@cdx-ui/components 0.1.7 → 0.2.1

package/lib/commonjs/components/ColorPicker/index.js

@@ -0,0 +1,88 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ColorPicker = void 0;
+Object.defineProperty(exports, "parseColor", {
+  enumerable: true,
+  get: function () {
+    return _primitives.parseColor;
+  }
+});
+var _react = require("react");
+var _primitives = require("@cdx-ui/primitives");
+var _utils = require("@cdx-ui/utils");
+var _surfaces = require("../picker/surfaces");
+var _styles = require("./styles");
+var _jsxRuntime = require("react/jsx-runtime");
+const ColorPickerRoot = /*#__PURE__*/(0, _react.forwardRef)(({
+  asChild,
+  className,
+  style,
+  children,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.ColorPickerRoot, {
+  ref: ref,
+  asChild: asChild,
+  className: (0, _utils.cn)((0, _styles.colorPickerVariants)(), className),
+  style: style,
+  ...props,
+  ...(0, _primitives.mergeDataAttributes)(props, (0, _primitives.dataAttributes)({
+    slot: 'color-picker'
+  })),
+  children: children
+}));
+ColorPickerRoot.displayName = 'ColorPicker';
+const ColorPickerTrigger = /*#__PURE__*/(0, _react.forwardRef)(({
+  asChild,
+  className,
+  style,
+  children,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.ColorPickerTrigger, {
+  ref: ref,
+  asChild: asChild,
+  className: asChild ? className : (0, _utils.cn)((0, _styles.colorPickerTriggerVariants)(), className),
+  style: style,
+  ...props,
+  ...(0, _primitives.mergeDataAttributes)(props, (0, _primitives.dataAttributes)({
+    slot: 'color-picker-trigger'
+  })),
+  children: children
+}));
+ColorPickerTrigger.displayName = 'ColorPicker.Trigger';
+const registerPopoverSurface = type => {
+  void type;
+};
+function ColorPickerPopover({
+  className,
+  contentClassName,
+  children
+}) {
+  const context = (0, _primitives.useColorPickerRootContext)();
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_surfaces.PickerPopoverSurface, {
+    open: context.open,
+    setOpen: context.setOpen,
+    registerSurface: registerPopoverSurface,
+    anchorRef: context.anchorRef,
+    triggerRef: context.triggerRef,
+    className: (0, _utils.cn)((0, _styles.colorPickerPopoverVariants)(), className),
+    contentClassName: (0, _utils.cn)((0, _styles.colorPickerPopoverContentVariants)(), contentClassName),
+    dataSlot: "color-picker-popover",
+    width: "content",
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.ColorPickerRootProvider, {
+      value: context,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.ColorPickerProvider, {
+        value: context,
+        children: children
+      })
+    })
+  });
+}
+ColorPickerPopover.displayName = 'ColorPicker.Popover';
+const ColorPicker = exports.ColorPicker = Object.assign(ColorPickerRoot, {
+  Trigger: ColorPickerTrigger,
+  Popover: ColorPickerPopover
+});
+//# sourceMappingURL=index.js.map

package/lib/commonjs/components/ColorPicker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_primitives","_utils","_surfaces","_styles","_jsxRuntime","ColorPickerRoot","forwardRef","asChild","className","style","children","props","ref","jsx","cn","colorPickerVariants","mergeDataAttributes","dataAttributes","slot","displayName","ColorPickerTrigger","colorPickerTriggerVariants","registerPopoverSurface","type","ColorPickerPopover","contentClassName","context","useColorPickerRootContext","PickerPopoverSurface","open","setOpen","registerSurface","anchorRef","triggerRef","colorPickerPopoverVariants","colorPickerPopoverContentVariants","dataSlot","width","ColorPickerRootProvider","value","ColorPickerProvider","ColorPicker","exports","Object","assign","Trigger","Popover"],"sourceRoot":"../../../../src","sources":["components/ColorPicker/index.tsx"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/components/ColorPicker/styles.js

@@ -0,0 +1,22 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.colorPickerVariants = exports.colorPickerTriggerVariants = exports.colorPickerPopoverVariants = exports.colorPickerPopoverContentVariants = void 0;
+var _reactNative = require("react-native");
+var _utils = require("@cdx-ui/utils");
+var _constants = require("../../styles/constants");
+const colorPickerVariants = exports.colorPickerVariants = (0, _utils.cva)(['items-start gap-2']);
+const colorPickerTriggerVariants = exports.colorPickerTriggerVariants = (0, _utils.cva)(['h-10 self-start flex-row items-center justify-center gap-2 px-3', 'rounded-[var(--border-radius-button)]', 'border border-stroke-action bg-transparent', _constants.TRANSITION_COLORS, 'data-[disabled=true]:opacity-[var(--opacity-disabled)]', _constants.DISABLED_CURSOR, 'web:outline-none web:focus:outline-none web:focus-visible:outline-none', 'web:data-[focus-visible=true]:ring-2', 'web:data-[focus-visible=true]:ring-stroke-focus', 'web:data-[focus-visible=true]:ring-offset-2', _reactNative.Platform.select({
+  default: 'data-[active=true]:bg-surface-action-tint-active',
+  web: ['data-[hover=true]:bg-surface-action-tint-hover', 'data-[active=true]:data-[hover=true]:bg-surface-action-tint-active'].join(' ')
+})]);
+
+/**
+ * Padding lives on the scroll content, not the popover: the popover's `ScrollView` clips at its
+ * own bounds, and slider/area thumbs overhang their track ends by half a thumb plus shadow.
+ */
+const colorPickerPopoverVariants = exports.colorPickerPopoverVariants = (0, _utils.cva)(['w-80 p-0']);
+const colorPickerPopoverContentVariants = exports.colorPickerPopoverContentVariants = (0, _utils.cva)(['gap-3 p-4']);
+//# sourceMappingURL=styles.js.map

