@cdx-ui/components 0.1.7 → 0.2.0

package/coverage.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="108" height="20" role="img" aria-label="coverage: 91.5%"><title>coverage: 91.5%</title><filter id="blur"><feGaussianBlur stdDeviation="16"/></filter><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="108" height="20" rx="3"/></clipPath><g clip-path="url(#r)"><rect width="61" height="20" fill="#555"/><rect x="61" width="47" height="20" fill="#4b0"/><rect width="108" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><g transform="scale(.1)"><g aria-hidden="true" fill="#010101"><text x="315" y="150" fill-opacity=".8" filter="url(#blur)" textLength="510">coverage</text><text x="315" y="150" fill-opacity=".3" textLength="510">coverage</text></g><text x="315" y="140" textLength="510">coverage</text></g><g transform="scale(.1)"><g aria-hidden="true" fill="#010101"><text x="835" y="150" fill-opacity=".8" filter="url(#blur)" textLength="370">91.5%</text><text x="835" y="150" fill-opacity=".3" textLength="370">91.5%</text></g><text x="835" y="140" textLength="370">91.5%</text></g></g></svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="108" height="20" role="img" aria-label="coverage: 91.8%"><title>coverage: 91.8%</title><filter id="blur"><feGaussianBlur stdDeviation="16"/></filter><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="108" height="20" rx="3"/></clipPath><g clip-path="url(#r)"><rect width="61" height="20" fill="#555"/><rect x="61" width="47" height="20" fill="#4b0"/><rect width="108" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><g transform="scale(.1)"><g aria-hidden="true" fill="#010101"><text x="315" y="150" fill-opacity=".8" filter="url(#blur)" textLength="510">coverage</text><text x="315" y="150" fill-opacity=".3" textLength="510">coverage</text></g><text x="315" y="140" textLength="510">coverage</text></g><g transform="scale(.1)"><g aria-hidden="true" fill="#010101"><text x="835" y="150" fill-opacity=".8" filter="url(#blur)" textLength="370">91.8%</text><text x="835" y="150" fill-opacity=".3" textLength="370">91.8%</text></g><text x="835" y="140" textLength="370">91.8%</text></g></g></svg>

package/lib/commonjs/components/ColorArea/ColorAreaPaint.js

@@ -0,0 +1,78 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ColorAreaPaint = ColorAreaPaint;
+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 ColorAreaPaint() {
+  const {
+    value,
+    isRTL
+  } = (0, _primitives.useColorAreaContext)();
+  const horizontalGradientId = (0, _react.useId)();
+  const verticalGradientId = (0, _react.useId)();
+  const hue = value.withChannel('hsb', 'saturation', 100).withChannel('hsb', 'brightness', 100);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+    className: (0, _styles.colorAreaPaintVariants)(),
+    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.jsxs)(_reactNativeSvg.Defs, {
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNativeSvg.LinearGradient, {
+          id: horizontalGradientId,
+          x1: isRTL ? '100%' : '0%',
+          y1: "0%",
+          x2: isRTL ? '0%' : '100%',
+          y2: "0%",
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Stop, {
+            offset: "0%",
+            stopColor: "#FFFFFF"
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Stop, {
+            offset: "100%",
+            stopColor: hue.toString('hex')
+          })]
+        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNativeSvg.LinearGradient, {
+          id: verticalGradientId,
+          x1: "0%",
+          y1: "0%",
+          x2: "0%",
+          y2: "100%",
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Stop, {
+            offset: "0%",
+            stopColor: "#000000",
+            stopOpacity: 0
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Stop, {
+            offset: "100%",
+            stopColor: "#000000",
+            stopOpacity: 1
+          })]
+        })]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Rect, {
+        width: "100%",
+        height: "100%",
+        fill: `url(#${horizontalGradientId})`
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Rect, {
+        width: "100%",
+        height: "100%",
+        fill: `url(#${verticalGradientId})`
+      })]
+    })
+  });
+}
+ColorAreaPaint.displayName = 'ColorAreaPaint';
+const styles = _reactNative.StyleSheet.create({
+  paint: {
+    pointerEvents: 'none'
+  }
+});
+//# sourceMappingURL=ColorAreaPaint.js.map

