@mantine/core 9.1.1 → 9.2.1

package/cjs/components/ColorInput/ColorInput.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ColorInput.cjs","names":["createVarsResolver","getSize","factory","useProps","useInputProps","useStyles","useResolvedStylesApi","ActionIcon","convertHsvaTo","parseColor","EyeDropperIcon","isColorValid","Input","Popover","ColorSwatch","classes","ColorPicker","InputBase"],"sources":["../../../src/components/ColorInput/ColorInput.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { useDidUpdate, useEyeDropper, useUncontrolled } from '@mantine/hooks';\nimport {\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getSize,\n  StylesApiProps,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '../../core';\nimport { ActionIcon } from '../ActionIcon';\nimport {\n  __ColorPickerProps,\n  ColorPicker,\n  ColorPickerStylesNames,\n  convertHsvaTo,\n  isColorValid,\n  parseColor,\n} from '../ColorPicker';\nimport { ColorSwatch } from '../ColorSwatch';\nimport { __BaseInputProps, __InputStylesNames, Input, InputVariant, useInputProps } from '../Input';\nimport { InputBase } from '../InputBase';\nimport { Popover, PopoverProps } from '../Popover';\nimport { EyeDropperIcon } from './EyeDropperIcon';\nimport classes from './ColorInput.module.css';\n\nexport type ColorInputStylesNames =\n  | 'dropdown'\n  | 'eyeDropperButton'\n  | 'eyeDropperIcon'\n  | 'colorPreview'\n  | ColorPickerStylesNames\n  | __InputStylesNames;\n\nexport type ColorInputCssVariables = {\n  eyeDropperIcon: '--ci-eye-dropper-icon-size';\n  eyeDropperButton: '--ci-button-size';\n  colorPreview: '--ci-preview-size';\n};\n\nexport interface ColorInputProps\n  extends\n    BoxProps,\n    __BaseInputProps,\n    __ColorPickerProps,\n    StylesApiProps<ColorInputFactory>,\n    ElementProps<'input', 'size' | 'onChange' | 'value' | 'defaultValue'> {\n  /** If input is not allowed, the user can only pick value with color picker and swatches */\n  disallowInput?: boolean;\n\n  /** If set, the input value resets to the last known valid value when the input loses focus @default true */\n  fixOnBlur?: boolean;\n\n  /** Props passed down to the `Popover` component */\n  popoverProps?: PopoverProps;\n\n  /** If set, the preview color swatch is displayed in the left section of the input @default true */\n  withPreview?: boolean;\n\n  /** If set, the eye dropper button is displayed in the right section @default true */\n  withEyeDropper?: boolean;\n\n  /** An icon to replace the default eye dropper icon */\n  eyeDropperIcon?: React.ReactNode;\n\n  /** If set, the dropdown is closed when one of the color swatches is clicked @default false */\n  closeOnColorSwatchClick?: boolean;\n\n  /** Props passed down to the eye dropper button */\n  eyeDropperButtonProps?: Record<string, any>;\n}\n\nexport type ColorInputFactory = Factory<{\n  props: ColorInputProps;\n  ref: HTMLInputElement;\n  stylesNames: ColorInputStylesNames;\n  vars: ColorInputCssVariables;\n  variant: InputVariant;\n}>;\n\nconst defaultProps = {\n  format: 'hex',\n  fixOnBlur: true,\n  withPreview: true,\n  swatchesPerRow: 7,\n  withPicker: true,\n  popoverProps: { transitionProps: { transition: 'fade', duration: 0 } },\n  withEyeDropper: true,\n  size: 'sm',\n  leftSectionPointerEvents: 'none',\n} satisfies Partial<ColorInputProps>;\n\nconst varsResolver = createVarsResolver<ColorInputFactory>((_, { size }) => ({\n  eyeDropperIcon: {\n    '--ci-eye-dropper-icon-size': getSize(size, 'ci-eye-dropper-icon-size'),\n  },\n\n  eyeDropperButton: {\n    '--ci-button-size': getSize(size, 'ci-button-size'),\n  },\n\n  colorPreview: {\n    '--ci-preview-size': getSize(size, 'ci-preview-size'),\n  },\n}));\n\nexport const ColorInput = factory<ColorInputFactory>((_props) => {\n  const props = useProps('ColorInput', defaultProps, _props);\n  const {\n    classNames,\n    styles,\n    unstyled,\n    disallowInput,\n    fixOnBlur,\n    popoverProps,\n    withPreview,\n    withEyeDropper,\n    eyeDropperIcon,\n    closeOnColorSwatchClick,\n    eyeDropperButtonProps,\n    value,\n    defaultValue,\n    onChange,\n    onChangeEnd,\n    onClick,\n    onFocus,\n    onBlur,\n    inputProps,\n    format = 'hex',\n    wrapperProps,\n    readOnly,\n    withPicker,\n    swatches,\n    disabled,\n    leftSection,\n    rightSection,\n    swatchesPerRow,\n    ...others\n  } = useInputProps('ColorInput', defaultProps, _props);\n\n  const getStyles = useStyles<ColorInputFactory>({\n    name: 'ColorInput',\n    props,\n    classes,\n    classNames,\n    styles,\n    unstyled,\n    rootSelector: 'wrapper',\n    vars: props.vars,\n    varsResolver,\n  });\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<ColorInputFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  const [dropdownOpened, setDropdownOpened] = useState(false);\n  const [lastValidValue, setLastValidValue] = useState('');\n  const [_value, setValue] = useUncontrolled({\n    value,\n    defaultValue,\n    finalValue: '',\n    onChange,\n  });\n\n  const { supported: eyeDropperSupported, open: openEyeDropper } = useEyeDropper();\n\n  const eyeDropper = (\n    <ActionIcon\n      {...eyeDropperButtonProps}\n      {...getStyles('eyeDropperButton', {\n        className: eyeDropperButtonProps?.className,\n        style: eyeDropperButtonProps?.style,\n      })}\n      variant=\"subtle\"\n      color=\"gray\"\n      unstyled={unstyled}\n      onClick={() =>\n        openEyeDropper()\n          .then((payload) => {\n            if (payload?.sRGBHex) {\n              const color = convertHsvaTo(format, parseColor(payload.sRGBHex));\n              setValue(color);\n              onChangeEnd?.(color);\n            }\n          })\n          .catch(() => {})\n      }\n    >\n      {eyeDropperIcon || <EyeDropperIcon {...getStyles('eyeDropperIcon')} />}\n    </ActionIcon>\n  );\n\n  const handleInputFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n    onFocus?.(event);\n    setDropdownOpened(true);\n  };\n\n  const handleInputBlur = (event: React.FocusEvent<HTMLInputElement>) => {\n    fixOnBlur && setValue(lastValidValue);\n    onBlur?.(event);\n    setDropdownOpened(false);\n  };\n\n  const handleInputClick = (event: React.MouseEvent<HTMLInputElement>) => {\n    onClick?.(event);\n    setDropdownOpened(true);\n  };\n\n  useEffect(() => {\n    if (isColorValid(_value) || _value.trim() === '') {\n      setLastValidValue(_value);\n    }\n  }, [_value]);\n\n  useDidUpdate(() => {\n    if (isColorValid(_value)) {\n      setValue(convertHsvaTo(format, parseColor(_value)));\n    }\n  }, [format]);\n\n  return (\n    <Input.Wrapper\n      {...wrapperProps}\n      classNames={resolvedClassNames}\n      styles={resolvedStyles}\n      __staticSelector=\"ColorInput\"\n    >\n      <Popover\n        __staticSelector=\"ColorInput\"\n        position=\"bottom-start\"\n        offset={5}\n        opened={dropdownOpened}\n        {...popoverProps}\n        classNames={resolvedClassNames}\n        styles={resolvedStyles}\n        unstyled={unstyled}\n        withRoles={false}\n        disabled={\n          readOnly || (withPicker === false && (!Array.isArray(swatches) || swatches.length === 0))\n        }\n      >\n        <Popover.Target>\n          <Input<'input'>\n            autoComplete=\"off\"\n            {...others}\n            {...inputProps}\n            classNames={resolvedClassNames}\n            styles={resolvedStyles}\n            disabled={disabled}\n            __staticSelector=\"ColorInput\"\n            onFocus={handleInputFocus}\n            onBlur={handleInputBlur}\n            onClick={handleInputClick}\n            spellCheck={false}\n            value={_value}\n            onChange={(event) => {\n              const inputValue = event.currentTarget.value;\n              setValue(inputValue);\n              if (isColorValid(inputValue)) {\n                onChangeEnd?.(convertHsvaTo(format, parseColor(inputValue)));\n              }\n            }}\n            leftSection={\n              leftSection ||\n              (withPreview ? (\n                <ColorSwatch\n                  color={isColorValid(_value) ? _value : '#fff'}\n                  size=\"var(--ci-preview-size)\"\n                  {...getStyles('colorPreview')}\n                />\n              ) : null)\n            }\n            readOnly={disallowInput || readOnly}\n            pointer={disallowInput}\n            unstyled={unstyled}\n            rightSection={\n              rightSection ||\n              (withEyeDropper && !disabled && !readOnly && eyeDropperSupported ? eyeDropper : null)\n            }\n          />\n        </Popover.Target>\n\n        <Popover.Dropdown\n          onMouseDown={(event) => event.preventDefault()}\n          className={classes.dropdown}\n        >\n          <ColorPicker\n            __staticSelector=\"ColorInput\"\n            value={_value}\n            onChange={setValue}\n            onChangeEnd={onChangeEnd}\n            format={format}\n            swatches={swatches}\n            swatchesPerRow={swatchesPerRow}\n            withPicker={withPicker}\n            size={inputProps.size}\n            focusable={false}\n            unstyled={unstyled}\n            styles={resolvedStyles}\n            classNames={resolvedClassNames}\n            onColorSwatchClick={() => closeOnColorSwatchClick && setDropdownOpened(false)}\n            attributes={wrapperProps.attributes}\n          />\n        </Popover.Dropdown>\n      </Popover>\n    </Input.Wrapper>\n  );\n});\n\nColorInput.classes = InputBase.classes;\nColorInput.varsResolver = varsResolver;\nColorInput.displayName = '@mantine/core/ColorInput';\n\nexport namespace ColorInput {\n  export type Props = ColorInputProps;\n  export type StylesNames = ColorInputStylesNames;\n  export type CssVariables = ColorInputCssVariables;\n  export type Factory = ColorInputFactory;\n}\n"],"mappings":"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"}
+{"version":3,"file":"ColorInput.cjs","names":["createVarsResolver","getSize","factory","useProps","useInputProps","useStyles","useResolvedStylesApi","ActionIcon","convertHsvaTo","parseColor","EyeDropperIcon","isColorValid","Input","Popover","ColorSwatch","classes","ColorPicker","InputBase"],"sources":["../../../src/components/ColorInput/ColorInput.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { useDidUpdate, useEyeDropper, useUncontrolled } from '@mantine/hooks';\nimport {\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getSize,\n  StylesApiProps,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '../../core';\nimport { ActionIcon } from '../ActionIcon';\nimport {\n  __ColorPickerProps,\n  ColorPicker,\n  ColorPickerStylesNames,\n  convertHsvaTo,\n  isColorValid,\n  parseColor,\n} from '../ColorPicker';\nimport { ColorSwatch } from '../ColorSwatch';\nimport { __BaseInputProps, __InputStylesNames, Input, InputVariant, useInputProps } from '../Input';\nimport { InputBase } from '../InputBase';\nimport { Popover, PopoverProps } from '../Popover';\nimport { EyeDropperIcon } from './EyeDropperIcon';\nimport classes from './ColorInput.module.css';\n\nexport type ColorInputStylesNames =\n  | 'dropdown'\n  | 'eyeDropperButton'\n  | 'eyeDropperIcon'\n  | 'colorPreview'\n  | ColorPickerStylesNames\n  | __InputStylesNames;\n\nexport type ColorInputCssVariables = {\n  eyeDropperIcon: '--ci-eye-dropper-icon-size';\n  eyeDropperButton: '--ci-button-size';\n  colorPreview: '--ci-preview-size';\n};\n\nexport interface ColorInputProps\n  extends\n    BoxProps,\n    __BaseInputProps,\n    __ColorPickerProps,\n    StylesApiProps<ColorInputFactory>,\n    ElementProps<'input', 'size' | 'onChange' | 'value' | 'defaultValue'> {\n  /** If input is not allowed, the user can only pick value with color picker and swatches */\n  disallowInput?: boolean;\n\n  /** If set, the input value resets to the last known valid value when the input loses focus @default true */\n  fixOnBlur?: boolean;\n\n  /** Props passed down to the `Popover` component */\n  popoverProps?: PopoverProps;\n\n  /** If set, the preview color swatch is displayed in the left section of the input @default true */\n  withPreview?: boolean;\n\n  /** If set, the eye dropper button is displayed in the right section @default true */\n  withEyeDropper?: boolean;\n\n  /** An icon to replace the default eye dropper icon */\n  eyeDropperIcon?: React.ReactNode;\n\n  /** If set, the dropdown is closed when one of the color swatches is clicked @default false */\n  closeOnColorSwatchClick?: boolean;\n\n  /** Props passed down to the eye dropper button */\n  eyeDropperButtonProps?: Record<string, any>;\n}\n\nexport type ColorInputFactory = Factory<{\n  props: ColorInputProps;\n  ref: HTMLInputElement;\n  stylesNames: ColorInputStylesNames;\n  vars: ColorInputCssVariables;\n  variant: InputVariant;\n}>;\n\nconst defaultProps = {\n  format: 'hex',\n  fixOnBlur: true,\n  withPreview: true,\n  swatchesPerRow: 7,\n  withPicker: true,\n  popoverProps: { transitionProps: { transition: 'fade', duration: 0 } },\n  withEyeDropper: true,\n  size: 'sm',\n  leftSectionPointerEvents: 'none',\n} satisfies Partial<ColorInputProps>;\n\nconst varsResolver = createVarsResolver<ColorInputFactory>((_, { size }) => ({\n  eyeDropperIcon: {\n    '--ci-eye-dropper-icon-size': getSize(size, 'ci-eye-dropper-icon-size'),\n  },\n\n  eyeDropperButton: {\n    '--ci-button-size': getSize(size, 'ci-button-size'),\n  },\n\n  colorPreview: {\n    '--ci-preview-size': getSize(size, 'ci-preview-size'),\n  },\n}));\n\nexport const ColorInput = factory<ColorInputFactory>((_props) => {\n  const props = useProps(['Input', 'InputWrapper', 'ColorInput'], defaultProps, _props);\n  const {\n    classNames,\n    styles,\n    unstyled,\n    disallowInput,\n    fixOnBlur,\n    popoverProps,\n    withPreview,\n    withEyeDropper,\n    eyeDropperIcon,\n    closeOnColorSwatchClick,\n    eyeDropperButtonProps,\n    value,\n    defaultValue,\n    onChange,\n    onChangeEnd,\n    onClick,\n    onFocus,\n    onBlur,\n    inputProps,\n    format = 'hex',\n    wrapperProps,\n    readOnly,\n    withPicker,\n    swatches,\n    disabled,\n    leftSection,\n    rightSection,\n    swatchesPerRow,\n    ...others\n  } = useInputProps('ColorInput', defaultProps, _props);\n\n  const getStyles = useStyles<ColorInputFactory>({\n    name: 'ColorInput',\n    props,\n    classes,\n    classNames,\n    styles,\n    unstyled,\n    rootSelector: 'wrapper',\n    vars: props.vars,\n    varsResolver,\n  });\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<ColorInputFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  const [dropdownOpened, setDropdownOpened] = useState(false);\n  const [lastValidValue, setLastValidValue] = useState('');\n  const [_value, setValue] = useUncontrolled({\n    value,\n    defaultValue,\n    finalValue: '',\n    onChange,\n  });\n\n  const { supported: eyeDropperSupported, open: openEyeDropper } = useEyeDropper();\n\n  const eyeDropper = (\n    <ActionIcon\n      {...eyeDropperButtonProps}\n      {...getStyles('eyeDropperButton', {\n        className: eyeDropperButtonProps?.className,\n        style: eyeDropperButtonProps?.style,\n      })}\n      variant=\"subtle\"\n      color=\"gray\"\n      unstyled={unstyled}\n      onClick={() =>\n        openEyeDropper()\n          .then((payload) => {\n            if (payload?.sRGBHex) {\n              const color = convertHsvaTo(format, parseColor(payload.sRGBHex));\n              setValue(color);\n              onChangeEnd?.(color);\n            }\n          })\n          .catch(() => {})\n      }\n    >\n      {eyeDropperIcon || <EyeDropperIcon {...getStyles('eyeDropperIcon')} />}\n    </ActionIcon>\n  );\n\n  const handleInputFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n    onFocus?.(event);\n    setDropdownOpened(true);\n  };\n\n  const handleInputBlur = (event: React.FocusEvent<HTMLInputElement>) => {\n    fixOnBlur && setValue(lastValidValue);\n    onBlur?.(event);\n    setDropdownOpened(false);\n  };\n\n  const handleInputClick = (event: React.MouseEvent<HTMLInputElement>) => {\n    onClick?.(event);\n    setDropdownOpened(true);\n  };\n\n  useEffect(() => {\n    if (isColorValid(_value) || _value.trim() === '') {\n      setLastValidValue(_value);\n    }\n  }, [_value]);\n\n  useDidUpdate(() => {\n    if (isColorValid(_value)) {\n      setValue(convertHsvaTo(format, parseColor(_value)));\n    }\n  }, [format]);\n\n  return (\n    <Input.Wrapper\n      {...wrapperProps}\n      classNames={resolvedClassNames}\n      styles={resolvedStyles}\n      __staticSelector=\"ColorInput\"\n    >\n      <Popover\n        __staticSelector=\"ColorInput\"\n        position=\"bottom-start\"\n        offset={5}\n        opened={dropdownOpened}\n        {...popoverProps}\n        classNames={resolvedClassNames}\n        styles={resolvedStyles}\n        unstyled={unstyled}\n        withRoles={false}\n        disabled={\n          readOnly || (withPicker === false && (!Array.isArray(swatches) || swatches.length === 0))\n        }\n      >\n        <Popover.Target>\n          <Input<'input'>\n            autoComplete=\"off\"\n            {...others}\n            {...inputProps}\n            classNames={resolvedClassNames}\n            styles={resolvedStyles}\n            disabled={disabled}\n            __staticSelector=\"ColorInput\"\n            onFocus={handleInputFocus}\n            onBlur={handleInputBlur}\n            onClick={handleInputClick}\n            spellCheck={false}\n            value={_value}\n            onChange={(event) => {\n              const inputValue = event.currentTarget.value;\n              setValue(inputValue);\n              if (isColorValid(inputValue)) {\n                onChangeEnd?.(convertHsvaTo(format, parseColor(inputValue)));\n              }\n            }}\n            leftSection={\n              leftSection ||\n              (withPreview ? (\n                <ColorSwatch\n                  color={isColorValid(_value) ? _value : '#fff'}\n                  size=\"var(--ci-preview-size)\"\n                  {...getStyles('colorPreview')}\n                />\n              ) : null)\n            }\n            readOnly={disallowInput || readOnly}\n            pointer={disallowInput}\n            unstyled={unstyled}\n            rightSection={\n              rightSection ||\n              (withEyeDropper && !disabled && !readOnly && eyeDropperSupported ? eyeDropper : null)\n            }\n          />\n        </Popover.Target>\n\n        <Popover.Dropdown\n          onMouseDown={(event) => event.preventDefault()}\n          className={classes.dropdown}\n        >\n          <ColorPicker\n            __staticSelector=\"ColorInput\"\n            value={_value}\n            onChange={setValue}\n            onChangeEnd={onChangeEnd}\n            format={format}\n            swatches={swatches}\n            swatchesPerRow={swatchesPerRow}\n            withPicker={withPicker}\n            size={inputProps.size}\n            focusable={false}\n            unstyled={unstyled}\n            styles={resolvedStyles}\n            classNames={resolvedClassNames}\n            onColorSwatchClick={() => closeOnColorSwatchClick && setDropdownOpened(false)}\n            attributes={wrapperProps.attributes}\n          />\n        </Popover.Dropdown>\n      </Popover>\n    </Input.Wrapper>\n  );\n});\n\nColorInput.classes = InputBase.classes;\nColorInput.varsResolver = varsResolver;\nColorInput.displayName = '@mantine/core/ColorInput';\n\nexport namespace ColorInput {\n  export type Props = ColorInputProps;\n  export type StylesNames = ColorInputStylesNames;\n  export type CssVariables = ColorInputCssVariables;\n  export type Factory = ColorInputFactory;\n}\n"],"mappings":"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"}

package/cjs/components/ColorInput/EyeDropperIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"EyeDropperIcon.cjs","names":[],"sources":["../../../src/components/ColorInput/EyeDropperIcon.tsx"],"sourcesContent":["export function EyeDropperIcon({ style, ...others }: React.ComponentProps<'svg'>) {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      style={{\n        width: 'var(--ci-eye-dropper-icon-size)',\n        height: 'var(--ci-eye-dropper-icon-size)',\n        ...style,\n      }}\n      viewBox=\"0 0 24 24\"\n      strokeWidth=\"1.5\"\n      stroke=\"currentColor\"\n      fill=\"none\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      {...others}\n    >\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0\" />\n      <path d=\"M12 3l0 4\" />\n      <path d=\"M12 21l0 -3\" />\n      <path d=\"M3 12l4 0\" />\n      <path d=\"M21 12l-3 0\" />\n      <path d=\"M12 12l0 .01\" />\n    </svg>\n  );\n}\n"],"mappings":";;;;AAAA,SAAgB,eAAe,EAAE,OAAO,GAAG,UAAuC;AAChF,QACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;EACE,OAAM;EACN,OAAO;GACL,OAAO;GACP,QAAQ;GACR,GAAG;GACJ;EACD,SAAQ;EACR,aAAY;EACZ,QAAO;EACP,MAAK;EACL,eAAc;EACd,gBAAe;EACf,GAAI;YAbN;GAeE,iBAAA,GAAA,kBAAA,KAAC,QAAD;IAAM,QAAO;IAAO,GAAE;IAAgB,MAAK;IAAS,CAAA;GACpD,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAM,GAAE,8CAA+C,CAAA;GACvD,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAM,GAAE,aAAc,CAAA;GACtB,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAM,GAAE,eAAgB,CAAA;GACxB,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAM,GAAE,aAAc,CAAA;GACtB,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAM,GAAE,eAAgB,CAAA;GACxB,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAM,GAAE,gBAAiB,CAAA;GACrB"}
+{"version":3,"file":"EyeDropperIcon.cjs","names":[],"sources":["../../../src/components/ColorInput/EyeDropperIcon.tsx"],"sourcesContent":["export function EyeDropperIcon({ style, ...others }: React.ComponentProps<'svg'>) {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      style={{\n        width: 'var(--ci-eye-dropper-icon-size)',\n        height: 'var(--ci-eye-dropper-icon-size)',\n        ...style,\n      }}\n      viewBox=\"0 0 24 24\"\n      strokeWidth=\"1.5\"\n      stroke=\"currentColor\"\n      fill=\"none\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      {...others}\n    >\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0\" />\n      <path d=\"M12 3l0 4\" />\n      <path d=\"M12 21l0 -3\" />\n      <path d=\"M3 12l4 0\" />\n      <path d=\"M21 12l-3 0\" />\n      <path d=\"M12 12l0 .01\" />\n    </svg>\n  );\n}\n"],"mappings":";;;;AAAA,SAAgB,eAAe,EAAE,OAAO,GAAG,UAAuC;CAChF,OACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;EACE,OAAM;EACN,OAAO;GACL,OAAO;GACP,QAAQ;GACR,GAAG;EACL;EACA,SAAQ;EACR,aAAY;EACZ,QAAO;EACP,MAAK;EACL,eAAc;EACd,gBAAe;EACf,GAAI;YAbN;GAeE,iBAAA,GAAA,kBAAA,KAAC,QAAD;IAAM,QAAO;IAAO,GAAE;IAAgB,MAAK;GAAQ,CAAA;GACnD,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAM,GAAE,6CAA8C,CAAA;GACtD,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAM,GAAE,YAAa,CAAA;GACrB,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAM,GAAE,cAAe,CAAA;GACvB,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAM,GAAE,YAAa,CAAA;GACrB,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAM,GAAE,cAAe,CAAA;GACvB,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAM,GAAE,eAAgB,CAAA;EACrB;;AAET"}

package/cjs/components/ColorPicker/AlphaSlider/AlphaSlider.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AlphaSlider.cjs","names":["factory","useProps","ColorSlider","round","rem"],"sources":["../../../../src/components/ColorPicker/AlphaSlider/AlphaSlider.tsx"],"sourcesContent":["import { Factory, factory, rem, useProps } from '../../../core';\nimport {\n  ColorSlider,\n  ColorSliderOptions,\n  ColorSliderStylesNames,\n} from '../ColorSlider/ColorSlider';\nimport { round } from '../converters/parsers';\n\nexport interface AlphaSliderProps extends ColorSliderOptions {\n  color: string;\n}\n\nexport type AlphaSliderFactory = Factory<{\n  props: AlphaSliderProps;\n  ref: HTMLDivElement;\n  stylesNames: ColorSliderStylesNames;\n}>;\n\nconst defaultProps = {\n  __staticSelector: 'AlphaSlider',\n} satisfies Partial<AlphaSliderProps>;\n\nexport const AlphaSlider = factory<AlphaSliderFactory>((props: AlphaSliderProps) => {\n  const { value, onChange, onChangeEnd, color, ...others } = useProps(\n    'AlphaSlider',\n    defaultProps,\n    props\n  );\n\n  return (\n    <ColorSlider\n      {...others}\n      value={value}\n      onChange={(val) => onChange?.(round(val, 2))}\n      onChangeEnd={(val) => onChangeEnd?.(round(val, 2))}\n      maxValue={1}\n      round={false}\n      data-alpha\n      overlays={[\n        {\n          backgroundImage:\n            'linear-gradient(45deg, var(--slider-checkers) 25%, transparent 25%), linear-gradient(-45deg, var(--slider-checkers) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--slider-checkers) 75%), linear-gradient(-45deg, var(--mantine-color-body) 75%, var(--slider-checkers) 75%)',\n          backgroundSize: `${rem(8)} ${rem(8)}`,\n          backgroundPosition: `0 0, 0 ${rem(4)}, ${rem(4)} ${rem(-4)}, ${rem(-4)} 0`,\n        },\n        {\n          backgroundImage: `linear-gradient(90deg, transparent, ${color})`,\n        },\n        {\n          boxShadow: `rgba(0, 0, 0, .1) 0 0 0 ${rem(1)} inset, rgb(0, 0, 0, .15) 0 0 ${rem(\n            4\n          )} inset`,\n        },\n      ]}\n    />\n  );\n});\n\nAlphaSlider.displayName = '@mantine/core/AlphaSlider';\nAlphaSlider.classes = ColorSlider.classes;\n\nexport namespace AlphaSlider {\n  export type Props = AlphaSliderProps;\n  export type Factory = AlphaSliderFactory;\n}\n"],"mappings":";;;;;;;;;AAkBA,MAAM,eAAe,EACnB,kBAAkB,eACnB;AAED,MAAa,cAAcA,gBAAAA,SAA6B,UAA4B;CAClF,MAAM,EAAE,OAAO,UAAU,aAAa,OAAO,GAAG,WAAWC,kBAAAA,SACzD,eACA,cACA,MACD;AAED,QACE,iBAAA,GAAA,kBAAA,KAACC,oBAAAA,aAAD;EACE,GAAI;EACG;EACP,WAAW,QAAQ,WAAWC,gBAAAA,MAAM,KAAK,EAAE,CAAC;EAC5C,cAAc,QAAQ,cAAcA,gBAAAA,MAAM,KAAK,EAAE,CAAC;EAClD,UAAU;EACV,OAAO;EACP,cAAA;EACA,UAAU;GACR;IACE,iBACE;IACF,gBAAgB,GAAGC,YAAAA,IAAI,EAAE,CAAC,GAAGA,YAAAA,IAAI,EAAE;IACnC,oBAAoB,UAAUA,YAAAA,IAAI,EAAE,CAAC,IAAIA,YAAAA,IAAI,EAAE,CAAC,GAAGA,YAAAA,IAAI,GAAG,CAAC,IAAIA,YAAAA,IAAI,GAAG,CAAC;IACxE;GACD,EACE,iBAAiB,uCAAuC,MAAM,IAC/D;GACD,EACE,WAAW,2BAA2BA,YAAAA,IAAI,EAAE,CAAC,gCAAgCA,YAAAA,IAC3E,EACD,CAAC,SACH;GACF;EACD,CAAA;EAEJ;AAEF,YAAY,cAAc;AAC1B,YAAY,UAAUF,oBAAAA,YAAY"}
+{"version":3,"file":"AlphaSlider.cjs","names":["factory","useProps","ColorSlider","round","rem"],"sources":["../../../../src/components/ColorPicker/AlphaSlider/AlphaSlider.tsx"],"sourcesContent":["import { Factory, factory, rem, useProps } from '../../../core';\nimport {\n  ColorSlider,\n  ColorSliderOptions,\n  ColorSliderStylesNames,\n} from '../ColorSlider/ColorSlider';\nimport { round } from '../converters/parsers';\n\nexport interface AlphaSliderProps extends ColorSliderOptions {\n  color: string;\n}\n\nexport type AlphaSliderFactory = Factory<{\n  props: AlphaSliderProps;\n  ref: HTMLDivElement;\n  stylesNames: ColorSliderStylesNames;\n}>;\n\nconst defaultProps = {\n  __staticSelector: 'AlphaSlider',\n} satisfies Partial<AlphaSliderProps>;\n\nexport const AlphaSlider = factory<AlphaSliderFactory>((props: AlphaSliderProps) => {\n  const { value, onChange, onChangeEnd, color, ...others } = useProps(\n    'AlphaSlider',\n    defaultProps,\n    props\n  );\n\n  return (\n    <ColorSlider\n      {...others}\n      value={value}\n      onChange={(val) => onChange?.(round(val, 2))}\n      onChangeEnd={(val) => onChangeEnd?.(round(val, 2))}\n      maxValue={1}\n      round={false}\n      data-alpha\n      overlays={[\n        {\n          backgroundImage:\n            'linear-gradient(45deg, var(--slider-checkers) 25%, transparent 25%), linear-gradient(-45deg, var(--slider-checkers) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--slider-checkers) 75%), linear-gradient(-45deg, var(--mantine-color-body) 75%, var(--slider-checkers) 75%)',\n          backgroundSize: `${rem(8)} ${rem(8)}`,\n          backgroundPosition: `0 0, 0 ${rem(4)}, ${rem(4)} ${rem(-4)}, ${rem(-4)} 0`,\n        },\n        {\n          backgroundImage: `linear-gradient(90deg, transparent, ${color})`,\n        },\n        {\n          boxShadow: `rgba(0, 0, 0, .1) 0 0 0 ${rem(1)} inset, rgb(0, 0, 0, .15) 0 0 ${rem(\n            4\n          )} inset`,\n        },\n      ]}\n    />\n  );\n});\n\nAlphaSlider.displayName = '@mantine/core/AlphaSlider';\nAlphaSlider.classes = ColorSlider.classes;\n\nexport namespace AlphaSlider {\n  export type Props = AlphaSliderProps;\n  export type Factory = AlphaSliderFactory;\n}\n"],"mappings":";;;;;;;;;AAkBA,MAAM,eAAe,EACnB,kBAAkB,cACpB;AAEA,MAAa,cAAcA,gBAAAA,SAA6B,UAA4B;CAClF,MAAM,EAAE,OAAO,UAAU,aAAa,OAAO,GAAG,WAAWC,kBAAAA,SACzD,eACA,cACA,KACF;CAEA,OACE,iBAAA,GAAA,kBAAA,KAACC,oBAAAA,aAAD;EACE,GAAI;EACG;EACP,WAAW,QAAQ,WAAWC,gBAAAA,MAAM,KAAK,CAAC,CAAC;EAC3C,cAAc,QAAQ,cAAcA,gBAAAA,MAAM,KAAK,CAAC,CAAC;EACjD,UAAU;EACV,OAAO;EACP,cAAA;EACA,UAAU;GACR;IACE,iBACE;IACF,gBAAgB,GAAGC,YAAAA,IAAI,CAAC,EAAE,GAAGA,YAAAA,IAAI,CAAC;IAClC,oBAAoB,UAAUA,YAAAA,IAAI,CAAC,EAAE,IAAIA,YAAAA,IAAI,CAAC,EAAE,GAAGA,YAAAA,IAAI,EAAE,EAAE,IAAIA,YAAAA,IAAI,EAAE,EAAE;GACzE;GACA,EACE,iBAAiB,uCAAuC,MAAM,GAChE;GACA,EACE,WAAW,2BAA2BA,YAAAA,IAAI,CAAC,EAAE,gCAAgCA,YAAAA,IAC3E,CACF,EAAE,QACJ;EACF;CACD,CAAA;AAEL,CAAC;AAED,YAAY,cAAc;AAC1B,YAAY,UAAUF,oBAAAA,YAAY"}

package/cjs/components/ColorPicker/ColorPicker.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ColorPicker.cjs","names":["createVarsResolver","getSize","getSpacing","factory","useProps","useStyles","parseColor","convertHsvaTo","isColorValid","ColorPickerContext","Box","Saturation","HueSlider","AlphaSlider","ColorSwatch","Swatches","classes"],"sources":["../../../src/components/ColorPicker/ColorPicker.tsx"],"sourcesContent":["import { useRef, useState } from 'react';\nimport { useDidUpdate, useUncontrolled } from '@mantine/hooks';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  DataAttributes,\n  ElementProps,\n  factory,\n  Factory,\n  getSize,\n  getSpacing,\n  MantineSize,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { ColorSwatch } from '../ColorSwatch';\nimport { AlphaSlider } from './AlphaSlider/AlphaSlider';\nimport { ColorPickerContext } from './ColorPicker.context';\nimport { ColorFormat, HsvaColor } from './ColorPicker.types';\nimport { convertHsvaTo, isColorValid, parseColor } from './converters';\nimport { HueSlider } from './HueSlider/HueSlider';\nimport { Saturation } from './Saturation/Saturation';\nimport { Swatches } from './Swatches/Swatches';\nimport classes from './ColorPicker.module.css';\n\nexport type ColorPickerStylesNames =\n  | 'wrapper'\n  | 'preview'\n  | 'body'\n  | 'sliders'\n  | 'slider'\n  | 'sliderOverlay'\n  | 'thumb'\n  | 'saturation'\n  | 'thumb'\n  | 'saturationOverlay'\n  | 'thumb'\n  | 'swatches'\n  | 'swatch';\n\nexport type ColorPickerCssVariables = {\n  wrapper:\n    | '--cp-preview-size'\n    | '--cp-width'\n    | '--cp-body-spacing'\n    | '--cp-swatch-size'\n    | '--cp-thumb-size'\n    | '--cp-saturation-height';\n};\n\nexport interface __ColorPickerProps {\n  /** Controlled component value */\n  value?: string;\n\n  /** Uncontrolled component default value */\n  defaultValue?: string;\n\n  /** Called when value changes */\n  onChange?: (value: string) => void;\n\n  /** Called when the user stops dragging one of the sliders or changes the value with keyboard */\n  onChangeEnd?: (value: string) => void;\n\n  /** Color format. `hexa`, `rgba`, `hsla` values render alpha channel slider @default 'hex' */\n  format?: ColorFormat;\n\n  /** If `false`, the component displays only swatches @default true */\n  withPicker?: boolean;\n\n  /** A list of colors used to display swatches list below the color picker */\n  swatches?: string[];\n\n  /** Number of swatches per row @default 7 */\n  swatchesPerRow?: number;\n\n  /** Component size @default 'md' */\n  size?: MantineSize | (string & {});\n}\n\nexport interface ColorPickerProps\n  extends\n    BoxProps,\n    __ColorPickerProps,\n    StylesApiProps<ColorPickerFactory>,\n    ElementProps<'div', 'onChange' | 'value' | 'defaultValue'> {\n  __staticSelector?: string;\n\n  /** If set, the component takes 100% width of its container @default false */\n  fullWidth?: boolean;\n\n  /** If set, interactive elements (sliders thumbs and swatches) are focusable with keyboard @default true */\n  focusable?: boolean;\n\n  /** Saturation slider `aria-label` */\n  saturationLabel?: string;\n\n  /** Hue slider `aria-label` */\n  hueLabel?: string;\n\n  /** Alpha slider `aria-label` */\n  alphaLabel?: string;\n\n  /** Called when one of the color swatches is clicked */\n  onColorSwatchClick?: (color: string) => void;\n\n  /** Hidden input `name` attribute, if not set, the input will not be rendered */\n  name?: string;\n\n  /** Props spread to the hidden input */\n  hiddenInputProps?: React.ComponentProps<'input'> & DataAttributes;\n}\n\nexport type ColorPickerFactory = Factory<{\n  props: ColorPickerProps;\n  ref: HTMLDivElement;\n  stylesNames: ColorPickerStylesNames;\n  vars: ColorPickerCssVariables;\n}>;\n\nconst defaultProps = {\n  swatchesPerRow: 7,\n  withPicker: true,\n  focusable: true,\n  size: 'md',\n  __staticSelector: 'ColorPicker',\n} satisfies Partial<ColorPickerProps>;\n\nconst varsResolver = createVarsResolver<ColorPickerFactory>((_, { size, swatchesPerRow }) => ({\n  wrapper: {\n    '--cp-preview-size': getSize(size, 'cp-preview-size'),\n    '--cp-width': getSize(size, 'cp-width'),\n    '--cp-body-spacing': getSpacing(size),\n    '--cp-swatch-size': `${100 / swatchesPerRow!}%`,\n    '--cp-thumb-size': getSize(size, 'cp-thumb-size'),\n    '--cp-saturation-height': getSize(size, 'cp-saturation-height'),\n  },\n}));\n\nexport const ColorPicker = factory<ColorPickerFactory>((_props) => {\n  const props = useProps('ColorPicker', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    format = 'hex',\n    value,\n    defaultValue,\n    onChange,\n    onChangeEnd,\n    withPicker,\n    size,\n    saturationLabel,\n    hueLabel,\n    alphaLabel,\n    focusable,\n    swatches,\n    swatchesPerRow,\n    fullWidth,\n    onColorSwatchClick,\n    __staticSelector,\n    mod,\n    attributes,\n    name,\n    hiddenInputProps,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<ColorPickerFactory>({\n    name: __staticSelector,\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    rootSelector: 'wrapper',\n    vars,\n    varsResolver,\n  });\n\n  const formatRef = useRef(format || 'hex');\n  const valueRef = useRef<string>('');\n  const scrubTimeoutRef = useRef<number>(-1);\n  const isScrubbingRef = useRef(false);\n  const withAlpha = format === 'hexa' || format === 'rgba' || format === 'hsla';\n\n  const [_value, setValue, controlled] = useUncontrolled({\n    value,\n    defaultValue,\n    finalValue: '#FFFFFF',\n    onChange,\n  });\n\n  const [parsed, setParsed] = useState<HsvaColor>(parseColor(_value));\n\n  const startScrubbing = () => {\n    window.clearTimeout(scrubTimeoutRef.current);\n    isScrubbingRef.current = true;\n  };\n\n  const stopScrubbing = () => {\n    window.clearTimeout(scrubTimeoutRef.current);\n    scrubTimeoutRef.current = window.setTimeout(() => {\n      isScrubbingRef.current = false;\n    }, 200);\n  };\n\n  const handleChange = (color: Partial<HsvaColor>) => {\n    setParsed((current) => {\n      const next = { ...current, ...color };\n      valueRef.current = convertHsvaTo(formatRef.current, next);\n      return next;\n    });\n\n    setValue(valueRef.current);\n  };\n\n  useDidUpdate(() => {\n    if (typeof value === 'string' && isColorValid(value) && !isScrubbingRef.current) {\n      setParsed(parseColor(value));\n    }\n  }, [value]);\n\n  useDidUpdate(() => {\n    formatRef.current = format || 'hex';\n    setValue(convertHsvaTo(formatRef.current, parsed));\n  }, [format]);\n\n  return (\n    <ColorPickerContext value={{ getStyles, unstyled }}>\n      <Box\n        {...getStyles('wrapper')}\n        size={size}\n        mod={[{ 'full-width': fullWidth }, mod]}\n        {...others}\n      >\n        {name && <input type=\"hidden\" name={name} value={_value} {...hiddenInputProps} />}\n\n        {withPicker && (\n          <>\n            <Saturation\n              value={parsed}\n              onChange={handleChange}\n              onChangeEnd={({ s, v }) =>\n                onChangeEnd?.(convertHsvaTo(formatRef.current, { ...parsed, s: s!, v: v! }))\n              }\n              color={_value}\n              size={size}\n              focusable={focusable}\n              saturationLabel={saturationLabel}\n              onScrubStart={startScrubbing}\n              onScrubEnd={stopScrubbing}\n            />\n\n            <div {...getStyles('body')}>\n              <div {...getStyles('sliders')}>\n                <HueSlider\n                  value={parsed.h}\n                  onChange={(h) => handleChange({ h })}\n                  onChangeEnd={(h) =>\n                    onChangeEnd?.(convertHsvaTo(formatRef.current, { ...parsed, h }))\n                  }\n                  size={size}\n                  focusable={focusable}\n                  aria-label={hueLabel}\n                  onScrubStart={startScrubbing}\n                  onScrubEnd={stopScrubbing}\n                />\n\n                {withAlpha && (\n                  <AlphaSlider\n                    value={parsed.a}\n                    onChange={(a) => handleChange({ a })}\n                    onChangeEnd={(a) => {\n                      onChangeEnd?.(convertHsvaTo(formatRef.current, { ...parsed, a }));\n                    }}\n                    size={size}\n                    color={convertHsvaTo('hex', parsed)}\n                    focusable={focusable}\n                    aria-label={alphaLabel}\n                    onScrubStart={startScrubbing}\n                    onScrubEnd={stopScrubbing}\n                  />\n                )}\n              </div>\n\n              {withAlpha && (\n                <ColorSwatch\n                  color={_value}\n                  radius=\"sm\"\n                  size=\"var(--cp-preview-size)\"\n                  {...getStyles('preview')}\n                />\n              )}\n            </div>\n          </>\n        )}\n\n        {Array.isArray(swatches) && (\n          <Swatches\n            data={swatches}\n            swatchesPerRow={swatchesPerRow}\n            focusable={focusable}\n            setValue={setValue}\n            value={_value}\n            onChangeEnd={(color) => {\n              const convertedColor = convertHsvaTo(format, parseColor(color));\n              onColorSwatchClick?.(convertedColor);\n              onChangeEnd?.(convertedColor);\n              if (!controlled) {\n                setParsed(parseColor(color));\n              }\n            }}\n          />\n        )}\n      </Box>\n    </ColorPickerContext>\n  );\n});\n\nColorPicker.classes = classes;\nColorPicker.varsResolver = varsResolver;\nColorPicker.displayName = '@mantine/core/ColorPicker';\n\nexport namespace ColorPicker {\n  export type Props = ColorPickerProps;\n  export type CssVariables = ColorPickerCssVariables;\n  export type Factory = ColorPickerFactory;\n  export type StylesNames = ColorPickerStylesNames;\n}\n"],"mappings":"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"}
+{"version":3,"file":"ColorPicker.cjs","names":["createVarsResolver","getSize","getSpacing","factory","useProps","useStyles","parseColor","convertHsvaTo","isColorValid","ColorPickerContext","Box","Saturation","HueSlider","AlphaSlider","ColorSwatch","Swatches","classes"],"sources":["../../../src/components/ColorPicker/ColorPicker.tsx"],"sourcesContent":["import { useRef, useState } from 'react';\nimport { useDidUpdate, useUncontrolled } from '@mantine/hooks';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  DataAttributes,\n  ElementProps,\n  factory,\n  Factory,\n  getSize,\n  getSpacing,\n  MantineSize,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { ColorSwatch } from '../ColorSwatch';\nimport { AlphaSlider } from './AlphaSlider/AlphaSlider';\nimport { ColorPickerContext } from './ColorPicker.context';\nimport { ColorFormat, HsvaColor } from './ColorPicker.types';\nimport { convertHsvaTo, isColorValid, parseColor } from './converters';\nimport { HueSlider } from './HueSlider/HueSlider';\nimport { Saturation } from './Saturation/Saturation';\nimport { Swatches } from './Swatches/Swatches';\nimport classes from './ColorPicker.module.css';\n\nexport type ColorPickerStylesNames =\n  | 'wrapper'\n  | 'preview'\n  | 'body'\n  | 'sliders'\n  | 'slider'\n  | 'sliderOverlay'\n  | 'thumb'\n  | 'saturation'\n  | 'thumb'\n  | 'saturationOverlay'\n  | 'thumb'\n  | 'swatches'\n  | 'swatch';\n\nexport type ColorPickerCssVariables = {\n  wrapper:\n    | '--cp-preview-size'\n    | '--cp-width'\n    | '--cp-body-spacing'\n    | '--cp-swatch-size'\n    | '--cp-thumb-size'\n    | '--cp-saturation-height';\n};\n\nexport interface __ColorPickerProps {\n  /** Controlled component value */\n  value?: string;\n\n  /** Uncontrolled component default value */\n  defaultValue?: string;\n\n  /** Called when value changes */\n  onChange?: (value: string) => void;\n\n  /** Called when the user stops dragging one of the sliders or changes the value with keyboard */\n  onChangeEnd?: (value: string) => void;\n\n  /** Color format. `hexa`, `rgba`, `hsla` values render alpha channel slider @default 'hex' */\n  format?: ColorFormat;\n\n  /** If `false`, the component displays only swatches @default true */\n  withPicker?: boolean;\n\n  /** A list of colors used to display swatches list below the color picker */\n  swatches?: string[];\n\n  /** Number of swatches per row @default 7 */\n  swatchesPerRow?: number;\n\n  /** Component size @default 'md' */\n  size?: MantineSize | (string & {});\n}\n\nexport interface ColorPickerProps\n  extends\n    BoxProps,\n    __ColorPickerProps,\n    StylesApiProps<ColorPickerFactory>,\n    ElementProps<'div', 'onChange' | 'value' | 'defaultValue'> {\n  __staticSelector?: string;\n\n  /** If set, the component takes 100% width of its container @default false */\n  fullWidth?: boolean;\n\n  /** If set, interactive elements (sliders thumbs and swatches) are focusable with keyboard @default true */\n  focusable?: boolean;\n\n  /** Saturation slider `aria-label` */\n  saturationLabel?: string;\n\n  /** Hue slider `aria-label` */\n  hueLabel?: string;\n\n  /** Alpha slider `aria-label` */\n  alphaLabel?: string;\n\n  /** Called when one of the color swatches is clicked */\n  onColorSwatchClick?: (color: string) => void;\n\n  /** Hidden input `name` attribute, if not set, the input will not be rendered */\n  name?: string;\n\n  /** Props spread to the hidden input */\n  hiddenInputProps?: React.ComponentProps<'input'> & DataAttributes;\n}\n\nexport type ColorPickerFactory = Factory<{\n  props: ColorPickerProps;\n  ref: HTMLDivElement;\n  stylesNames: ColorPickerStylesNames;\n  vars: ColorPickerCssVariables;\n}>;\n\nconst defaultProps = {\n  swatchesPerRow: 7,\n  withPicker: true,\n  focusable: true,\n  size: 'md',\n  __staticSelector: 'ColorPicker',\n} satisfies Partial<ColorPickerProps>;\n\nconst varsResolver = createVarsResolver<ColorPickerFactory>((_, { size, swatchesPerRow }) => ({\n  wrapper: {\n    '--cp-preview-size': getSize(size, 'cp-preview-size'),\n    '--cp-width': getSize(size, 'cp-width'),\n    '--cp-body-spacing': getSpacing(size),\n    '--cp-swatch-size': `${100 / swatchesPerRow!}%`,\n    '--cp-thumb-size': getSize(size, 'cp-thumb-size'),\n    '--cp-saturation-height': getSize(size, 'cp-saturation-height'),\n  },\n}));\n\nexport const ColorPicker = factory<ColorPickerFactory>((_props) => {\n  const props = useProps('ColorPicker', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    format = 'hex',\n    value,\n    defaultValue,\n    onChange,\n    onChangeEnd,\n    withPicker,\n    size,\n    saturationLabel,\n    hueLabel,\n    alphaLabel,\n    focusable,\n    swatches,\n    swatchesPerRow,\n    fullWidth,\n    onColorSwatchClick,\n    __staticSelector,\n    mod,\n    attributes,\n    name,\n    hiddenInputProps,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<ColorPickerFactory>({\n    name: __staticSelector,\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    rootSelector: 'wrapper',\n    vars,\n    varsResolver,\n  });\n\n  const formatRef = useRef(format || 'hex');\n  const valueRef = useRef<string>('');\n  const scrubTimeoutRef = useRef<number>(-1);\n  const isScrubbingRef = useRef(false);\n  const withAlpha = format === 'hexa' || format === 'rgba' || format === 'hsla';\n\n  const [_value, setValue, controlled] = useUncontrolled({\n    value,\n    defaultValue,\n    finalValue: '#FFFFFF',\n    onChange,\n  });\n\n  const [parsed, setParsed] = useState<HsvaColor>(parseColor(_value));\n\n  const startScrubbing = () => {\n    window.clearTimeout(scrubTimeoutRef.current);\n    isScrubbingRef.current = true;\n  };\n\n  const stopScrubbing = () => {\n    window.clearTimeout(scrubTimeoutRef.current);\n    scrubTimeoutRef.current = window.setTimeout(() => {\n      isScrubbingRef.current = false;\n    }, 200);\n  };\n\n  const handleChange = (color: Partial<HsvaColor>) => {\n    setParsed((current) => {\n      const next = { ...current, ...color };\n      valueRef.current = convertHsvaTo(formatRef.current, next);\n      return next;\n    });\n\n    setValue(valueRef.current);\n  };\n\n  useDidUpdate(() => {\n    if (typeof value === 'string' && isColorValid(value) && !isScrubbingRef.current) {\n      setParsed(parseColor(value));\n    }\n  }, [value]);\n\n  useDidUpdate(() => {\n    formatRef.current = format || 'hex';\n    setValue(convertHsvaTo(formatRef.current, parsed));\n  }, [format]);\n\n  return (\n    <ColorPickerContext value={{ getStyles, unstyled }}>\n      <Box\n        {...getStyles('wrapper')}\n        size={size}\n        mod={[{ 'full-width': fullWidth }, mod]}\n        {...others}\n      >\n        {name && <input type=\"hidden\" name={name} value={_value} {...hiddenInputProps} />}\n\n        {withPicker && (\n          <>\n            <Saturation\n              value={parsed}\n              onChange={handleChange}\n              onChangeEnd={({ s, v }) =>\n                onChangeEnd?.(convertHsvaTo(formatRef.current, { ...parsed, s: s!, v: v! }))\n              }\n              color={_value}\n              size={size}\n              focusable={focusable}\n              saturationLabel={saturationLabel}\n              onScrubStart={startScrubbing}\n              onScrubEnd={stopScrubbing}\n            />\n\n            <div {...getStyles('body')}>\n              <div {...getStyles('sliders')}>\n                <HueSlider\n                  value={parsed.h}\n                  onChange={(h) => handleChange({ h })}\n                  onChangeEnd={(h) =>\n                    onChangeEnd?.(convertHsvaTo(formatRef.current, { ...parsed, h }))\n                  }\n                  size={size}\n                  focusable={focusable}\n                  aria-label={hueLabel}\n                  onScrubStart={startScrubbing}\n                  onScrubEnd={stopScrubbing}\n                />\n\n                {withAlpha && (\n                  <AlphaSlider\n                    value={parsed.a}\n                    onChange={(a) => handleChange({ a })}\n                    onChangeEnd={(a) => {\n                      onChangeEnd?.(convertHsvaTo(formatRef.current, { ...parsed, a }));\n                    }}\n                    size={size}\n                    color={convertHsvaTo('hex', parsed)}\n                    focusable={focusable}\n                    aria-label={alphaLabel}\n                    onScrubStart={startScrubbing}\n                    onScrubEnd={stopScrubbing}\n                  />\n                )}\n              </div>\n\n              {withAlpha && (\n                <ColorSwatch\n                  color={_value}\n                  radius=\"sm\"\n                  size=\"var(--cp-preview-size)\"\n                  {...getStyles('preview')}\n                />\n              )}\n            </div>\n          </>\n        )}\n\n        {Array.isArray(swatches) && (\n          <Swatches\n            data={swatches}\n            swatchesPerRow={swatchesPerRow}\n            focusable={focusable}\n            setValue={setValue}\n            value={_value}\n            onChangeEnd={(color) => {\n              const convertedColor = convertHsvaTo(format, parseColor(color));\n              onColorSwatchClick?.(convertedColor);\n              onChangeEnd?.(convertedColor);\n              if (!controlled) {\n                setParsed(parseColor(color));\n              }\n            }}\n          />\n        )}\n      </Box>\n    </ColorPickerContext>\n  );\n});\n\nColorPicker.classes = classes;\nColorPicker.varsResolver = varsResolver;\nColorPicker.displayName = '@mantine/core/ColorPicker';\n\nexport namespace ColorPicker {\n  export type Props = ColorPickerProps;\n  export type CssVariables = ColorPickerCssVariables;\n  export type Factory = ColorPickerFactory;\n  export type StylesNames = ColorPickerStylesNames;\n}\n"],"mappings":"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"}

package/cjs/components/ColorPicker/ColorPicker.context.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ColorPicker.context.cjs","names":[],"sources":["../../../src/components/ColorPicker/ColorPicker.context.ts"],"sourcesContent":["import { createContext } from 'react';\nimport { GetStylesApi } from '../../core';\nimport type { ColorPickerFactory } from './ColorPicker';\n\ninterface ColorPickerContextValue {\n  getStyles: GetStylesApi<ColorPickerFactory>;\n  unstyled: boolean | undefined;\n}\n\nexport const ColorPickerContext = createContext<ColorPickerContextValue | null>(null);\n"],"mappings":";;;AASA,MAAa,sBAAA,oBAAA,eAAmE,KAAK"}
+{"version":3,"file":"ColorPicker.context.cjs","names":[],"sources":["../../../src/components/ColorPicker/ColorPicker.context.ts"],"sourcesContent":["import { createContext } from 'react';\nimport { GetStylesApi } from '../../core';\nimport type { ColorPickerFactory } from './ColorPicker';\n\ninterface ColorPickerContextValue {\n  getStyles: GetStylesApi<ColorPickerFactory>;\n  unstyled: boolean | undefined;\n}\n\nexport const ColorPickerContext = createContext<ColorPickerContextValue | null>(null);\n"],"mappings":";;;AASA,MAAa,sBAAA,kBAAA,EAAA,eAAmE,IAAI"}

package/cjs/components/ColorPicker/ColorSlider/ColorSlider.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ColorSlider.cjs","names":["factory","useProps","useStyles","ColorPickerContext","useMantineTheme","Box","Thumb","rem","classes"],"sources":["../../../../src/components/ColorPicker/ColorSlider/ColorSlider.tsx"],"sourcesContent":["import { use, useRef, useState } from 'react';\nimport {\n  clampUseMovePosition,\n  useDidUpdate,\n  useMergedRef,\n  useMove,\n  UseMovePosition,\n} from '@mantine/hooks';\nimport {\n  Box,\n  BoxProps,\n  ElementProps,\n  factory,\n  Factory,\n  MantineSize,\n  rem,\n  StylesApiProps,\n  useMantineTheme,\n  useProps,\n  useStyles,\n} from '../../../core';\nimport { ColorPickerContext } from '../ColorPicker.context';\nimport { Thumb } from '../Thumb/Thumb';\nimport classes from '../ColorPicker.module.css';\n\nexport type ColorSliderStylesNames = 'slider' | 'sliderOverlay' | 'thumb';\n\nexport interface __ColorSliderProps extends ElementProps<'div', 'onChange'> {\n  /** Controlled component value */\n  value: number;\n\n  /** Called when value changes */\n  onChange?: (value: number) => void;\n\n  /** Called when user stops dragging the slider or uses keyboard to change value */\n  onChangeEnd?: (value: number) => void;\n\n  /** Called when user starts dragging the slider */\n  onScrubStart?: () => void;\n\n  /** Called when user stops dragging the slider */\n  onScrubEnd?: () => void;\n\n  /** Slider size @default 'md' */\n  size?: MantineSize | (string & {});\n\n  /** If set, slider thumb can be focused @default true */\n  focusable?: boolean;\n}\n\nexport interface ColorSliderProps\n  extends\n    BoxProps,\n    StylesApiProps<ColorSliderFactory>,\n    __ColorSliderProps,\n    ElementProps<'div', 'onChange'> {\n  __staticSelector?: string;\n  maxValue: number;\n  overlays: React.CSSProperties[];\n  round: boolean;\n  thumbColor?: string;\n}\n\nexport type ColorSliderOptions = Omit<\n  ColorSliderProps,\n  'maxValue' | 'overlays' | 'round' | 'thumbColor'\n>;\n\nexport type ColorSliderFactory = Factory<{\n  props: ColorSliderProps;\n  ref: HTMLDivElement;\n  stylesNames: ColorSliderStylesNames;\n}>;\n\nexport const ColorSlider = factory<ColorSliderFactory>((_props) => {\n  const props = useProps('ColorSlider', null, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    onChange,\n    onChangeEnd,\n    maxValue,\n    round,\n    size = 'md',\n    focusable = true,\n    value,\n    overlays,\n    thumbColor = 'transparent',\n    onScrubStart,\n    onScrubEnd,\n    __staticSelector = 'ColorPicker',\n    attributes,\n    ref,\n    ...others\n  } = props;\n\n  const _getStyles = useStyles<ColorSliderFactory>({\n    name: __staticSelector,\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    rootSelector: 'slider',\n  });\n\n  const ctxGetStyles = use(ColorPickerContext)?.getStyles;\n  const getStyles = ctxGetStyles || _getStyles;\n\n  const theme = useMantineTheme();\n  const [position, setPosition] = useState({ y: 0, x: value / maxValue });\n  const positionRef = useRef(position);\n  const getChangeValue = (val: number) => (round ? Math.round(val * maxValue) : val * maxValue);\n  const { ref: sliderRef } = useMove(\n    ({ x, y }) => {\n      positionRef.current = { x, y };\n      onChange?.(getChangeValue(x));\n    },\n    {\n      onScrubEnd: () => {\n        const { x } = positionRef.current;\n        onChangeEnd?.(getChangeValue(x));\n        onScrubEnd?.();\n      },\n      onScrubStart,\n    }\n  );\n\n  useDidUpdate(() => {\n    setPosition({ y: 0, x: value / maxValue });\n  }, [value]);\n\n  const handleArrow = (event: React.KeyboardEvent<HTMLDivElement>, pos: UseMovePosition) => {\n    event.preventDefault();\n    const _position = clampUseMovePosition(pos);\n    onChange?.(getChangeValue(_position.x));\n    onChangeEnd?.(getChangeValue(_position.x));\n  };\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    switch (event.key) {\n      case 'ArrowRight': {\n        handleArrow(event, { x: position.x + 0.05, y: position.y });\n        break;\n      }\n\n      case 'ArrowLeft': {\n        handleArrow(event, { x: position.x - 0.05, y: position.y });\n        break;\n      }\n    }\n  };\n\n  const layers = overlays.map((overlay, index) => (\n    <div {...getStyles('sliderOverlay')} style={overlay} key={index} />\n  ));\n\n  return (\n    <Box\n      {...others}\n      ref={useMergedRef(sliderRef, ref)}\n      {...getStyles('slider')}\n      size={size}\n      role=\"slider\"\n      aria-valuenow={value}\n      aria-valuemax={maxValue}\n      aria-valuemin={0}\n      tabIndex={focusable ? 0 : -1}\n      onKeyDown={handleKeyDown}\n      data-focus-ring={theme.focusRing}\n      __vars={{\n        '--cp-thumb-size': `var(--cp-thumb-size-${size})`,\n      }}\n    >\n      {layers}\n\n      <Thumb\n        position={position}\n        {...getStyles('thumb', { style: { top: rem(1), background: thumbColor } })}\n      />\n    </Box>\n  );\n});\n\nColorSlider.displayName = '@mantine/core/ColorSlider';\nColorSlider.classes = classes;\n"],"mappings":";;;;;;;;;;;;;;;AA0EA,MAAa,cAAcA,gBAAAA,SAA6B,WAAW;CACjE,MAAM,QAAQC,kBAAAA,SAAS,eAAe,MAAM,OAAO;CACnD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,aACA,UACA,OACA,OAAO,MACP,YAAY,MACZ,OACA,UACA,aAAa,eACb,cACA,YACA,mBAAmB,eACnB,YACA,KACA,GAAG,WACD;CAEJ,MAAM,aAAaC,mBAAAA,UAA8B;EAC/C,MAAM;EACN,SAAA,2BAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;EACf,CAAC;CAGF,MAAM,aAAA,GAAA,MAAA,KADmBC,4BAAAA,mBAAmB,EAAE,aACZ;CAElC,MAAM,QAAQC,6BAAAA,iBAAiB;CAC/B,MAAM,CAAC,UAAU,gBAAA,GAAA,MAAA,UAAwB;EAAE,GAAG;EAAG,GAAG,QAAQ;EAAU,CAAC;CACvE,MAAM,eAAA,GAAA,MAAA,QAAqB,SAAS;CACpC,MAAM,kBAAkB,QAAiB,QAAQ,KAAK,MAAM,MAAM,SAAS,GAAG,MAAM;CACpF,MAAM,EAAE,KAAK,eAAA,GAAA,eAAA,UACV,EAAE,GAAG,QAAQ;AACZ,cAAY,UAAU;GAAE;GAAG;GAAG;AAC9B,aAAW,eAAe,EAAE,CAAC;IAE/B;EACE,kBAAkB;GAChB,MAAM,EAAE,MAAM,YAAY;AAC1B,iBAAc,eAAe,EAAE,CAAC;AAChC,iBAAc;;EAEhB;EACD,CACF;AAED,EAAA,GAAA,eAAA,oBAAmB;AACjB,cAAY;GAAE,GAAG;GAAG,GAAG,QAAQ;GAAU,CAAC;IACzC,CAAC,MAAM,CAAC;CAEX,MAAM,eAAe,OAA4C,QAAyB;AACxF,QAAM,gBAAgB;EACtB,MAAM,aAAA,GAAA,eAAA,sBAAiC,IAAI;AAC3C,aAAW,eAAe,UAAU,EAAE,CAAC;AACvC,gBAAc,eAAe,UAAU,EAAE,CAAC;;CAG5C,MAAM,iBAAiB,UAA+C;AACpE,UAAQ,MAAM,KAAd;GACE,KAAK;AACH,gBAAY,OAAO;KAAE,GAAG,SAAS,IAAI;KAAM,GAAG,SAAS;KAAG,CAAC;AAC3D;GAGF,KAAK;AACH,gBAAY,OAAO;KAAE,GAAG,SAAS,IAAI;KAAM,GAAG,SAAS;KAAG,CAAC;AAC3D;;;CAKN,MAAM,SAAS,SAAS,KAAK,SAAS,UACpC,iBAAA,GAAA,MAAA,eAAC,OAAD;EAAK,GAAI,UAAU,gBAAgB;EAAE,OAAO;EAAS,KAAK;EAAS,CAAA,CACnE;AAEF,QACE,iBAAA,GAAA,kBAAA,MAACC,YAAAA,KAAD;EACE,GAAI;EACJ,MAAA,GAAA,eAAA,cAAkB,WAAW,IAAI;EACjC,GAAI,UAAU,SAAS;EACjB;EACN,MAAK;EACL,iBAAe;EACf,iBAAe;EACf,iBAAe;EACf,UAAU,YAAY,IAAI;EAC1B,WAAW;EACX,mBAAiB,MAAM;EACvB,QAAQ,EACN,mBAAmB,uBAAuB,KAAK,IAChD;YAdH,CAgBG,QAED,iBAAA,GAAA,kBAAA,KAACC,cAAAA,OAAD;GACY;GACV,GAAI,UAAU,SAAS,EAAE,OAAO;IAAE,KAAKC,YAAAA,IAAI,EAAE;IAAE,YAAY;IAAY,EAAE,CAAC;GAC1E,CAAA,CACE;;EAER;AAEF,YAAY,cAAc;AAC1B,YAAY,UAAUC,2BAAAA"}
+{"version":3,"file":"ColorSlider.cjs","names":["factory","useProps","useStyles","ColorPickerContext","useMantineTheme","Box","Thumb","rem","classes"],"sources":["../../../../src/components/ColorPicker/ColorSlider/ColorSlider.tsx"],"sourcesContent":["import { use, useRef, useState } from 'react';\nimport {\n  clampUseMovePosition,\n  useDidUpdate,\n  useMergedRef,\n  useMove,\n  UseMovePosition,\n} from '@mantine/hooks';\nimport {\n  Box,\n  BoxProps,\n  ElementProps,\n  factory,\n  Factory,\n  MantineSize,\n  rem,\n  StylesApiProps,\n  useMantineTheme,\n  useProps,\n  useStyles,\n} from '../../../core';\nimport { ColorPickerContext } from '../ColorPicker.context';\nimport { Thumb } from '../Thumb/Thumb';\nimport classes from '../ColorPicker.module.css';\n\nexport type ColorSliderStylesNames = 'slider' | 'sliderOverlay' | 'thumb';\n\nexport interface __ColorSliderProps extends ElementProps<'div', 'onChange'> {\n  /** Controlled component value */\n  value: number;\n\n  /** Called when value changes */\n  onChange?: (value: number) => void;\n\n  /** Called when user stops dragging the slider or uses keyboard to change value */\n  onChangeEnd?: (value: number) => void;\n\n  /** Called when user starts dragging the slider */\n  onScrubStart?: () => void;\n\n  /** Called when user stops dragging the slider */\n  onScrubEnd?: () => void;\n\n  /** Slider size @default 'md' */\n  size?: MantineSize | (string & {});\n\n  /** If set, slider thumb can be focused @default true */\n  focusable?: boolean;\n}\n\nexport interface ColorSliderProps\n  extends\n    BoxProps,\n    StylesApiProps<ColorSliderFactory>,\n    __ColorSliderProps,\n    ElementProps<'div', 'onChange'> {\n  __staticSelector?: string;\n  maxValue: number;\n  overlays: React.CSSProperties[];\n  round: boolean;\n  thumbColor?: string;\n}\n\nexport type ColorSliderOptions = Omit<\n  ColorSliderProps,\n  'maxValue' | 'overlays' | 'round' | 'thumbColor'\n>;\n\nexport type ColorSliderFactory = Factory<{\n  props: ColorSliderProps;\n  ref: HTMLDivElement;\n  stylesNames: ColorSliderStylesNames;\n}>;\n\nexport const ColorSlider = factory<ColorSliderFactory>((_props) => {\n  const props = useProps('ColorSlider', null, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    onChange,\n    onChangeEnd,\n    maxValue,\n    round,\n    size = 'md',\n    focusable = true,\n    value,\n    overlays,\n    thumbColor = 'transparent',\n    onScrubStart,\n    onScrubEnd,\n    __staticSelector = 'ColorPicker',\n    attributes,\n    ref,\n    ...others\n  } = props;\n\n  const _getStyles = useStyles<ColorSliderFactory>({\n    name: __staticSelector,\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    rootSelector: 'slider',\n  });\n\n  const ctxGetStyles = use(ColorPickerContext)?.getStyles;\n  const getStyles = ctxGetStyles || _getStyles;\n\n  const theme = useMantineTheme();\n  const [position, setPosition] = useState({ y: 0, x: value / maxValue });\n  const positionRef = useRef(position);\n  const getChangeValue = (val: number) => (round ? Math.round(val * maxValue) : val * maxValue);\n  const { ref: sliderRef } = useMove(\n    ({ x, y }) => {\n      positionRef.current = { x, y };\n      onChange?.(getChangeValue(x));\n    },\n    {\n      onScrubEnd: () => {\n        const { x } = positionRef.current;\n        onChangeEnd?.(getChangeValue(x));\n        onScrubEnd?.();\n      },\n      onScrubStart,\n    }\n  );\n\n  useDidUpdate(() => {\n    setPosition({ y: 0, x: value / maxValue });\n  }, [value]);\n\n  const handleArrow = (event: React.KeyboardEvent<HTMLDivElement>, pos: UseMovePosition) => {\n    event.preventDefault();\n    const _position = clampUseMovePosition(pos);\n    onChange?.(getChangeValue(_position.x));\n    onChangeEnd?.(getChangeValue(_position.x));\n  };\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    switch (event.key) {\n      case 'ArrowRight': {\n        handleArrow(event, { x: position.x + 0.05, y: position.y });\n        break;\n      }\n\n      case 'ArrowLeft': {\n        handleArrow(event, { x: position.x - 0.05, y: position.y });\n        break;\n      }\n    }\n  };\n\n  const layers = overlays.map((overlay, index) => (\n    <div {...getStyles('sliderOverlay')} style={overlay} key={index} />\n  ));\n\n  return (\n    <Box\n      {...others}\n      ref={useMergedRef(sliderRef, ref)}\n      {...getStyles('slider')}\n      size={size}\n      role=\"slider\"\n      aria-valuenow={value}\n      aria-valuemax={maxValue}\n      aria-valuemin={0}\n      tabIndex={focusable ? 0 : -1}\n      onKeyDown={handleKeyDown}\n      data-focus-ring={theme.focusRing}\n      __vars={{\n        '--cp-thumb-size': `var(--cp-thumb-size-${size})`,\n      }}\n    >\n      {layers}\n\n      <Thumb\n        position={position}\n        {...getStyles('thumb', { style: { top: rem(1), background: thumbColor } })}\n      />\n    </Box>\n  );\n});\n\nColorSlider.displayName = '@mantine/core/ColorSlider';\nColorSlider.classes = classes;\n"],"mappings":";;;;;;;;;;;;;;;AA0EA,MAAa,cAAcA,gBAAAA,SAA6B,WAAW;CACjE,MAAM,QAAQC,kBAAAA,SAAS,eAAe,MAAM,MAAM;CAClD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,aACA,UACA,OACA,OAAO,MACP,YAAY,MACZ,OACA,UACA,aAAa,eACb,cACA,YACA,mBAAmB,eACnB,YACA,KACA,GAAG,WACD;CAEJ,MAAM,aAAaC,mBAAAA,UAA8B;EAC/C,MAAM;EACN,SAAA,2BAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;CAChB,CAAC;CAGD,MAAM,aAAA,GAAA,MAAA,KADmBC,4BAAAA,kBAAkB,GAAG,aACZ;CAElC,MAAM,QAAQC,6BAAAA,gBAAgB;CAC9B,MAAM,CAAC,UAAU,gBAAA,GAAA,MAAA,UAAwB;EAAE,GAAG;EAAG,GAAG,QAAQ;CAAS,CAAC;CACtE,MAAM,eAAA,GAAA,MAAA,QAAqB,QAAQ;CACnC,MAAM,kBAAkB,QAAiB,QAAQ,KAAK,MAAM,MAAM,QAAQ,IAAI,MAAM;CACpF,MAAM,EAAE,KAAK,eAAA,GAAA,eAAA,UACV,EAAE,GAAG,QAAQ;EACZ,YAAY,UAAU;GAAE;GAAG;EAAE;EAC7B,WAAW,eAAe,CAAC,CAAC;CAC9B,GACA;EACE,kBAAkB;GAChB,MAAM,EAAE,MAAM,YAAY;GAC1B,cAAc,eAAe,CAAC,CAAC;GAC/B,aAAa;EACf;EACA;CACF,CACF;CAEA,CAAA,GAAA,eAAA,oBAAmB;EACjB,YAAY;GAAE,GAAG;GAAG,GAAG,QAAQ;EAAS,CAAC;CAC3C,GAAG,CAAC,KAAK,CAAC;CAEV,MAAM,eAAe,OAA4C,QAAyB;EACxF,MAAM,eAAe;EACrB,MAAM,aAAA,GAAA,eAAA,sBAAiC,GAAG;EAC1C,WAAW,eAAe,UAAU,CAAC,CAAC;EACtC,cAAc,eAAe,UAAU,CAAC,CAAC;CAC3C;CAEA,MAAM,iBAAiB,UAA+C;EACpE,QAAQ,MAAM,KAAd;GACE,KAAK;IACH,YAAY,OAAO;KAAE,GAAG,SAAS,IAAI;KAAM,GAAG,SAAS;IAAE,CAAC;IAC1D;GAGF,KAAK;IACH,YAAY,OAAO;KAAE,GAAG,SAAS,IAAI;KAAM,GAAG,SAAS;IAAE,CAAC;IAC1D;EAEJ;CACF;CAEA,MAAM,SAAS,SAAS,KAAK,SAAS,UACpC,iBAAA,GAAA,MAAA,eAAC,OAAD;EAAK,GAAI,UAAU,eAAe;EAAG,OAAO;EAAS,KAAK;CAAQ,CAAA,CACnE;CAED,OACE,iBAAA,GAAA,kBAAA,MAACC,YAAAA,KAAD;EACE,GAAI;EACJ,MAAA,GAAA,eAAA,cAAkB,WAAW,GAAG;EAChC,GAAI,UAAU,QAAQ;EAChB;EACN,MAAK;EACL,iBAAe;EACf,iBAAe;EACf,iBAAe;EACf,UAAU,YAAY,IAAI;EAC1B,WAAW;EACX,mBAAiB,MAAM;EACvB,QAAQ,EACN,mBAAmB,uBAAuB,KAAK,GACjD;YAdF,CAgBG,QAED,iBAAA,GAAA,kBAAA,KAACC,cAAAA,OAAD;GACY;GACV,GAAI,UAAU,SAAS,EAAE,OAAO;IAAE,KAAKC,YAAAA,IAAI,CAAC;IAAG,YAAY;GAAW,EAAE,CAAC;EAC1E,CAAA,CACE;;AAET,CAAC;AAED,YAAY,cAAc;AAC1B,YAAY,UAAUC,2BAAAA"}

package/cjs/components/ColorPicker/HueSlider/HueSlider.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"HueSlider.cjs","names":["factory","useProps","ColorSlider","rem"],"sources":["../../../../src/components/ColorPicker/HueSlider/HueSlider.tsx"],"sourcesContent":["import { Factory, factory, rem, useProps } from '../../../core';\nimport {\n  ColorSlider,\n  ColorSliderOptions,\n  ColorSliderStylesNames,\n} from '../ColorSlider/ColorSlider';\n\nexport interface HueSliderProps extends ColorSliderOptions {}\n\nexport type HueSliderFactory = Factory<{\n  props: HueSliderProps;\n  ref: HTMLDivElement;\n  stylesNames: ColorSliderStylesNames;\n}>;\n\nconst defaultProps = {\n  __staticSelector: 'HueSlider',\n} satisfies Partial<HueSliderProps>;\n\nexport const HueSlider = factory<HueSliderFactory>((props: HueSliderProps) => {\n  const { value, onChange, onChangeEnd, color, ...others } = useProps(\n    'HueSlider',\n    defaultProps,\n    props\n  );\n\n  return (\n    <ColorSlider\n      {...others}\n      value={value}\n      onChange={onChange}\n      onChangeEnd={onChangeEnd}\n      maxValue={360}\n      thumbColor={`hsl(${value}, 100%, 50%)`}\n      round\n      data-hue\n      overlays={[\n        {\n          backgroundImage:\n            'linear-gradient(to right,hsl(0,100%,50%),hsl(60,100%,50%),hsl(120,100%,50%),hsl(170,100%,50%),hsl(240,100%,50%),hsl(300,100%,50%),hsl(360,100%,50%))',\n        },\n        {\n          boxShadow: `rgba(0, 0, 0, .1) 0 0 0 ${rem(1)} inset, rgb(0, 0, 0, .15) 0 0 ${rem(\n            4\n          )} inset`,\n        },\n      ]}\n    />\n  );\n});\n\nHueSlider.displayName = '@mantine/core/HueSlider';\nHueSlider.classes = ColorSlider.classes;\n\nexport namespace HueSlider {\n  export type Props = HueSliderProps;\n  export type Factory = HueSliderFactory;\n}\n"],"mappings":";;;;;;;;AAeA,MAAM,eAAe,EACnB,kBAAkB,aACnB;AAED,MAAa,YAAYA,gBAAAA,SAA2B,UAA0B;CAC5E,MAAM,EAAE,OAAO,UAAU,aAAa,OAAO,GAAG,WAAWC,kBAAAA,SACzD,aACA,cACA,MACD;AAED,QACE,iBAAA,GAAA,kBAAA,KAACC,oBAAAA,aAAD;EACE,GAAI;EACG;EACG;EACG;EACb,UAAU;EACV,YAAY,OAAO,MAAM;EACzB,OAAA;EACA,YAAA;EACA,UAAU,CACR,EACE,iBACE,wJACH,EACD,EACE,WAAW,2BAA2BC,YAAAA,IAAI,EAAE,CAAC,gCAAgCA,YAAAA,IAC3E,EACD,CAAC,SACH,CACF;EACD,CAAA;EAEJ;AAEF,UAAU,cAAc;AACxB,UAAU,UAAUD,oBAAAA,YAAY"}
+{"version":3,"file":"HueSlider.cjs","names":["factory","useProps","ColorSlider","rem"],"sources":["../../../../src/components/ColorPicker/HueSlider/HueSlider.tsx"],"sourcesContent":["import { Factory, factory, rem, useProps } from '../../../core';\nimport {\n  ColorSlider,\n  ColorSliderOptions,\n  ColorSliderStylesNames,\n} from '../ColorSlider/ColorSlider';\n\nexport interface HueSliderProps extends ColorSliderOptions {}\n\nexport type HueSliderFactory = Factory<{\n  props: HueSliderProps;\n  ref: HTMLDivElement;\n  stylesNames: ColorSliderStylesNames;\n}>;\n\nconst defaultProps = {\n  __staticSelector: 'HueSlider',\n} satisfies Partial<HueSliderProps>;\n\nexport const HueSlider = factory<HueSliderFactory>((props: HueSliderProps) => {\n  const { value, onChange, onChangeEnd, color, ...others } = useProps(\n    'HueSlider',\n    defaultProps,\n    props\n  );\n\n  return (\n    <ColorSlider\n      {...others}\n      value={value}\n      onChange={onChange}\n      onChangeEnd={onChangeEnd}\n      maxValue={360}\n      thumbColor={`hsl(${value}, 100%, 50%)`}\n      round\n      data-hue\n      overlays={[\n        {\n          backgroundImage:\n            'linear-gradient(to right,hsl(0,100%,50%),hsl(60,100%,50%),hsl(120,100%,50%),hsl(170,100%,50%),hsl(240,100%,50%),hsl(300,100%,50%),hsl(360,100%,50%))',\n        },\n        {\n          boxShadow: `rgba(0, 0, 0, .1) 0 0 0 ${rem(1)} inset, rgb(0, 0, 0, .15) 0 0 ${rem(\n            4\n          )} inset`,\n        },\n      ]}\n    />\n  );\n});\n\nHueSlider.displayName = '@mantine/core/HueSlider';\nHueSlider.classes = ColorSlider.classes;\n\nexport namespace HueSlider {\n  export type Props = HueSliderProps;\n  export type Factory = HueSliderFactory;\n}\n"],"mappings":";;;;;;;;AAeA,MAAM,eAAe,EACnB,kBAAkB,YACpB;AAEA,MAAa,YAAYA,gBAAAA,SAA2B,UAA0B;CAC5E,MAAM,EAAE,OAAO,UAAU,aAAa,OAAO,GAAG,WAAWC,kBAAAA,SACzD,aACA,cACA,KACF;CAEA,OACE,iBAAA,GAAA,kBAAA,KAACC,oBAAAA,aAAD;EACE,GAAI;EACG;EACG;EACG;EACb,UAAU;EACV,YAAY,OAAO,MAAM;EACzB,OAAA;EACA,YAAA;EACA,UAAU,CACR,EACE,iBACE,uJACJ,GACA,EACE,WAAW,2BAA2BC,YAAAA,IAAI,CAAC,EAAE,gCAAgCA,YAAAA,IAC3E,CACF,EAAE,QACJ,CACF;CACD,CAAA;AAEL,CAAC;AAED,UAAU,cAAc;AACxB,UAAU,UAAUD,oBAAAA,YAAY"}

package/cjs/components/ColorPicker/Saturation/Saturation.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Saturation.cjs","names":["ColorPickerContext","Box","convertHsvaTo","Thumb"],"sources":["../../../../src/components/ColorPicker/Saturation/Saturation.tsx"],"sourcesContent":["import { use, useEffect, useRef, useState } from 'react';\nimport { clampUseMovePosition, useMove, UseMovePosition } from '@mantine/hooks';\nimport { Box, ElementProps, MantineSize } from '../../../core';\nimport { ColorPickerContext } from '../ColorPicker.context';\nimport { HsvaColor } from '../ColorPicker.types';\nimport { convertHsvaTo } from '../converters';\nimport { Thumb } from '../Thumb/Thumb';\n\nexport interface SaturationProps extends ElementProps<'div', 'onChange'> {\n  value: HsvaColor;\n  onChange: (color: Partial<HsvaColor>) => void;\n  onChangeEnd: (color: Partial<HsvaColor>) => void;\n  onScrubStart?: () => void;\n  onScrubEnd?: () => void;\n  saturationLabel?: string;\n  size: MantineSize | (string & {});\n  color: string;\n  focusable?: boolean;\n}\n\nexport function Saturation({\n  className,\n  onChange,\n  onChangeEnd,\n  value,\n  saturationLabel,\n  focusable = true,\n  size,\n  color,\n  onScrubStart,\n  onScrubEnd,\n  ...others\n}: SaturationProps) {\n  const { getStyles } = use(ColorPickerContext)!;\n\n  const [position, setPosition] = useState({ x: value.s / 100, y: 1 - value.v / 100 });\n  const positionRef = useRef(position);\n\n  const { ref } = useMove(\n    ({ x, y }) => {\n      positionRef.current = { x, y };\n      onChange({ s: Math.round(x * 100), v: Math.round((1 - y) * 100) });\n    },\n    {\n      onScrubEnd: () => {\n        const { x, y } = positionRef.current;\n        onChangeEnd({ s: Math.round(x * 100), v: Math.round((1 - y) * 100) });\n        onScrubEnd?.();\n      },\n      onScrubStart,\n    }\n  );\n\n  useEffect(() => {\n    setPosition({ x: value.s / 100, y: 1 - value.v / 100 });\n  }, [value.s, value.v]);\n\n  const handleArrow = (event: React.KeyboardEvent<HTMLDivElement>, pos: UseMovePosition) => {\n    event.preventDefault();\n    const _position = clampUseMovePosition(pos);\n    onChange({ s: Math.round(_position.x * 100), v: Math.round((1 - _position.y) * 100) });\n    onChangeEnd({ s: Math.round(_position.x * 100), v: Math.round((1 - _position.y) * 100) });\n  };\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    switch (event.key) {\n      case 'ArrowUp': {\n        handleArrow(event, { y: position.y - 0.05, x: position.x });\n        break;\n      }\n\n      case 'ArrowDown': {\n        handleArrow(event, { y: position.y + 0.05, x: position.x });\n        break;\n      }\n\n      case 'ArrowRight': {\n        handleArrow(event, { x: position.x + 0.05, y: position.y });\n        break;\n      }\n\n      case 'ArrowLeft': {\n        handleArrow(event, { x: position.x - 0.05, y: position.y });\n        break;\n      }\n    }\n  };\n\n  return (\n    <Box\n      {...getStyles('saturation')}\n      ref={ref as any}\n      {...others}\n      role=\"slider\"\n      aria-label={saturationLabel}\n      aria-valuenow={position.x}\n      aria-valuetext={convertHsvaTo('rgba', value)}\n      tabIndex={focusable ? 0 : -1}\n      onKeyDown={handleKeyDown}\n    >\n      <div\n        {...getStyles('saturationOverlay', {\n          style: { backgroundColor: `hsl(${value.h}, 100%, 50%)` },\n        })}\n      />\n\n      <div\n        {...getStyles('saturationOverlay', {\n          style: { backgroundImage: 'linear-gradient(90deg, #fff, transparent)' },\n        })}\n      />\n\n      <div\n        {...getStyles('saturationOverlay', {\n          style: { backgroundImage: 'linear-gradient(0deg, #000, transparent)' },\n        })}\n      />\n\n      <Thumb position={position} {...getStyles('thumb', { style: { backgroundColor: color } })} />\n    </Box>\n  );\n}\n\nSaturation.displayName = '@mantine/core/Saturation';\n"],"mappings":"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"}
+{"version":3,"file":"Saturation.cjs","names":["ColorPickerContext","Box","convertHsvaTo","Thumb"],"sources":["../../../../src/components/ColorPicker/Saturation/Saturation.tsx"],"sourcesContent":["import { use, useEffect, useRef, useState } from 'react';\nimport { clampUseMovePosition, useMove, UseMovePosition } from '@mantine/hooks';\nimport { Box, ElementProps, MantineSize } from '../../../core';\nimport { ColorPickerContext } from '../ColorPicker.context';\nimport { HsvaColor } from '../ColorPicker.types';\nimport { convertHsvaTo } from '../converters';\nimport { Thumb } from '../Thumb/Thumb';\n\nexport interface SaturationProps extends ElementProps<'div', 'onChange'> {\n  value: HsvaColor;\n  onChange: (color: Partial<HsvaColor>) => void;\n  onChangeEnd: (color: Partial<HsvaColor>) => void;\n  onScrubStart?: () => void;\n  onScrubEnd?: () => void;\n  saturationLabel?: string;\n  size: MantineSize | (string & {});\n  color: string;\n  focusable?: boolean;\n}\n\nexport function Saturation({\n  className,\n  onChange,\n  onChangeEnd,\n  value,\n  saturationLabel,\n  focusable = true,\n  size,\n  color,\n  onScrubStart,\n  onScrubEnd,\n  ...others\n}: SaturationProps) {\n  const { getStyles } = use(ColorPickerContext)!;\n\n  const [position, setPosition] = useState({ x: value.s / 100, y: 1 - value.v / 100 });\n  const positionRef = useRef(position);\n\n  const { ref } = useMove(\n    ({ x, y }) => {\n      positionRef.current = { x, y };\n      onChange({ s: Math.round(x * 100), v: Math.round((1 - y) * 100) });\n    },\n    {\n      onScrubEnd: () => {\n        const { x, y } = positionRef.current;\n        onChangeEnd({ s: Math.round(x * 100), v: Math.round((1 - y) * 100) });\n        onScrubEnd?.();\n      },\n      onScrubStart,\n    }\n  );\n\n  useEffect(() => {\n    setPosition({ x: value.s / 100, y: 1 - value.v / 100 });\n  }, [value.s, value.v]);\n\n  const handleArrow = (event: React.KeyboardEvent<HTMLDivElement>, pos: UseMovePosition) => {\n    event.preventDefault();\n    const _position = clampUseMovePosition(pos);\n    onChange({ s: Math.round(_position.x * 100), v: Math.round((1 - _position.y) * 100) });\n    onChangeEnd({ s: Math.round(_position.x * 100), v: Math.round((1 - _position.y) * 100) });\n  };\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    switch (event.key) {\n      case 'ArrowUp': {\n        handleArrow(event, { y: position.y - 0.05, x: position.x });\n        break;\n      }\n\n      case 'ArrowDown': {\n        handleArrow(event, { y: position.y + 0.05, x: position.x });\n        break;\n      }\n\n      case 'ArrowRight': {\n        handleArrow(event, { x: position.x + 0.05, y: position.y });\n        break;\n      }\n\n      case 'ArrowLeft': {\n        handleArrow(event, { x: position.x - 0.05, y: position.y });\n        break;\n      }\n    }\n  };\n\n  return (\n    <Box\n      {...getStyles('saturation')}\n      ref={ref as any}\n      {...others}\n      role=\"slider\"\n      aria-label={saturationLabel}\n      aria-valuenow={position.x}\n      aria-valuetext={convertHsvaTo('rgba', value)}\n      tabIndex={focusable ? 0 : -1}\n      onKeyDown={handleKeyDown}\n    >\n      <div\n        {...getStyles('saturationOverlay', {\n          style: { backgroundColor: `hsl(${value.h}, 100%, 50%)` },\n        })}\n      />\n\n      <div\n        {...getStyles('saturationOverlay', {\n          style: { backgroundImage: 'linear-gradient(90deg, #fff, transparent)' },\n        })}\n      />\n\n      <div\n        {...getStyles('saturationOverlay', {\n          style: { backgroundImage: 'linear-gradient(0deg, #000, transparent)' },\n        })}\n      />\n\n      <Thumb position={position} {...getStyles('thumb', { style: { backgroundColor: color } })} />\n    </Box>\n  );\n}\n\nSaturation.displayName = '@mantine/core/Saturation';\n"],"mappings":"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"}

package/cjs/components/ColorPicker/Swatches/Swatches.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Swatches.cjs","names":["ColorPickerContext","ColorSwatch","CheckIcon","luminance","Box"],"sources":["../../../../src/components/ColorPicker/Swatches/Swatches.tsx"],"sourcesContent":["import { use } from 'react';\nimport { Box, ElementProps, luminance } from '../../../core';\nimport { CheckIcon } from '../../Checkbox';\nimport { ColorSwatch } from '../../ColorSwatch';\nimport { ColorPickerContext } from '../ColorPicker.context';\n\nexport interface SwatchesProps extends ElementProps<'div'> {\n  size?: string | number;\n  data: string[];\n  swatchesPerRow?: number;\n  focusable?: boolean;\n  value?: string;\n  onChangeEnd?: (color: string) => void;\n  setValue: (value: string) => void;\n}\n\nexport function Swatches({\n  className,\n  datatype,\n  setValue,\n  onChangeEnd,\n  size,\n  focusable,\n  data,\n  swatchesPerRow,\n  value,\n  ...others\n}: SwatchesProps) {\n  const ctx = use(ColorPickerContext)!;\n\n  const colors = data.map((color, index) => (\n    <ColorSwatch\n      {...ctx.getStyles('swatch')}\n      unstyled={ctx.unstyled}\n      component=\"button\"\n      type=\"button\"\n      color={color}\n      key={index}\n      radius=\"sm\"\n      onClick={() => {\n        setValue(color);\n        onChangeEnd?.(color);\n      }}\n      aria-label={color}\n      tabIndex={focusable ? 0 : -1}\n      data-swatch\n    >\n      {value === color && (\n        <CheckIcon size=\"35%\" color={luminance(color) < 0.5 ? 'white' : 'black'} />\n      )}\n    </ColorSwatch>\n  ));\n\n  return (\n    <Box {...ctx.getStyles('swatches')} {...others}>\n      {colors}\n    </Box>\n  );\n}\n\nSwatches.displayName = '@mantine/core/Swatches';\n"],"mappings":";;;;;;;;;;AAgBA,SAAgB,SAAS,EACvB,WACA,UACA,UACA,aACA,MACA,WACA,MACA,gBACA,OACA,GAAG,UACa;CAChB,MAAM,OAAA,GAAA,MAAA,KAAUA,4BAAAA,mBAAmB;CAEnC,MAAM,SAAS,KAAK,KAAK,OAAO,UAC9B,iBAAA,GAAA,MAAA,eAACC,oBAAAA,aAAD;EACE,GAAI,IAAI,UAAU,SAAS;EAC3B,UAAU,IAAI;EACd,WAAU;EACV,MAAK;EACE;EACP,KAAK;EACL,QAAO;EACP,eAAe;AACb,YAAS,MAAM;AACf,iBAAc,MAAM;;EAEtB,cAAY;EACZ,UAAU,YAAY,IAAI;EAC1B,eAAA;EAKY,EAHX,UAAU,SACT,iBAAA,GAAA,kBAAA,KAACC,kBAAAA,WAAD;EAAW,MAAK;EAAM,OAAOC,kBAAAA,UAAU,MAAM,GAAG,KAAM,UAAU;EAAW,CAAA,CAEjE,CACd;AAEF,QACE,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EAAK,GAAI,IAAI,UAAU,WAAW;EAAE,GAAI;YACrC;EACG,CAAA;;AAIV,SAAS,cAAc"}
+{"version":3,"file":"Swatches.cjs","names":["ColorPickerContext","ColorSwatch","CheckIcon","luminance","Box"],"sources":["../../../../src/components/ColorPicker/Swatches/Swatches.tsx"],"sourcesContent":["import { use } from 'react';\nimport { Box, ElementProps, luminance } from '../../../core';\nimport { CheckIcon } from '../../Checkbox';\nimport { ColorSwatch } from '../../ColorSwatch';\nimport { ColorPickerContext } from '../ColorPicker.context';\n\nexport interface SwatchesProps extends ElementProps<'div'> {\n  size?: string | number;\n  data: string[];\n  swatchesPerRow?: number;\n  focusable?: boolean;\n  value?: string;\n  onChangeEnd?: (color: string) => void;\n  setValue: (value: string) => void;\n}\n\nexport function Swatches({\n  className,\n  datatype,\n  setValue,\n  onChangeEnd,\n  size,\n  focusable,\n  data,\n  swatchesPerRow,\n  value,\n  ...others\n}: SwatchesProps) {\n  const ctx = use(ColorPickerContext)!;\n\n  const colors = data.map((color, index) => (\n    <ColorSwatch\n      {...ctx.getStyles('swatch')}\n      unstyled={ctx.unstyled}\n      component=\"button\"\n      type=\"button\"\n      color={color}\n      key={index}\n      radius=\"sm\"\n      onClick={() => {\n        setValue(color);\n        onChangeEnd?.(color);\n      }}\n      aria-label={color}\n      tabIndex={focusable ? 0 : -1}\n      data-swatch\n    >\n      {value === color && (\n        <CheckIcon size=\"35%\" color={luminance(color) < 0.5 ? 'white' : 'black'} />\n      )}\n    </ColorSwatch>\n  ));\n\n  return (\n    <Box {...ctx.getStyles('swatches')} {...others}>\n      {colors}\n    </Box>\n  );\n}\n\nSwatches.displayName = '@mantine/core/Swatches';\n"],"mappings":";;;;;;;;;;AAgBA,SAAgB,SAAS,EACvB,WACA,UACA,UACA,aACA,MACA,WACA,MACA,gBACA,OACA,GAAG,UACa;CAChB,MAAM,OAAA,GAAA,MAAA,KAAUA,4BAAAA,kBAAkB;CAElC,MAAM,SAAS,KAAK,KAAK,OAAO,UAC9B,iBAAA,GAAA,MAAA,eAACC,oBAAAA,aAAD;EACE,GAAI,IAAI,UAAU,QAAQ;EAC1B,UAAU,IAAI;EACd,WAAU;EACV,MAAK;EACE;EACP,KAAK;EACL,QAAO;EACP,eAAe;GACb,SAAS,KAAK;GACd,cAAc,KAAK;EACrB;EACA,cAAY;EACZ,UAAU,YAAY,IAAI;EAC1B,eAAA;CAKW,GAHV,UAAU,SACT,iBAAA,GAAA,kBAAA,KAACC,kBAAAA,WAAD;EAAW,MAAK;EAAM,OAAOC,kBAAAA,UAAU,KAAK,IAAI,KAAM,UAAU;CAAU,CAAA,CAEjE,CACd;CAED,OACE,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EAAK,GAAI,IAAI,UAAU,UAAU;EAAG,GAAI;YACrC;CACE,CAAA;AAET;AAEA,SAAS,cAAc"}

package/cjs/components/ColorPicker/Thumb/Thumb.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Thumb.cjs","names":["Box"],"sources":["../../../../src/components/ColorPicker/Thumb/Thumb.tsx"],"sourcesContent":["import { Box } from '../../../core';\n\nexport interface ThumbProps extends React.ComponentProps<'div'> {\n  variant?: string;\n  position: { x: number; y: number };\n}\n\nexport function Thumb({ position, ...others }: ThumbProps) {\n  return (\n    <Box\n      __vars={{\n        '--thumb-y-offset': `${position.y * 100}%`,\n        '--thumb-x-offset': `${position.x * 100}%`,\n      }}\n      {...others}\n    />\n  );\n}\n\nThumb.displayName = '@mantine/core/ColorPickerThumb';\n"],"mappings":";;;;;AAOA,SAAgB,MAAM,EAAE,UAAU,GAAG,UAAsB;AACzD,QACE,iBAAA,GAAA,kBAAA,KAACA,YAAAA,KAAD;EACE,QAAQ;GACN,oBAAoB,GAAG,SAAS,IAAI,IAAI;GACxC,oBAAoB,GAAG,SAAS,IAAI,IAAI;GACzC;EACD,GAAI;EACJ,CAAA;;AAIN,MAAM,cAAc"}
+{"version":3,"file":"Thumb.cjs","names":["Box"],"sources":["../../../../src/components/ColorPicker/Thumb/Thumb.tsx"],"sourcesContent":["import { Box } from '../../../core';\n\nexport interface ThumbProps extends React.ComponentProps<'div'> {\n  variant?: string;\n  position: { x: number; y: number };\n}\n\nexport function Thumb({ position, ...others }: ThumbProps) {\n  return (\n    <Box\n      __vars={{\n        '--thumb-y-offset': `${position.y * 100}%`,\n        '--thumb-x-offset': `${position.x * 100}%`,\n      }}\n      {...others}\n    />\n  );\n}\n\nThumb.displayName = '@mantine/core/ColorPickerThumb';\n"],"mappings":";;;;;AAOA,SAAgB,MAAM,EAAE,UAAU,GAAG,UAAsB;CACzD,OACE,iBAAA,GAAA,kBAAA,KAACA,YAAAA,KAAD;EACE,QAAQ;GACN,oBAAoB,GAAG,SAAS,IAAI,IAAI;GACxC,oBAAoB,GAAG,SAAS,IAAI,IAAI;EAC1C;EACA,GAAI;CACL,CAAA;AAEL;AAEA,MAAM,cAAc"}

package/cjs/components/ColorPicker/converters/converters.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"converters.cjs","names":["round"],"sources":["../../../../src/components/ColorPicker/converters/converters.ts"],"sourcesContent":["import { ColorFormat, HsvaColor, RgbaColor } from '../ColorPicker.types';\nimport { round } from './parsers';\n\nexport function hsvaToRgbaObject({ h, s, v, a }: HsvaColor): RgbaColor {\n  const _h = (h / 360) * 6;\n  const _s = s / 100;\n  const _v = v / 100;\n\n  const hh = Math.floor(_h);\n  const l = _v * (1 - _s);\n  const c = _v * (1 - (_h - hh) * _s);\n  const d = _v * (1 - (1 - _h + hh) * _s);\n  const module = hh % 6;\n\n  return {\n    r: round([_v, c, l, l, d, _v][module] * 255),\n    g: round([d, _v, _v, c, l, l][module] * 255),\n    b: round([l, l, d, _v, _v, c][module] * 255),\n    a: round(a, 2),\n  };\n}\n\nexport function hsvaToRgba(color: HsvaColor, includeAlpha: boolean) {\n  const { r, g, b, a } = hsvaToRgbaObject(color);\n\n  if (!includeAlpha) {\n    return `rgb(${r}, ${g}, ${b})`;\n  }\n\n  return `rgba(${r}, ${g}, ${b}, ${round(a, 2)})`;\n}\n\nexport function hsvaToHsl({ h, s, v, a }: HsvaColor, includeAlpha: boolean) {\n  const hh = ((200 - s) * v) / 100;\n\n  const result = {\n    h: Math.round(h),\n    s: Math.round(hh > 0 && hh < 200 ? ((s * v) / 100 / (hh <= 100 ? hh : 200 - hh)) * 100 : 0),\n    l: Math.round(hh / 2),\n  };\n\n  if (!includeAlpha) {\n    return `hsl(${result.h}, ${result.s}%, ${result.l}%)`;\n  }\n\n  return `hsla(${result.h}, ${result.s}%, ${result.l}%, ${round(a, 2)})`;\n}\n\nfunction formatHexPart(number: number) {\n  const hex = number.toString(16);\n  return hex.length < 2 ? `0${hex}` : hex;\n}\n\nexport function hsvaToHex(color: HsvaColor) {\n  const { r, g, b } = hsvaToRgbaObject(color);\n  return `#${formatHexPart(r)}${formatHexPart(g)}${formatHexPart(b)}`;\n}\n\nexport function hsvaToHexa(color: HsvaColor) {\n  const a = Math.round(color.a * 255);\n\n  return `${hsvaToHex(color)}${formatHexPart(a)}`;\n}\n\nconst CONVERTERS: Record<ColorFormat, (color: HsvaColor) => string> = {\n  hex: hsvaToHex,\n  hexa: (color) => hsvaToHexa(color),\n  rgb: (color) => hsvaToRgba(color, false),\n  rgba: (color) => hsvaToRgba(color, true),\n  hsl: (color) => hsvaToHsl(color, false),\n  hsla: (color) => hsvaToHsl(color, true),\n};\n\nexport function convertHsvaTo(format: ColorFormat, color: HsvaColor) {\n  if (!color) {\n    return '#000000';\n  }\n\n  if (!(format in CONVERTERS)) {\n    return CONVERTERS.hex(color);\n  }\n\n  return CONVERTERS[format](color);\n}\n"],"mappings":";;;AAGA,SAAgB,iBAAiB,EAAE,GAAG,GAAG,GAAG,KAA2B;CACrE,MAAM,KAAM,IAAI,MAAO;CACvB,MAAM,KAAK,IAAI;CACf,MAAM,KAAK,IAAI;CAEf,MAAM,KAAK,KAAK,MAAM,GAAG;CACzB,MAAM,IAAI,MAAM,IAAI;CACpB,MAAM,IAAI,MAAM,KAAK,KAAK,MAAM;CAChC,MAAM,IAAI,MAAM,KAAK,IAAI,KAAK,MAAM;CACpC,MAAM,SAAS,KAAK;AAEpB,QAAO;EACL,GAAGA,gBAAAA,MAAM;GAAC;GAAI;GAAG;GAAG;GAAG;GAAG;GAAG,CAAC,UAAU,IAAI;EAC5C,GAAGA,gBAAAA,MAAM;GAAC;GAAG;GAAI;GAAI;GAAG;GAAG;GAAE,CAAC,UAAU,IAAI;EAC5C,GAAGA,gBAAAA,MAAM;GAAC;GAAG;GAAG;GAAG;GAAI;GAAI;GAAE,CAAC,UAAU,IAAI;EAC5C,GAAGA,gBAAAA,MAAM,GAAG,EAAE;EACf;;AAGH,SAAgB,WAAW,OAAkB,cAAuB;CAClE,MAAM,EAAE,GAAG,GAAG,GAAG,MAAM,iBAAiB,MAAM;AAE9C,KAAI,CAAC,aACH,QAAO,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE;AAG9B,QAAO,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAE,IAAIA,gBAAAA,MAAM,GAAG,EAAE,CAAC;;AAG/C,SAAgB,UAAU,EAAE,GAAG,GAAG,GAAG,KAAgB,cAAuB;CAC1E,MAAM,MAAO,MAAM,KAAK,IAAK;CAE7B,MAAM,SAAS;EACb,GAAG,KAAK,MAAM,EAAE;EAChB,GAAG,KAAK,MAAM,KAAK,KAAK,KAAK,MAAQ,IAAI,IAAK,OAAO,MAAM,MAAM,KAAK,MAAM,MAAO,MAAM,EAAE;EAC3F,GAAG,KAAK,MAAM,KAAK,EAAE;EACtB;AAED,KAAI,CAAC,aACH,QAAO,OAAO,OAAO,EAAE,IAAI,OAAO,EAAE,KAAK,OAAO,EAAE;AAGpD,QAAO,QAAQ,OAAO,EAAE,IAAI,OAAO,EAAE,KAAK,OAAO,EAAE,KAAKA,gBAAAA,MAAM,GAAG,EAAE,CAAC;;AAGtE,SAAS,cAAc,QAAgB;CACrC,MAAM,MAAM,OAAO,SAAS,GAAG;AAC/B,QAAO,IAAI,SAAS,IAAI,IAAI,QAAQ;;AAGtC,SAAgB,UAAU,OAAkB;CAC1C,MAAM,EAAE,GAAG,GAAG,MAAM,iBAAiB,MAAM;AAC3C,QAAO,IAAI,cAAc,EAAE,GAAG,cAAc,EAAE,GAAG,cAAc,EAAE;;AAGnE,SAAgB,WAAW,OAAkB;CAC3C,MAAM,IAAI,KAAK,MAAM,MAAM,IAAI,IAAI;AAEnC,QAAO,GAAG,UAAU,MAAM,GAAG,cAAc,EAAE;;AAG/C,MAAM,aAAgE;CACpE,KAAK;CACL,OAAO,UAAU,WAAW,MAAM;CAClC,MAAM,UAAU,WAAW,OAAO,MAAM;CACxC,OAAO,UAAU,WAAW,OAAO,KAAK;CACxC,MAAM,UAAU,UAAU,OAAO,MAAM;CACvC,OAAO,UAAU,UAAU,OAAO,KAAK;CACxC;AAED,SAAgB,cAAc,QAAqB,OAAkB;AACnE,KAAI,CAAC,MACH,QAAO;AAGT,KAAI,EAAE,UAAU,YACd,QAAO,WAAW,IAAI,MAAM;AAG9B,QAAO,WAAW,QAAQ,MAAM"}
+{"version":3,"file":"converters.cjs","names":["round"],"sources":["../../../../src/components/ColorPicker/converters/converters.ts"],"sourcesContent":["import { ColorFormat, HsvaColor, RgbaColor } from '../ColorPicker.types';\nimport { round } from './parsers';\n\nexport function hsvaToRgbaObject({ h, s, v, a }: HsvaColor): RgbaColor {\n  const _h = (h / 360) * 6;\n  const _s = s / 100;\n  const _v = v / 100;\n\n  const hh = Math.floor(_h);\n  const l = _v * (1 - _s);\n  const c = _v * (1 - (_h - hh) * _s);\n  const d = _v * (1 - (1 - _h + hh) * _s);\n  const module = hh % 6;\n\n  return {\n    r: round([_v, c, l, l, d, _v][module] * 255),\n    g: round([d, _v, _v, c, l, l][module] * 255),\n    b: round([l, l, d, _v, _v, c][module] * 255),\n    a: round(a, 2),\n  };\n}\n\nexport function hsvaToRgba(color: HsvaColor, includeAlpha: boolean) {\n  const { r, g, b, a } = hsvaToRgbaObject(color);\n\n  if (!includeAlpha) {\n    return `rgb(${r}, ${g}, ${b})`;\n  }\n\n  return `rgba(${r}, ${g}, ${b}, ${round(a, 2)})`;\n}\n\nexport function hsvaToHsl({ h, s, v, a }: HsvaColor, includeAlpha: boolean) {\n  const hh = ((200 - s) * v) / 100;\n\n  const result = {\n    h: Math.round(h),\n    s: Math.round(hh > 0 && hh < 200 ? ((s * v) / 100 / (hh <= 100 ? hh : 200 - hh)) * 100 : 0),\n    l: Math.round(hh / 2),\n  };\n\n  if (!includeAlpha) {\n    return `hsl(${result.h}, ${result.s}%, ${result.l}%)`;\n  }\n\n  return `hsla(${result.h}, ${result.s}%, ${result.l}%, ${round(a, 2)})`;\n}\n\nfunction formatHexPart(number: number) {\n  const hex = number.toString(16);\n  return hex.length < 2 ? `0${hex}` : hex;\n}\n\nexport function hsvaToHex(color: HsvaColor) {\n  const { r, g, b } = hsvaToRgbaObject(color);\n  return `#${formatHexPart(r)}${formatHexPart(g)}${formatHexPart(b)}`;\n}\n\nexport function hsvaToHexa(color: HsvaColor) {\n  const a = Math.round(color.a * 255);\n\n  return `${hsvaToHex(color)}${formatHexPart(a)}`;\n}\n\nconst CONVERTERS: Record<ColorFormat, (color: HsvaColor) => string> = {\n  hex: hsvaToHex,\n  hexa: (color) => hsvaToHexa(color),\n  rgb: (color) => hsvaToRgba(color, false),\n  rgba: (color) => hsvaToRgba(color, true),\n  hsl: (color) => hsvaToHsl(color, false),\n  hsla: (color) => hsvaToHsl(color, true),\n};\n\nexport function convertHsvaTo(format: ColorFormat, color: HsvaColor) {\n  if (!color) {\n    return '#000000';\n  }\n\n  if (!(format in CONVERTERS)) {\n    return CONVERTERS.hex(color);\n  }\n\n  return CONVERTERS[format](color);\n}\n"],"mappings":";;;AAGA,SAAgB,iBAAiB,EAAE,GAAG,GAAG,GAAG,KAA2B;CACrE,MAAM,KAAM,IAAI,MAAO;CACvB,MAAM,KAAK,IAAI;CACf,MAAM,KAAK,IAAI;CAEf,MAAM,KAAK,KAAK,MAAM,EAAE;CACxB,MAAM,IAAI,MAAM,IAAI;CACpB,MAAM,IAAI,MAAM,KAAK,KAAK,MAAM;CAChC,MAAM,IAAI,MAAM,KAAK,IAAI,KAAK,MAAM;CACpC,MAAM,SAAS,KAAK;CAEpB,OAAO;EACL,GAAGA,gBAAAA,MAAM;GAAC;GAAI;GAAG;GAAG;GAAG;GAAG;EAAE,EAAE,UAAU,GAAG;EAC3C,GAAGA,gBAAAA,MAAM;GAAC;GAAG;GAAI;GAAI;GAAG;GAAG;EAAC,EAAE,UAAU,GAAG;EAC3C,GAAGA,gBAAAA,MAAM;GAAC;GAAG;GAAG;GAAG;GAAI;GAAI;EAAC,EAAE,UAAU,GAAG;EAC3C,GAAGA,gBAAAA,MAAM,GAAG,CAAC;CACf;AACF;AAEA,SAAgB,WAAW,OAAkB,cAAuB;CAClE,MAAM,EAAE,GAAG,GAAG,GAAG,MAAM,iBAAiB,KAAK;CAE7C,IAAI,CAAC,cACH,OAAO,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE;CAG9B,OAAO,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAE,IAAIA,gBAAAA,MAAM,GAAG,CAAC,EAAE;AAC/C;AAEA,SAAgB,UAAU,EAAE,GAAG,GAAG,GAAG,KAAgB,cAAuB;CAC1E,MAAM,MAAO,MAAM,KAAK,IAAK;CAE7B,MAAM,SAAS;EACb,GAAG,KAAK,MAAM,CAAC;EACf,GAAG,KAAK,MAAM,KAAK,KAAK,KAAK,MAAQ,IAAI,IAAK,OAAO,MAAM,MAAM,KAAK,MAAM,MAAO,MAAM,CAAC;EAC1F,GAAG,KAAK,MAAM,KAAK,CAAC;CACtB;CAEA,IAAI,CAAC,cACH,OAAO,OAAO,OAAO,EAAE,IAAI,OAAO,EAAE,KAAK,OAAO,EAAE;CAGpD,OAAO,QAAQ,OAAO,EAAE,IAAI,OAAO,EAAE,KAAK,OAAO,EAAE,KAAKA,gBAAAA,MAAM,GAAG,CAAC,EAAE;AACtE;AAEA,SAAS,cAAc,QAAgB;CACrC,MAAM,MAAM,OAAO,SAAS,EAAE;CAC9B,OAAO,IAAI,SAAS,IAAI,IAAI,QAAQ;AACtC;AAEA,SAAgB,UAAU,OAAkB;CAC1C,MAAM,EAAE,GAAG,GAAG,MAAM,iBAAiB,KAAK;CAC1C,OAAO,IAAI,cAAc,CAAC,IAAI,cAAc,CAAC,IAAI,cAAc,CAAC;AAClE;AAEA,SAAgB,WAAW,OAAkB;CAC3C,MAAM,IAAI,KAAK,MAAM,MAAM,IAAI,GAAG;CAElC,OAAO,GAAG,UAAU,KAAK,IAAI,cAAc,CAAC;AAC9C;AAEA,MAAM,aAAgE;CACpE,KAAK;CACL,OAAO,UAAU,WAAW,KAAK;CACjC,MAAM,UAAU,WAAW,OAAO,KAAK;CACvC,OAAO,UAAU,WAAW,OAAO,IAAI;CACvC,MAAM,UAAU,UAAU,OAAO,KAAK;CACtC,OAAO,UAAU,UAAU,OAAO,IAAI;AACxC;AAEA,SAAgB,cAAc,QAAqB,OAAkB;CACnE,IAAI,CAAC,OACH,OAAO;CAGT,IAAI,EAAE,UAAU,aACd,OAAO,WAAW,IAAI,KAAK;CAG7B,OAAO,WAAW,QAAQ,KAAK;AACjC"}

package/cjs/components/ColorPicker/converters/parsers.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"parsers.cjs","names":[],"sources":["../../../../src/components/ColorPicker/converters/parsers.ts"],"sourcesContent":["import { ColorFormat, HslaColor, HsvaColor, RgbaColor } from '../ColorPicker.types';\n\nexport function round(number: number, digits = 0, base = 10 ** digits) {\n  return Math.round(base * number) / base;\n}\n\nfunction hslaToHsva({ h, s, l, a }: HslaColor): HsvaColor {\n  const ss = s * ((l < 50 ? l : 100 - l) / 100);\n\n  return {\n    h,\n    s: ss > 0 ? ((2 * ss) / (l + ss)) * 100 : 0,\n    v: l + ss,\n    a,\n  };\n}\n\nconst angleUnits: Record<string, number> = {\n  grad: 360 / 400,\n  turn: 360,\n  rad: 360 / (Math.PI * 2),\n};\n\nexport function parseHue(value: string, unit = 'deg') {\n  return Number(value) * (angleUnits[unit] || 1);\n}\n\nconst HSL_REGEXP =\n  /hsla?\\(?\\s*(-?\\d*\\.?\\d+)(deg|rad|grad|turn)?[,\\s]+(-?\\d*\\.?\\d+)%?[,\\s]+(-?\\d*\\.?\\d+)%?,?\\s*[/\\s]*(-?\\d*\\.?\\d+)?(%)?\\s*\\)?/i;\n\nexport function parseHsla(color: string): HsvaColor {\n  const match = HSL_REGEXP.exec(color);\n\n  if (!match) {\n    return { h: 0, s: 0, v: 0, a: 1 };\n  }\n\n  return hslaToHsva({\n    h: parseHue(match[1], match[2]),\n    s: Number(match[3]),\n    l: Number(match[4]),\n    a: match[5] === undefined ? 1 : Number(match[5]) / (match[6] ? 100 : 1),\n  });\n}\n\nfunction rgbaToHsva({ r, g, b, a }: RgbaColor): HsvaColor {\n  const max = Math.max(r, g, b);\n  const delta = max - Math.min(r, g, b);\n\n  const hh = delta\n    ? max === r\n      ? (g - b) / delta\n      : max === g\n        ? 2 + (b - r) / delta\n        : 4 + (r - g) / delta\n    : 0;\n\n  return {\n    h: round(60 * (hh < 0 ? hh + 6 : hh), 3),\n    s: round(max ? (delta / max) * 100 : 0, 3),\n    v: round((max / 255) * 100, 3),\n    a,\n  };\n}\n\nexport function parseHex(color: string): HsvaColor {\n  const hex = color[0] === '#' ? color.slice(1) : color;\n\n  if (hex.length === 3) {\n    return rgbaToHsva({\n      r: parseInt(hex[0] + hex[0], 16),\n      g: parseInt(hex[1] + hex[1], 16),\n      b: parseInt(hex[2] + hex[2], 16),\n      a: 1,\n    });\n  }\n\n  return rgbaToHsva({\n    r: parseInt(hex.slice(0, 2), 16),\n    g: parseInt(hex.slice(2, 4), 16),\n    b: parseInt(hex.slice(4, 6), 16),\n    a: 1,\n  });\n}\n\nexport function parseHexa(color: string): HsvaColor {\n  const hex = color[0] === '#' ? color.slice(1) : color;\n\n  const roundA = (a: string) => round(parseInt(a, 16) / 255, 3);\n  if (hex.length === 4) {\n    const withoutOpacity = hex.slice(0, 3);\n    const a = roundA(hex[3] + hex[3]);\n\n    const hsvaColor: HsvaColor = { ...parseHex(withoutOpacity), a };\n    return hsvaColor;\n  }\n\n  const withoutOpacity = hex.slice(0, 6);\n  const a = roundA(hex.slice(6, 8));\n  const hsvaColor: HsvaColor = { ...parseHex(withoutOpacity), a };\n  return hsvaColor;\n}\n\nconst RGB_REGEXP =\n  /rgba?\\(?\\s*(-?\\d*\\.?\\d+)(%)?[,\\s]+(-?\\d*\\.?\\d+)(%)?[,\\s]+(-?\\d*\\.?\\d+)(%)?,?\\s*[/\\s]*(-?\\d*\\.?\\d+)?(%)?\\s*\\)?/i;\n\nexport function parseRgba(color: string): HsvaColor {\n  const match = RGB_REGEXP.exec(color);\n\n  if (!match) {\n    return { h: 0, s: 0, v: 0, a: 1 };\n  }\n\n  return rgbaToHsva({\n    r: Number(match[1]) / (match[2] ? 100 / 255 : 1),\n    g: Number(match[3]) / (match[4] ? 100 / 255 : 1),\n    b: Number(match[5]) / (match[6] ? 100 / 255 : 1),\n    a: match[7] === undefined ? 1 : Number(match[7]) / (match[8] ? 100 : 1),\n  });\n}\n\nconst VALIDATION_REGEXP: Record<ColorFormat, RegExp> = {\n  hex: /^#?([0-9A-F]{3}){1,2}$/i,\n  hexa: /^#?([0-9A-F]{4}){1,2}$/i,\n  rgb: /^rgb\\((\\d+),\\s*(\\d+),\\s*(\\d+)(?:,\\s*(\\d+(?:\\.\\d+)?))?\\)$/i,\n  rgba: /^rgba\\((\\d+),\\s*(\\d+),\\s*(\\d+)(?:,\\s*(\\d+(?:\\.\\d+)?))?\\)$/i,\n  hsl: /hsl\\(\\s*(\\d+)\\s*,\\s*(\\d+(?:\\.\\d+)?%)\\s*,\\s*(\\d+(?:\\.\\d+)?%)\\)/i,\n  hsla: /^hsla\\((\\d+),\\s*([\\d.]+)%,\\s*([\\d.]+)%,\\s*(\\d*(?:\\.\\d+)?)\\)$/i,\n};\n\nconst CONVERTERS: Record<ColorFormat, (color: string) => HsvaColor> = {\n  hex: parseHex,\n  hexa: parseHexa,\n  rgb: parseRgba,\n  rgba: parseRgba,\n  hsl: parseHsla,\n  hsla: parseHsla,\n};\n\nexport function isColorValid(color: string) {\n  for (const [, regexp] of Object.entries(VALIDATION_REGEXP)) {\n    if (regexp.test(color)) {\n      return true;\n    }\n  }\n\n  return false;\n}\n\nexport function parseColor(color: string): HsvaColor {\n  if (typeof color !== 'string') {\n    return { h: 0, s: 0, v: 0, a: 1 };\n  }\n\n  if (color === 'transparent') {\n    return { h: 0, s: 0, v: 0, a: 0 };\n  }\n\n  const trimmed = color.trim();\n\n  for (const [rule, regexp] of Object.entries(VALIDATION_REGEXP)) {\n    if (regexp.test(trimmed)) {\n      return CONVERTERS[rule as keyof typeof CONVERTERS](trimmed);\n    }\n  }\n\n  return { h: 0, s: 0, v: 0, a: 1 };\n}\n"],"mappings":"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"}
+{"version":3,"file":"parsers.cjs","names":[],"sources":["../../../../src/components/ColorPicker/converters/parsers.ts"],"sourcesContent":["import { ColorFormat, HslaColor, HsvaColor, RgbaColor } from '../ColorPicker.types';\n\nexport function round(number: number, digits = 0, base = 10 ** digits) {\n  return Math.round(base * number) / base;\n}\n\nfunction hslaToHsva({ h, s, l, a }: HslaColor): HsvaColor {\n  const ss = s * ((l < 50 ? l : 100 - l) / 100);\n\n  return {\n    h,\n    s: ss > 0 ? ((2 * ss) / (l + ss)) * 100 : 0,\n    v: l + ss,\n    a,\n  };\n}\n\nconst angleUnits: Record<string, number> = {\n  grad: 360 / 400,\n  turn: 360,\n  rad: 360 / (Math.PI * 2),\n};\n\nexport function parseHue(value: string, unit = 'deg') {\n  return Number(value) * (angleUnits[unit] || 1);\n}\n\nconst HSL_REGEXP =\n  /hsla?\\(?\\s*(-?\\d*\\.?\\d+)(deg|rad|grad|turn)?[,\\s]+(-?\\d*\\.?\\d+)%?[,\\s]+(-?\\d*\\.?\\d+)%?,?\\s*[/\\s]*(-?\\d*\\.?\\d+)?(%)?\\s*\\)?/i;\n\nexport function parseHsla(color: string): HsvaColor {\n  const match = HSL_REGEXP.exec(color);\n\n  if (!match) {\n    return { h: 0, s: 0, v: 0, a: 1 };\n  }\n\n  return hslaToHsva({\n    h: parseHue(match[1], match[2]),\n    s: Number(match[3]),\n    l: Number(match[4]),\n    a: match[5] === undefined ? 1 : Number(match[5]) / (match[6] ? 100 : 1),\n  });\n}\n\nfunction rgbaToHsva({ r, g, b, a }: RgbaColor): HsvaColor {\n  const max = Math.max(r, g, b);\n  const delta = max - Math.min(r, g, b);\n\n  const hh = delta\n    ? max === r\n      ? (g - b) / delta\n      : max === g\n        ? 2 + (b - r) / delta\n        : 4 + (r - g) / delta\n    : 0;\n\n  return {\n    h: round(60 * (hh < 0 ? hh + 6 : hh), 3),\n    s: round(max ? (delta / max) * 100 : 0, 3),\n    v: round((max / 255) * 100, 3),\n    a,\n  };\n}\n\nexport function parseHex(color: string): HsvaColor {\n  const hex = color[0] === '#' ? color.slice(1) : color;\n\n  if (hex.length === 3) {\n    return rgbaToHsva({\n      r: parseInt(hex[0] + hex[0], 16),\n      g: parseInt(hex[1] + hex[1], 16),\n      b: parseInt(hex[2] + hex[2], 16),\n      a: 1,\n    });\n  }\n\n  return rgbaToHsva({\n    r: parseInt(hex.slice(0, 2), 16),\n    g: parseInt(hex.slice(2, 4), 16),\n    b: parseInt(hex.slice(4, 6), 16),\n    a: 1,\n  });\n}\n\nexport function parseHexa(color: string): HsvaColor {\n  const hex = color[0] === '#' ? color.slice(1) : color;\n\n  const roundA = (a: string) => round(parseInt(a, 16) / 255, 3);\n  if (hex.length === 4) {\n    const withoutOpacity = hex.slice(0, 3);\n    const a = roundA(hex[3] + hex[3]);\n\n    const hsvaColor: HsvaColor = { ...parseHex(withoutOpacity), a };\n    return hsvaColor;\n  }\n\n  const withoutOpacity = hex.slice(0, 6);\n  const a = roundA(hex.slice(6, 8));\n  const hsvaColor: HsvaColor = { ...parseHex(withoutOpacity), a };\n  return hsvaColor;\n}\n\nconst RGB_REGEXP =\n  /rgba?\\(?\\s*(-?\\d*\\.?\\d+)(%)?[,\\s]+(-?\\d*\\.?\\d+)(%)?[,\\s]+(-?\\d*\\.?\\d+)(%)?,?\\s*[/\\s]*(-?\\d*\\.?\\d+)?(%)?\\s*\\)?/i;\n\nexport function parseRgba(color: string): HsvaColor {\n  const match = RGB_REGEXP.exec(color);\n\n  if (!match) {\n    return { h: 0, s: 0, v: 0, a: 1 };\n  }\n\n  return rgbaToHsva({\n    r: Number(match[1]) / (match[2] ? 100 / 255 : 1),\n    g: Number(match[3]) / (match[4] ? 100 / 255 : 1),\n    b: Number(match[5]) / (match[6] ? 100 / 255 : 1),\n    a: match[7] === undefined ? 1 : Number(match[7]) / (match[8] ? 100 : 1),\n  });\n}\n\nconst VALIDATION_REGEXP: Record<ColorFormat, RegExp> = {\n  hex: /^#?([0-9A-F]{3}){1,2}$/i,\n  hexa: /^#?([0-9A-F]{4}){1,2}$/i,\n  rgb: /^rgb\\((\\d+),\\s*(\\d+),\\s*(\\d+)(?:,\\s*(\\d+(?:\\.\\d+)?))?\\)$/i,\n  rgba: /^rgba\\((\\d+),\\s*(\\d+),\\s*(\\d+)(?:,\\s*(\\d+(?:\\.\\d+)?))?\\)$/i,\n  hsl: /hsl\\(\\s*(\\d+)\\s*,\\s*(\\d+(?:\\.\\d+)?%)\\s*,\\s*(\\d+(?:\\.\\d+)?%)\\)/i,\n  hsla: /^hsla\\((\\d+),\\s*([\\d.]+)%,\\s*([\\d.]+)%,\\s*(\\d*(?:\\.\\d+)?)\\)$/i,\n};\n\nconst CONVERTERS: Record<ColorFormat, (color: string) => HsvaColor> = {\n  hex: parseHex,\n  hexa: parseHexa,\n  rgb: parseRgba,\n  rgba: parseRgba,\n  hsl: parseHsla,\n  hsla: parseHsla,\n};\n\nexport function isColorValid(color: string) {\n  for (const [, regexp] of Object.entries(VALIDATION_REGEXP)) {\n    if (regexp.test(color)) {\n      return true;\n    }\n  }\n\n  return false;\n}\n\nexport function parseColor(color: string): HsvaColor {\n  if (typeof color !== 'string') {\n    return { h: 0, s: 0, v: 0, a: 1 };\n  }\n\n  if (color === 'transparent') {\n    return { h: 0, s: 0, v: 0, a: 0 };\n  }\n\n  const trimmed = color.trim();\n\n  for (const [rule, regexp] of Object.entries(VALIDATION_REGEXP)) {\n    if (regexp.test(trimmed)) {\n      return CONVERTERS[rule as keyof typeof CONVERTERS](trimmed);\n    }\n  }\n\n  return { h: 0, s: 0, v: 0, a: 1 };\n}\n"],"mappings":"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"}

package/cjs/components/ColorSwatch/ColorSwatch.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ColorSwatch.cjs","names":["createVarsResolver","getRadius","rem","polymorphicFactory","useProps","useStyles","Box","classes"],"sources":["../../../src/components/ColorSwatch/ColorSwatch.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  getRadius,\n  MantineRadius,\n  polymorphicFactory,\n  PolymorphicFactory,\n  rem,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport classes from './ColorSwatch.module.css';\n\nexport type ColorSwatchStylesNames =\n  | 'root'\n  | 'alphaOverlay'\n  | 'shadowOverlay'\n  | 'colorOverlay'\n  | 'childrenOverlay';\n\nexport type ColorSwatchCssVariables = {\n  root: '--cs-radius' | '--cs-size';\n};\n\nexport interface ColorSwatchProps extends BoxProps, StylesApiProps<ColorSwatchFactory> {\n  /** Valid CSS color to display */\n  color: string;\n\n  /** Swatch `width` and `height`, any valid CSS value, numbers are converted to rem. @default 28 */\n  size?: React.CSSProperties['width'];\n\n  /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem. @default 1000 */\n  radius?: MantineRadius;\n\n  /** If set, the swatch has inner `box-shadow` @default true */\n  withShadow?: boolean;\n\n  /** Children inside the swatch */\n  children?: React.ReactNode;\n}\n\nexport type ColorSwatchFactory = PolymorphicFactory<{\n  props: ColorSwatchProps;\n  defaultRef: HTMLDivElement;\n  defaultComponent: 'div';\n  stylesNames: ColorSwatchStylesNames;\n  vars: ColorSwatchCssVariables;\n}>;\n\nconst defaultProps = {\n  withShadow: true,\n} satisfies Partial<ColorSwatchProps>;\n\nconst varsResolver = createVarsResolver<ColorSwatchFactory>((_, { radius, size }) => ({\n  root: {\n    '--cs-radius': radius === undefined ? undefined : getRadius(radius),\n    '--cs-size': rem(size),\n  },\n}));\n\nexport const ColorSwatch = polymorphicFactory<ColorSwatchFactory>((_props) => {\n  const props = useProps('ColorSwatch', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    color,\n    radius,\n    withShadow,\n    children,\n    attributes,\n    ...others\n  } = useProps('ColorSwatch', defaultProps, props);\n\n  const getStyles = useStyles<ColorSwatchFactory>({\n    name: 'ColorSwatch',\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  return (\n    <Box {...getStyles('root', { focusable: true })} {...others}>\n      <span {...getStyles('alphaOverlay')} />\n      {withShadow && <span {...getStyles('shadowOverlay')} />}\n      <span {...getStyles('colorOverlay', { style: { backgroundColor: color } })} />\n      <span {...getStyles('childrenOverlay')}>{children}</span>\n    </Box>\n  );\n});\n\nColorSwatch.classes = classes;\nColorSwatch.varsResolver = varsResolver;\nColorSwatch.displayName = '@mantine/core/ColorSwatch';\n\nexport namespace ColorSwatch {\n  export type Props = ColorSwatchProps;\n  export type CssVariables = ColorSwatchCssVariables;\n  export type Factory = ColorSwatchFactory;\n  export type StylesNames = ColorSwatchStylesNames;\n}\n"],"mappings":";;;;;;;;;;;;AAmDA,MAAM,eAAe,EACnB,YAAY,MACb;AAED,MAAM,eAAeA,6BAAAA,oBAAwC,GAAG,EAAE,QAAQ,YAAY,EACpF,MAAM;CACJ,eAAe,WAAW,KAAA,IAAY,KAAA,IAAYC,iBAAAA,UAAU,OAAO;CACnE,aAAaC,YAAAA,IAAI,KAAK;CACvB,EACF,EAAE;AAEH,MAAa,cAAcC,4BAAAA,oBAAwC,WAAW;CAC5E,MAAM,QAAQC,kBAAAA,SAAS,eAAe,cAAc,OAAO;CAC3D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,OACA,QACA,YACA,UACA,YACA,GAAG,WACDA,kBAAAA,SAAS,eAAe,cAAc,MAAM;CAEhD,MAAM,YAAYC,mBAAAA,UAA8B;EAC9C,MAAM;EACN;EACA,SAAA,2BAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,QACE,iBAAA,GAAA,kBAAA,MAACC,YAAAA,KAAD;EAAK,GAAI,UAAU,QAAQ,EAAE,WAAW,MAAM,CAAC;EAAE,GAAI;YAArD;GACE,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAM,GAAI,UAAU,eAAe,EAAI,CAAA;GACtC,cAAc,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAM,GAAI,UAAU,gBAAgB,EAAI,CAAA;GACvD,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAM,GAAI,UAAU,gBAAgB,EAAE,OAAO,EAAE,iBAAiB,OAAO,EAAE,CAAC,EAAI,CAAA;GAC9E,iBAAA,GAAA,kBAAA,KAAC,QAAD;IAAM,GAAI,UAAU,kBAAkB;IAAG;IAAgB,CAAA;GACrD;;EAER;AAEF,YAAY,UAAUC,2BAAAA;AACtB,YAAY,eAAe;AAC3B,YAAY,cAAc"}
+{"version":3,"file":"ColorSwatch.cjs","names":["createVarsResolver","getRadius","rem","polymorphicFactory","useProps","useStyles","Box","classes"],"sources":["../../../src/components/ColorSwatch/ColorSwatch.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  getRadius,\n  MantineRadius,\n  polymorphicFactory,\n  PolymorphicFactory,\n  rem,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport classes from './ColorSwatch.module.css';\n\nexport type ColorSwatchStylesNames =\n  | 'root'\n  | 'alphaOverlay'\n  | 'shadowOverlay'\n  | 'colorOverlay'\n  | 'childrenOverlay';\n\nexport type ColorSwatchCssVariables = {\n  root: '--cs-radius' | '--cs-size';\n};\n\nexport interface ColorSwatchProps extends BoxProps, StylesApiProps<ColorSwatchFactory> {\n  /** Valid CSS color to display */\n  color: string;\n\n  /** Swatch `width` and `height`, any valid CSS value, numbers are converted to rem. @default 28 */\n  size?: React.CSSProperties['width'];\n\n  /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem. @default 1000 */\n  radius?: MantineRadius;\n\n  /** If set, the swatch has inner `box-shadow` @default true */\n  withShadow?: boolean;\n\n  /** Children inside the swatch */\n  children?: React.ReactNode;\n}\n\nexport type ColorSwatchFactory = PolymorphicFactory<{\n  props: ColorSwatchProps;\n  defaultRef: HTMLDivElement;\n  defaultComponent: 'div';\n  stylesNames: ColorSwatchStylesNames;\n  vars: ColorSwatchCssVariables;\n}>;\n\nconst defaultProps = {\n  withShadow: true,\n} satisfies Partial<ColorSwatchProps>;\n\nconst varsResolver = createVarsResolver<ColorSwatchFactory>((_, { radius, size }) => ({\n  root: {\n    '--cs-radius': radius === undefined ? undefined : getRadius(radius),\n    '--cs-size': rem(size),\n  },\n}));\n\nexport const ColorSwatch = polymorphicFactory<ColorSwatchFactory>((_props) => {\n  const props = useProps('ColorSwatch', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    color,\n    radius,\n    withShadow,\n    children,\n    attributes,\n    ...others\n  } = useProps('ColorSwatch', defaultProps, props);\n\n  const getStyles = useStyles<ColorSwatchFactory>({\n    name: 'ColorSwatch',\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  return (\n    <Box {...getStyles('root', { focusable: true })} {...others}>\n      <span {...getStyles('alphaOverlay')} />\n      {withShadow && <span {...getStyles('shadowOverlay')} />}\n      <span {...getStyles('colorOverlay', { style: { backgroundColor: color } })} />\n      <span {...getStyles('childrenOverlay')}>{children}</span>\n    </Box>\n  );\n});\n\nColorSwatch.classes = classes;\nColorSwatch.varsResolver = varsResolver;\nColorSwatch.displayName = '@mantine/core/ColorSwatch';\n\nexport namespace ColorSwatch {\n  export type Props = ColorSwatchProps;\n  export type CssVariables = ColorSwatchCssVariables;\n  export type Factory = ColorSwatchFactory;\n  export type StylesNames = ColorSwatchStylesNames;\n}\n"],"mappings":";;;;;;;;;;;;AAmDA,MAAM,eAAe,EACnB,YAAY,KACd;AAEA,MAAM,eAAeA,6BAAAA,oBAAwC,GAAG,EAAE,QAAQ,YAAY,EACpF,MAAM;CACJ,eAAe,WAAW,KAAA,IAAY,KAAA,IAAYC,iBAAAA,UAAU,MAAM;CAClE,aAAaC,YAAAA,IAAI,IAAI;AACvB,EACF,EAAE;AAEF,MAAa,cAAcC,4BAAAA,oBAAwC,WAAW;CAC5E,MAAM,QAAQC,kBAAAA,SAAS,eAAe,cAAc,MAAM;CAC1D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,OACA,QACA,YACA,UACA,YACA,GAAG,WACDA,kBAAAA,SAAS,eAAe,cAAc,KAAK;CAE/C,MAAM,YAAYC,mBAAAA,UAA8B;EAC9C,MAAM;EACN;EACA,SAAA,2BAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,OACE,iBAAA,GAAA,kBAAA,MAACC,YAAAA,KAAD;EAAK,GAAI,UAAU,QAAQ,EAAE,WAAW,KAAK,CAAC;EAAG,GAAI;YAArD;GACE,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAM,GAAI,UAAU,cAAc,EAAI,CAAA;GACrC,cAAc,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAM,GAAI,UAAU,eAAe,EAAI,CAAA;GACtD,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAM,GAAI,UAAU,gBAAgB,EAAE,OAAO,EAAE,iBAAiB,MAAM,EAAE,CAAC,EAAI,CAAA;GAC7E,iBAAA,GAAA,kBAAA,KAAC,QAAD;IAAM,GAAI,UAAU,iBAAiB;IAAI;GAAe,CAAA;EACrD;;AAET,CAAC;AAED,YAAY,UAAUC,2BAAAA;AACtB,YAAY,eAAe;AAC3B,YAAY,cAAc"}

package/cjs/components/Combobox/Combobox.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Combobox.cjs","names":["createVarsResolver","getFontSize","getSize","rem","useProps","useCombobox","useStyles","ComboboxProvider","Popover","classes","ComboboxTarget","ComboboxDropdown","ComboboxOptions","ComboboxOption","ComboboxSearch","ComboboxEmpty","ComboboxChevron","ComboboxFooter","ComboboxHeader","ComboboxEventsTarget","ComboboxDropdownTarget","ComboboxGroup","ComboboxClearButton","ComboboxHiddenInput"],"sources":["../../../src/components/Combobox/Combobox.tsx"],"sourcesContent":["import {\n  createVarsResolver,\n  ExtendComponent,\n  Factory,\n  getFontSize,\n  getSize,\n  MantineSize,\n  MantineThemeComponent,\n  rem,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { __PopoverProps, Popover } from '../Popover';\nimport { ComboboxProvider } from './Combobox.context';\nimport { ComboboxChevron, ComboboxChevronProps } from './ComboboxChevron/ComboboxChevron';\nimport {\n  ComboboxClearButton,\n  ComboboxClearButtonProps,\n} from './ComboboxClearButton/ComboboxClearButton';\nimport { ComboboxDropdown, ComboboxDropdownProps } from './ComboboxDropdown/ComboboxDropdown';\nimport {\n  ComboboxDropdownTarget,\n  ComboboxDropdownTargetProps,\n} from './ComboboxDropdownTarget/ComboboxDropdownTarget';\nimport { ComboboxEmpty, ComboboxEmptyProps } from './ComboboxEmpty/ComboboxEmpty';\nimport {\n  ComboboxEventsTarget,\n  ComboboxEventsTargetProps,\n} from './ComboboxEventsTarget/ComboboxEventsTarget';\nimport { ComboboxFooter, ComboboxFooterProps } from './ComboboxFooter/ComboboxFooter';\nimport { ComboboxGroup, ComboboxGroupProps } from './ComboboxGroup/ComboboxGroup';\nimport { ComboboxHeader, ComboboxHeaderProps } from './ComboboxHeader/ComboboxHeader';\nimport {\n  ComboboxHiddenInput,\n  ComboboxHiddenInputProps,\n} from './ComboboxHiddenInput/ComboboxHiddenInput';\nimport { ComboboxOption, ComboboxOptionProps } from './ComboboxOption/ComboboxOption';\nimport { ComboboxOptions, ComboboxOptionsProps } from './ComboboxOptions/ComboboxOptions';\nimport { ComboboxSearch, ComboboxSearchProps } from './ComboboxSearch/ComboboxSearch';\nimport { ComboboxTarget, ComboboxTargetProps } from './ComboboxTarget/ComboboxTarget';\nimport { ComboboxStore, useCombobox } from './use-combobox/use-combobox';\nimport classes from './Combobox.module.css';\n\nexport type ComboboxStylesNames =\n  | 'options'\n  | 'dropdown'\n  | 'option'\n  | 'search'\n  | 'empty'\n  | 'footer'\n  | 'header'\n  | 'group'\n  | 'groupLabel';\n\nexport type ComboboxCSSVariables = {\n  options: '--combobox-option-fz' | '--combobox-option-padding';\n  dropdown: '--combobox-padding' | '--combobox-option-fz' | '--combobox-option-padding';\n};\n\nexport interface ComboboxProps extends __PopoverProps, StylesApiProps<ComboboxFactory> {\n  __staticSelector?: string;\n\n  /** Combobox content */\n  children?: React.ReactNode;\n\n  /** Combobox store, can be used to control combobox state */\n  store?: ComboboxStore;\n\n  /** Called when item is selected with the `Enter` key or by clicking it */\n  onOptionSubmit?: (value: string, optionProps: ComboboxOptionProps) => void;\n\n  /** Controls items `font-size` and `padding` @default 'sm' */\n  size?: MantineSize | (string & {});\n\n  /** Controls `padding` of the dropdown @default 4 */\n  dropdownPadding?: React.CSSProperties['padding'];\n\n  /** Determines whether selection should be reset when option is hovered @default false */\n  resetSelectionOnOptionHover?: boolean;\n\n  /** Determines whether the `Combobox` value can be changed */\n  readOnly?: boolean;\n}\n\nexport type ComboboxFactory = Factory<{\n  props: ComboboxProps;\n  ref: HTMLDivElement;\n  stylesNames: ComboboxStylesNames;\n  vars: ComboboxCSSVariables;\n  staticComponents: {\n    Target: typeof ComboboxTarget;\n    Dropdown: typeof ComboboxDropdown;\n    Options: typeof ComboboxOptions;\n    Option: typeof ComboboxOption;\n    Search: typeof ComboboxSearch;\n    Empty: typeof ComboboxEmpty;\n    Chevron: typeof ComboboxChevron;\n    Footer: typeof ComboboxFooter;\n    Header: typeof ComboboxHeader;\n    EventsTarget: typeof ComboboxEventsTarget;\n    DropdownTarget: typeof ComboboxDropdownTarget;\n    Group: typeof ComboboxGroup;\n    ClearButton: typeof ComboboxClearButton;\n    HiddenInput: typeof ComboboxHiddenInput;\n  };\n}>;\n\nconst defaultProps = {\n  keepMounted: true,\n  withinPortal: true,\n  resetSelectionOnOptionHover: false,\n  width: 'target',\n  transitionProps: { transition: 'fade', duration: 0 },\n  size: 'sm',\n} satisfies Partial<ComboboxProps>;\n\nconst varsResolver = createVarsResolver<ComboboxFactory>((_, { size, dropdownPadding }) => ({\n  options: {\n    '--combobox-option-fz': getFontSize(size),\n    '--combobox-option-padding': getSize(size, 'combobox-option-padding'),\n  },\n\n  dropdown: {\n    '--combobox-padding': dropdownPadding === undefined ? undefined : rem(dropdownPadding),\n    '--combobox-option-fz': getFontSize(size),\n    '--combobox-option-padding': getSize(size, 'combobox-option-padding'),\n  },\n}));\n\nexport const Combobox = (_props: ComboboxProps) => {\n  const props = useProps('Combobox', defaultProps, _props);\n  const {\n    classNames,\n    styles,\n    unstyled,\n    children,\n    store: controlledStore,\n    vars,\n    onOptionSubmit,\n    onClose,\n    size,\n    dropdownPadding,\n    resetSelectionOnOptionHover,\n    __staticSelector,\n    readOnly,\n    attributes,\n    ...others\n  } = props;\n\n  const uncontrolledStore = useCombobox();\n  const store = controlledStore || uncontrolledStore;\n\n  const getStyles = useStyles<ComboboxFactory>({\n    name: __staticSelector || 'Combobox',\n    classes,\n    props,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const onDropdownClose = () => {\n    onClose?.();\n    store.closeDropdown();\n  };\n\n  return (\n    <ComboboxProvider\n      value={{\n        getStyles,\n        store,\n        onOptionSubmit,\n        size,\n        resetSelectionOnOptionHover,\n        readOnly,\n      }}\n    >\n      <Popover\n        opened={store.dropdownOpened}\n        preventPositionChangeWhenVisible={false}\n        {...others}\n        onChange={(_opened) => !_opened && onDropdownClose()}\n        withRoles={false}\n        unstyled={unstyled}\n      >\n        {children}\n      </Popover>\n    </ComboboxProvider>\n  );\n};\n\nconst extendCombobox = (c: ExtendComponent<ComboboxFactory>): MantineThemeComponent => c;\n\nCombobox.extend = extendCombobox;\nCombobox.classes = classes;\nCombobox.varsResolver = varsResolver;\nCombobox.displayName = '@mantine/core/Combobox';\nCombobox.Target = ComboboxTarget;\nCombobox.Dropdown = ComboboxDropdown;\nCombobox.Options = ComboboxOptions;\nCombobox.Option = ComboboxOption;\nCombobox.Search = ComboboxSearch;\nCombobox.Empty = ComboboxEmpty;\nCombobox.Chevron = ComboboxChevron;\nCombobox.Footer = ComboboxFooter;\nCombobox.Header = ComboboxHeader;\nCombobox.EventsTarget = ComboboxEventsTarget;\nCombobox.DropdownTarget = ComboboxDropdownTarget;\nCombobox.Group = ComboboxGroup;\nCombobox.ClearButton = ComboboxClearButton;\nCombobox.HiddenInput = ComboboxHiddenInput;\n\nexport namespace Combobox {\n  export type Props = ComboboxProps;\n  export type StylesNames = ComboboxStylesNames;\n  export type Factory = ComboboxFactory;\n\n  export namespace Dropdown {\n    export type Props = ComboboxDropdownProps;\n  }\n\n  export namespace Options {\n    export type Props = ComboboxOptionsProps;\n  }\n\n  export namespace Option {\n    export type Props = ComboboxOptionProps;\n  }\n\n  export namespace Target {\n    export type Props = ComboboxTargetProps;\n  }\n\n  export namespace Chevron {\n    export type Props = ComboboxChevronProps;\n  }\n\n  export namespace Empty {\n    export type Props = ComboboxEmptyProps;\n  }\n\n  export namespace Search {\n    export type Props = ComboboxSearchProps;\n  }\n\n  export namespace Footer {\n    export type Props = ComboboxFooterProps;\n  }\n\n  export namespace Header {\n    export type Props = ComboboxHeaderProps;\n  }\n\n  export namespace DropdownTarget {\n    export type Props = ComboboxDropdownTargetProps;\n  }\n\n  export namespace EventsTarget {\n    export type Props = ComboboxEventsTargetProps;\n  }\n\n  export namespace Group {\n    export type Props = ComboboxGroupProps;\n  }\n\n  export namespace ClearButton {\n    export type Props = ComboboxClearButtonProps;\n  }\n\n  export namespace HiddenInput {\n    export type Props = ComboboxHiddenInputProps;\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AA4GA,MAAM,eAAe;CACnB,aAAa;CACb,cAAc;CACd,6BAA6B;CAC7B,OAAO;CACP,iBAAiB;EAAE,YAAY;EAAQ,UAAU;EAAG;CACpD,MAAM;CACP;AAED,MAAM,eAAeA,6BAAAA,oBAAqC,GAAG,EAAE,MAAM,uBAAuB;CAC1F,SAAS;EACP,wBAAwBC,iBAAAA,YAAY,KAAK;EACzC,6BAA6BC,iBAAAA,QAAQ,MAAM,0BAA0B;EACtE;CAED,UAAU;EACR,sBAAsB,oBAAoB,KAAA,IAAY,KAAA,IAAYC,YAAAA,IAAI,gBAAgB;EACtF,wBAAwBF,iBAAAA,YAAY,KAAK;EACzC,6BAA6BC,iBAAAA,QAAQ,MAAM,0BAA0B;EACtE;CACF,EAAE;AAEH,MAAa,YAAY,WAA0B;CACjD,MAAM,QAAQE,kBAAAA,SAAS,YAAY,cAAc,OAAO;CACxD,MAAM,EACJ,YACA,QACA,UACA,UACA,OAAO,iBACP,MACA,gBACA,SACA,MACA,iBACA,6BACA,kBACA,UACA,YACA,GAAG,WACD;CAEJ,MAAM,oBAAoBC,qBAAAA,aAAa;CACvC,MAAM,QAAQ,mBAAmB;CAEjC,MAAM,YAAYC,mBAAAA,UAA2B;EAC3C,MAAM,oBAAoB;EAC1B,SAAA,wBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,wBAAwB;AAC5B,aAAW;AACX,QAAM,eAAe;;AAGvB,QACE,iBAAA,GAAA,kBAAA,KAACC,yBAAAA,kBAAD;EACE,OAAO;GACL;GACA;GACA;GACA;GACA;GACA;GACD;YAED,iBAAA,GAAA,kBAAA,KAACC,gBAAAA,SAAD;GACE,QAAQ,MAAM;GACd,kCAAkC;GAClC,GAAI;GACJ,WAAW,YAAY,CAAC,WAAW,iBAAiB;GACpD,WAAW;GACD;GAET;GACO,CAAA;EACO,CAAA;;AAIvB,MAAM,kBAAkB,MAA+D;AAEvF,SAAS,SAAS;AAClB,SAAS,UAAUC,wBAAAA;AACnB,SAAS,eAAe;AACxB,SAAS,cAAc;AACvB,SAAS,SAASC,uBAAAA;AAClB,SAAS,WAAWC,yBAAAA;AACpB,SAAS,UAAUC,wBAAAA;AACnB,SAAS,SAASC,uBAAAA;AAClB,SAAS,SAASC,uBAAAA;AAClB,SAAS,QAAQC,sBAAAA;AACjB,SAAS,UAAUC,wBAAAA;AACnB,SAAS,SAASC,uBAAAA;AAClB,SAAS,SAASC,uBAAAA;AAClB,SAAS,eAAeC,6BAAAA;AACxB,SAAS,iBAAiBC,+BAAAA;AAC1B,SAAS,QAAQC,sBAAAA;AACjB,SAAS,cAAcC,4BAAAA;AACvB,SAAS,cAAcC,4BAAAA"}
+{"version":3,"file":"Combobox.cjs","names":["createVarsResolver","getFontSize","getSize","rem","useProps","useCombobox","useStyles","ComboboxProvider","Popover","classes","ComboboxTarget","ComboboxDropdown","ComboboxOptions","ComboboxOption","ComboboxSearch","ComboboxEmpty","ComboboxChevron","ComboboxFooter","ComboboxHeader","ComboboxEventsTarget","ComboboxDropdownTarget","ComboboxGroup","ComboboxClearButton","ComboboxHiddenInput"],"sources":["../../../src/components/Combobox/Combobox.tsx"],"sourcesContent":["import {\n  createVarsResolver,\n  ExtendComponent,\n  Factory,\n  getFontSize,\n  getSize,\n  MantineSize,\n  MantineThemeComponent,\n  rem,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { __PopoverProps, Popover } from '../Popover';\nimport { ComboboxProvider } from './Combobox.context';\nimport { ComboboxChevron, ComboboxChevronProps } from './ComboboxChevron/ComboboxChevron';\nimport {\n  ComboboxClearButton,\n  ComboboxClearButtonProps,\n} from './ComboboxClearButton/ComboboxClearButton';\nimport { ComboboxDropdown, ComboboxDropdownProps } from './ComboboxDropdown/ComboboxDropdown';\nimport {\n  ComboboxDropdownTarget,\n  ComboboxDropdownTargetProps,\n} from './ComboboxDropdownTarget/ComboboxDropdownTarget';\nimport { ComboboxEmpty, ComboboxEmptyProps } from './ComboboxEmpty/ComboboxEmpty';\nimport {\n  ComboboxEventsTarget,\n  ComboboxEventsTargetProps,\n} from './ComboboxEventsTarget/ComboboxEventsTarget';\nimport { ComboboxFooter, ComboboxFooterProps } from './ComboboxFooter/ComboboxFooter';\nimport { ComboboxGroup, ComboboxGroupProps } from './ComboboxGroup/ComboboxGroup';\nimport { ComboboxHeader, ComboboxHeaderProps } from './ComboboxHeader/ComboboxHeader';\nimport {\n  ComboboxHiddenInput,\n  ComboboxHiddenInputProps,\n} from './ComboboxHiddenInput/ComboboxHiddenInput';\nimport { ComboboxOption, ComboboxOptionProps } from './ComboboxOption/ComboboxOption';\nimport { ComboboxOptions, ComboboxOptionsProps } from './ComboboxOptions/ComboboxOptions';\nimport { ComboboxSearch, ComboboxSearchProps } from './ComboboxSearch/ComboboxSearch';\nimport { ComboboxTarget, ComboboxTargetProps } from './ComboboxTarget/ComboboxTarget';\nimport { ComboboxStore, useCombobox } from './use-combobox/use-combobox';\nimport classes from './Combobox.module.css';\n\nexport type ComboboxStylesNames =\n  | 'options'\n  | 'dropdown'\n  | 'option'\n  | 'search'\n  | 'empty'\n  | 'footer'\n  | 'header'\n  | 'group'\n  | 'groupLabel';\n\nexport type ComboboxCSSVariables = {\n  options: '--combobox-option-fz' | '--combobox-option-padding';\n  dropdown: '--combobox-padding' | '--combobox-option-fz' | '--combobox-option-padding';\n};\n\nexport interface ComboboxProps extends __PopoverProps, StylesApiProps<ComboboxFactory> {\n  __staticSelector?: string;\n\n  /** Combobox content */\n  children?: React.ReactNode;\n\n  /** Combobox store, can be used to control combobox state */\n  store?: ComboboxStore;\n\n  /** Called when item is selected with the `Enter` key or by clicking it */\n  onOptionSubmit?: (value: string, optionProps: ComboboxOptionProps) => void;\n\n  /** Controls items `font-size` and `padding` @default 'sm' */\n  size?: MantineSize | (string & {});\n\n  /** Controls `padding` of the dropdown @default 4 */\n  dropdownPadding?: React.CSSProperties['padding'];\n\n  /** Determines whether selection should be reset when option is hovered @default false */\n  resetSelectionOnOptionHover?: boolean;\n\n  /** Determines whether the `Combobox` value can be changed */\n  readOnly?: boolean;\n}\n\nexport type ComboboxFactory = Factory<{\n  props: ComboboxProps;\n  ref: HTMLDivElement;\n  stylesNames: ComboboxStylesNames;\n  vars: ComboboxCSSVariables;\n  staticComponents: {\n    Target: typeof ComboboxTarget;\n    Dropdown: typeof ComboboxDropdown;\n    Options: typeof ComboboxOptions;\n    Option: typeof ComboboxOption;\n    Search: typeof ComboboxSearch;\n    Empty: typeof ComboboxEmpty;\n    Chevron: typeof ComboboxChevron;\n    Footer: typeof ComboboxFooter;\n    Header: typeof ComboboxHeader;\n    EventsTarget: typeof ComboboxEventsTarget;\n    DropdownTarget: typeof ComboboxDropdownTarget;\n    Group: typeof ComboboxGroup;\n    ClearButton: typeof ComboboxClearButton;\n    HiddenInput: typeof ComboboxHiddenInput;\n  };\n}>;\n\nconst defaultProps = {\n  keepMounted: true,\n  withinPortal: true,\n  resetSelectionOnOptionHover: false,\n  width: 'target',\n  transitionProps: { transition: 'fade', duration: 0 },\n  size: 'sm',\n} satisfies Partial<ComboboxProps>;\n\nconst varsResolver = createVarsResolver<ComboboxFactory>((_, { size, dropdownPadding }) => ({\n  options: {\n    '--combobox-option-fz': getFontSize(size),\n    '--combobox-option-padding': getSize(size, 'combobox-option-padding'),\n  },\n\n  dropdown: {\n    '--combobox-padding': dropdownPadding === undefined ? undefined : rem(dropdownPadding),\n    '--combobox-option-fz': getFontSize(size),\n    '--combobox-option-padding': getSize(size, 'combobox-option-padding'),\n  },\n}));\n\nexport const Combobox = (_props: ComboboxProps) => {\n  const props = useProps('Combobox', defaultProps, _props);\n  const {\n    classNames,\n    styles,\n    unstyled,\n    children,\n    store: controlledStore,\n    vars,\n    onOptionSubmit,\n    onClose,\n    size,\n    dropdownPadding,\n    resetSelectionOnOptionHover,\n    __staticSelector,\n    readOnly,\n    attributes,\n    ...others\n  } = props;\n\n  const uncontrolledStore = useCombobox();\n  const store = controlledStore || uncontrolledStore;\n\n  const getStyles = useStyles<ComboboxFactory>({\n    name: __staticSelector || 'Combobox',\n    classes,\n    props,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const onDropdownClose = () => {\n    onClose?.();\n    store.closeDropdown();\n  };\n\n  return (\n    <ComboboxProvider\n      value={{\n        getStyles,\n        store,\n        onOptionSubmit,\n        size,\n        resetSelectionOnOptionHover,\n        readOnly,\n      }}\n    >\n      <Popover\n        opened={store.dropdownOpened}\n        preventPositionChangeWhenVisible={false}\n        {...others}\n        onChange={(_opened) => !_opened && onDropdownClose()}\n        withRoles={false}\n        unstyled={unstyled}\n      >\n        {children}\n      </Popover>\n    </ComboboxProvider>\n  );\n};\n\nconst extendCombobox = (c: ExtendComponent<ComboboxFactory>): MantineThemeComponent => c;\n\nCombobox.extend = extendCombobox;\nCombobox.classes = classes;\nCombobox.varsResolver = varsResolver;\nCombobox.displayName = '@mantine/core/Combobox';\nCombobox.Target = ComboboxTarget;\nCombobox.Dropdown = ComboboxDropdown;\nCombobox.Options = ComboboxOptions;\nCombobox.Option = ComboboxOption;\nCombobox.Search = ComboboxSearch;\nCombobox.Empty = ComboboxEmpty;\nCombobox.Chevron = ComboboxChevron;\nCombobox.Footer = ComboboxFooter;\nCombobox.Header = ComboboxHeader;\nCombobox.EventsTarget = ComboboxEventsTarget;\nCombobox.DropdownTarget = ComboboxDropdownTarget;\nCombobox.Group = ComboboxGroup;\nCombobox.ClearButton = ComboboxClearButton;\nCombobox.HiddenInput = ComboboxHiddenInput;\n\nexport namespace Combobox {\n  export type Props = ComboboxProps;\n  export type StylesNames = ComboboxStylesNames;\n  export type Factory = ComboboxFactory;\n\n  export namespace Dropdown {\n    export type Props = ComboboxDropdownProps;\n  }\n\n  export namespace Options {\n    export type Props = ComboboxOptionsProps;\n  }\n\n  export namespace Option {\n    export type Props = ComboboxOptionProps;\n  }\n\n  export namespace Target {\n    export type Props = ComboboxTargetProps;\n  }\n\n  export namespace Chevron {\n    export type Props = ComboboxChevronProps;\n  }\n\n  export namespace Empty {\n    export type Props = ComboboxEmptyProps;\n  }\n\n  export namespace Search {\n    export type Props = ComboboxSearchProps;\n  }\n\n  export namespace Footer {\n    export type Props = ComboboxFooterProps;\n  }\n\n  export namespace Header {\n    export type Props = ComboboxHeaderProps;\n  }\n\n  export namespace DropdownTarget {\n    export type Props = ComboboxDropdownTargetProps;\n  }\n\n  export namespace EventsTarget {\n    export type Props = ComboboxEventsTargetProps;\n  }\n\n  export namespace Group {\n    export type Props = ComboboxGroupProps;\n  }\n\n  export namespace ClearButton {\n    export type Props = ComboboxClearButtonProps;\n  }\n\n  export namespace HiddenInput {\n    export type Props = ComboboxHiddenInputProps;\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AA4GA,MAAM,eAAe;CACnB,aAAa;CACb,cAAc;CACd,6BAA6B;CAC7B,OAAO;CACP,iBAAiB;EAAE,YAAY;EAAQ,UAAU;CAAE;CACnD,MAAM;AACR;AAEA,MAAM,eAAeA,6BAAAA,oBAAqC,GAAG,EAAE,MAAM,uBAAuB;CAC1F,SAAS;EACP,wBAAwBC,iBAAAA,YAAY,IAAI;EACxC,6BAA6BC,iBAAAA,QAAQ,MAAM,yBAAyB;CACtE;CAEA,UAAU;EACR,sBAAsB,oBAAoB,KAAA,IAAY,KAAA,IAAYC,YAAAA,IAAI,eAAe;EACrF,wBAAwBF,iBAAAA,YAAY,IAAI;EACxC,6BAA6BC,iBAAAA,QAAQ,MAAM,yBAAyB;CACtE;AACF,EAAE;AAEF,MAAa,YAAY,WAA0B;CACjD,MAAM,QAAQE,kBAAAA,SAAS,YAAY,cAAc,MAAM;CACvD,MAAM,EACJ,YACA,QACA,UACA,UACA,OAAO,iBACP,MACA,gBACA,SACA,MACA,iBACA,6BACA,kBACA,UACA,YACA,GAAG,WACD;CAEJ,MAAM,oBAAoBC,qBAAAA,YAAY;CACtC,MAAM,QAAQ,mBAAmB;CAEjC,MAAM,YAAYC,mBAAAA,UAA2B;EAC3C,MAAM,oBAAoB;EAC1B,SAAA,wBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,wBAAwB;EAC5B,UAAU;EACV,MAAM,cAAc;CACtB;CAEA,OACE,iBAAA,GAAA,kBAAA,KAACC,yBAAAA,kBAAD;EACE,OAAO;GACL;GACA;GACA;GACA;GACA;GACA;EACF;YAEA,iBAAA,GAAA,kBAAA,KAACC,gBAAAA,SAAD;GACE,QAAQ,MAAM;GACd,kCAAkC;GAClC,GAAI;GACJ,WAAW,YAAY,CAAC,WAAW,gBAAgB;GACnD,WAAW;GACD;GAET;EACM,CAAA;CACO,CAAA;AAEtB;AAEA,MAAM,kBAAkB,MAA+D;AAEvF,SAAS,SAAS;AAClB,SAAS,UAAUC,wBAAAA;AACnB,SAAS,eAAe;AACxB,SAAS,cAAc;AACvB,SAAS,SAASC,uBAAAA;AAClB,SAAS,WAAWC,yBAAAA;AACpB,SAAS,UAAUC,wBAAAA;AACnB,SAAS,SAASC,uBAAAA;AAClB,SAAS,SAASC,uBAAAA;AAClB,SAAS,QAAQC,sBAAAA;AACjB,SAAS,UAAUC,wBAAAA;AACnB,SAAS,SAASC,uBAAAA;AAClB,SAAS,SAASC,uBAAAA;AAClB,SAAS,eAAeC,6BAAAA;AACxB,SAAS,iBAAiBC,+BAAAA;AAC1B,SAAS,QAAQC,sBAAAA;AACjB,SAAS,cAAcC,4BAAAA;AACvB,SAAS,cAAcC,4BAAAA"}

package/cjs/components/Combobox/Combobox.context.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Combobox.context.cjs","names":["createSafeContext"],"sources":["../../../src/components/Combobox/Combobox.context.ts"],"sourcesContent":["import { createSafeContext, GetStylesApi, MantineSize } from '../../core';\nimport type { ComboboxFactory } from './Combobox';\nimport type { ComboboxOptionProps } from './ComboboxOption/ComboboxOption';\nimport type { ComboboxStore } from './use-combobox/use-combobox';\n\nexport interface ComboboxContextValue {\n  getStyles: GetStylesApi<ComboboxFactory>;\n  store: ComboboxStore;\n  onOptionSubmit?: (value: string, optionProps: ComboboxOptionProps) => void;\n  size: MantineSize | (string & {});\n  resetSelectionOnOptionHover: boolean | undefined;\n  readOnly: boolean | undefined;\n}\n\nexport const [ComboboxProvider, useComboboxContext] = createSafeContext<ComboboxContextValue>(\n  'Combobox component was not found in tree'\n);\n"],"mappings":";;AAcA,MAAa,CAAC,kBAAkB,8FAAsBA,kBACpD,2CACD"}
+{"version":3,"file":"Combobox.context.cjs","names":["createSafeContext"],"sources":["../../../src/components/Combobox/Combobox.context.ts"],"sourcesContent":["import { createSafeContext, GetStylesApi, MantineSize } from '../../core';\nimport type { ComboboxFactory } from './Combobox';\nimport type { ComboboxOptionProps } from './ComboboxOption/ComboboxOption';\nimport type { ComboboxStore } from './use-combobox/use-combobox';\n\nexport interface ComboboxContextValue {\n  getStyles: GetStylesApi<ComboboxFactory>;\n  store: ComboboxStore;\n  onOptionSubmit?: (value: string, optionProps: ComboboxOptionProps) => void;\n  size: MantineSize | (string & {});\n  resetSelectionOnOptionHover: boolean | undefined;\n  readOnly: boolean | undefined;\n}\n\nexport const [ComboboxProvider, useComboboxContext] = createSafeContext<ComboboxContextValue>(\n  'Combobox component was not found in tree'\n);\n"],"mappings":";;AAcA,MAAa,CAAC,kBAAkB,4FAAsBA,EAAAA,kBACpD,0CACF"}

package/cjs/components/Combobox/ComboboxChevron/ComboboxChevron.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxChevron.cjs","names":["createVarsResolver","getSize","getThemeColor","factory","useProps","useStyles","Box","classes"],"sources":["../../../../src/components/Combobox/ComboboxChevron/ComboboxChevron.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  Factory,\n  factory,\n  getSize,\n  getThemeColor,\n  MantineColor,\n  MantineSize,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../../core';\nimport classes from '../Combobox.module.css';\n\nexport type ComboboxChevronStylesNames = 'chevron';\nexport type ComboboxChevronCSSVariables = {\n  chevron: '--combobox-chevron-size' | '--combobox-chevron-color';\n};\n\nexport interface ComboboxChevronProps\n  extends\n    BoxProps,\n    StylesApiProps<ComboboxChevronFactory>,\n    ElementProps<'svg', 'opacity' | 'display'> {\n  size?: MantineSize | (string & {});\n  error?: React.ReactNode;\n  color?: MantineColor;\n}\n\nexport type ComboboxChevronFactory = Factory<{\n  props: ComboboxChevronProps;\n  ref: SVGSVGElement;\n  stylesNames: ComboboxChevronStylesNames;\n  vars: ComboboxChevronCSSVariables;\n}>;\n\nconst defaultProps = {\n  error: null,\n} satisfies Partial<ComboboxChevronProps>;\n\nconst varsResolver = createVarsResolver<ComboboxChevronFactory>((theme, { size, color }) => ({\n  chevron: {\n    '--combobox-chevron-size': getSize(size, 'combobox-chevron-size'),\n    '--combobox-chevron-color': color ? getThemeColor(color, theme) : undefined,\n  },\n}));\n\nexport const ComboboxChevron = factory<ComboboxChevronFactory>((_props) => {\n  const props = useProps('ComboboxChevron', defaultProps, _props);\n  const {\n    size,\n    error,\n    style,\n    className,\n    classNames,\n    styles,\n    unstyled,\n    vars,\n    attributes,\n    mod,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<ComboboxChevronFactory>({\n    name: 'ComboboxChevron',\n    classes,\n    props,\n    style,\n    className,\n    classNames,\n    styles,\n    unstyled,\n    vars,\n    varsResolver,\n    attributes,\n    rootSelector: 'chevron',\n  });\n\n  return (\n    <Box\n      component=\"svg\"\n      {...others}\n      {...getStyles('chevron')}\n      size={size}\n      viewBox=\"0 0 15 15\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      mod={['combobox-chevron', { error }, mod]}\n    >\n      <path\n        d=\"M4.93179 5.43179C4.75605 5.60753 4.75605 5.89245 4.93179 6.06819C5.10753 6.24392 5.39245 6.24392 5.56819 6.06819L7.49999 4.13638L9.43179 6.06819C9.60753 6.24392 9.89245 6.24392 10.0682 6.06819C10.2439 5.89245 10.2439 5.60753 10.0682 5.43179L7.81819 3.18179C7.73379 3.0974 7.61933 3.04999 7.49999 3.04999C7.38064 3.04999 7.26618 3.0974 7.18179 3.18179L4.93179 5.43179ZM10.0682 9.56819C10.2439 9.39245 10.2439 9.10753 10.0682 8.93179C9.89245 8.75606 9.60753 8.75606 9.43179 8.93179L7.49999 10.8636L5.56819 8.93179C5.39245 8.75606 5.10753 8.75606 4.93179 8.93179C4.75605 9.10753 4.75605 9.39245 4.93179 9.56819L7.18179 11.8182C7.35753 11.9939 7.64245 11.9939 7.81819 11.8182L10.0682 9.56819Z\"\n        fill=\"currentColor\"\n        fillRule=\"evenodd\"\n        clipRule=\"evenodd\"\n      />\n    </Box>\n  );\n});\n\nComboboxChevron.classes = classes;\nComboboxChevron.varsResolver = varsResolver;\nComboboxChevron.displayName = '@mantine/core/ComboboxChevron';\n"],"mappings":";;;;;;;;;;;;AAuCA,MAAM,eAAe,EACnB,OAAO,MACR;AAED,MAAM,eAAeA,6BAAAA,oBAA4C,OAAO,EAAE,MAAM,aAAa,EAC3F,SAAS;CACP,2BAA2BC,iBAAAA,QAAQ,MAAM,wBAAwB;CACjE,4BAA4B,QAAQC,wBAAAA,cAAc,OAAO,MAAM,GAAG,KAAA;CACnE,EACF,EAAE;AAEH,MAAa,kBAAkBC,gBAAAA,SAAiC,WAAW;CACzE,MAAM,QAAQC,kBAAAA,SAAS,mBAAmB,cAAc,OAAO;CAC/D,MAAM,EACJ,MACA,OACA,OACA,WACA,YACA,QACA,UACA,MACA,YACA,KACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAAkC;EAClD,MAAM;EACN,SAAA,wBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;EACf,CAAC;AAEF,QACE,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EACE,WAAU;EACV,GAAI;EACJ,GAAI,UAAU,UAAU;EAClB;EACN,SAAQ;EACR,MAAK;EACL,OAAM;EACN,KAAK;GAAC;GAAoB,EAAE,OAAO;GAAE;GAAI;YAEzC,iBAAA,GAAA,kBAAA,KAAC,QAAD;GACE,GAAE;GACF,MAAK;GACL,UAAS;GACT,UAAS;GACT,CAAA;EACE,CAAA;EAER;AAEF,gBAAgB,UAAUC,wBAAAA;AAC1B,gBAAgB,eAAe;AAC/B,gBAAgB,cAAc"}
+{"version":3,"file":"ComboboxChevron.cjs","names":["createVarsResolver","getSize","getThemeColor","factory","useProps","useStyles","Box","classes"],"sources":["../../../../src/components/Combobox/ComboboxChevron/ComboboxChevron.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  Factory,\n  factory,\n  getSize,\n  getThemeColor,\n  MantineColor,\n  MantineSize,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../../core';\nimport classes from '../Combobox.module.css';\n\nexport type ComboboxChevronStylesNames = 'chevron';\nexport type ComboboxChevronCSSVariables = {\n  chevron: '--combobox-chevron-size' | '--combobox-chevron-color';\n};\n\nexport interface ComboboxChevronProps\n  extends\n    BoxProps,\n    StylesApiProps<ComboboxChevronFactory>,\n    ElementProps<'svg', 'opacity' | 'display'> {\n  size?: MantineSize | (string & {});\n  error?: React.ReactNode;\n  color?: MantineColor;\n}\n\nexport type ComboboxChevronFactory = Factory<{\n  props: ComboboxChevronProps;\n  ref: SVGSVGElement;\n  stylesNames: ComboboxChevronStylesNames;\n  vars: ComboboxChevronCSSVariables;\n}>;\n\nconst defaultProps = {\n  error: null,\n} satisfies Partial<ComboboxChevronProps>;\n\nconst varsResolver = createVarsResolver<ComboboxChevronFactory>((theme, { size, color }) => ({\n  chevron: {\n    '--combobox-chevron-size': getSize(size, 'combobox-chevron-size'),\n    '--combobox-chevron-color': color ? getThemeColor(color, theme) : undefined,\n  },\n}));\n\nexport const ComboboxChevron = factory<ComboboxChevronFactory>((_props) => {\n  const props = useProps('ComboboxChevron', defaultProps, _props);\n  const {\n    size,\n    error,\n    style,\n    className,\n    classNames,\n    styles,\n    unstyled,\n    vars,\n    attributes,\n    mod,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<ComboboxChevronFactory>({\n    name: 'ComboboxChevron',\n    classes,\n    props,\n    style,\n    className,\n    classNames,\n    styles,\n    unstyled,\n    vars,\n    varsResolver,\n    attributes,\n    rootSelector: 'chevron',\n  });\n\n  return (\n    <Box\n      component=\"svg\"\n      {...others}\n      {...getStyles('chevron')}\n      size={size}\n      viewBox=\"0 0 15 15\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      mod={['combobox-chevron', { error }, mod]}\n    >\n      <path\n        d=\"M4.93179 5.43179C4.75605 5.60753 4.75605 5.89245 4.93179 6.06819C5.10753 6.24392 5.39245 6.24392 5.56819 6.06819L7.49999 4.13638L9.43179 6.06819C9.60753 6.24392 9.89245 6.24392 10.0682 6.06819C10.2439 5.89245 10.2439 5.60753 10.0682 5.43179L7.81819 3.18179C7.73379 3.0974 7.61933 3.04999 7.49999 3.04999C7.38064 3.04999 7.26618 3.0974 7.18179 3.18179L4.93179 5.43179ZM10.0682 9.56819C10.2439 9.39245 10.2439 9.10753 10.0682 8.93179C9.89245 8.75606 9.60753 8.75606 9.43179 8.93179L7.49999 10.8636L5.56819 8.93179C5.39245 8.75606 5.10753 8.75606 4.93179 8.93179C4.75605 9.10753 4.75605 9.39245 4.93179 9.56819L7.18179 11.8182C7.35753 11.9939 7.64245 11.9939 7.81819 11.8182L10.0682 9.56819Z\"\n        fill=\"currentColor\"\n        fillRule=\"evenodd\"\n        clipRule=\"evenodd\"\n      />\n    </Box>\n  );\n});\n\nComboboxChevron.classes = classes;\nComboboxChevron.varsResolver = varsResolver;\nComboboxChevron.displayName = '@mantine/core/ComboboxChevron';\n"],"mappings":";;;;;;;;;;;;AAuCA,MAAM,eAAe,EACnB,OAAO,KACT;AAEA,MAAM,eAAeA,6BAAAA,oBAA4C,OAAO,EAAE,MAAM,aAAa,EAC3F,SAAS;CACP,2BAA2BC,iBAAAA,QAAQ,MAAM,uBAAuB;CAChE,4BAA4B,QAAQC,wBAAAA,cAAc,OAAO,KAAK,IAAI,KAAA;AACpE,EACF,EAAE;AAEF,MAAa,kBAAkBC,gBAAAA,SAAiC,WAAW;CACzE,MAAM,QAAQC,kBAAAA,SAAS,mBAAmB,cAAc,MAAM;CAC9D,MAAM,EACJ,MACA,OACA,OACA,WACA,YACA,QACA,UACA,MACA,YACA,KACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAAkC;EAClD,MAAM;EACN,SAAA,wBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;CAChB,CAAC;CAED,OACE,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EACE,WAAU;EACV,GAAI;EACJ,GAAI,UAAU,SAAS;EACjB;EACN,SAAQ;EACR,MAAK;EACL,OAAM;EACN,KAAK;GAAC;GAAoB,EAAE,MAAM;GAAG;EAAG;YAExC,iBAAA,GAAA,kBAAA,KAAC,QAAD;GACE,GAAE;GACF,MAAK;GACL,UAAS;GACT,UAAS;EACV,CAAA;CACE,CAAA;AAET,CAAC;AAED,gBAAgB,UAAUC,wBAAAA;AAC1B,gBAAgB,eAAe;AAC/B,gBAAgB,cAAc"}

package/cjs/components/Combobox/ComboboxClearButton/ComboboxClearButton.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxClearButton.cjs","names":["Input"],"sources":["../../../../src/components/Combobox/ComboboxClearButton/ComboboxClearButton.tsx"],"sourcesContent":["import { ElementProps } from '../../../core';\nimport { Input, InputClearButtonProps } from '../../Input';\n\nexport interface ComboboxClearButtonProps extends InputClearButtonProps, ElementProps<'button'> {\n  onClear: () => void;\n}\n\nexport function ComboboxClearButton({\n  onMouseDown,\n  onClick,\n  onClear,\n  ...others\n}: ComboboxClearButtonProps) {\n  return (\n    <Input.ClearButton\n      tabIndex={-1}\n      aria-hidden\n      {...others}\n      onMouseDown={(event) => {\n        event.preventDefault();\n        onMouseDown?.(event);\n      }}\n      onClick={(event) => {\n        onClear();\n        onClick?.(event);\n      }}\n    />\n  );\n}\n\nComboboxClearButton.displayName = '@mantine/core/ComboboxClearButton';\n"],"mappings":";;;;;AAOA,SAAgB,oBAAoB,EAClC,aACA,SACA,SACA,GAAG,UACwB;AAC3B,QACE,iBAAA,GAAA,kBAAA,KAACA,cAAAA,MAAM,aAAP;EACE,UAAU;EACV,eAAA;EACA,GAAI;EACJ,cAAc,UAAU;AACtB,SAAM,gBAAgB;AACtB,iBAAc,MAAM;;EAEtB,UAAU,UAAU;AAClB,YAAS;AACT,aAAU,MAAM;;EAElB,CAAA;;AAIN,oBAAoB,cAAc"}
+{"version":3,"file":"ComboboxClearButton.cjs","names":["Input"],"sources":["../../../../src/components/Combobox/ComboboxClearButton/ComboboxClearButton.tsx"],"sourcesContent":["import { ElementProps } from '../../../core';\nimport { Input, InputClearButtonProps } from '../../Input';\n\nexport interface ComboboxClearButtonProps extends InputClearButtonProps, ElementProps<'button'> {\n  onClear: () => void;\n}\n\nexport function ComboboxClearButton({\n  onMouseDown,\n  onClick,\n  onClear,\n  ...others\n}: ComboboxClearButtonProps) {\n  return (\n    <Input.ClearButton\n      tabIndex={-1}\n      aria-hidden\n      {...others}\n      onMouseDown={(event) => {\n        event.preventDefault();\n        onMouseDown?.(event);\n      }}\n      onClick={(event) => {\n        onClear();\n        onClick?.(event);\n      }}\n    />\n  );\n}\n\nComboboxClearButton.displayName = '@mantine/core/ComboboxClearButton';\n"],"mappings":";;;;;AAOA,SAAgB,oBAAoB,EAClC,aACA,SACA,SACA,GAAG,UACwB;CAC3B,OACE,iBAAA,GAAA,kBAAA,KAACA,cAAAA,MAAM,aAAP;EACE,UAAU;EACV,eAAA;EACA,GAAI;EACJ,cAAc,UAAU;GACtB,MAAM,eAAe;GACrB,cAAc,KAAK;EACrB;EACA,UAAU,UAAU;GAClB,QAAQ;GACR,UAAU,KAAK;EACjB;CACD,CAAA;AAEL;AAEA,oBAAoB,cAAc"}

package/cjs/components/Combobox/ComboboxDropdown/ComboboxDropdown.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxDropdown.cjs","names":["factory","useProps","useComboboxContext","Popover","classes"],"sources":["../../../../src/components/Combobox/ComboboxDropdown/ComboboxDropdown.tsx"],"sourcesContent":["import { factory, Factory, useProps } from '../../../core';\nimport { Popover, PopoverDropdownProps } from '../../Popover';\nimport { useComboboxContext } from '../Combobox.context';\nimport classes from '../Combobox.module.css';\n\nexport type ComboboxDropdownStylesNames = 'dropdown';\n\nexport interface ComboboxDropdownProps extends PopoverDropdownProps {\n  /** Determines whether the dropdown should be hidden, for example, when there are no options to display */\n  hidden?: boolean;\n}\n\nexport type ComboboxDropdownFactory = Factory<{\n  props: ComboboxDropdownProps;\n  ref: HTMLDivElement;\n  stylesNames: ComboboxDropdownStylesNames;\n  compound: true;\n}>;\n\nexport const ComboboxDropdown = factory<ComboboxDropdownFactory>((props) => {\n  const { classNames, styles, className, style, hidden, ...others } = useProps(\n    'ComboboxDropdown',\n    null,\n    props\n  );\n\n  const ctx = useComboboxContext();\n\n  return (\n    <Popover.Dropdown\n      {...others}\n      role=\"presentation\"\n      data-hidden={hidden || undefined}\n      {...ctx.getStyles('dropdown', { className, style, classNames, styles })}\n    />\n  );\n});\n\nComboboxDropdown.classes = classes;\nComboboxDropdown.displayName = '@mantine/core/ComboboxDropdown';\n"],"mappings":";;;;;;;;;AAmBA,MAAa,mBAAmBA,gBAAAA,SAAkC,UAAU;CAC1E,MAAM,EAAE,YAAY,QAAQ,WAAW,OAAO,QAAQ,GAAG,WAAWC,kBAAAA,SAClE,oBACA,MACA,MACD;CAED,MAAM,MAAMC,yBAAAA,oBAAoB;AAEhC,QACE,iBAAA,GAAA,kBAAA,KAACC,gBAAAA,QAAQ,UAAT;EACE,GAAI;EACJ,MAAK;EACL,eAAa,UAAU,KAAA;EACvB,GAAI,IAAI,UAAU,YAAY;GAAE;GAAW;GAAO;GAAY;GAAQ,CAAC;EACvE,CAAA;EAEJ;AAEF,iBAAiB,UAAUC,wBAAAA;AAC3B,iBAAiB,cAAc"}
+{"version":3,"file":"ComboboxDropdown.cjs","names":["factory","useProps","useComboboxContext","Popover","classes"],"sources":["../../../../src/components/Combobox/ComboboxDropdown/ComboboxDropdown.tsx"],"sourcesContent":["import { factory, Factory, useProps } from '../../../core';\nimport { Popover, PopoverDropdownProps } from '../../Popover';\nimport { useComboboxContext } from '../Combobox.context';\nimport classes from '../Combobox.module.css';\n\nexport type ComboboxDropdownStylesNames = 'dropdown';\n\nexport interface ComboboxDropdownProps extends PopoverDropdownProps {\n  /** Determines whether the dropdown should be hidden, for example, when there are no options to display */\n  hidden?: boolean;\n}\n\nexport type ComboboxDropdownFactory = Factory<{\n  props: ComboboxDropdownProps;\n  ref: HTMLDivElement;\n  stylesNames: ComboboxDropdownStylesNames;\n  compound: true;\n}>;\n\nexport const ComboboxDropdown = factory<ComboboxDropdownFactory>((props) => {\n  const { classNames, styles, className, style, hidden, ...others } = useProps(\n    'ComboboxDropdown',\n    null,\n    props\n  );\n\n  const ctx = useComboboxContext();\n\n  return (\n    <Popover.Dropdown\n      {...others}\n      role=\"presentation\"\n      data-hidden={hidden || undefined}\n      {...ctx.getStyles('dropdown', { className, style, classNames, styles })}\n    />\n  );\n});\n\nComboboxDropdown.classes = classes;\nComboboxDropdown.displayName = '@mantine/core/ComboboxDropdown';\n"],"mappings":";;;;;;;;;AAmBA,MAAa,mBAAmBA,gBAAAA,SAAkC,UAAU;CAC1E,MAAM,EAAE,YAAY,QAAQ,WAAW,OAAO,QAAQ,GAAG,WAAWC,kBAAAA,SAClE,oBACA,MACA,KACF;CAEA,MAAM,MAAMC,yBAAAA,mBAAmB;CAE/B,OACE,iBAAA,GAAA,kBAAA,KAACC,gBAAAA,QAAQ,UAAT;EACE,GAAI;EACJ,MAAK;EACL,eAAa,UAAU,KAAA;EACvB,GAAI,IAAI,UAAU,YAAY;GAAE;GAAW;GAAO;GAAY;EAAO,CAAC;CACvE,CAAA;AAEL,CAAC;AAED,iBAAiB,UAAUC,wBAAAA;AAC3B,iBAAiB,cAAc"}

package/cjs/components/Combobox/ComboboxDropdownTarget/ComboboxDropdownTarget.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxDropdownTarget.cjs","names":["factory","useProps","isElement","Popover"],"sources":["../../../../src/components/Combobox/ComboboxDropdownTarget/ComboboxDropdownTarget.tsx"],"sourcesContent":["import { factory, Factory, isElement, useProps } from '../../../core';\nimport { Popover } from '../../Popover';\nimport { useComboboxContext } from '../Combobox.context';\n\nexport interface ComboboxDropdownTargetProps {\n  ref?: React.RefObject<HTMLElement>;\n\n  /** Target element */\n  children: React.ReactNode;\n\n  /** Key of the prop that should be used to access element ref */\n  refProp?: string;\n}\n\nconst defaultProps = {\n  refProp: 'ref',\n} satisfies Partial<ComboboxDropdownTargetProps>;\n\nexport type ComboboxDropdownTargetFactory = Factory<{\n  props: ComboboxDropdownTargetProps;\n  ref: HTMLElement;\n  compound: true;\n}>;\n\nexport const ComboboxDropdownTarget = factory<ComboboxDropdownTargetFactory>((props) => {\n  const { children, refProp, ref } = useProps('ComboboxDropdownTarget', defaultProps, props);\n\n  // Context not used, just to throw error if used outside of Combobox\n  useComboboxContext();\n\n  if (!isElement(children)) {\n    throw new Error(\n      'Combobox.DropdownTarget component children should be an element or a component that accepts ref. Fragments, strings, numbers and other primitive values are not supported'\n    );\n  }\n\n  return (\n    <Popover.Target ref={ref} refProp={refProp}>\n      {children}\n    </Popover.Target>\n  );\n});\n\nComboboxDropdownTarget.displayName = '@mantine/core/ComboboxDropdownTarget';\n"],"mappings":";;;;;;;;;AAcA,MAAM,eAAe,EACnB,SAAS,OACV;AAQD,MAAa,yBAAyBA,gBAAAA,SAAwC,UAAU;CACtF,MAAM,EAAE,UAAU,SAAS,QAAQC,kBAAAA,SAAS,0BAA0B,cAAc,MAAM;AAG1F,0BAAA,oBAAoB;AAEpB,KAAI,CAACC,mBAAAA,UAAU,SAAS,CACtB,OAAM,IAAI,MACR,4KACD;AAGH,QACE,iBAAA,GAAA,kBAAA,KAACC,gBAAAA,QAAQ,QAAT;EAAqB;EAAc;EAChC;EACc,CAAA;EAEnB;AAEF,uBAAuB,cAAc"}
+{"version":3,"file":"ComboboxDropdownTarget.cjs","names":["factory","useProps","isElement","Popover"],"sources":["../../../../src/components/Combobox/ComboboxDropdownTarget/ComboboxDropdownTarget.tsx"],"sourcesContent":["import { factory, Factory, isElement, useProps } from '../../../core';\nimport { Popover } from '../../Popover';\nimport { useComboboxContext } from '../Combobox.context';\n\nexport interface ComboboxDropdownTargetProps {\n  ref?: React.RefObject<HTMLElement>;\n\n  /** Target element */\n  children: React.ReactNode;\n\n  /** Key of the prop that should be used to access element ref */\n  refProp?: string;\n}\n\nconst defaultProps = {\n  refProp: 'ref',\n} satisfies Partial<ComboboxDropdownTargetProps>;\n\nexport type ComboboxDropdownTargetFactory = Factory<{\n  props: ComboboxDropdownTargetProps;\n  ref: HTMLElement;\n  compound: true;\n}>;\n\nexport const ComboboxDropdownTarget = factory<ComboboxDropdownTargetFactory>((props) => {\n  const { children, refProp, ref } = useProps('ComboboxDropdownTarget', defaultProps, props);\n\n  // Context not used, just to throw error if used outside of Combobox\n  useComboboxContext();\n\n  if (!isElement(children)) {\n    throw new Error(\n      'Combobox.DropdownTarget component children should be an element or a component that accepts ref. Fragments, strings, numbers and other primitive values are not supported'\n    );\n  }\n\n  return (\n    <Popover.Target ref={ref} refProp={refProp}>\n      {children}\n    </Popover.Target>\n  );\n});\n\nComboboxDropdownTarget.displayName = '@mantine/core/ComboboxDropdownTarget';\n"],"mappings":";;;;;;;;;AAcA,MAAM,eAAe,EACnB,SAAS,MACX;AAQA,MAAa,yBAAyBA,gBAAAA,SAAwC,UAAU;CACtF,MAAM,EAAE,UAAU,SAAS,QAAQC,kBAAAA,SAAS,0BAA0B,cAAc,KAAK;CAGzF,yBAAA,mBAAmB;CAEnB,IAAI,CAACC,mBAAAA,UAAU,QAAQ,GACrB,MAAM,IAAI,MACR,2KACF;CAGF,OACE,iBAAA,GAAA,kBAAA,KAACC,gBAAAA,QAAQ,QAAT;EAAqB;EAAc;EAChC;CACa,CAAA;AAEpB,CAAC;AAED,uBAAuB,cAAc"}

package/cjs/components/Combobox/ComboboxEmpty/ComboboxEmpty.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxEmpty.cjs","names":["factory","useProps","Box","useComboboxContext","classes"],"sources":["../../../../src/components/Combobox/ComboboxEmpty/ComboboxEmpty.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  CompoundStylesApiProps,\n  ElementProps,\n  factory,\n  Factory,\n  useProps,\n} from '../../../core';\nimport { useComboboxContext } from '../Combobox.context';\nimport classes from '../Combobox.module.css';\n\nexport type ComboboxEmptyStylesNames = 'empty';\n\nexport interface ComboboxEmptyProps\n  extends BoxProps, CompoundStylesApiProps<ComboboxEmptyFactory>, ElementProps<'div'> {}\n\nexport type ComboboxEmptyFactory = Factory<{\n  props: ComboboxEmptyProps;\n  ref: HTMLDivElement;\n  stylesNames: ComboboxEmptyStylesNames;\n  compound: true;\n}>;\n\nexport const ComboboxEmpty = factory<ComboboxEmptyFactory>((props) => {\n  const { classNames, className, style, styles, vars, ...others } = useProps(\n    'ComboboxEmpty',\n    null,\n    props\n  );\n\n  const ctx = useComboboxContext();\n\n  return <Box {...ctx.getStyles('empty', { className, classNames, styles, style })} {...others} />;\n});\n\nComboboxEmpty.classes = classes;\nComboboxEmpty.displayName = '@mantine/core/ComboboxEmpty';\n"],"mappings":";;;;;;;;;AAwBA,MAAa,gBAAgBA,gBAAAA,SAA+B,UAAU;CACpE,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,GAAG,WAAWC,kBAAAA,SAChE,iBACA,MACA,MACD;AAID,QAAO,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EAAK,GAFAC,yBAAAA,oBAAoB,CAEZ,UAAU,SAAS;GAAE;GAAW;GAAY;GAAQ;GAAO,CAAC;EAAE,GAAI;EAAU,CAAA;EAChG;AAEF,cAAc,UAAUC,wBAAAA;AACxB,cAAc,cAAc"}
+{"version":3,"file":"ComboboxEmpty.cjs","names":["factory","useProps","Box","useComboboxContext","classes"],"sources":["../../../../src/components/Combobox/ComboboxEmpty/ComboboxEmpty.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  CompoundStylesApiProps,\n  ElementProps,\n  factory,\n  Factory,\n  useProps,\n} from '../../../core';\nimport { useComboboxContext } from '../Combobox.context';\nimport classes from '../Combobox.module.css';\n\nexport type ComboboxEmptyStylesNames = 'empty';\n\nexport interface ComboboxEmptyProps\n  extends BoxProps, CompoundStylesApiProps<ComboboxEmptyFactory>, ElementProps<'div'> {}\n\nexport type ComboboxEmptyFactory = Factory<{\n  props: ComboboxEmptyProps;\n  ref: HTMLDivElement;\n  stylesNames: ComboboxEmptyStylesNames;\n  compound: true;\n}>;\n\nexport const ComboboxEmpty = factory<ComboboxEmptyFactory>((props) => {\n  const { classNames, className, style, styles, vars, ...others } = useProps(\n    'ComboboxEmpty',\n    null,\n    props\n  );\n\n  const ctx = useComboboxContext();\n\n  return <Box {...ctx.getStyles('empty', { className, classNames, styles, style })} {...others} />;\n});\n\nComboboxEmpty.classes = classes;\nComboboxEmpty.displayName = '@mantine/core/ComboboxEmpty';\n"],"mappings":";;;;;;;;;AAwBA,MAAa,gBAAgBA,gBAAAA,SAA+B,UAAU;CACpE,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,GAAG,WAAWC,kBAAAA,SAChE,iBACA,MACA,KACF;CAIA,OAAO,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EAAK,GAFAC,yBAAAA,mBAEM,EAAE,UAAU,SAAS;GAAE;GAAW;GAAY;GAAQ;EAAM,CAAC;EAAG,GAAI;CAAS,CAAA;AACjG,CAAC;AAED,cAAc,UAAUC,wBAAAA;AACxB,cAAc,cAAc"}

package/cjs/components/Combobox/ComboboxEventsTarget/ComboboxEventsTarget.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxEventsTarget.cjs","names":["factory","useProps","getSingleElementChild","useComboboxContext","useComboboxTargetProps","getRefProp"],"sources":["../../../../src/components/Combobox/ComboboxEventsTarget/ComboboxEventsTarget.tsx"],"sourcesContent":["import { cloneElement } from 'react';\nimport { useMergedRef } from '@mantine/hooks';\nimport { factory, Factory, getRefProp, getSingleElementChild, useProps } from '../../../core';\nimport { useComboboxContext } from '../Combobox.context';\nimport { useComboboxTargetProps } from '../use-combobox-target-props/use-combobox-target-props';\n\nexport interface ComboboxEventsTargetProps {\n  /** Target element */\n  children: React.ReactNode;\n\n  /** Key of the prop is used to access element ref */\n  refProp?: string;\n\n  /** If set, the component responds to the keyboard events @default true */\n  withKeyboardNavigation?: boolean;\n\n  /** If set, the target has `aria-` attributes @default true */\n  withAriaAttributes?: boolean;\n\n  /** If set, the target has `aria-expanded` attribute @default false */\n  withExpandedAttribute?: boolean;\n\n  /** Determines which events should be handled by the target element.\n   * `button` target type handles `Space` and `Enter` keys to toggle dropdown opened state.\n   * @default input\n   * */\n  targetType?: 'button' | 'input';\n\n  /** Input autocomplete attribute */\n  autoComplete?: string;\n}\n\nconst defaultProps = {\n  refProp: 'ref',\n  targetType: 'input',\n  withKeyboardNavigation: true,\n  withAriaAttributes: true,\n  withExpandedAttribute: false,\n  autoComplete: 'off',\n} satisfies Partial<ComboboxEventsTargetProps>;\n\nexport type ComboboxEventsTargetFactory = Factory<{\n  props: ComboboxEventsTargetProps;\n  ref: HTMLElement;\n  compound: true;\n}>;\n\nexport const ComboboxEventsTarget = factory<ComboboxEventsTargetFactory>((props) => {\n  const {\n    children,\n    refProp,\n    withKeyboardNavigation,\n    withAriaAttributes,\n    withExpandedAttribute,\n    targetType,\n    autoComplete,\n    ref,\n    ...others\n  } = useProps('ComboboxEventsTarget', defaultProps, props);\n\n  const child = getSingleElementChild(children);\n  if (!child) {\n    throw new Error(\n      'Combobox.EventsTarget component children should be an element or a component that accepts ref. Fragments, strings, numbers and other primitive values are not supported'\n    );\n  }\n\n  const ctx = useComboboxContext();\n  const targetProps = useComboboxTargetProps({\n    targetType,\n    withAriaAttributes,\n    withKeyboardNavigation,\n    withExpandedAttribute,\n    onKeyDown: (child.props as any).onKeyDown,\n    onClick: (child.props as any).onClick,\n    autoComplete,\n  });\n\n  return cloneElement(child, {\n    ...targetProps,\n    ...others,\n    [refProp]: useMergedRef(ref, ctx.store.targetRef, getRefProp(child)),\n  });\n});\n\nComboboxEventsTarget.displayName = '@mantine/core/ComboboxEventsTarget';\n"],"mappings":";;;;;;;;;;;AAgCA,MAAM,eAAe;CACnB,SAAS;CACT,YAAY;CACZ,wBAAwB;CACxB,oBAAoB;CACpB,uBAAuB;CACvB,cAAc;CACf;AAQD,MAAa,uBAAuBA,gBAAAA,SAAsC,UAAU;CAClF,MAAM,EACJ,UACA,SACA,wBACA,oBACA,uBACA,YACA,cACA,KACA,GAAG,WACDC,kBAAAA,SAAS,wBAAwB,cAAc,MAAM;CAEzD,MAAM,QAAQC,iCAAAA,sBAAsB,SAAS;AAC7C,KAAI,CAAC,MACH,OAAM,IAAI,MACR,0KACD;CAGH,MAAM,MAAMC,yBAAAA,oBAAoB;AAWhC,SAAA,GAAA,MAAA,cAAoB,OAAO;EACzB,GAXkBC,kCAAAA,uBAAuB;GACzC;GACA;GACA;GACA;GACA,WAAY,MAAM,MAAc;GAChC,SAAU,MAAM,MAAc;GAC9B;GACD,CAAC;EAIA,GAAG;GACF,WAAA,GAAA,eAAA,cAAuB,KAAK,IAAI,MAAM,WAAWC,qBAAAA,WAAW,MAAM,CAAC;EACrE,CAAC;EACF;AAEF,qBAAqB,cAAc"}
+{"version":3,"file":"ComboboxEventsTarget.cjs","names":["factory","useProps","getSingleElementChild","useComboboxContext","useComboboxTargetProps","getRefProp"],"sources":["../../../../src/components/Combobox/ComboboxEventsTarget/ComboboxEventsTarget.tsx"],"sourcesContent":["import { cloneElement } from 'react';\nimport { useMergedRef } from '@mantine/hooks';\nimport { factory, Factory, getRefProp, getSingleElementChild, useProps } from '../../../core';\nimport { useComboboxContext } from '../Combobox.context';\nimport { useComboboxTargetProps } from '../use-combobox-target-props/use-combobox-target-props';\n\nexport interface ComboboxEventsTargetProps {\n  /** Target element */\n  children: React.ReactNode;\n\n  /** Key of the prop is used to access element ref */\n  refProp?: string;\n\n  /** If set, the component responds to the keyboard events @default true */\n  withKeyboardNavigation?: boolean;\n\n  /** If set, the target has `aria-` attributes @default true */\n  withAriaAttributes?: boolean;\n\n  /** If set, the target has `aria-expanded` attribute @default false */\n  withExpandedAttribute?: boolean;\n\n  /** Determines which events should be handled by the target element.\n   * `button` target type handles `Space` and `Enter` keys to toggle dropdown opened state.\n   * @default input\n   * */\n  targetType?: 'button' | 'input';\n\n  /** Input autocomplete attribute */\n  autoComplete?: string;\n}\n\nconst defaultProps = {\n  refProp: 'ref',\n  targetType: 'input',\n  withKeyboardNavigation: true,\n  withAriaAttributes: true,\n  withExpandedAttribute: false,\n  autoComplete: 'off',\n} satisfies Partial<ComboboxEventsTargetProps>;\n\nexport type ComboboxEventsTargetFactory = Factory<{\n  props: ComboboxEventsTargetProps;\n  ref: HTMLElement;\n  compound: true;\n}>;\n\nexport const ComboboxEventsTarget = factory<ComboboxEventsTargetFactory>((props) => {\n  const {\n    children,\n    refProp,\n    withKeyboardNavigation,\n    withAriaAttributes,\n    withExpandedAttribute,\n    targetType,\n    autoComplete,\n    ref,\n    ...others\n  } = useProps('ComboboxEventsTarget', defaultProps, props);\n\n  const child = getSingleElementChild(children);\n  if (!child) {\n    throw new Error(\n      'Combobox.EventsTarget component children should be an element or a component that accepts ref. Fragments, strings, numbers and other primitive values are not supported'\n    );\n  }\n\n  const ctx = useComboboxContext();\n  const targetProps = useComboboxTargetProps({\n    targetType,\n    withAriaAttributes,\n    withKeyboardNavigation,\n    withExpandedAttribute,\n    onKeyDown: (child.props as any).onKeyDown,\n    onClick: (child.props as any).onClick,\n    autoComplete,\n  });\n\n  return cloneElement(child, {\n    ...targetProps,\n    ...others,\n    [refProp]: useMergedRef(ref, ctx.store.targetRef, getRefProp(child)),\n  });\n});\n\nComboboxEventsTarget.displayName = '@mantine/core/ComboboxEventsTarget';\n"],"mappings":";;;;;;;;;;;AAgCA,MAAM,eAAe;CACnB,SAAS;CACT,YAAY;CACZ,wBAAwB;CACxB,oBAAoB;CACpB,uBAAuB;CACvB,cAAc;AAChB;AAQA,MAAa,uBAAuBA,gBAAAA,SAAsC,UAAU;CAClF,MAAM,EACJ,UACA,SACA,wBACA,oBACA,uBACA,YACA,cACA,KACA,GAAG,WACDC,kBAAAA,SAAS,wBAAwB,cAAc,KAAK;CAExD,MAAM,QAAQC,iCAAAA,sBAAsB,QAAQ;CAC5C,IAAI,CAAC,OACH,MAAM,IAAI,MACR,yKACF;CAGF,MAAM,MAAMC,yBAAAA,mBAAmB;CAW/B,QAAA,GAAA,MAAA,cAAoB,OAAO;EACzB,GAXkBC,kCAAAA,uBAAuB;GACzC;GACA;GACA;GACA;GACA,WAAY,MAAM,MAAc;GAChC,SAAU,MAAM,MAAc;GAC9B;EACF,CAGe;EACb,GAAG;GACF,WAAA,GAAA,eAAA,cAAuB,KAAK,IAAI,MAAM,WAAWC,qBAAAA,WAAW,KAAK,CAAC;CACrE,CAAC;AACH,CAAC;AAED,qBAAqB,cAAc"}