package/lib/commonjs/components/ColorPicker/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_reactNative","require","_utils","_constants","colorPickerVariants","exports","cva","colorPickerTriggerVariants","TRANSITION_COLORS","DISABLED_CURSOR","Platform","select","default","web","join","colorPickerPopoverVariants","colorPickerPopoverContentVariants"],"sourceRoot":"../../../../src","sources":["components/ColorPicker/styles.ts"],"mappings":";;;;;;AAAA,IAAAA,YAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AACA,IAAAE,UAAA,GAAAF,OAAA;AAEO,MAAMG,mBAAmB,GAAAC,OAAA,CAAAD,mBAAA,GAAG,IAAAE,UAAG,EAAC,CAAC,mBAAmB,CAAC,CAAC;AAEtD,MAAMC,0BAA0B,GAAAF,OAAA,CAAAE,0BAAA,GAAG,IAAAD,UAAG,EAAC,CAC5C,iEAAiE,EACjE,uCAAuC,EACvC,4CAA4C,EAC5CE,4BAAiB,EACjB,wDAAwD,EACxDC,0BAAe,EACf,wEAAwE,EACxE,sCAAsC,EACtC,iDAAiD,EACjD,6CAA6C,EAC7CC,qBAAQ,CAACC,MAAM,CAAC;EACdC,OAAO,EAAE,kDAAkD;EAC3DC,GAAG,EAAE,CACH,gDAAgD,EAChD,oEAAoE,CACrE,CAACC,IAAI,CAAC,GAAG;AACZ,CAAC,CAAC,CACH,CAAC;;AAEF;AACA;AACA;AACA;AACO,MAAMC,0BAA0B,GAAAV,OAAA,CAAAU,0BAAA,GAAG,IAAAT,UAAG,EAAC,CAAC,UAAU,CAAC,CAAC;AAEpD,MAAMU,iCAAiC,GAAAX,OAAA,CAAAW,iCAAA,GAAG,IAAAV,UAAG,EAAC,CAAC,WAAW,CAAC,CAAC","ignoreList":[]}

package/lib/commonjs/components/ColorSlider/ColorSliderRailPaint.js

@@ -0,0 +1,68 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ColorSliderRailPaint = ColorSliderRailPaint;
+var _react = require("react");
+var _reactNative = require("react-native");
+var _reactNativeSvg = require("react-native-svg");
+var _primitives = require("@cdx-ui/primitives");
+var _styles = require("./styles");
+var _jsxRuntime = require("react/jsx-runtime");
+function getStopOffset(index, count, railSize, endCap) {
+  const ratio = index / (count - 1);
+  if (railSize <= 0 || endCap <= 0) {
+    return `${String(ratio * 100)}%`;
+  }
+  return `${String((endCap + ratio * railSize) / (railSize + 2 * endCap) * 100)}%`;
+}
+function ColorSliderRailPaint() {
+  const {
+    gradientColors,
+    orientation,
+    layout,
+    thumbSize
+  } = (0, _primitives.useColorSliderContext)();
+  const gradientId = (0, _react.useId)();
+  const isVertical = orientation === 'vertical';
+  const railSize = (isVertical ? layout?.height : layout?.width) ?? 0;
+  const endCap = (isVertical ? thumbSize.height : thumbSize.width) / 2;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+    className: (0, _styles.colorSliderRailPaintVariants)({
+      orientation
+    }),
+    style: styles.paint,
+    accessible: false,
+    accessibilityElementsHidden: true,
+    importantForAccessibility: "no-hide-descendants",
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNativeSvg.Svg, {
+      width: "100%",
+      height: "100%",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Defs, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.LinearGradient, {
+          id: gradientId,
+          x1: "0%",
+          y1: orientation === 'vertical' ? '100%' : '0%',
+          x2: orientation === 'horizontal' ? '100%' : '0%',
+          y2: "0%",
+          children: gradientColors.map((color, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Stop, {
+            offset: getStopOffset(index, gradientColors.length, railSize, endCap),
+            stopColor: color
+          }, `${color}-${String(index)}`))
+        })
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Rect, {
+        width: "100%",
+        height: "100%",
+        fill: `url(#${gradientId})`
+      })]
+    })
+  });
+}
+ColorSliderRailPaint.displayName = 'ColorSliderRailPaint';
+const styles = _reactNative.StyleSheet.create({
+  paint: {
+    pointerEvents: 'none'
+  }
+});
+//# sourceMappingURL=ColorSliderRailPaint.js.map