package/lib/commonjs/components/ColorArea/ColorAreaPaint.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_reactNative","_reactNativeSvg","_primitives","_styles","_jsxRuntime","ColorAreaPaint","value","isRTL","useColorAreaContext","horizontalGradientId","useId","verticalGradientId","hue","withChannel","jsx","View","className","colorAreaPaintVariants","style","styles","paint","accessible","accessibilityElementsHidden","importantForAccessibility","children","jsxs","Svg","width","height","Defs","LinearGradient","id","x1","y1","x2","y2","Stop","offset","stopColor","toString","stopOpacity","Rect","fill","displayName","StyleSheet","create","pointerEvents"],"sourceRoot":"../../../../src","sources":["components/ColorArea/ColorAreaPaint.tsx"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/components/ColorArea/ColorAreaPaint.web.js

@@ -0,0 +1,31 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ColorAreaPaint = ColorAreaPaint;
+var _reactNative = require("react-native");
+var _primitives = require("@cdx-ui/primitives");
+var _styles = require("./styles");
+var _jsxRuntime = require("react/jsx-runtime");
+function ColorAreaPaint() {
+  const {
+    value,
+    isRTL
+  } = (0, _primitives.useColorAreaContext)();
+  const hue = value.withChannel('hsb', 'saturation', 100).withChannel('hsb', 'brightness', 100).toString('hex');
+  const direction = isRTL ? 'to left' : 'to right';
+  const paintStyle = {
+    backgroundImage: ['linear-gradient(to bottom, transparent, #000000)', `linear-gradient(${direction}, #FFFFFF, ${hue})`].join(', '),
+    pointerEvents: 'none'
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+    className: (0, _styles.colorAreaPaintVariants)(),
+    style: paintStyle,
+    accessible: false,
+    accessibilityElementsHidden: true,
+    importantForAccessibility: "no-hide-descendants"
+  });
+}
+ColorAreaPaint.displayName = 'ColorAreaPaint';
+//# sourceMappingURL=ColorAreaPaint.web.js.map

package/lib/commonjs/components/ColorArea/ColorAreaPaint.web.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_reactNative","require","_primitives","_styles","_jsxRuntime","ColorAreaPaint","value","isRTL","useColorAreaContext","hue","withChannel","toString","direction","paintStyle","backgroundImage","join","pointerEvents","jsx","View","className","colorAreaPaintVariants","style","accessible","accessibilityElementsHidden","importantForAccessibility","displayName"],"sourceRoot":"../../../../src","sources":["components/ColorArea/ColorAreaPaint.web.tsx"],"mappings":";;;;;;AAAA,IAAAA,YAAA,GAAAC,OAAA;AACA,IAAAC,WAAA,GAAAD,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AAAkD,IAAAG,WAAA,GAAAH,OAAA;AAE3C,SAASI,cAAcA,CAAA,EAAG;EAC/B,MAAM;IAAEC,KAAK;IAAEC;EAAM,CAAC,GAAG,IAAAC,+BAAmB,EAAC,CAAC;EAC9C,MAAMC,GAAG,GAAGH,KAAK,CACdI,WAAW,CAAC,KAAK,EAAE,YAAY,EAAE,GAAG,CAAC,CACrCA,WAAW,CAAC,KAAK,EAAE,YAAY,EAAE,GAAG,CAAC,CACrCC,QAAQ,CAAC,KAAK,CAAC;EAClB,MAAMC,SAAS,GAAGL,KAAK,GAAG,SAAS,GAAG,UAAU;EAChD,MAAMM,UAAU,GAAG;IACjBC,eAAe,EAAE,CACf,kDAAkD,EAClD,mBAAmBF,SAAS,cAAcH,GAAG,GAAG,CACjD,CAACM,IAAI,CAAC,IAAI,CAAC;IACZC,aAAa,EAAE;EACjB,CAAyB;EAEzB,oBACE,IAAAZ,WAAA,CAAAa,GAAA,EAACjB,YAAA,CAAAkB,IAAI;IACHC,SAAS,EAAE,IAAAC,8BAAsB,EAAC,CAAE;IACpCC,KAAK,EAAER,UAAW;IAClBS,UAAU,EAAE,KAAM;IAClBC,2BAA2B;IAC3BC,yBAAyB,EAAC;EAAqB,CAChD,CAAC;AAEN;AAEAnB,cAAc,CAACoB,WAAW,GAAG,gBAAgB","ignoreList":[]}

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

