12.3K ·GitHub
Что это такое?
React Color — это набор из 13 компонентов выбора цвета для React, повторяющих палитры, привычные по Sketch, Photoshop, Chrome, GitHub и Twitter.
React Color — это набор из 13 компонентов выбора цвета для React, повторяющих палитры, привычные по Sketch, Photoshop, Chrome, GitHub и Twitter.Это отдельное приложение или набор компонентов, которые я встраиваю в свой React-код?Это библиотека React-компонентов, опубликованная на npm, — каждый палитро-пикер (SketchPicker, ChromePicker, PhotoshopPicker и так далее) — это компонент, который вы импортируете и отрисовываете внутри своего приложения.
Это библиотека React-компонентов, опубликованная на npm, — каждый палитро-пикер (SketchPicker, ChromePicker, PhotoshopPicker и так далее) — это компонент, который вы импортируете и отрисовываете внутри своего приложения.Как добавить пикер в свой проект?Установите его из npm и импортируйте только те пикеры, которые нужны, — пакет экспортирует 13 компонентов: от AlphaPicker и CirclePicker до SketchPicker и TwitterPicker.
Установите его из npm и импортируйте только те пикеры, которые нужны, — пакет экспортирует 13 компонентов: от AlphaPicker и CirclePicker до SketchPicker и TwitterPicker.Какие зависимости у него кроме React?reactcss отвечает за встроенные стили, tinycolor2 — за преобразования цветов, а рядом идут lodash, material-colors, prop-types и @icons/material — всё это обычный JavaScript, без нативного кода.
reactcss отвечает за встроенные стили, tinycolor2 — за преобразования цветов, а рядом идут lodash, material-colors, prop-types и @icons/material — всё это обычный JavaScript, без нативного кода.Понадобится ли пикерам настройка CSS или они будут конфликтовать с моими текущими стилями?Нет — компоненты не содержат ни одного файла стилей, потому что всё оформление сделано инлайн через ReactCSS, так что импортировать нечего, и конфликтовать с вашей CSS нечему.
Нет — компоненты не содержат ни одного файла стилей, потому что всё оформление сделано инлайн через ReactCSS, так что импортировать нечего, и конфликтовать с вашей CSS нечему.Какие готовые пикеры в него входят?Тринадцать: Sketch, Photoshop, Chrome, GitHub и Twitter, а также Material, Compact, Swatches, Circle, Block, Slider, Hue и Alpha.
Тринадцать: Sketch, Photoshop, Chrome, GitHub и Twitter, а также Material, Compact, Swatches, Circle, Block, Slider, Hue и Alpha.Могу ли я собрать пикер под оформление своего интерфейса вместо готовых вариантов?Да — второй по счёту пункт в README как раз о том, как собрать собственный пикер из отдельных блоков-компонентов, которые экспортирует библиотека.
Да — второй по счёту пункт в README как раз о том, как собрать собственный пикер из отдельных блоков-компонентов, которые экспортирует библиотека.Можно ли попробовать пикеры, прежде чем что-то устанавливать?Да, в README есть ссылка на живое демо, где можно попробовать все 13 пикеров прямо в браузере.
Да, в README есть ссылка на живое демо, где можно попробовать все 13 пикеров прямо в браузере.Насколько это проверенное решение?Проект на GitHub с августа 2015 года, у него больше 12 000 звёзд, а тестовый скрипт запускает Jest и ESLint.
Проект на GitHub с августа 2015 года, у него больше 12 000 звёзд, а тестовый скрипт запускает Jest и ESLint.What are similar projects?drawably, shaders, chakra-ui, primitives, material, Libraries.dev, tweakcn, react-bootstrap
drawably, shaders, chakra-ui, primitives, material, Libraries.dev, tweakcn, react-bootstrapWhich topics is it in?react-component, color-picker, sketch, design-tools, chrome, component-library, javascript-library, design, ui-components, customization, ui, web-development
react-component, color-picker, sketch, design-tools, chrome, component-library, javascript-library, design, ui-components, customization, ui, web-development