package/lib/commonjs/components/ColorSlider/ColorSliderRailPaint.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_reactNative","_reactNativeSvg","_primitives","_styles","_jsxRuntime","getStopOffset","index","count","railSize","endCap","ratio","String","ColorSliderRailPaint","gradientColors","orientation","layout","thumbSize","useColorSliderContext","gradientId","useId","isVertical","height","width","jsx","View","className","colorSliderRailPaintVariants","style","styles","paint","accessible","accessibilityElementsHidden","importantForAccessibility","children","jsxs","Svg","Defs","LinearGradient","id","x1","y1","x2","y2","map","color","Stop","offset","length","stopColor","Rect","fill","displayName","StyleSheet","create","pointerEvents"],"sourceRoot":"../../../../src","sources":["components/ColorSlider/ColorSliderRailPaint.tsx"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/components/ColorSlider/ColorSliderRailPaint.web.js

@@ -0,0 +1,41 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ColorSliderRailPaint = ColorSliderRailPaint;
+var _reactNative = require("react-native");
+var _primitives = require("@cdx-ui/primitives");
+var _styles = require("./styles");
+var _jsxRuntime = require("react/jsx-runtime");
+function getGradientStops(colors, endCap) {
+  if (endCap <= 0 || colors.length < 2) {
+    return colors.join(', ');
+  }
+  const first = `${colors[0]} ${String(endCap)}px`;
+  const last = `${colors[colors.length - 1]} calc(100% - ${String(endCap)}px)`;
+  return [first, ...colors.slice(1, -1), last].join(', ');
+}
+function ColorSliderRailPaint() {
+  const {
+    gradientColors,
+    orientation,
+    thumbSize
+  } = (0, _primitives.useColorSliderContext)();
+  const direction = orientation === 'vertical' ? 'to top' : 'to right';
+  const endCap = (orientation === 'vertical' ? thumbSize.height : thumbSize.width) / 2;
+  const paintStyle = {
+    backgroundImage: `linear-gradient(${direction}, ${getGradientStops(gradientColors, endCap)})`
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+    className: (0, _styles.colorSliderRailPaintVariants)({
+      orientation
+    }),
+    style: paintStyle,
+    accessible: false,
+    accessibilityElementsHidden: true,
+    importantForAccessibility: "no-hide-descendants"
+  });
+}
+ColorSliderRailPaint.displayName = 'ColorSliderRailPaint';
+//# sourceMappingURL=ColorSliderRailPaint.web.js.map

package/lib/commonjs/components/ColorSlider/ColorSliderRailPaint.web.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_reactNative","require","_primitives","_styles","_jsxRuntime","getGradientStops","colors","endCap","length","join","first","String","last","slice","ColorSliderRailPaint","gradientColors","orientation","thumbSize","useColorSliderContext","direction","height","width","paintStyle","backgroundImage","jsx","View","className","colorSliderRailPaintVariants","style","accessible","accessibilityElementsHidden","importantForAccessibility","displayName"],"sourceRoot":"../../../../src","sources":["components/ColorSlider/ColorSliderRailPaint.web.tsx"],"mappings":";;;;;;AAAA,IAAAA,YAAA,GAAAC,OAAA;AACA,IAAAC,WAAA,GAAAD,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AAAwD,IAAAG,WAAA,GAAAH,OAAA;AAExD,SAASI,gBAAgBA,CAACC,MAAyB,EAAEC,MAAc,EAAU;EAC3E,IAAIA,MAAM,IAAI,CAAC,IAAID,MAAM,CAACE,MAAM,GAAG,CAAC,EAAE;IACpC,OAAOF,MAAM,CAACG,IAAI,CAAC,IAAI,CAAC;EAC1B;EACA,MAAMC,KAAK,GAAG,GAAGJ,MAAM,CAAC,CAAC,CAAC,IAAIK,MAAM,CAACJ,MAAM,CAAC,IAAI;EAChD,MAAMK,IAAI,GAAG,GAAGN,MAAM,CAACA,MAAM,CAACE,MAAM,GAAG,CAAC,CAAC,gBAAgBG,MAAM,CAACJ,MAAM,CAAC,KAAK;EAC5E,OAAO,CAACG,KAAK,EAAE,GAAGJ,MAAM,CAACO,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAED,IAAI,CAAC,CAACH,IAAI,CAAC,IAAI,CAAC;AACzD;AAEO,SAASK,oBAAoBA,CAAA,EAAG;EACrC,MAAM;IAAEC,cAAc;IAAEC,WAAW;IAAEC;EAAU,CAAC,GAAG,IAAAC,iCAAqB,EAAC,CAAC;EAC1E,MAAMC,SAAS,GAAGH,WAAW,KAAK,UAAU,GAAG,QAAQ,GAAG,UAAU;EACpE,MAAMT,MAAM,GAAG,CAACS,WAAW,KAAK,UAAU,GAAGC,SAAS,CAACG,MAAM,GAAGH,SAAS,CAACI,KAAK,IAAI,CAAC;EACpF,MAAMC,UAAU,GAAG;IACjBC,eAAe,EAAE,mBAAmBJ,SAAS,KAAKd,gBAAgB,CAACU,cAAc,EAAER,MAAM,CAAC;EAC5F,CAAyB;EAEzB,oBACE,IAAAH,WAAA,CAAAoB,GAAA,EAACxB,YAAA,CAAAyB,IAAI;IACHC,SAAS,EAAE,IAAAC,oCAA4B,EAAC;MAAEX;IAAY,CAAC,CAAE;IACzDY,KAAK,EAAEN,UAAW;IAClBO,UAAU,EAAE,KAAM;IAClBC,2BAA2B;IAC3BC,yBAAyB,EAAC;EAAqB,CAChD,CAAC;AAEN;AAEAjB,oBAAoB,CAACkB,WAAW,GAAG,sBAAsB","ignoreList":[]}