@@ -0,0 +1,57 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ColorArea = void 0;
+var _react = require("react");
+var _primitives = require("@cdx-ui/primitives");
+var _utils = require("@cdx-ui/utils");
+var _ColorAreaPaint = require("./ColorAreaPaint");
+var _styles = require("./styles");
+var _jsxRuntime = require("react/jsx-runtime");
+const ColorAreaRoot = /*#__PURE__*/(0, _react.forwardRef)(({
+  asChild,
+  className,
+  style,
+  children,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_primitives.ColorAreaRoot, {
+  ref: ref,
+  asChild: asChild,
+  className: (0, _utils.cn)((0, _styles.colorAreaVariants)(), className),
+  style: style,
+  ...props,
+  ...(0, _primitives.mergeDataAttributes)(props, (0, _primitives.dataAttributes)({
+    slot: 'color-area'
+  })),
+  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ColorAreaPaint.ColorAreaPaint, {}), children]
+}));
+ColorAreaRoot.displayName = 'ColorArea';
+const ColorAreaThumb = /*#__PURE__*/(0, _react.forwardRef)(({
+  className,
+  style,
+  children,
+  ...props
+}, ref) => {
+  const {
+    value
+  } = (0, _primitives.useColorAreaContext)();
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.ColorAreaThumb, {
+    ref: ref,
+    className: (0, _utils.cn)((0, _styles.colorAreaThumbVariants)(), className),
+    style: [{
+      backgroundColor: value.toString('hex')
+    }, style],
+    ...props,
+    ...(0, _primitives.mergeDataAttributes)(props, (0, _primitives.dataAttributes)({
+      slot: 'color-area-thumb'
+    })),
+    children: children
+  });
+});
+ColorAreaThumb.displayName = 'ColorArea.Thumb';
+const ColorArea = exports.ColorArea = Object.assign(ColorAreaRoot, {
+  Thumb: ColorAreaThumb
+});
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_primitives","_utils","_ColorAreaPaint","_styles","_jsxRuntime","ColorAreaRoot","forwardRef","asChild","className","style","children","props","ref","jsxs","cn","colorAreaVariants","mergeDataAttributes","dataAttributes","slot","jsx","ColorAreaPaint","displayName","ColorAreaThumb","value","useColorAreaContext","colorAreaThumbVariants","backgroundColor","toString","ColorArea","exports","Object","assign","Thumb"],"sourceRoot":"../../../../src","sources":["components/ColorArea/index.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAEA,IAAAC,WAAA,GAAAD,OAAA;AASA,IAAAE,MAAA,GAAAF,OAAA;AACA,IAAAG,eAAA,GAAAH,OAAA;AACA,IAAAI,OAAA,GAAAJ,OAAA;AAAqE,IAAAK,WAAA,GAAAL,OAAA;AAQrE,MAAMM,aAAa,gBAAG,IAAAC,iBAAU,EAC9B,CAAC;EAAEC,OAAO;EAAEC,SAAS;EAAEC,KAAK;EAAEC,QAAQ;EAAE,GAAGC;AAAM,CAAC,EAAEC,GAAG,kBACrD,IAAAR,WAAA,CAAAS,IAAA,EAACb,WAAA,CAAAK,aAAsB;EACrBO,GAAG,EAAEA,GAAI;EACTL,OAAO,EAAEA,OAAQ;EACjBC,SAAS,EAAE,IAAAM,SAAE,EAAC,IAAAC,yBAAiB,EAAC,CAAC,EAAEP,SAAS,CAAE;EAC9CC,KAAK,EAAEA,KAAM;EAAA,GACTE,KAAK;EAAA,GACL,IAAAK,+BAAmB,EAACL,KAAK,EAAE,IAAAM,0BAAc,EAAC;IAAEC,IAAI,EAAE;EAAa,CAAC,CAAC,CAAC;EAAAR,QAAA,gBAEtE,IAAAN,WAAA,CAAAe,GAAA,EAACjB,eAAA,CAAAkB,cAAc,IAAE,CAAC,EACjBV,QAAQ;AAAA,CACa,CAE5B,CAAC;AAEDL,aAAa,CAACgB,WAAW,GAAG,WAAW;AAOvC,MAAMC,cAAc,gBAAG,IAAAhB,iBAAU,EAC/B,CAAC;EAAEE,SAAS;EAAEC,KAAK;EAAEC,QAAQ;EAAE,GAAGC;AAAM,CAAC,EAAEC,GAAG,KAAK;EACjD,MAAM;IAAEW;EAAM,CAAC,GAAG,IAAAC,+BAAmB,EAAC,CAAC;EAEvC,oBACE,IAAApB,WAAA,CAAAe,GAAA,EAACnB,WAAA,CAAAsB,cAAuB;IACtBV,GAAG,EAAEA,GAAI;IACTJ,SAAS,EAAE,IAAAM,SAAE,EAAC,IAAAW,8BAAsB,EAAC,CAAC,EAAEjB,SAAS,CAAE;IACnDC,KAAK,EAAE,CAAC;MAAEiB,eAAe,EAAEH,KAAK,CAACI,QAAQ,CAAC,KAAK;IAAE,CAAC,EAAElB,KAAK,CAAE;IAAA,GACvDE,KAAK;IAAA,GACL,IAAAK,+BAAmB,EAACL,KAAK,EAAE,IAAAM,0BAAc,EAAC;MAAEC,IAAI,EAAE;IAAmB,CAAC,CAAC,CAAC;IAAAR,QAAA,EAE3EA;EAAQ,CACc,CAAC;AAE9B,CACF,CAAC;AAEDY,cAAc,CAACD,WAAW,GAAG,iBAAiB;AAMvC,MAAMO,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAGE,MAAM,CAACC,MAAM,CAAC1B,aAAa,EAAE;EACpD2B,KAAK,EAAEV;AACT,CAAC,CAA+B","ignoreList":[]}

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

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.colorAreaVariants = exports.colorAreaThumbVariants = exports.colorAreaPaintVariants = void 0;
+var _utils = require("@cdx-ui/utils");
+var _constants = require("../../styles/constants");
+const colorAreaVariants = exports.colorAreaVariants = (0, _utils.cva)(['relative aspect-square w-full touch-none select-none', 'data-[disabled=true]:opacity-[var(--opacity-disabled)]', _constants.DISABLED_CURSOR]);
+const colorAreaPaintVariants = exports.colorAreaPaintVariants = (0, _utils.cva)(['absolute inset-0 overflow-hidden rounded-[var(--border-radius-default)]']);
+const colorAreaThumbVariants = exports.colorAreaThumbVariants = (0, _utils.cva)(['z-2 size-5 rounded-[var(--border-radius-round)]', 'border-2 border-surface-primary shadow-md', 'transition-none']);
+//# sourceMappingURL=styles.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["_utils","require","_constants","colorAreaVariants","exports","cva","DISABLED_CURSOR","colorAreaPaintVariants","colorAreaThumbVariants"],"sourceRoot":"../../../../src","sources":["components/ColorArea/styles.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,UAAA,GAAAD,OAAA;AAEO,MAAME,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAG,IAAAE,UAAG,EAAC,CACnC,sDAAsD,EACtD,wDAAwD,EACxDC,0BAAe,CAChB,CAAC;AAEK,MAAMC,sBAAsB,GAAAH,OAAA,CAAAG,sBAAA,GAAG,IAAAF,UAAG,EAAC,CACxC,yEAAyE,CAC1E,CAAC;AAEK,MAAMG,sBAAsB,GAAAJ,OAAA,CAAAI,sBAAA,GAAG,IAAAH,UAAG,EAAC,CACxC,iDAAiD,EACjD,2CAA2C,EAC3C,iBAAiB,CAClB,CAAC","ignoreList":[]}

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

