@cdx-ui/primitives 0.1.6 → 0.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/commonjs/color/Color.js +69 -0
- package/lib/commonjs/color/Color.js.map +1 -0
- package/lib/commonjs/color/index.js +13 -0
- package/lib/commonjs/color/index.js.map +1 -0
- package/lib/commonjs/color/types.js +2 -0
- package/lib/commonjs/color/types.js.map +1 -0
- package/lib/commonjs/color-area/ColorAreaAccessibility.js +100 -0
- package/lib/commonjs/color-area/ColorAreaAccessibility.js.map +1 -0
- package/lib/commonjs/color-area/ColorAreaAccessibility.web.js +58 -0
- package/lib/commonjs/color-area/ColorAreaAccessibility.web.js.map +1 -0
- package/lib/commonjs/color-area/ColorAreaRoot.js +240 -0
- package/lib/commonjs/color-area/ColorAreaRoot.js.map +1 -0
- package/lib/commonjs/color-area/ColorAreaThumb.js +71 -0
- package/lib/commonjs/color-area/ColorAreaThumb.js.map +1 -0
- package/lib/commonjs/color-area/context.js +11 -0
- package/lib/commonjs/color-area/context.js.map +1 -0
- package/lib/commonjs/color-area/index.js +27 -0
- package/lib/commonjs/color-area/index.js.map +1 -0
- package/lib/commonjs/color-area/types.js +6 -0
- package/lib/commonjs/color-area/types.js.map +1 -0
- package/lib/commonjs/color-area/utils.js +51 -0
- package/lib/commonjs/color-area/utils.js.map +1 -0
- package/lib/commonjs/color-field/ColorFieldInput.js +67 -0
- package/lib/commonjs/color-field/ColorFieldInput.js.map +1 -0
- package/lib/commonjs/color-field/ColorFieldRoot.js +104 -0
- package/lib/commonjs/color-field/ColorFieldRoot.js.map +1 -0
- package/lib/commonjs/color-field/context.js +11 -0
- package/lib/commonjs/color-field/context.js.map +1 -0
- package/lib/commonjs/color-field/index.js +27 -0
- package/lib/commonjs/color-field/index.js.map +1 -0
- package/lib/commonjs/color-field/types.js +6 -0
- package/lib/commonjs/color-field/types.js.map +1 -0
- package/lib/commonjs/color-field/utils.js +60 -0
- package/lib/commonjs/color-field/utils.js.map +1 -0
- package/lib/commonjs/color-picker/ColorPickerRoot.js +69 -0
- package/lib/commonjs/color-picker/ColorPickerRoot.js.map +1 -0
- package/lib/commonjs/color-picker/ColorPickerTrigger.js +98 -0
- package/lib/commonjs/color-picker/ColorPickerTrigger.js.map +1 -0
- package/lib/commonjs/color-picker/context.js +32 -0
- package/lib/commonjs/color-picker/context.js.map +1 -0
- package/lib/commonjs/color-picker/index.js +51 -0
- package/lib/commonjs/color-picker/index.js.map +1 -0
- package/lib/commonjs/color-picker/types.js +6 -0
- package/lib/commonjs/color-picker/types.js.map +1 -0
- package/lib/commonjs/color-slider/ColorSliderRail.js +119 -0
- package/lib/commonjs/color-slider/ColorSliderRail.js.map +1 -0
- package/lib/commonjs/color-slider/ColorSliderRoot.js +153 -0
- package/lib/commonjs/color-slider/ColorSliderRoot.js.map +1 -0
- package/lib/commonjs/color-slider/ColorSliderThumb.js +265 -0
- package/lib/commonjs/color-slider/ColorSliderThumb.js.map +1 -0
- package/lib/commonjs/color-slider/context.js +11 -0
- package/lib/commonjs/color-slider/context.js.map +1 -0
- package/lib/commonjs/color-slider/index.js +34 -0
- package/lib/commonjs/color-slider/index.js.map +1 -0
- package/lib/commonjs/color-slider/types.js +6 -0
- package/lib/commonjs/color-slider/types.js.map +1 -0
- package/lib/commonjs/color-slider/utils.js +75 -0
- package/lib/commonjs/color-slider/utils.js.map +1 -0
- package/lib/commonjs/color-swatch-picker/ColorSwatchPickerItem.js +46 -0
- package/lib/commonjs/color-swatch-picker/ColorSwatchPickerItem.js.map +1 -0
- package/lib/commonjs/color-swatch-picker/ColorSwatchPickerRoot.js +71 -0
- package/lib/commonjs/color-swatch-picker/ColorSwatchPickerRoot.js.map +1 -0
- package/lib/commonjs/color-swatch-picker/context.js +22 -0
- package/lib/commonjs/color-swatch-picker/context.js.map +1 -0
- package/lib/commonjs/color-swatch-picker/index.js +33 -0
- package/lib/commonjs/color-swatch-picker/index.js.map +1 -0
- package/lib/commonjs/color-swatch-picker/types.js +6 -0
- package/lib/commonjs/color-swatch-picker/types.js.map +1 -0
- package/lib/commonjs/dialog/DialogContent.js +13 -5
- package/lib/commonjs/dialog/DialogContent.js.map +1 -1
- package/lib/commonjs/dialog/DialogPopup.js +7 -1
- package/lib/commonjs/dialog/DialogPopup.js.map +1 -1
- package/lib/commonjs/dialog/DialogRoot.js +3 -1
- package/lib/commonjs/dialog/DialogRoot.js.map +1 -1
- package/lib/commonjs/index.js +80 -0
- package/lib/commonjs/index.js.map +1 -1
- package/lib/commonjs/portal/portal.js +4 -2
- package/lib/commonjs/portal/portal.js.map +1 -1
- package/lib/commonjs/react-native-web.d.js +2 -0
- package/lib/commonjs/react-native-web.d.js.map +1 -0
- package/lib/commonjs/select/SelectContent.js +1 -0
- package/lib/commonjs/select/SelectContent.js.map +1 -1
- package/lib/commonjs/slider/useSliderPointer.js +2 -0
- package/lib/commonjs/slider/useSliderPointer.js.map +1 -1
- package/lib/commonjs/utils/createPortal.web.js +10 -1
- package/lib/commonjs/utils/createPortal.web.js.map +1 -1
- package/lib/commonjs/utils/textAncestor.js +25 -0
- package/lib/commonjs/utils/textAncestor.js.map +1 -0
- package/lib/commonjs/utils/textAncestor.web.js +27 -0
- package/lib/commonjs/utils/textAncestor.web.js.map +1 -0
- package/lib/module/color/Color.js +65 -0
- package/lib/module/color/Color.js.map +1 -0
- package/lib/module/color/index.js +4 -0
- package/lib/module/color/index.js.map +1 -0
- package/lib/module/color/types.js +2 -0
- package/lib/module/color/types.js.map +1 -0
- package/lib/module/color-area/ColorAreaAccessibility.js +96 -0
- package/lib/module/color-area/ColorAreaAccessibility.js.map +1 -0
- package/lib/module/color-area/ColorAreaAccessibility.web.js +54 -0
- package/lib/module/color-area/ColorAreaAccessibility.web.js.map +1 -0
- package/lib/module/color-area/ColorAreaRoot.js +236 -0
- package/lib/module/color-area/ColorAreaRoot.js.map +1 -0
- package/lib/module/color-area/ColorAreaThumb.js +67 -0
- package/lib/module/color-area/ColorAreaThumb.js.map +1 -0
- package/lib/module/color-area/context.js +5 -0
- package/lib/module/color-area/context.js.map +1 -0
- package/lib/module/color-area/index.js +6 -0
- package/lib/module/color-area/index.js.map +1 -0
- package/lib/module/color-area/types.js +4 -0
- package/lib/module/color-area/types.js.map +1 -0
- package/lib/module/color-area/utils.js +45 -0
- package/lib/module/color-area/utils.js.map +1 -0
- package/lib/module/color-field/ColorFieldInput.js +63 -0
- package/lib/module/color-field/ColorFieldInput.js.map +1 -0
- package/lib/module/color-field/ColorFieldRoot.js +100 -0
- package/lib/module/color-field/ColorFieldRoot.js.map +1 -0
- package/lib/module/color-field/context.js +5 -0
- package/lib/module/color-field/context.js.map +1 -0
- package/lib/module/color-field/index.js +6 -0
- package/lib/module/color-field/index.js.map +1 -0
- package/lib/module/color-field/types.js +4 -0
- package/lib/module/color-field/types.js.map +1 -0
- package/lib/module/color-field/utils.js +55 -0
- package/lib/module/color-field/utils.js.map +1 -0
- package/lib/module/color-picker/ColorPickerRoot.js +65 -0
- package/lib/module/color-picker/ColorPickerRoot.js.map +1 -0
- package/lib/module/color-picker/ColorPickerTrigger.js +94 -0
- package/lib/module/color-picker/ColorPickerTrigger.js.map +1 -0
- package/lib/module/color-picker/context.js +25 -0
- package/lib/module/color-picker/context.js.map +1 -0
- package/lib/module/color-picker/index.js +6 -0
- package/lib/module/color-picker/index.js.map +1 -0
- package/lib/module/color-picker/types.js +4 -0
- package/lib/module/color-picker/types.js.map +1 -0
- package/lib/module/color-slider/ColorSliderRail.js +115 -0
- package/lib/module/color-slider/ColorSliderRail.js.map +1 -0
- package/lib/module/color-slider/ColorSliderRoot.js +149 -0
- package/lib/module/color-slider/ColorSliderRoot.js.map +1 -0
- package/lib/module/color-slider/ColorSliderThumb.js +261 -0
- package/lib/module/color-slider/ColorSliderThumb.js.map +1 -0
- package/lib/module/color-slider/context.js +5 -0
- package/lib/module/color-slider/context.js.map +1 -0
- package/lib/module/color-slider/index.js +7 -0
- package/lib/module/color-slider/index.js.map +1 -0
- package/lib/module/color-slider/types.js +4 -0
- package/lib/module/color-slider/types.js.map +1 -0
- package/lib/module/color-slider/utils.js +66 -0
- package/lib/module/color-slider/utils.js.map +1 -0
- package/lib/module/color-swatch-picker/ColorSwatchPickerItem.js +42 -0
- package/lib/module/color-swatch-picker/ColorSwatchPickerItem.js.map +1 -0
- package/lib/module/color-swatch-picker/ColorSwatchPickerRoot.js +67 -0
- package/lib/module/color-swatch-picker/ColorSwatchPickerRoot.js.map +1 -0
- package/lib/module/color-swatch-picker/context.js +15 -0
- package/lib/module/color-swatch-picker/context.js.map +1 -0
- package/lib/module/color-swatch-picker/index.js +6 -0
- package/lib/module/color-swatch-picker/index.js.map +1 -0
- package/lib/module/color-swatch-picker/types.js +4 -0
- package/lib/module/color-swatch-picker/types.js.map +1 -0
- package/lib/module/dialog/DialogContent.js +13 -5
- package/lib/module/dialog/DialogContent.js.map +1 -1
- package/lib/module/dialog/DialogPopup.js +7 -1
- package/lib/module/dialog/DialogPopup.js.map +1 -1
- package/lib/module/dialog/DialogRoot.js +4 -2
- package/lib/module/dialog/DialogRoot.js.map +1 -1
- package/lib/module/index.js +7 -0
- package/lib/module/index.js.map +1 -1
- package/lib/module/portal/portal.js +4 -2
- package/lib/module/portal/portal.js.map +1 -1
- package/lib/module/react-native-web.d.js +2 -0
- package/lib/module/react-native-web.d.js.map +1 -0
- package/lib/module/select/SelectContent.js +2 -1
- package/lib/module/select/SelectContent.js.map +1 -1
- package/lib/module/slider/useSliderPointer.js +2 -0
- package/lib/module/slider/useSliderPointer.js.map +1 -1
- package/lib/module/utils/createPortal.web.js +9 -1
- package/lib/module/utils/createPortal.web.js.map +1 -1
- package/lib/module/utils/textAncestor.js +20 -0
- package/lib/module/utils/textAncestor.js.map +1 -0
- package/lib/module/utils/textAncestor.web.js +22 -0
- package/lib/module/utils/textAncestor.web.js.map +1 -0
- package/lib/typescript/breadcrumbs/types.d.ts +13 -0
- package/lib/typescript/breadcrumbs/types.d.ts.map +1 -1
- package/lib/typescript/checkbox/types.d.ts +4 -0
- package/lib/typescript/checkbox/types.d.ts.map +1 -1
- package/lib/typescript/color/Color.d.ts +3 -0
- package/lib/typescript/color/Color.d.ts.map +1 -0
- package/lib/typescript/color/index.d.ts +3 -0
- package/lib/typescript/color/index.d.ts.map +1 -0
- package/lib/typescript/color/types.d.ts +13 -0
- package/lib/typescript/color/types.d.ts.map +1 -0
- package/lib/typescript/color-area/ColorAreaAccessibility.d.ts +8 -0
- package/lib/typescript/color-area/ColorAreaAccessibility.d.ts.map +1 -0
- package/lib/typescript/color-area/ColorAreaAccessibility.web.d.ts +8 -0
- package/lib/typescript/color-area/ColorAreaAccessibility.web.d.ts.map +1 -0
- package/lib/typescript/color-area/ColorAreaRoot.d.ts +7 -0
- package/lib/typescript/color-area/ColorAreaRoot.d.ts.map +1 -0
- package/lib/typescript/color-area/ColorAreaThumb.d.ts +6 -0
- package/lib/typescript/color-area/ColorAreaThumb.d.ts.map +1 -0
- package/lib/typescript/color-area/context.d.ts +6 -0
- package/lib/typescript/color-area/context.d.ts.map +1 -0
- package/lib/typescript/color-area/index.d.ts +5 -0
- package/lib/typescript/color-area/index.d.ts.map +1 -0
- package/lib/typescript/color-area/types.d.ts +65 -0
- package/lib/typescript/color-area/types.d.ts.map +1 -0
- package/lib/typescript/color-area/utils.d.ts +5 -0
- package/lib/typescript/color-area/utils.d.ts.map +1 -0
- package/lib/typescript/color-field/ColorFieldInput.d.ts +5 -0
- package/lib/typescript/color-field/ColorFieldInput.d.ts.map +1 -0
- package/lib/typescript/color-field/ColorFieldRoot.d.ts +7 -0
- package/lib/typescript/color-field/ColorFieldRoot.d.ts.map +1 -0
- package/lib/typescript/color-field/context.d.ts +6 -0
- package/lib/typescript/color-field/context.d.ts.map +1 -0
- package/lib/typescript/color-field/index.d.ts +7 -0
- package/lib/typescript/color-field/index.d.ts.map +1 -0
- package/lib/typescript/color-field/types.d.ts +39 -0
- package/lib/typescript/color-field/types.d.ts.map +1 -0
- package/lib/typescript/color-field/utils.d.ts +5 -0
- package/lib/typescript/color-field/utils.d.ts.map +1 -0
- package/lib/typescript/color-picker/ColorPickerRoot.d.ts +7 -0
- package/lib/typescript/color-picker/ColorPickerRoot.d.ts.map +1 -0
- package/lib/typescript/color-picker/ColorPickerTrigger.d.ts +4 -0
- package/lib/typescript/color-picker/ColorPickerTrigger.d.ts.map +1 -0
- package/lib/typescript/color-picker/context.d.ts +19 -0
- package/lib/typescript/color-picker/context.d.ts.map +1 -0
- package/lib/typescript/color-picker/index.d.ts +5 -0
- package/lib/typescript/color-picker/index.d.ts.map +1 -0
- package/lib/typescript/color-picker/types.d.ts +24 -0
- package/lib/typescript/color-picker/types.d.ts.map +1 -0
- package/lib/typescript/color-slider/ColorSliderRail.d.ts +6 -0
- package/lib/typescript/color-slider/ColorSliderRail.d.ts.map +1 -0
- package/lib/typescript/color-slider/ColorSliderRoot.d.ts +7 -0
- package/lib/typescript/color-slider/ColorSliderRoot.d.ts.map +1 -0
- package/lib/typescript/color-slider/ColorSliderThumb.d.ts +6 -0
- package/lib/typescript/color-slider/ColorSliderThumb.d.ts.map +1 -0
- package/lib/typescript/color-slider/context.d.ts +6 -0
- package/lib/typescript/color-slider/context.d.ts.map +1 -0
- package/lib/typescript/color-slider/index.d.ts +6 -0
- package/lib/typescript/color-slider/index.d.ts.map +1 -0
- package/lib/typescript/color-slider/types.d.ts +82 -0
- package/lib/typescript/color-slider/types.d.ts.map +1 -0
- package/lib/typescript/color-slider/utils.d.ts +12 -0
- package/lib/typescript/color-slider/utils.d.ts.map +1 -0
- package/lib/typescript/color-swatch-picker/ColorSwatchPickerItem.d.ts +6 -0
- package/lib/typescript/color-swatch-picker/ColorSwatchPickerItem.d.ts.map +1 -0
- package/lib/typescript/color-swatch-picker/ColorSwatchPickerRoot.d.ts +7 -0
- package/lib/typescript/color-swatch-picker/ColorSwatchPickerRoot.d.ts.map +1 -0
- package/lib/typescript/color-swatch-picker/context.d.ts +8 -0
- package/lib/typescript/color-swatch-picker/context.d.ts.map +1 -0
- package/lib/typescript/color-swatch-picker/index.d.ts +5 -0
- package/lib/typescript/color-swatch-picker/index.d.ts.map +1 -0
- package/lib/typescript/color-swatch-picker/types.d.ts +26 -0
- package/lib/typescript/color-swatch-picker/types.d.ts.map +1 -0
- package/lib/typescript/dialog/DialogContent.d.ts +1 -1
- package/lib/typescript/dialog/DialogContent.d.ts.map +1 -1
- package/lib/typescript/dialog/DialogPopup.d.ts.map +1 -1
- package/lib/typescript/dialog/DialogRoot.d.ts.map +1 -1
- package/lib/typescript/dialog/types.d.ts +12 -0
- package/lib/typescript/dialog/types.d.ts.map +1 -1
- package/lib/typescript/field/types.d.ts +1 -1
- package/lib/typescript/field/types.d.ts.map +1 -1
- package/lib/typescript/form/types.d.ts +6 -0
- package/lib/typescript/form/types.d.ts.map +1 -1
- package/lib/typescript/index.d.ts +7 -0
- package/lib/typescript/index.d.ts.map +1 -1
- package/lib/typescript/input/types.d.ts +1 -0
- package/lib/typescript/input/types.d.ts.map +1 -1
- package/lib/typescript/link/types.d.ts +2 -2
- package/lib/typescript/list-item/types.d.ts +3 -2
- package/lib/typescript/list-item/types.d.ts.map +1 -1
- package/lib/typescript/portal/portal.d.ts +13 -2
- package/lib/typescript/portal/portal.d.ts.map +1 -1
- package/lib/typescript/progress-bar/types.d.ts +9 -4
- package/lib/typescript/progress-bar/types.d.ts.map +1 -1
- package/lib/typescript/radio/types.d.ts +2 -0
- package/lib/typescript/radio/types.d.ts.map +1 -1
- package/lib/typescript/select/SelectContent.d.ts.map +1 -1
- package/lib/typescript/slider/useSliderPointer.d.ts.map +1 -1
- package/lib/typescript/switch/types.d.ts +4 -4
- package/lib/typescript/tabs/types.d.ts +7 -2
- package/lib/typescript/tabs/types.d.ts.map +1 -1
- package/lib/typescript/utils/createPortal.web.d.ts +6 -2
- package/lib/typescript/utils/createPortal.web.d.ts.map +1 -1
- package/lib/typescript/utils/textAncestor.d.ts +13 -0
- package/lib/typescript/utils/textAncestor.d.ts.map +1 -0
- package/lib/typescript/utils/textAncestor.web.d.ts +15 -0
- package/lib/typescript/utils/textAncestor.web.d.ts.map +1 -0
- package/package.json +4 -3
- package/src/breadcrumbs/types.ts +13 -0
- package/src/checkbox/types.ts +4 -0
- package/src/color/Color.ts +95 -0
- package/src/color/index.ts +2 -0
- package/src/color/types.ts +19 -0
- package/src/color-area/ColorAreaAccessibility.tsx +94 -0
- package/src/color-area/ColorAreaAccessibility.web.tsx +52 -0
- package/src/color-area/ColorAreaRoot.tsx +326 -0
- package/src/color-area/ColorAreaThumb.tsx +56 -0
- package/src/color-area/context.tsx +5 -0
- package/src/color-area/index.ts +10 -0
- package/src/color-area/types.ts +69 -0
- package/src/color-area/utils.ts +51 -0
- package/src/color-field/ColorFieldInput.tsx +66 -0
- package/src/color-field/ColorFieldRoot.tsx +132 -0
- package/src/color-field/context.tsx +5 -0
- package/src/color-field/index.ts +11 -0
- package/src/color-field/types.ts +46 -0
- package/src/color-field/utils.ts +75 -0
- package/src/color-picker/ColorPickerRoot.tsx +91 -0
- package/src/color-picker/ColorPickerTrigger.tsx +96 -0
- package/src/color-picker/context.tsx +47 -0
- package/src/color-picker/index.ts +12 -0
- package/src/color-picker/types.ts +25 -0
- package/src/color-slider/ColorSliderRail.tsx +130 -0
- package/src/color-slider/ColorSliderRoot.tsx +222 -0
- package/src/color-slider/ColorSliderThumb.tsx +294 -0
- package/src/color-slider/context.tsx +5 -0
- package/src/color-slider/index.ts +16 -0
- package/src/color-slider/types.ts +94 -0
- package/src/color-slider/utils.ts +79 -0
- package/src/color-swatch-picker/ColorSwatchPickerItem.tsx +54 -0
- package/src/color-swatch-picker/ColorSwatchPickerRoot.tsx +94 -0
- package/src/color-swatch-picker/context.tsx +22 -0
- package/src/color-swatch-picker/index.ts +4 -0
- package/src/color-swatch-picker/types.ts +29 -0
- package/src/dialog/DialogContent.tsx +13 -5
- package/src/dialog/DialogPopup.tsx +7 -1
- package/src/dialog/DialogRoot.tsx +3 -1
- package/src/dialog/types.ts +12 -0
- package/src/field/types.tsx +1 -1
- package/src/form/types.tsx +6 -0
- package/src/index.ts +7 -0
- package/src/input/types.ts +1 -0
- package/src/link/types.ts +2 -2
- package/src/list-item/types.ts +3 -2
- package/src/portal/portal.tsx +17 -2
- package/src/progress-bar/types.ts +9 -4
- package/src/radio/types.ts +2 -0
- package/src/react-native-web.d.ts +6 -0
- package/src/select/SelectContent.tsx +2 -1
- package/src/slider/useSliderPointer.ts +3 -0
- package/src/switch/types.ts +4 -4
- package/src/tabs/types.ts +7 -2
- package/src/utils/createPortal.web.ts +9 -3
- package/src/utils/textAncestor.ts +19 -0
- package/src/utils/textAncestor.web.ts +19 -0
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { parseColor } from '../color';
|
|
4
|
+
const CHANNEL_VALUE_PATTERN = /^([+-]?(?:\d+(?:\.\d+)?|\.\d+))\s*([°%])?$/u;
|
|
5
|
+
function formatNumber(value) {
|
|
6
|
+
return Number.isInteger(value) ? String(value) : value.toFixed(1);
|
|
7
|
+
}
|
|
8
|
+
export function formatColorFieldValue(value, configuration) {
|
|
9
|
+
if (!value) {
|
|
10
|
+
return '';
|
|
11
|
+
}
|
|
12
|
+
if (!configuration.channel) {
|
|
13
|
+
return value.toString('hex');
|
|
14
|
+
}
|
|
15
|
+
const channelValue = value.getChannel(configuration.colorSpace, configuration.channel);
|
|
16
|
+
const formattedValue = formatNumber(channelValue);
|
|
17
|
+
if (configuration.channel === 'hue') {
|
|
18
|
+
return `${formattedValue}°`;
|
|
19
|
+
}
|
|
20
|
+
if (configuration.colorSpace === 'hsl') {
|
|
21
|
+
return `${formattedValue}%`;
|
|
22
|
+
}
|
|
23
|
+
return formattedValue;
|
|
24
|
+
}
|
|
25
|
+
export function parseColorFieldValue(text, currentValue, configuration) {
|
|
26
|
+
const normalizedText = text.trim();
|
|
27
|
+
if (!configuration.channel) {
|
|
28
|
+
return parseColor(normalizedText);
|
|
29
|
+
}
|
|
30
|
+
if (!currentValue) {
|
|
31
|
+
return undefined;
|
|
32
|
+
}
|
|
33
|
+
const match = CHANNEL_VALUE_PATTERN.exec(normalizedText);
|
|
34
|
+
if (!match) {
|
|
35
|
+
return undefined;
|
|
36
|
+
}
|
|
37
|
+
const value = Number(match[1]);
|
|
38
|
+
const unit = match[2];
|
|
39
|
+
if (!Number.isFinite(value)) {
|
|
40
|
+
return undefined;
|
|
41
|
+
}
|
|
42
|
+
if (configuration.colorSpace === 'rgb') {
|
|
43
|
+
if (unit || value < 0 || value > 255) {
|
|
44
|
+
return undefined;
|
|
45
|
+
}
|
|
46
|
+
} else if (configuration.channel === 'hue') {
|
|
47
|
+
if (unit === '%' || value < 0 || value > 360) {
|
|
48
|
+
return undefined;
|
|
49
|
+
}
|
|
50
|
+
} else if (unit === '°' || value < 0 || value > 100) {
|
|
51
|
+
return undefined;
|
|
52
|
+
}
|
|
53
|
+
return currentValue.withChannel(configuration.colorSpace, configuration.channel, value);
|
|
54
|
+
}
|
|
55
|
+
//# sourceMappingURL=utils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["parseColor","CHANNEL_VALUE_PATTERN","formatNumber","value","Number","isInteger","String","toFixed","formatColorFieldValue","configuration","channel","toString","channelValue","getChannel","colorSpace","formattedValue","parseColorFieldValue","text","currentValue","normalizedText","trim","undefined","match","exec","unit","isFinite","withChannel"],"sourceRoot":"../../../src","sources":["color-field/utils.ts"],"mappings":";;AAAA,SAASA,UAAU,QAAoB,UAAU;AAGjD,MAAMC,qBAAqB,GAAG,6CAA6C;AAE3E,SAASC,YAAYA,CAACC,KAAa,EAAU;EAC3C,OAAOC,MAAM,CAACC,SAAS,CAACF,KAAK,CAAC,GAAGG,MAAM,CAACH,KAAK,CAAC,GAAGA,KAAK,CAACI,OAAO,CAAC,CAAC,CAAC;AACnE;AAEA,OAAO,SAASC,qBAAqBA,CACnCL,KAAwB,EACxBM,aAAsC,EAC9B;EACR,IAAI,CAACN,KAAK,EAAE;IACV,OAAO,EAAE;EACX;EAEA,IAAI,CAACM,aAAa,CAACC,OAAO,EAAE;IAC1B,OAAOP,KAAK,CAACQ,QAAQ,CAAC,KAAK,CAAC;EAC9B;EAEA,MAAMC,YAAY,GAAGT,KAAK,CAACU,UAAU,CAACJ,aAAa,CAACK,UAAU,EAAEL,aAAa,CAACC,OAAO,CAAC;EACtF,MAAMK,cAAc,GAAGb,YAAY,CAACU,YAAY,CAAC;EAEjD,IAAIH,aAAa,CAACC,OAAO,KAAK,KAAK,EAAE;IACnC,OAAO,GAAGK,cAAc,GAAG;EAC7B;EAEA,IAAIN,aAAa,CAACK,UAAU,KAAK,KAAK,EAAE;IACtC,OAAO,GAAGC,cAAc,GAAG;EAC7B;EAEA,OAAOA,cAAc;AACvB;AAEA,OAAO,SAASC,oBAAoBA,CAClCC,IAAY,EACZC,YAA+B,EAC/BT,aAAsC,EACnB;EACnB,MAAMU,cAAc,GAAGF,IAAI,CAACG,IAAI,CAAC,CAAC;EAElC,IAAI,CAACX,aAAa,CAACC,OAAO,EAAE;IAC1B,OAAOV,UAAU,CAACmB,cAAc,CAAC;EACnC;EAEA,IAAI,CAACD,YAAY,EAAE;IACjB,OAAOG,SAAS;EAClB;EAEA,MAAMC,KAAK,GAAGrB,qBAAqB,CAACsB,IAAI,CAACJ,cAAc,CAAC;EACxD,IAAI,CAACG,KAAK,EAAE;IACV,OAAOD,SAAS;EAClB;EAEA,MAAMlB,KAAK,GAAGC,MAAM,CAACkB,KAAK,CAAC,CAAC,CAAC,CAAC;EAC9B,MAAME,IAAI,GAAGF,KAAK,CAAC,CAAC,CAAC;EACrB,IAAI,CAAClB,MAAM,CAACqB,QAAQ,CAACtB,KAAK,CAAC,EAAE;IAC3B,OAAOkB,SAAS;EAClB;EAEA,IAAIZ,aAAa,CAACK,UAAU,KAAK,KAAK,EAAE;IACtC,IAAIU,IAAI,IAAIrB,KAAK,GAAG,CAAC,IAAIA,KAAK,GAAG,GAAG,EAAE;MACpC,OAAOkB,SAAS;IAClB;EACF,CAAC,MAAM,IAAIZ,aAAa,CAACC,OAAO,KAAK,KAAK,EAAE;IAC1C,IAAIc,IAAI,KAAK,GAAG,IAAIrB,KAAK,GAAG,CAAC,IAAIA,KAAK,GAAG,GAAG,EAAE;MAC5C,OAAOkB,SAAS;IAClB;EACF,CAAC,MAAM,IAAIG,IAAI,KAAK,GAAG,IAAIrB,KAAK,GAAG,CAAC,IAAIA,KAAK,GAAG,GAAG,EAAE;IACnD,OAAOkB,SAAS;EAClB;EAEA,OAAOH,YAAY,CAACQ,WAAW,CAACjB,aAAa,CAACK,UAAU,EAAEL,aAAa,CAACC,OAAO,EAAEP,KAAK,CAAC;AACzF","ignoreList":[]}
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { forwardRef, useCallback, useMemo, useRef } from 'react';
|
|
4
|
+
import { View } from 'react-native';
|
|
5
|
+
import { mergeRefs, useControllableState } from '@cdx-ui/utils';
|
|
6
|
+
import { Slot } from '../slot';
|
|
7
|
+
import { dataAttributes, mergeDataAttributes } from '../utils/dataAttributes';
|
|
8
|
+
import { ColorPickerProvider, ColorPickerRootProvider } from './context';
|
|
9
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
+
export const ColorPickerRoot = /*#__PURE__*/forwardRef(({
|
|
11
|
+
asChild,
|
|
12
|
+
value: valueProp,
|
|
13
|
+
defaultValue,
|
|
14
|
+
onValueChange,
|
|
15
|
+
isOpen: openProp,
|
|
16
|
+
defaultOpen = false,
|
|
17
|
+
onOpenChange,
|
|
18
|
+
children,
|
|
19
|
+
...props
|
|
20
|
+
}, ref) => {
|
|
21
|
+
const [value, setValueState] = useControllableState({
|
|
22
|
+
prop: valueProp,
|
|
23
|
+
defaultProp: defaultValue,
|
|
24
|
+
onChange: onValueChange
|
|
25
|
+
});
|
|
26
|
+
const [open, setOpenState] = useControllableState({
|
|
27
|
+
prop: openProp,
|
|
28
|
+
defaultProp: defaultOpen,
|
|
29
|
+
onChange: onOpenChange
|
|
30
|
+
});
|
|
31
|
+
const anchorRef = useRef(null);
|
|
32
|
+
const triggerRef = useRef(null);
|
|
33
|
+
const setValue = useCallback(nextValue => {
|
|
34
|
+
setValueState(nextValue);
|
|
35
|
+
}, [setValueState]);
|
|
36
|
+
const setOpen = useCallback(nextOpen => {
|
|
37
|
+
setOpenState(nextOpen);
|
|
38
|
+
}, [setOpenState]);
|
|
39
|
+
const contextValue = useMemo(() => ({
|
|
40
|
+
value,
|
|
41
|
+
onValueChange: setValue,
|
|
42
|
+
open: open ?? false,
|
|
43
|
+
setOpen,
|
|
44
|
+
anchorRef,
|
|
45
|
+
triggerRef
|
|
46
|
+
}), [open, setOpen, setValue, value]);
|
|
47
|
+
const Comp = asChild ? Slot : View;
|
|
48
|
+
return /*#__PURE__*/_jsx(ColorPickerRootProvider, {
|
|
49
|
+
value: contextValue,
|
|
50
|
+
children: /*#__PURE__*/_jsx(ColorPickerProvider, {
|
|
51
|
+
value: contextValue,
|
|
52
|
+
children: /*#__PURE__*/_jsx(Comp, {
|
|
53
|
+
ref: mergeRefs(ref, anchorRef),
|
|
54
|
+
...props,
|
|
55
|
+
...mergeDataAttributes(props, dataAttributes({
|
|
56
|
+
open: contextValue.open,
|
|
57
|
+
state: contextValue.open ? 'open' : 'closed'
|
|
58
|
+
})),
|
|
59
|
+
children: children
|
|
60
|
+
})
|
|
61
|
+
})
|
|
62
|
+
});
|
|
63
|
+
});
|
|
64
|
+
ColorPickerRoot.displayName = 'ColorPickerRoot';
|
|
65
|
+
//# sourceMappingURL=ColorPickerRoot.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["forwardRef","useCallback","useMemo","useRef","View","mergeRefs","useControllableState","Slot","dataAttributes","mergeDataAttributes","ColorPickerProvider","ColorPickerRootProvider","jsx","_jsx","ColorPickerRoot","asChild","value","valueProp","defaultValue","onValueChange","isOpen","openProp","defaultOpen","onOpenChange","children","props","ref","setValueState","prop","defaultProp","onChange","open","setOpenState","anchorRef","triggerRef","setValue","nextValue","setOpen","nextOpen","contextValue","Comp","state","displayName"],"sourceRoot":"../../../src","sources":["color-picker/ColorPickerRoot.tsx"],"mappings":";;AAAA,SAASA,UAAU,EAAEC,WAAW,EAAEC,OAAO,EAAEC,MAAM,QAA2B,OAAO;AACnF,SAASC,IAAI,QAAQ,cAAc;AACnC,SAASC,SAAS,EAAEC,oBAAoB,QAAQ,eAAe;AAE/D,SAASC,IAAI,QAAQ,SAAS;AAC9B,SAASC,cAAc,EAAEC,mBAAmB,QAAQ,yBAAyB;AAC7E,SAASC,mBAAmB,EAAEC,uBAAuB,QAAQ,WAAW;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAOzE,OAAO,MAAMC,eAAe,gBAAGd,UAAU,CACvC,CACE;EACEe,OAAO;EACPC,KAAK,EAAEC,SAAS;EAChBC,YAAY;EACZC,aAAa;EACbC,MAAM,EAAEC,QAAQ;EAChBC,WAAW,GAAG,KAAK;EACnBC,YAAY;EACZC,QAAQ;EACR,GAAGC;AACL,CAAC,EACDC,GAAG,KACA;EACH,MAAM,CAACV,KAAK,EAAEW,aAAa,CAAC,GAAGrB,oBAAoB,CAAQ;IACzDsB,IAAI,EAAEX,SAAS;IACfY,WAAW,EAAEX,YAAY;IACzBY,QAAQ,EAAEX;EACZ,CAAC,CAAC;EACF,MAAM,CAACY,IAAI,EAAEC,YAAY,CAAC,GAAG1B,oBAAoB,CAAU;IACzDsB,IAAI,EAAEP,QAAQ;IACdQ,WAAW,EAAEP,WAAW;IACxBQ,QAAQ,EAAEP;EACZ,CAAC,CAAC;EACF,MAAMU,SAAS,GAAG9B,MAAM,CAA4B,IAAI,CAAC;EACzD,MAAM+B,UAAU,GAAG/B,MAAM,CAA4B,IAAI,CAAC;EAE1D,MAAMgC,QAAQ,GAAGlC,WAAW,CACzBmC,SAAgB,IAAK;IACpBT,aAAa,CAACS,SAAS,CAAC;EAC1B,CAAC,EACD,CAACT,aAAa,CAChB,CAAC;EACD,MAAMU,OAAO,GAAGpC,WAAW,CACxBqC,QAAiB,IAAK;IACrBN,YAAY,CAACM,QAAQ,CAAC;EACxB,CAAC,EACD,CAACN,YAAY,CACf,CAAC;EAED,MAAMO,YAAY,GAAGrC,OAAO,CAC1B,OAAO;IACLc,KAAK;IACLG,aAAa,EAAEgB,QAAQ;IACvBJ,IAAI,EAAEA,IAAI,IAAI,KAAK;IACnBM,OAAO;IACPJ,SAAS;IACTC;EACF,CAAC,CAAC,EACF,CAACH,IAAI,EAAEM,OAAO,EAAEF,QAAQ,EAAEnB,KAAK,CACjC,CAAC;EAED,MAAMwB,IAAI,GAAGzB,OAAO,GAAGR,IAAI,GAAGH,IAAI;EAElC,oBACES,IAAA,CAACF,uBAAuB;IAACK,KAAK,EAAEuB,YAAa;IAAAf,QAAA,eAC3CX,IAAA,CAACH,mBAAmB;MAACM,KAAK,EAAEuB,YAAa;MAAAf,QAAA,eACvCX,IAAA,CAAC2B,IAAI;QACHd,GAAG,EAAErB,SAAS,CAACqB,GAAG,EAAEO,SAAS,CAAE;QAAA,GAC3BR,KAAK;QAAA,GACLhB,mBAAmB,CACrBgB,KAAK,EACLjB,cAAc,CAAC;UACbuB,IAAI,EAAEQ,YAAY,CAACR,IAAI;UACvBU,KAAK,EAAEF,YAAY,CAACR,IAAI,GAAG,MAAM,GAAG;QACtC,CAAC,CACH,CAAC;QAAAP,QAAA,EAEAA;MAAQ,CACL;IAAC,CACY;EAAC,CACC,CAAC;AAE9B,CACF,CAAC;AAEDV,eAAe,CAAC4B,WAAW,GAAG,iBAAiB","ignoreList":[]}
|
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { forwardRef } from 'react';
|
|
4
|
+
import { Platform, Pressable } from 'react-native';
|
|
5
|
+
import { composeEventHandlers, mergeRefs } from '@cdx-ui/utils';
|
|
6
|
+
import { useFocus, useFocusRing } from '@react-native-aria/focus';
|
|
7
|
+
import { useHover, usePress } from '@react-native-aria/interactions';
|
|
8
|
+
import { Slot } from '../slot';
|
|
9
|
+
import { dataAttributes, mergeDataAttributes } from '../utils/dataAttributes';
|
|
10
|
+
import { useColorPickerRootContext } from './context';
|
|
11
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
12
|
+
export const ColorPickerTrigger = /*#__PURE__*/forwardRef(({
|
|
13
|
+
asChild,
|
|
14
|
+
children,
|
|
15
|
+
isDisabled,
|
|
16
|
+
isHovered: isHoveredProp,
|
|
17
|
+
isActive: isActiveProp,
|
|
18
|
+
isFocused: isFocusedProp,
|
|
19
|
+
isFocusVisible: isFocusVisibleProp,
|
|
20
|
+
accessibilityLabel = 'Open color picker',
|
|
21
|
+
onPress,
|
|
22
|
+
onPressIn,
|
|
23
|
+
onPressOut,
|
|
24
|
+
onHoverIn,
|
|
25
|
+
onHoverOut,
|
|
26
|
+
onFocus,
|
|
27
|
+
onBlur,
|
|
28
|
+
...props
|
|
29
|
+
}, ref) => {
|
|
30
|
+
const {
|
|
31
|
+
open,
|
|
32
|
+
setOpen,
|
|
33
|
+
triggerRef
|
|
34
|
+
} = useColorPickerRootContext();
|
|
35
|
+
const disabled = Boolean(isDisabled || props.disabled);
|
|
36
|
+
const {
|
|
37
|
+
isFocused,
|
|
38
|
+
focusProps
|
|
39
|
+
} = useFocus();
|
|
40
|
+
const {
|
|
41
|
+
isFocusVisible,
|
|
42
|
+
focusProps: focusRingProps
|
|
43
|
+
} = useFocusRing();
|
|
44
|
+
const {
|
|
45
|
+
isPressed,
|
|
46
|
+
pressProps
|
|
47
|
+
} = usePress({
|
|
48
|
+
isDisabled: disabled
|
|
49
|
+
});
|
|
50
|
+
const {
|
|
51
|
+
isHovered,
|
|
52
|
+
hoverProps
|
|
53
|
+
} = useHover({
|
|
54
|
+
isDisabled: disabled
|
|
55
|
+
});
|
|
56
|
+
const Comp = asChild ? Slot : Pressable;
|
|
57
|
+
const platformAccessibilityProps = Platform.OS === 'web' ? {
|
|
58
|
+
role: 'button',
|
|
59
|
+
'aria-haspopup': 'dialog',
|
|
60
|
+
'aria-expanded': open,
|
|
61
|
+
'aria-disabled': disabled || undefined
|
|
62
|
+
} : {
|
|
63
|
+
accessibilityRole: 'button',
|
|
64
|
+
accessibilityState: {
|
|
65
|
+
disabled,
|
|
66
|
+
expanded: open
|
|
67
|
+
}
|
|
68
|
+
};
|
|
69
|
+
return /*#__PURE__*/_jsx(Comp, {
|
|
70
|
+
ref: mergeRefs(ref, triggerRef),
|
|
71
|
+
disabled: disabled,
|
|
72
|
+
accessibilityLabel: accessibilityLabel,
|
|
73
|
+
...props,
|
|
74
|
+
...platformAccessibilityProps,
|
|
75
|
+
...mergeDataAttributes(props, dataAttributes({
|
|
76
|
+
state: open ? 'open' : 'closed',
|
|
77
|
+
disabled,
|
|
78
|
+
hover: isHoveredProp || isHovered,
|
|
79
|
+
active: isActiveProp || isPressed,
|
|
80
|
+
focus: isFocusedProp || isFocused,
|
|
81
|
+
focusVisible: isFocusVisibleProp || isFocusVisible
|
|
82
|
+
})),
|
|
83
|
+
onPress: composeEventHandlers(onPress, () => setOpen(!open)),
|
|
84
|
+
onPressIn: composeEventHandlers(onPressIn, pressProps.onPressIn),
|
|
85
|
+
onPressOut: composeEventHandlers(onPressOut, pressProps.onPressOut),
|
|
86
|
+
onHoverIn: composeEventHandlers(onHoverIn, hoverProps.onHoverIn),
|
|
87
|
+
onHoverOut: composeEventHandlers(onHoverOut, hoverProps.onHoverOut),
|
|
88
|
+
onFocus: composeEventHandlers(onFocus, focusProps.onFocus, focusRingProps.onFocus),
|
|
89
|
+
onBlur: composeEventHandlers(onBlur, focusProps.onBlur, focusRingProps.onBlur),
|
|
90
|
+
children: children
|
|
91
|
+
});
|
|
92
|
+
});
|
|
93
|
+
ColorPickerTrigger.displayName = 'ColorPickerTrigger';
|
|
94
|
+
//# sourceMappingURL=ColorPickerTrigger.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["forwardRef","Platform","Pressable","composeEventHandlers","mergeRefs","useFocus","useFocusRing","useHover","usePress","Slot","dataAttributes","mergeDataAttributes","useColorPickerRootContext","jsx","_jsx","ColorPickerTrigger","asChild","children","isDisabled","isHovered","isHoveredProp","isActive","isActiveProp","isFocused","isFocusedProp","isFocusVisible","isFocusVisibleProp","accessibilityLabel","onPress","onPressIn","onPressOut","onHoverIn","onHoverOut","onFocus","onBlur","props","ref","open","setOpen","triggerRef","disabled","Boolean","focusProps","focusRingProps","isPressed","pressProps","hoverProps","Comp","platformAccessibilityProps","OS","role","undefined","accessibilityRole","accessibilityState","expanded","state","hover","active","focus","focusVisible","displayName"],"sourceRoot":"../../../src","sources":["color-picker/ColorPickerTrigger.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { createContext, useContext } from 'react';
|
|
4
|
+
const ColorPickerContext = /*#__PURE__*/createContext(null);
|
|
5
|
+
export const ColorPickerProvider = ColorPickerContext.Provider;
|
|
6
|
+
const ColorPickerRootContext = /*#__PURE__*/createContext(null);
|
|
7
|
+
export const ColorPickerRootProvider = ColorPickerRootContext.Provider;
|
|
8
|
+
export function useColorPickerContext() {
|
|
9
|
+
const context = useContext(ColorPickerContext);
|
|
10
|
+
if (!context) {
|
|
11
|
+
throw new Error('Color picker compound components must be used within ColorPicker');
|
|
12
|
+
}
|
|
13
|
+
return context;
|
|
14
|
+
}
|
|
15
|
+
export function useOptionalColorPickerContext() {
|
|
16
|
+
return useContext(ColorPickerContext);
|
|
17
|
+
}
|
|
18
|
+
export function useColorPickerRootContext() {
|
|
19
|
+
const context = useContext(ColorPickerRootContext);
|
|
20
|
+
if (!context) {
|
|
21
|
+
throw new Error('ColorPicker compound components must be used within ColorPickerRoot');
|
|
22
|
+
}
|
|
23
|
+
return context;
|
|
24
|
+
}
|
|
25
|
+
//# sourceMappingURL=context.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["createContext","useContext","ColorPickerContext","ColorPickerProvider","Provider","ColorPickerRootContext","ColorPickerRootProvider","useColorPickerContext","context","Error","useOptionalColorPickerContext","useColorPickerRootContext"],"sourceRoot":"../../../src","sources":["color-picker/context.tsx"],"mappings":";;AAAA,SAASA,aAAa,EAAEC,UAAU,QAAwB,OAAO;AASjE,MAAMC,kBAAkB,gBAAGF,aAAa,CAAiC,IAAI,CAAC;AAE9E,OAAO,MAAMG,mBAAmB,GAAGD,kBAAkB,CAACE,QAAQ;AAS9D,MAAMC,sBAAsB,gBAAGL,aAAa,CAAqC,IAAI,CAAC;AAEtF,OAAO,MAAMM,uBAAuB,GAAGD,sBAAsB,CAACD,QAAQ;AAEtE,OAAO,SAASG,qBAAqBA,CAAA,EAA4B;EAC/D,MAAMC,OAAO,GAAGP,UAAU,CAACC,kBAAkB,CAAC;EAE9C,IAAI,CAACM,OAAO,EAAE;IACZ,MAAM,IAAIC,KAAK,CAAC,kEAAkE,CAAC;EACrF;EAEA,OAAOD,OAAO;AAChB;AAEA,OAAO,SAASE,6BAA6BA,CAAA,EAAmC;EAC9E,OAAOT,UAAU,CAACC,kBAAkB,CAAC;AACvC;AAEA,OAAO,SAASS,yBAAyBA,CAAA,EAAgC;EACvE,MAAMH,OAAO,GAAGP,UAAU,CAACI,sBAAsB,CAAC;EAElD,IAAI,CAACG,OAAO,EAAE;IACZ,MAAM,IAAIC,KAAK,CAAC,qEAAqE,CAAC;EACxF;EAEA,OAAOD,OAAO;AAChB","ignoreList":[]}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
export { ColorPickerProvider, ColorPickerRootProvider, useColorPickerContext, useColorPickerRootContext, useOptionalColorPickerContext } from './context';
|
|
4
|
+
export { ColorPickerRoot } from './ColorPickerRoot';
|
|
5
|
+
export { ColorPickerTrigger } from './ColorPickerTrigger';
|
|
6
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["ColorPickerProvider","ColorPickerRootProvider","useColorPickerContext","useColorPickerRootContext","useOptionalColorPickerContext","ColorPickerRoot","ColorPickerTrigger"],"sourceRoot":"../../../src","sources":["color-picker/index.ts"],"mappings":";;AAAA,SACEA,mBAAmB,EACnBC,uBAAuB,EACvBC,qBAAqB,EACrBC,yBAAyB,EACzBC,6BAA6B,QAGxB,WAAW;AAClB,SAASC,eAAe,QAAmC,mBAAmB;AAC9E,SAASC,kBAAkB,QAAsC,sBAAsB","ignoreList":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":[],"sourceRoot":"../../../src","sources":["color-picker/types.ts"],"mappings":"","ignoreList":[]}
|
|
@@ -0,0 +1,115 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { forwardRef, useCallback, useRef } from 'react';
|
|
4
|
+
import { Platform, Pressable } from 'react-native';
|
|
5
|
+
import { Slot } from '../slot';
|
|
6
|
+
import { assignRef } from '../utils/assignRef';
|
|
7
|
+
import { dataAttributes, mergeDataAttributes } from '../utils/dataAttributes';
|
|
8
|
+
import { getPointerCoords, getRatioFromPagePoint, useWebSliderDrag } from '../slider/useSliderPointer';
|
|
9
|
+
import { useColorSliderContext } from './context';
|
|
10
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
11
|
+
export const ColorSliderRail = /*#__PURE__*/forwardRef(({
|
|
12
|
+
asChild,
|
|
13
|
+
style,
|
|
14
|
+
onLayout,
|
|
15
|
+
children,
|
|
16
|
+
...props
|
|
17
|
+
}, ref) => {
|
|
18
|
+
const {
|
|
19
|
+
orientation,
|
|
20
|
+
isDisabled,
|
|
21
|
+
isDragging,
|
|
22
|
+
layout,
|
|
23
|
+
thumbSize,
|
|
24
|
+
setLayout,
|
|
25
|
+
setIsDragging,
|
|
26
|
+
setValueFromRatio
|
|
27
|
+
} = useColorSliderContext();
|
|
28
|
+
const railRef = useRef(null);
|
|
29
|
+
const thumbAxisSize = orientation === 'horizontal' ? thumbSize.width : thumbSize.height;
|
|
30
|
+
const measureRail = useCallback(() => {
|
|
31
|
+
const node = railRef.current;
|
|
32
|
+
if (!node?.measureInWindow) {
|
|
33
|
+
return;
|
|
34
|
+
}
|
|
35
|
+
node.measureInWindow((x, y, width, height) => {
|
|
36
|
+
setLayout({
|
|
37
|
+
x,
|
|
38
|
+
y,
|
|
39
|
+
width,
|
|
40
|
+
height
|
|
41
|
+
});
|
|
42
|
+
});
|
|
43
|
+
}, [setLayout]);
|
|
44
|
+
const handleLayout = useCallback(event => {
|
|
45
|
+
measureRail();
|
|
46
|
+
onLayout?.(event);
|
|
47
|
+
}, [measureRail, onLayout]);
|
|
48
|
+
const {
|
|
49
|
+
startDrag
|
|
50
|
+
} = useWebSliderDrag({
|
|
51
|
+
isDisabled,
|
|
52
|
+
setIsDragging,
|
|
53
|
+
setValueFromRatio,
|
|
54
|
+
trackLayout: layout,
|
|
55
|
+
orientation,
|
|
56
|
+
thumbSize: thumbAxisSize
|
|
57
|
+
});
|
|
58
|
+
const updateFromEvent = useCallback(event => {
|
|
59
|
+
if (isDisabled) {
|
|
60
|
+
return;
|
|
61
|
+
}
|
|
62
|
+
const {
|
|
63
|
+
x,
|
|
64
|
+
y
|
|
65
|
+
} = getPointerCoords(event.nativeEvent);
|
|
66
|
+
setValueFromRatio(getRatioFromPagePoint(x, y, layout, orientation, thumbAxisSize), true);
|
|
67
|
+
}, [isDisabled, layout, orientation, setValueFromRatio, thumbAxisSize]);
|
|
68
|
+
const handlePointerDown = useCallback(event => {
|
|
69
|
+
if (Platform.OS !== 'web' || isDisabled) {
|
|
70
|
+
return;
|
|
71
|
+
}
|
|
72
|
+
event.preventDefault();
|
|
73
|
+
const node = railRef.current;
|
|
74
|
+
if (!node) {
|
|
75
|
+
return;
|
|
76
|
+
}
|
|
77
|
+
const rect = node.getBoundingClientRect();
|
|
78
|
+
const freshLayout = {
|
|
79
|
+
x: rect.left,
|
|
80
|
+
y: rect.top,
|
|
81
|
+
width: rect.width,
|
|
82
|
+
height: rect.height
|
|
83
|
+
};
|
|
84
|
+
setLayout(freshLayout);
|
|
85
|
+
const {
|
|
86
|
+
x,
|
|
87
|
+
y
|
|
88
|
+
} = getPointerCoords(event.nativeEvent);
|
|
89
|
+
const ratio = getRatioFromPagePoint(x, y, freshLayout, orientation, thumbAxisSize);
|
|
90
|
+
startDrag(x, y, ratio, freshLayout);
|
|
91
|
+
}, [isDisabled, orientation, setLayout, startDrag, thumbAxisSize]);
|
|
92
|
+
const Comp = asChild ? Slot : Pressable;
|
|
93
|
+
return /*#__PURE__*/_jsx(Comp, {
|
|
94
|
+
ref: node => {
|
|
95
|
+
railRef.current = node;
|
|
96
|
+
assignRef(ref, node);
|
|
97
|
+
},
|
|
98
|
+
...props,
|
|
99
|
+
accessibilityRole: "none",
|
|
100
|
+
accessible: false,
|
|
101
|
+
disabled: isDisabled,
|
|
102
|
+
onPress: Platform.OS === 'web' ? undefined : updateFromEvent,
|
|
103
|
+
onPointerDown: Platform.OS === 'web' ? handlePointerDown : undefined,
|
|
104
|
+
tabIndex: -1,
|
|
105
|
+
onLayout: handleLayout,
|
|
106
|
+
style: style,
|
|
107
|
+
...mergeDataAttributes(props, dataAttributes({
|
|
108
|
+
slot: 'color-slider-rail',
|
|
109
|
+
dragging: isDragging
|
|
110
|
+
})),
|
|
111
|
+
children: children
|
|
112
|
+
});
|
|
113
|
+
});
|
|
114
|
+
ColorSliderRail.displayName = 'ColorSliderRail';
|
|
115
|
+
//# sourceMappingURL=ColorSliderRail.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["forwardRef","useCallback","useRef","Platform","Pressable","Slot","assignRef","dataAttributes","mergeDataAttributes","getPointerCoords","getRatioFromPagePoint","useWebSliderDrag","useColorSliderContext","jsx","_jsx","ColorSliderRail","asChild","style","onLayout","children","props","ref","orientation","isDisabled","isDragging","layout","thumbSize","setLayout","setIsDragging","setValueFromRatio","railRef","thumbAxisSize","width","height","measureRail","node","current","measureInWindow","x","y","handleLayout","event","startDrag","trackLayout","updateFromEvent","nativeEvent","handlePointerDown","OS","preventDefault","rect","getBoundingClientRect","freshLayout","left","top","ratio","Comp","accessibilityRole","accessible","disabled","onPress","undefined","onPointerDown","tabIndex","slot","dragging","displayName"],"sourceRoot":"../../../src","sources":["color-slider/ColorSliderRail.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,149 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from 'react';
|
|
4
|
+
import { Platform, View } from 'react-native';
|
|
5
|
+
import { useControllableState } from '@cdx-ui/utils';
|
|
6
|
+
import { parseColor } from '../color';
|
|
7
|
+
import { useOptionalColorPickerContext } from '../color-picker';
|
|
8
|
+
import { Slot } from '../slot';
|
|
9
|
+
import { dataAttributes, mergeDataAttributes } from '../utils/dataAttributes';
|
|
10
|
+
import { ColorSliderProvider } from './context';
|
|
11
|
+
import { clampColorSliderValue, formatColorSliderValue, getColorSliderChannelValue, getColorSliderGradientColors, getColorSliderRange, withColorSliderChannel } from './utils';
|
|
12
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
|
+
function createDefaultColor() {
|
|
14
|
+
const color = parseColor('#FF0000');
|
|
15
|
+
if (!color) {
|
|
16
|
+
throw new Error('ColorSlider default color could not be parsed');
|
|
17
|
+
}
|
|
18
|
+
return color;
|
|
19
|
+
}
|
|
20
|
+
const DEFAULT_COLOR = createDefaultColor();
|
|
21
|
+
const EMPTY_SIZE = {
|
|
22
|
+
width: 0,
|
|
23
|
+
height: 0
|
|
24
|
+
};
|
|
25
|
+
export const ColorSliderRoot = /*#__PURE__*/forwardRef(({
|
|
26
|
+
asChild,
|
|
27
|
+
value: valueProp,
|
|
28
|
+
defaultValue,
|
|
29
|
+
onValueChange,
|
|
30
|
+
onValueChangeComplete,
|
|
31
|
+
colorSpace,
|
|
32
|
+
channel,
|
|
33
|
+
orientation = 'horizontal',
|
|
34
|
+
step = 1,
|
|
35
|
+
pageStep = 10,
|
|
36
|
+
isDisabled = false,
|
|
37
|
+
accessibilityLabel,
|
|
38
|
+
children,
|
|
39
|
+
...props
|
|
40
|
+
}, ref) => {
|
|
41
|
+
const picker = useOptionalColorPickerContext();
|
|
42
|
+
const usesPickerContext = picker !== null && valueProp === undefined && defaultValue === undefined;
|
|
43
|
+
const [localValue, setLocalValue] = useControllableState({
|
|
44
|
+
prop: valueProp,
|
|
45
|
+
defaultProp: defaultValue ?? DEFAULT_COLOR,
|
|
46
|
+
onChange: onValueChange
|
|
47
|
+
});
|
|
48
|
+
const value = (usesPickerContext ? picker.value : localValue) ?? DEFAULT_COLOR;
|
|
49
|
+
const [layout, setLayoutState] = useState(null);
|
|
50
|
+
const [thumbSize, setThumbSizeState] = useState(EMPTY_SIZE);
|
|
51
|
+
const [isDragging, setIsDragging] = useState(false);
|
|
52
|
+
const configuration = useMemo(() => ({
|
|
53
|
+
colorSpace,
|
|
54
|
+
channel
|
|
55
|
+
}), [channel, colorSpace]);
|
|
56
|
+
const {
|
|
57
|
+
min,
|
|
58
|
+
max
|
|
59
|
+
} = getColorSliderRange(configuration);
|
|
60
|
+
const resolvedChannelValue = getColorSliderChannelValue(value, configuration);
|
|
61
|
+
const [isHueAtEnd, setIsHueAtEnd] = useState(false);
|
|
62
|
+
const channelValue = configuration.channel === 'hue' && resolvedChannelValue === min && isHueAtEnd ? max : resolvedChannelValue;
|
|
63
|
+
const valueRef = useRef(value);
|
|
64
|
+
valueRef.current = value;
|
|
65
|
+
useEffect(() => {
|
|
66
|
+
if (configuration.channel !== 'hue' || resolvedChannelValue !== min) {
|
|
67
|
+
setIsHueAtEnd(false);
|
|
68
|
+
}
|
|
69
|
+
}, [configuration.channel, min, resolvedChannelValue]);
|
|
70
|
+
const commitValue = useCallback((next, complete = false) => {
|
|
71
|
+
valueRef.current = next;
|
|
72
|
+
if (usesPickerContext) {
|
|
73
|
+
onValueChange?.(next);
|
|
74
|
+
picker.onValueChange(next);
|
|
75
|
+
} else {
|
|
76
|
+
setLocalValue(next);
|
|
77
|
+
}
|
|
78
|
+
if (complete) {
|
|
79
|
+
onValueChangeComplete?.(next);
|
|
80
|
+
}
|
|
81
|
+
}, [onValueChange, onValueChangeComplete, picker, setLocalValue, usesPickerContext]);
|
|
82
|
+
const setChannelValue = useCallback((nextValue, complete = false) => {
|
|
83
|
+
if (isDisabled) {
|
|
84
|
+
return;
|
|
85
|
+
}
|
|
86
|
+
const clamped = clampColorSliderValue(nextValue, min, max);
|
|
87
|
+
const snapped = step > 0 ? min + Math.round((clamped - min) / step) * step : clamped;
|
|
88
|
+
const committedValue = clampColorSliderValue(snapped, min, max);
|
|
89
|
+
const nextColor = withColorSliderChannel(valueRef.current, configuration, committedValue);
|
|
90
|
+
setIsHueAtEnd(configuration.channel === 'hue' && committedValue === max);
|
|
91
|
+
commitValue(nextColor, complete);
|
|
92
|
+
}, [commitValue, configuration, isDisabled, max, min, step]);
|
|
93
|
+
const setValueFromRatio = useCallback((ratio, complete = false) => {
|
|
94
|
+
const clampedRatio = clampColorSliderValue(ratio, 0, 1);
|
|
95
|
+
setChannelValue(min + clampedRatio * (max - min), complete);
|
|
96
|
+
}, [max, min, setChannelValue]);
|
|
97
|
+
const setLayout = useCallback(next => {
|
|
98
|
+
setLayoutState(previous => previous !== null && previous.width === next.width && previous.height === next.height && previous.x === next.x && previous.y === next.y ? previous : next);
|
|
99
|
+
}, []);
|
|
100
|
+
const setThumbSize = useCallback(next => {
|
|
101
|
+
setThumbSizeState(previous => previous.width === next.width && previous.height === next.height ? previous : next);
|
|
102
|
+
}, []);
|
|
103
|
+
const contextValue = useMemo(() => ({
|
|
104
|
+
...configuration,
|
|
105
|
+
value,
|
|
106
|
+
channelValue,
|
|
107
|
+
valueLabel: formatColorSliderValue(channelValue, configuration),
|
|
108
|
+
min,
|
|
109
|
+
max,
|
|
110
|
+
step,
|
|
111
|
+
pageStep,
|
|
112
|
+
percent: max <= min ? 0 : (channelValue - min) / (max - min) * 100,
|
|
113
|
+
orientation,
|
|
114
|
+
isDisabled,
|
|
115
|
+
isDragging,
|
|
116
|
+
accessibilityLabel,
|
|
117
|
+
layout,
|
|
118
|
+
thumbSize,
|
|
119
|
+
gradientColors: getColorSliderGradientColors(value, configuration),
|
|
120
|
+
setLayout,
|
|
121
|
+
setThumbSize,
|
|
122
|
+
setIsDragging,
|
|
123
|
+
setChannelValue,
|
|
124
|
+
setValueFromRatio
|
|
125
|
+
}), [accessibilityLabel, channelValue, configuration, isDisabled, isDragging, layout, max, min, orientation, pageStep, setChannelValue, setLayout, setThumbSize, setValueFromRatio, step, thumbSize, value]);
|
|
126
|
+
const Comp = asChild ? Slot : View;
|
|
127
|
+
return /*#__PURE__*/_jsx(ColorSliderProvider, {
|
|
128
|
+
value: contextValue,
|
|
129
|
+
children: /*#__PURE__*/_jsx(Comp, {
|
|
130
|
+
ref: ref,
|
|
131
|
+
...props,
|
|
132
|
+
role: Platform.OS === 'web' ? 'group' : undefined,
|
|
133
|
+
"aria-label": props['aria-label'] ?? accessibilityLabel,
|
|
134
|
+
accessibilityLabel: accessibilityLabel,
|
|
135
|
+
accessibilityState: {
|
|
136
|
+
disabled: isDisabled
|
|
137
|
+
},
|
|
138
|
+
...mergeDataAttributes(props, dataAttributes({
|
|
139
|
+
disabled: isDisabled,
|
|
140
|
+
colorSpace,
|
|
141
|
+
channel,
|
|
142
|
+
orientation
|
|
143
|
+
})),
|
|
144
|
+
children: children
|
|
145
|
+
})
|
|
146
|
+
});
|
|
147
|
+
});
|
|
148
|
+
ColorSliderRoot.displayName = 'ColorSliderRoot';
|
|
149
|
+
//# sourceMappingURL=ColorSliderRoot.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["forwardRef","useCallback","useEffect","useMemo","useRef","useState","Platform","View","useControllableState","parseColor","useOptionalColorPickerContext","Slot","dataAttributes","mergeDataAttributes","ColorSliderProvider","clampColorSliderValue","formatColorSliderValue","getColorSliderChannelValue","getColorSliderGradientColors","getColorSliderRange","withColorSliderChannel","jsx","_jsx","createDefaultColor","color","Error","DEFAULT_COLOR","EMPTY_SIZE","width","height","ColorSliderRoot","asChild","value","valueProp","defaultValue","onValueChange","onValueChangeComplete","colorSpace","channel","orientation","step","pageStep","isDisabled","accessibilityLabel","children","props","ref","picker","usesPickerContext","undefined","localValue","setLocalValue","prop","defaultProp","onChange","layout","setLayoutState","thumbSize","setThumbSizeState","isDragging","setIsDragging","configuration","min","max","resolvedChannelValue","isHueAtEnd","setIsHueAtEnd","channelValue","valueRef","current","commitValue","next","complete","setChannelValue","nextValue","clamped","snapped","Math","round","committedValue","nextColor","setValueFromRatio","ratio","clampedRatio","setLayout","previous","x","y","setThumbSize","contextValue","valueLabel","percent","gradientColors","Comp","role","OS","accessibilityState","disabled","displayName"],"sourceRoot":"../../../src","sources":["color-slider/ColorSliderRoot.tsx"],"mappings":"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","ignoreList":[]}
|