package/lib/commonjs/components/ColorSlider/index.js

@@ -0,0 +1,123 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ColorSlider = void 0;
+var _react = require("react");
+var _reactNative = require("react-native");
+var _primitives = require("@cdx-ui/primitives");
+var _utils = require("@cdx-ui/utils");
+var _ColorSliderRailPaint = require("./ColorSliderRailPaint");
+var _styles = require("./styles");
+var _jsxRuntime = require("react/jsx-runtime");
+const ColorSliderRoot = /*#__PURE__*/(0, _react.forwardRef)(({
+  asChild,
+  className,
+  style,
+  orientation = 'horizontal',
+  children,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.ColorSliderRoot, {
+  ref: ref,
+  asChild: asChild,
+  className: (0, _utils.cn)((0, _styles.colorSliderVariants)({
+    orientation
+  }), className),
+  style: style,
+  orientation: orientation,
+  ...props,
+  ...(0, _primitives.mergeDataAttributes)(props, (0, _primitives.dataAttributes)({
+    slot: 'color-slider'
+  })),
+  children: children
+}));
+ColorSliderRoot.displayName = 'ColorSlider';
+const ColorSliderRail = /*#__PURE__*/(0, _react.forwardRef)(({
+  asChild,
+  className,
+  style,
+  hitSlop,
+  children,
+  ...props
+}, ref) => {
+  const {
+    orientation,
+    thumbSize
+  } = (0, _primitives.useColorSliderContext)();
+  const endCap = orientation === 'vertical' ? {
+    top: thumbSize.height / 2,
+    bottom: thumbSize.height / 2
+  } : {
+    left: thumbSize.width / 2,
+    right: thumbSize.width / 2
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_primitives.ColorSliderRail, {
+    ref: ref,
+    asChild: asChild,
+    className: (0, _utils.cn)((0, _styles.colorSliderRailVariants)({
+      orientation
+    }), className),
+    style: style,
+    hitSlop: hitSlop ?? endCap,
+    ...props,
+    ...(0, _primitives.mergeDataAttributes)(props, (0, _primitives.dataAttributes)({
+      slot: 'color-slider-rail'
+    })),
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ColorSliderRailPaint.ColorSliderRailPaint, {}), children]
+  });
+});
+ColorSliderRail.displayName = 'ColorSlider.Rail';
+const ColorSliderThumb = /*#__PURE__*/(0, _react.forwardRef)(({
+  className,
+  style,
+  children,
+  ...props
+}, ref) => {
+  const {
+    value
+  } = (0, _primitives.useColorSliderContext)();
+  const fillStyle = {
+    backgroundColor: value.toString('hex')
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.ColorSliderThumb, {
+    ref: ref,
+    className: (0, _utils.cn)((0, _styles.colorSliderThumbVariants)(), className),
+    style: typeof style === 'function' ? state => [fillStyle, style(state)] : [fillStyle, style],
+    ...props,
+    ...(0, _primitives.mergeDataAttributes)(props, (0, _primitives.dataAttributes)({
+      slot: 'color-slider-thumb'
+    })),
+    children: children
+  });
+});
+ColorSliderThumb.displayName = 'ColorSlider.Thumb';
+const ColorSliderOutput = /*#__PURE__*/(0, _react.forwardRef)(({
+  asChild,
+  className,
+  style,
+  children,
+  ...props
+}, ref) => {
+  const {
+    valueLabel
+  } = (0, _primitives.useColorSliderContext)();
+  const Comp = asChild ? _primitives.Slot : _reactNative.Text;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Comp, {
+    ref: ref,
+    className: (0, _utils.cn)((0, _styles.colorSliderOutputVariants)(), className),
+    style: style,
+    ...props,
+    ...(0, _primitives.mergeDataAttributes)(props, (0, _primitives.dataAttributes)({
+      slot: 'color-slider-output'
+    })),
+    children: children ?? valueLabel
+  });
+});
+ColorSliderOutput.displayName = 'ColorSlider.Output';
+const ColorSlider = exports.ColorSlider = Object.assign(ColorSliderRoot, {
+  Rail: ColorSliderRail,
+  Thumb: ColorSliderThumb,
+  Output: ColorSliderOutput
+});
+//# sourceMappingURL=index.js.map

