{"version":3,"sources":["../src/color-selector-channels.tsx"],"sourcesContent":["import type { CSSUIObject, HTMLUIProps } from \"@yamada-ui/core\"\nimport type { InputProps } from \"@yamada-ui/input\"\nimport type { ReactNode } from \"react\"\nimport { forwardRef, ui } from \"@yamada-ui/core\"\nimport { Input } from \"@yamada-ui/input\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useId } from \"react\"\nimport { useColorSelectorContext } from \"./use-color-selector\"\n\ninterface ColorSelectorChannelsOptions {\n  /**\n   * Props for the chancel component.\n   */\n  channelProps?: Omit<ColorSelectorChannelProps, \"channelLabel\">\n}\n\nexport interface ColorSelectorChannelsProps\n  extends Omit<HTMLUIProps, \"children\">,\n    ColorSelectorChannelsOptions {}\n\nexport const ColorSelectorChannels = forwardRef<\n  ColorSelectorChannelsProps,\n  \"div\"\n>(({ className, channelProps, ...rest }, ref) => {\n  const { channels, styles, withAlpha, getChannelProps } =\n    useColorSelectorContext()\n\n  const css: CSSUIObject = {\n    display: \"grid\",\n    gridTemplateColumns: `repeat(${withAlpha ? \"4\" : \"3\"}, 1fr)`,\n    ...styles.channels,\n  }\n\n  return (\n    <ui.div\n      ref={ref}\n      className={cx(\"ui-color-selector__channels\", className)}\n      __css={css}\n      {...rest}\n    >\n      {channels.map(({ label, max, min, space, value }) => (\n        <ColorSelectorChannel\n          key={label}\n          channelLabel={label}\n          {...getChannelProps({ ...channelProps, max, min, space, value })}\n        />\n      ))}\n    </ui.div>\n  )\n})\n\nColorSelectorChannels.displayName = \"ColorSelectorChannels\"\nColorSelectorChannels.__ui__ = \"ColorSelectorChannels\"\n\ninterface ColorSelectorChannelOptions {\n  channelLabel?: ReactNode\n}\n\nexport type ColorSelectorChannelProps = ColorSelectorChannelOptions &\n  Omit<\n    InputProps,\n    \"defaultValue\" | \"max\" | \"min\" | \"pattern\" | \"type\" | \"value\"\n  >\n\nexport const ColorSelectorChannel = forwardRef<\n  ColorSelectorChannelProps,\n  \"input\"\n>(({ className, channelLabel, ...rest }, ref) => {\n  const id = useId()\n  let { size, disabled, readOnly, styles } = useColorSelectorContext()\n\n  if (size === \"full\") size = \"lg\"\n\n  const css: CSSUIObject = { ...styles.channel }\n\n  return (\n    <ui.div className={cx(\"ui-color-selector__channel\", className)}>\n      {channelLabel ? (\n        <ui.label\n          htmlFor={id}\n          style={{ cursor: disabled ? \"not-allowed\" : undefined }}\n          __css={{\n            display: \"block\",\n            pointerEvents: readOnly ? \"none\" : undefined,\n            ...styles.channelLabel,\n          }}\n        >\n          {channelLabel}\n        </ui.label>\n      ) : null}\n\n      <Input id={id} ref={ref} size={size} __css={css} {...rest} />\n    </ui.div>\n  )\n})\n\nColorSelectorChannel.displayName = \"ColorSelectorChannel\"\nColorSelectorChannel.__ui__ = \"ColorSelectorChannel\"\n"],"mappings":";;;;;;AAGA,SAAS,YAAY,UAAU;AAC/B,SAAS,aAAa;AACtB,SAAS,UAAU;AACnB,SAAS,aAAa;AAmCd,cAmCJ,YAnCI;AArBD,IAAM,wBAAwB,WAGnC,CAAC,EAAE,WAAW,cAAc,GAAG,KAAK,GAAG,QAAQ;AAC/C,QAAM,EAAE,UAAU,QAAQ,WAAW,gBAAgB,IACnD,wBAAwB;AAE1B,QAAM,MAAmB;AAAA,IACvB,SAAS;AAAA,IACT,qBAAqB,UAAU,YAAY,MAAM,GAAG;AAAA,IACpD,GAAG,OAAO;AAAA,EACZ;AAEA,SACE;AAAA,IAAC,GAAG;AAAA,IAAH;AAAA,MACC;AAAA,MACA,WAAW,GAAG,+BAA+B,SAAS;AAAA,MACtD,OAAO;AAAA,MACN,GAAG;AAAA,MAEH,mBAAS,IAAI,CAAC,EAAE,OAAO,KAAK,KAAK,OAAO,MAAM,MAC7C;AAAA,QAAC;AAAA;AAAA,UAEC,cAAc;AAAA,UACb,GAAG,gBAAgB,EAAE,GAAG,cAAc,KAAK,KAAK,OAAO,MAAM,CAAC;AAAA;AAAA,QAF1D;AAAA,MAGP,CACD;AAAA;AAAA,EACH;AAEJ,CAAC;AAED,sBAAsB,cAAc;AACpC,sBAAsB,SAAS;AAYxB,IAAM,uBAAuB,WAGlC,CAAC,EAAE,WAAW,cAAc,GAAG,KAAK,GAAG,QAAQ;AAC/C,QAAM,KAAK,MAAM;AACjB,MAAI,EAAE,MAAM,UAAU,UAAU,OAAO,IAAI,wBAAwB;AAEnE,MAAI,SAAS,OAAQ,QAAO;AAE5B,QAAM,MAAmB,EAAE,GAAG,OAAO,QAAQ;AAE7C,SACE,qBAAC,GAAG,KAAH,EAAO,WAAW,GAAG,8BAA8B,SAAS,GAC1D;AAAA,mBACC;AAAA,MAAC,GAAG;AAAA,MAAH;AAAA,QACC,SAAS;AAAA,QACT,OAAO,EAAE,QAAQ,WAAW,gBAAgB,OAAU;AAAA,QACtD,OAAO;AAAA,UACL,SAAS;AAAA,UACT,eAAe,WAAW,SAAS;AAAA,UACnC,GAAG,OAAO;AAAA,QACZ;AAAA,QAEC;AAAA;AAAA,IACH,IACE;AAAA,IAEJ,oBAAC,SAAM,IAAQ,KAAU,MAAY,OAAO,KAAM,GAAG,MAAM;AAAA,KAC7D;AAEJ,CAAC;AAED,qBAAqB,cAAc;AACnC,qBAAqB,SAAS;","names":[]}