@@ -0,0 +1,138 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ColorField = void 0;
+var _react = require("react");
+var _reactNative = require("react-native");
+var _primitives = require("@cdx-ui/primitives");
+var _utils = require("@cdx-ui/utils");
+var _positionToDataIcon = require("../../utils/positionToDataIcon");
+var _styles = require("./styles");
+var _jsxRuntime = require("react/jsx-runtime");
+const SCOPE = 'COLOR_FIELD';
+const useColorFieldStyleContext = () => (0, _utils.useParentContext)()[SCOPE] ?? {};
+const ColorFieldRoot = /*#__PURE__*/(0, _react.forwardRef)(({
+  variant = 'outline',
+  size = 'default',
+  fullWidth,
+  className,
+  children,
+  style,
+  ...props
+}, ref) => {
+  const parent = (0, _utils.useParentContext)();
+  const context = (0, _react.useMemo)(() => ({
+    ...parent,
+    [SCOPE]: {
+      variant,
+      size,
+      fullWidth
+    }
+  }), [fullWidth, parent, size, variant]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_utils.ParentContext.Provider, {
+    value: context,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.ColorFieldRoot, {
+      ref: ref,
+      className: (0, _utils.cn)((0, _styles.colorFieldVariants)(), className),
+      style: style,
+      ...props,
+      ...(0, _primitives.mergeDataAttributes)(props, (0, _primitives.dataAttributes)({
+        slot: 'color-field'
+      })),
+      children: children
+    })
+  });
+});
+ColorFieldRoot.displayName = 'ColorField';
+const ColorFieldGroup = /*#__PURE__*/(0, _react.forwardRef)(({
+  asChild,
+  variant,
+  size,
+  fullWidth,
+  className,
+  children,
+  style,
+  ...props
+}, ref) => {
+  const inherited = useColorFieldStyleContext();
+  const {
+    disabled,
+    invalid,
+    readOnly,
+    required
+  } = (0, _primitives.useColorFieldContext)();
+  const resolvedVariant = variant ?? inherited.variant ?? 'outline';
+  const resolvedSize = size ?? inherited.size ?? 'default';
+  const resolvedFullWidth = fullWidth ?? inherited.fullWidth ?? true;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.InputRoot, {
+    ref: ref,
+    asChild: asChild,
+    isDisabled: disabled,
+    isInvalid: invalid,
+    isReadOnly: readOnly,
+    isRequired: required,
+    className: (0, _utils.cn)((0, _styles.colorFieldGroupVariants)({
+      variant: resolvedVariant,
+      size: resolvedSize
+    }), !resolvedFullWidth && 'w-auto self-start', className),
+    style: style,
+    ...props,
+    ...(0, _primitives.mergeDataAttributes)(props, (0, _primitives.dataAttributes)({
+      slot: 'color-field-group'
+    })),
+    children: children
+  });
+});
+ColorFieldGroup.displayName = 'ColorField.Group';
+const ColorFieldInput = /*#__PURE__*/(0, _react.forwardRef)(({
+  className,
+  placeholderTextColorClassName,
+  style,
+  ...props
+}, ref) => {
+  const {
+    size
+  } = useColorFieldStyleContext();
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.ColorFieldInput, {
+    ref: ref,
+    className: (0, _utils.cn)((0, _styles.colorFieldInputVariants)({
+      size: size ?? 'default'
+    }), className),
+    placeholderTextColorClassName: (0, _utils.cn)((0, _styles.colorFieldInputPlaceholderVariants)(), placeholderTextColorClassName),
+    style: style,
+    ...props,
+    ...(0, _primitives.mergeDataAttributes)(props, (0, _primitives.dataAttributes)({
+      slot: 'color-field-input'
+    }))
+  });
+});
+ColorFieldInput.displayName = 'ColorField.Input';
+const ColorFieldSlot = /*#__PURE__*/(0, _react.forwardRef)(({
+  asChild,
+  position,
+  className,
+  children,
+  style,
+  ...props
+}, ref) => {
+  const Comp = asChild ? _primitives.Slot : _reactNative.View;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Comp, {
+    ref: ref,
+    className: (0, _utils.cn)((0, _styles.colorFieldSlotVariants)(), className),
+    style: style,
+    ...props,
+    ...(0, _primitives.mergeDataAttributes)(props, (0, _primitives.dataAttributes)({
+      slot: 'color-field-slot'
+    }), (0, _positionToDataIcon.positionToDataIcon)(position)),
+    children: children
+  });
+});
+ColorFieldSlot.displayName = 'ColorField.Slot';
+const ColorField = exports.ColorField = Object.assign(ColorFieldRoot, {
+  Group: ColorFieldGroup,
+  Input: ColorFieldInput,
+  Slot: ColorFieldSlot
+});
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_reactNative","_primitives","_utils","_positionToDataIcon","_styles","_jsxRuntime","SCOPE","useColorFieldStyleContext","useParentContext","ColorFieldRoot","forwardRef","variant","size","fullWidth","className","children","style","props","ref","parent","context","useMemo","jsx","ParentContext","Provider","value","cn","colorFieldVariants","mergeDataAttributes","dataAttributes","slot","displayName","ColorFieldGroup","asChild","inherited","disabled","invalid","readOnly","required","useColorFieldContext","resolvedVariant","resolvedSize","resolvedFullWidth","InputRoot","isDisabled","isInvalid","isReadOnly","isRequired","colorFieldGroupVariants","ColorFieldInput","placeholderTextColorClassName","colorFieldInputVariants","colorFieldInputPlaceholderVariants","ColorFieldSlot","position","Comp","Slot","View","colorFieldSlotVariants","positionToDataIcon","ColorField","exports","Object","assign","Group","Input"],"sourceRoot":"../../../../src","sources":["components/ColorField/index.tsx"],"mappings":"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","ignoreList":[]}

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

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.colorFieldVariants = exports.colorFieldSlotVariants = exports.colorFieldInputVariants = exports.colorFieldInputPlaceholderVariants = exports.colorFieldGroupVariants = void 0;
+var _utils = require("@cdx-ui/utils");
+var _styles = require("../Input/styles");
+const colorFieldVariants = exports.colorFieldVariants = (0, _utils.cva)('gap-1.5');
+const colorFieldGroupVariants = exports.colorFieldGroupVariants = _styles.inputRootVariants;
+const colorFieldInputVariants = exports.colorFieldInputVariants = _styles.inputFieldVariants;
+const colorFieldInputPlaceholderVariants = exports.colorFieldInputPlaceholderVariants = _styles.inputFieldPlaceholderVariants;
+const colorFieldSlotVariants = exports.colorFieldSlotVariants = _styles.inputSlotVariants;
+//# sourceMappingURL=styles.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["_utils","require","_styles","colorFieldVariants","exports","cva","colorFieldGroupVariants","inputRootVariants","colorFieldInputVariants","inputFieldVariants","colorFieldInputPlaceholderVariants","inputFieldPlaceholderVariants","colorFieldSlotVariants","inputSlotVariants"],"sourceRoot":"../../../../src","sources":["components/ColorField/styles.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AAQO,MAAME,kBAAkB,GAAAC,OAAA,CAAAD,kBAAA,GAAG,IAAAE,UAAG,EAAC,SAAS,CAAC;AAEzC,MAAMC,uBAAuB,GAAAF,OAAA,CAAAE,uBAAA,GAAGC,yBAAiB;AAEjD,MAAMC,uBAAuB,GAAAJ,OAAA,CAAAI,uBAAA,GAAGC,0BAAkB;AAElD,MAAMC,kCAAkC,GAAAN,OAAA,CAAAM,kCAAA,GAAGC,qCAA6B;AAExE,MAAMC,sBAAsB,GAAAR,OAAA,CAAAQ,sBAAA,GAAGC,yBAAiB","ignoreList":[]}

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":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,eAAA,GAAAF,OAAA;AACA,IAAAG,WAAA,GAAAH,OAAA;AACA,IAAAI,OAAA,GAAAJ,OAAA;AAAwD,IAAAK,WAAA,GAAAL,OAAA;AAExD,SAASM,aAAaA,CAACC,KAAa,EAAEC,KAAa,EAAEC,QAAgB,EAAEC,MAAc,EAAU;EAC7F,MAAMC,KAAK,GAAGJ,KAAK,IAAIC,KAAK,GAAG,CAAC,CAAC;EACjC,IAAIC,QAAQ,IAAI,CAAC,IAAIC,MAAM,IAAI,CAAC,EAAE;IAChC,OAAO,GAAGE,MAAM,CAACD,KAAK,GAAG,GAAG,CAAC,GAAG;EAClC;EACA,OAAO,GAAGC,MAAM,CAAE,CAACF,MAAM,GAAGC,KAAK,GAAGF,QAAQ,KAAKA,QAAQ,GAAG,CAAC,GAAGC,MAAM,CAAC,GAAI,GAAG,CAAC,GAAG;AACpF;AAEO,SAASG,oBAAoBA,CAAA,EAAG;EACrC,MAAM;IAAEC,cAAc;IAAEC,WAAW;IAAEC,MAAM;IAAEC;EAAU,CAAC,GAAG,IAAAC,iCAAqB,EAAC,CAAC;EAClF,MAAMC,UAAU,GAAG,IAAAC,YAAK,EAAC,CAAC;EAC1B,MAAMC,UAAU,GAAGN,WAAW,KAAK,UAAU;EAC7C,MAAMN,QAAQ,GAAG,CAACY,UAAU,GAAGL,MAAM,EAAEM,MAAM,GAAGN,MAAM,EAAEO,KAAK,KAAK,CAAC;EACnE,MAAMb,MAAM,GAAG,CAACW,UAAU,GAAGJ,SAAS,CAACK,MAAM,GAAGL,SAAS,CAACM,KAAK,IAAI,CAAC;EAEpE,oBACE,IAAAlB,WAAA,CAAAmB,GAAA,EAACvB,YAAA,CAAAwB,IAAI;IACHC,SAAS,EAAE,IAAAC,oCAA4B,EAAC;MAAEZ;IAAY,CAAC,CAAE;IACzDa,KAAK,EAAEC,MAAM,CAACC,KAAM;IACpBC,UAAU,EAAE,KAAM;IAClBC,2BAA2B;IAC3BC,yBAAyB,EAAC,qBAAqB;IAAAC,QAAA,eAE/C,IAAA7B,WAAA,CAAA8B,IAAA,EAACjC,eAAA,CAAAkC,GAAG;MAACb,KAAK,EAAC,MAAM;MAACD,MAAM,EAAC,MAAM;MAAAY,QAAA,gBAC7B,IAAA7B,WAAA,CAAAmB,GAAA,EAACtB,eAAA,CAAAmC,IAAI;QAAAH,QAAA,eACH,IAAA7B,WAAA,CAAAmB,GAAA,EAACtB,eAAA,CAAAoC,cAAc;UACbC,EAAE,EAAEpB,UAAW;UACfqB,EAAE,EAAC,IAAI;UACPC,EAAE,EAAE1B,WAAW,KAAK,UAAU,GAAG,MAAM,GAAG,IAAK;UAC/C2B,EAAE,EAAE3B,WAAW,KAAK,YAAY,GAAG,MAAM,GAAG,IAAK;UACjD4B,EAAE,EAAC,IAAI;UAAAT,QAAA,EAENpB,cAAc,CAAC8B,GAAG,CAAC,CAACC,KAAK,EAAEtC,KAAK,kBAC/B,IAAAF,WAAA,CAAAmB,GAAA,EAACtB,eAAA,CAAA4C,IAAI;YAEHC,MAAM,EAAEzC,aAAa,CAACC,KAAK,EAAEO,cAAc,CAACkC,MAAM,EAAEvC,QAAQ,EAAEC,MAAM,CAAE;YACtEuC,SAAS,EAAEJ;UAAM,GAFZ,GAAGA,KAAK,IAAIjC,MAAM,CAACL,KAAK,CAAC,EAG/B,CACF;QAAC,CACY;MAAC,CACb,CAAC,eACP,IAAAF,WAAA,CAAAmB,GAAA,EAACtB,eAAA,CAAAgD,IAAI;QAAC3B,KAAK,EAAC,MAAM;QAACD,MAAM,EAAC,MAAM;QAAC6B,IAAI,EAAE,QAAQhC,UAAU;MAAI,CAAE,CAAC;IAAA,CAC7D;EAAC,CACF,CAAC;AAEX;AAEAN,oBAAoB,CAACuC,WAAW,GAAG,sBAAsB;AAEzD,MAAMvB,MAAM,GAAGwB,uBAAU,CAACC,MAAM,CAAC;EAC/BxB,KAAK,EAAE;IACLyB,aAAa,EAAE;EACjB;AACF,CAAC,CAAC","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":[]}