package/lib/commonjs/components/ColorSlider/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_reactNative","_primitives","_utils","_ColorSliderRailPaint","_styles","_jsxRuntime","ColorSliderRoot","forwardRef","asChild","className","style","orientation","children","props","ref","jsx","cn","colorSliderVariants","mergeDataAttributes","dataAttributes","slot","displayName","ColorSliderRail","hitSlop","thumbSize","useColorSliderContext","endCap","top","height","bottom","left","width","right","jsxs","colorSliderRailVariants","ColorSliderRailPaint","ColorSliderThumb","value","fillStyle","backgroundColor","toString","colorSliderThumbVariants","state","ColorSliderOutput","valueLabel","Comp","Slot","Text","colorSliderOutputVariants","ColorSlider","exports","Object","assign","Rail","Thumb","Output"],"sourceRoot":"../../../../src","sources":["components/ColorSlider/index.tsx"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/components/ColorSlider/styles.js

@@ -0,0 +1,50 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.colorSliderVariants = exports.colorSliderThumbVariants = exports.colorSliderRailVariants = exports.colorSliderRailPaintVariants = exports.colorSliderOutputVariants = void 0;
+var _reactNative = require("react-native");
+var _utils = require("@cdx-ui/utils");
+var _constants = require("../../styles/constants");
+const colorSliderVariants = exports.colorSliderVariants = (0, _utils.cva)(['relative select-none', 'data-[disabled=true]:opacity-[var(--opacity-disabled)]', _constants.DISABLED_CURSOR], {
+  variants: {
+    orientation: {
+      horizontal: 'w-full',
+      vertical: 'h-48'
+    }
+  },
+  defaultVariants: {
+    orientation: 'horizontal'
+  }
+});
+
+// The rail inset equals the `size-5` thumb's radius so the thumb sits flush inside the pill ends.
+const colorSliderRailVariants = exports.colorSliderRailVariants = (0, _utils.cva)(['relative touch-none'], {
+  variants: {
+    orientation: {
+      horizontal: 'mx-2.5 h-5 w-auto',
+      vertical: 'my-2.5 w-5 flex-1'
+    }
+  },
+  defaultVariants: {
+    orientation: 'horizontal'
+  }
+});
+const colorSliderRailPaintVariants = exports.colorSliderRailPaintVariants = (0, _utils.cva)(['absolute overflow-hidden rounded-[var(--border-radius-round)]'], {
+  variants: {
+    orientation: {
+      horizontal: '-inset-x-2.5 inset-y-0',
+      vertical: '-inset-y-2.5 inset-x-0'
+    }
+  },
+  defaultVariants: {
+    orientation: 'horizontal'
+  }
+});
+const colorSliderThumbVariants = exports.colorSliderThumbVariants = (0, _utils.cva)(['z-2 box-border size-5 rounded-[var(--border-radius-round)]', 'border-2 border-surface-primary shadow-md', 'transition-[transform,box-shadow,opacity] duration-150', 'data-[dragging=true]:transition-none', 'web:outline-none web:active:cursor-grabbing', _reactNative.Platform.select({
+  default: 'data-[focus=true]:scale-105',
+  web: ['web:cursor-grab', 'data-[hover=true]:scale-110', 'data-[dragging=true]:scale-110', 'data-[focus-visible=true]:ring-4', 'data-[focus-visible=true]:ring-stroke-focus'].join(' ')
+})]);
+const colorSliderOutputVariants = exports.colorSliderOutputVariants = (0, _utils.cva)(['text-sm font-medium text-content-primary']);
+//# sourceMappingURL=styles.js.map

package/lib/commonjs/components/ColorSlider/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_reactNative","require","_utils","_constants","colorSliderVariants","exports","cva","DISABLED_CURSOR","variants","orientation","horizontal","vertical","defaultVariants","colorSliderRailVariants","colorSliderRailPaintVariants","colorSliderThumbVariants","Platform","select","default","web","join","colorSliderOutputVariants"],"sourceRoot":"../../../../src","sources":["components/ColorSlider/styles.ts"],"mappings":";;;;;;AAAA,IAAAA,YAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AACA,IAAAE,UAAA,GAAAF,OAAA;AAEO,MAAMG,mBAAmB,GAAAC,OAAA,CAAAD,mBAAA,GAAG,IAAAE,UAAG,EACpC,CACE,sBAAsB,EACtB,wDAAwD,EACxDC,0BAAe,CAChB,EACD;EACEC,QAAQ,EAAE;IACRC,WAAW,EAAE;MACXC,UAAU,EAAE,QAAQ;MACpBC,QAAQ,EAAE;IACZ;EACF,CAAC;EACDC,eAAe,EAAE;IACfH,WAAW,EAAE;EACf;AACF,CACF,CAAC;;AAED;AACO,MAAMI,uBAAuB,GAAAR,OAAA,CAAAQ,uBAAA,GAAG,IAAAP,UAAG,EAAC,CAAC,qBAAqB,CAAC,EAAE;EAClEE,QAAQ,EAAE;IACRC,WAAW,EAAE;MACXC,UAAU,EAAE,mBAAmB;MAC/BC,QAAQ,EAAE;IACZ;EACF,CAAC;EACDC,eAAe,EAAE;IACfH,WAAW,EAAE;EACf;AACF,CAAC,CAAC;AAEK,MAAMK,4BAA4B,GAAAT,OAAA,CAAAS,4BAAA,GAAG,IAAAR,UAAG,EAC7C,CAAC,+DAA+D,CAAC,EACjE;EACEE,QAAQ,EAAE;IACRC,WAAW,EAAE;MACXC,UAAU,EAAE,wBAAwB;MACpCC,QAAQ,EAAE;IACZ;EACF,CAAC;EACDC,eAAe,EAAE;IACfH,WAAW,EAAE;EACf;AACF,CACF,CAAC;AAEM,MAAMM,wBAAwB,GAAAV,OAAA,CAAAU,wBAAA,GAAG,IAAAT,UAAG,EAAC,CAC1C,4DAA4D,EAC5D,2CAA2C,EAC3C,wDAAwD,EACxD,sCAAsC,EACtC,6CAA6C,EAC7CU,qBAAQ,CAACC,MAAM,CAAC;EACdC,OAAO,EAAE,6BAA6B;EACtCC,GAAG,EAAE,CACH,iBAAiB,EACjB,6BAA6B,EAC7B,gCAAgC,EAChC,kCAAkC,EAClC,6CAA6C,CAC9C,CAACC,IAAI,CAAC,GAAG;AACZ,CAAC,CAAC,CACH,CAAC;AAEK,MAAMC,yBAAyB,GAAAhB,OAAA,CAAAgB,yBAAA,GAAG,IAAAf,UAAG,EAAC,CAAC,0CAA0C,CAAC,CAAC","ignoreList":[]}

package/lib/commonjs/components/ColorSwatch/index.js

@@ -0,0 +1,54 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ColorSwatchView = exports.ColorSwatch = void 0;
+var _react = require("react");
+var _reactNative = require("react-native");
+var _primitives = require("@cdx-ui/primitives");
+var _utils = require("@cdx-ui/utils");
+var _styles = require("./styles");
+var _jsxRuntime = require("react/jsx-runtime");
+const ColorSwatchView = exports.ColorSwatchView = /*#__PURE__*/(0, _react.forwardRef)(({
+  asChild,
+  color,
+  size = 'sm',
+  shape = 'circle',
+  slot,
+  className,
+  style,
+  ...props
+}, ref) => {
+  const Comp = asChild ? _primitives.Slot : _reactNative.View;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Comp, {
+    ref: ref,
+    className: (0, _utils.cn)((0, _styles.colorSwatchVariants)({
+      size,
+      shape
+    }), className),
+    style: [color ? {
+      backgroundColor: color.toString('hex')
+    } : undefined, style],
+    ...props,
+    ...(0, _primitives.mergeDataAttributes)(props, (0, _primitives.dataAttributes)({
+      slot
+    }))
+  });
+});
+ColorSwatchView.displayName = 'ColorSwatchView';
+const ColorSwatch = exports.ColorSwatch = /*#__PURE__*/(0, _react.forwardRef)(({
+  color: colorProp,
+  ...props
+}, ref) => {
+  const picker = (0, _primitives.useOptionalColorPickerContext)();
+  const color = colorProp ?? picker?.value;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(ColorSwatchView, {
+    ref: ref,
+    color: color,
+    slot: "color-swatch",
+    ...props
+  });
+});
+ColorSwatch.displayName = 'ColorSwatch';
+//# sourceMappingURL=index.js.map

package/lib/commonjs/components/ColorSwatch/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_reactNative","_primitives","_utils","_styles","_jsxRuntime","ColorSwatchView","exports","forwardRef","asChild","color","size","shape","slot","className","style","props","ref","Comp","Slot","View","jsx","cn","colorSwatchVariants","backgroundColor","toString","undefined","mergeDataAttributes","dataAttributes","displayName","ColorSwatch","colorProp","picker","useOptionalColorPickerContext","value"],"sourceRoot":"../../../../src","sources":["components/ColorSwatch/index.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,WAAA,GAAAF,OAAA;AAOA,IAAAG,MAAA,GAAAH,OAAA;AACA,IAAAI,OAAA,GAAAJ,OAAA;AAA6E,IAAAK,WAAA,GAAAL,OAAA;AAgBtE,MAAMM,eAAe,GAAAC,OAAA,CAAAD,eAAA,gBAAG,IAAAE,iBAAU,EACvC,CAAC;EAAEC,OAAO;EAAEC,KAAK;EAAEC,IAAI,GAAG,IAAI;EAAEC,KAAK,GAAG,QAAQ;EAAEC,IAAI;EAAEC,SAAS;EAAEC,KAAK;EAAE,GAAGC;AAAM,CAAC,EAAEC,GAAG,KAAK;EAC5F,MAAMC,IAAI,GAAGT,OAAO,GAAGU,gBAAI,GAAGC,iBAAI;EAElC,oBACE,IAAAf,WAAA,CAAAgB,GAAA,EAACH,IAAI;IACHD,GAAG,EAAEA,GAAI;IACTH,SAAS,EAAE,IAAAQ,SAAE,EAAC,IAAAC,2BAAmB,EAAC;MAAEZ,IAAI;MAAEC;IAAM,CAAC,CAAC,EAAEE,SAAS,CAAE;IAC/DC,KAAK,EAAE,CAACL,KAAK,GAAG;MAAEc,eAAe,EAAEd,KAAK,CAACe,QAAQ,CAAC,KAAK;IAAE,CAAC,GAAGC,SAAS,EAAEX,KAAK,CAAE;IAAA,GAC3EC,KAAK;IAAA,GACL,IAAAW,+BAAmB,EAACX,KAAK,EAAE,IAAAY,0BAAc,EAAC;MAAEf;IAAK,CAAC,CAAC;EAAC,CACzD,CAAC;AAEN,CACF,CAAC;AAEDP,eAAe,CAACuB,WAAW,GAAG,iBAAiB;AAExC,MAAMC,WAAW,GAAAvB,OAAA,CAAAuB,WAAA,gBAAG,IAAAtB,iBAAU,EACnC,CAAC;EAAEE,KAAK,EAAEqB,SAAS;EAAE,GAAGf;AAAM,CAAC,EAAEC,GAAG,KAAK;EACvC,MAAMe,MAAM,GAAG,IAAAC,yCAA6B,EAAC,CAAC;EAC9C,MAAMvB,KAAK,GAAGqB,SAAS,IAAIC,MAAM,EAAEE,KAAK;EAExC,oBAAO,IAAA7B,WAAA,CAAAgB,GAAA,EAACf,eAAe;IAACW,GAAG,EAAEA,GAAI;IAACP,KAAK,EAAEA,KAAM;IAACG,IAAI,EAAC,cAAc;IAAA,GAAKG;EAAK,CAAG,CAAC;AACnF,CACF,CAAC;AAEDc,WAAW,CAACD,WAAW,GAAG,aAAa","ignoreList":[]}

package/lib/commonjs/components/ColorSwatch/styles.js

@@ -0,0 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.colorSwatchVariants = void 0;
+var _utils = require("@cdx-ui/utils");
+const colorSwatchVariants = exports.colorSwatchVariants = (0, _utils.cva)(['shrink-0 overflow-hidden border border-stroke-secondary'], {
+  variants: {
+    size: {
+      xs: 'size-4',
+      sm: 'size-6',
+      lg: 'size-10'
+    },
+    shape: {
+      circle: 'rounded-[var(--border-radius-round)]',
+      square: 'rounded-[var(--border-radius-default)]'
+    }
+  },
+  defaultVariants: {
+    size: 'sm',
+    shape: 'circle'
+  }
+});
+//# sourceMappingURL=styles.js.map

package/lib/commonjs/components/ColorSwatch/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_utils","require","colorSwatchVariants","exports","cva","variants","size","xs","sm","lg","shape","circle","square","defaultVariants"],"sourceRoot":"../../../../src","sources":["components/ColorSwatch/styles.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAEO,MAAMC,mBAAmB,GAAAC,OAAA,CAAAD,mBAAA,GAAG,IAAAE,UAAG,EACpC,CAAC,yDAAyD,CAAC,EAC3D;EACEC,QAAQ,EAAE;IACRC,IAAI,EAAE;MACJC,EAAE,EAAE,QAAQ;MACZC,EAAE,EAAE,QAAQ;MACZC,EAAE,EAAE;IACN,CAAC;IACDC,KAAK,EAAE;MACLC,MAAM,EAAE,sCAAsC;MAC9CC,MAAM,EAAE;IACV;EACF,CAAC;EACDC,eAAe,EAAE;IACfP,IAAI,EAAE,IAAI;IACVI,KAAK,EAAE;EACT;AACF,CACF,CAAC","ignoreList":[]}

package/lib/commonjs/components/ColorSwatchPicker/index.js

@@ -0,0 +1,110 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ColorSwatchPicker = void 0;
+var _react = require("react");
+var _reactNative = require("react-native");
+var _icons = require("@cdx-ui/icons");
+var _primitives = require("@cdx-ui/primitives");
+var _utils = require("@cdx-ui/utils");
+var _Icon = require("../Icon");
+var _ColorSwatch = require("../ColorSwatch");
+var _styles = require("./styles");
+var _jsxRuntime = require("react/jsx-runtime");
+const ColorSwatchPickerRoot = /*#__PURE__*/(0, _react.forwardRef)(({
+  asChild,
+  className,
+  style,
+  children,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.ColorSwatchPickerRoot, {
+  ref: ref,
+  asChild: asChild,
+  className: (0, _utils.cn)((0, _styles.colorSwatchPickerVariants)(), className),
+  style: style,
+  ...props,
+  ...(0, _primitives.mergeDataAttributes)(props, (0, _primitives.dataAttributes)({
+    slot: 'color-swatch-picker'
+  })),
+  children: children
+}));
+ColorSwatchPickerRoot.displayName = 'ColorSwatchPicker';
+const ColorSwatchPickerItem = /*#__PURE__*/(0, _react.forwardRef)(({
+  asChild,
+  className,
+  style,
+  children,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.ColorSwatchPickerItem, {
+  ref: ref,
+  asChild: asChild,
+  className: (0, _utils.cn)((0, _styles.colorSwatchPickerItemVariants)(), className),
+  style: style,
+  ...props,
+  ...(0, _primitives.mergeDataAttributes)(props, (0, _primitives.dataAttributes)({
+    slot: 'color-swatch-picker-item'
+  })),
+  children: children
+}));
+ColorSwatchPickerItem.displayName = 'ColorSwatchPicker.Item';
+const ColorSwatchPickerSwatch = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
+  const {
+    color
+  } = (0, _primitives.useColorSwatchPickerItemContext)();
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ColorSwatch.ColorSwatchView, {
+    ref: ref,
+    color: color,
+    slot: "color-swatch-picker-swatch",
+    ...props
+  });
+});
+ColorSwatchPickerSwatch.displayName = 'ColorSwatchPicker.Swatch';
+const ColorSwatchPickerIndicator = ({
+  asChild,
+  as = _icons.Check,
+  className,
+  style,
+  children,
+  ...props
+}) => {
+  const {
+    isChecked
+  } = (0, _primitives.useRadioContext)();
+  if (!isChecked) {
+    return null;
+  }
+  const computedClassName = (0, _utils.cn)((0, _styles.colorSwatchPickerIndicatorIconVariants)(), className);
+  const slotData = (0, _primitives.mergeDataAttributes)(props, (0, _primitives.dataAttributes)({
+    slot: 'color-swatch-picker-indicator'
+  }));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+    className: (0, _styles.colorSwatchPickerIndicatorVariants)(),
+    accessibilityElementsHidden: true,
+    "aria-hidden": true,
+    ...slotData,
+    children: asChild ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.Slot, {
+      className: computedClassName,
+      style: style,
+      accessibilityElementsHidden: true,
+      "aria-hidden": true,
+      ...props,
+      children: children
+    }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.Icon, {
+      as: as,
+      className: computedClassName,
+      style: style,
+      accessibilityElementsHidden: true,
+      "aria-hidden": true,
+      ...props
+    })
+  });
+};
+ColorSwatchPickerIndicator.displayName = 'ColorSwatchPicker.Indicator';
+const ColorSwatchPicker = exports.ColorSwatchPicker = Object.assign(ColorSwatchPickerRoot, {
+  Item: ColorSwatchPickerItem,
+  Swatch: ColorSwatchPickerSwatch,
+  Indicator: ColorSwatchPickerIndicator
+});
+//# sourceMappingURL=index.js.map

package/lib/commonjs/components/ColorSwatchPicker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_reactNative","_icons","_primitives","_utils","_Icon","_ColorSwatch","_styles","_jsxRuntime","ColorSwatchPickerRoot","forwardRef","asChild","className","style","children","props","ref","jsx","cn","colorSwatchPickerVariants","mergeDataAttributes","dataAttributes","slot","displayName","ColorSwatchPickerItem","colorSwatchPickerItemVariants","ColorSwatchPickerSwatch","color","useColorSwatchPickerItemContext","ColorSwatchView","ColorSwatchPickerIndicator","as","Check","isChecked","useRadioContext","computedClassName","colorSwatchPickerIndicatorIconVariants","slotData","View","colorSwatchPickerIndicatorVariants","accessibilityElementsHidden","Slot","Icon","ColorSwatchPicker","exports","Object","assign","Item","Swatch","Indicator"],"sourceRoot":"../../../../src","sources":["components/ColorSwatchPicker/index.tsx"],"mappings":"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","ignoreList":[]}