@mantine/core 9.3.2 → 9.4.0

package/esm/components/PinInput/PinInput.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"PinInput.mjs","names":["useId","classes"],"sources":["../../../src/components/PinInput/PinInput.tsx"],"sourcesContent":["import { useRef, useState } from 'react';\nimport { assignRef, useId, useUncontrolled } from '@mantine/hooks';\nimport {\n  BoxProps,\n  createVarsResolver,\n  DataAttributes,\n  ElementProps,\n  Factory,\n  factory,\n  getSize,\n  MantineRadius,\n  MantineSize,\n  MantineSpacing,\n  StylesApiProps,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '../../core';\nimport { Group } from '../Group';\nimport { Input, InputProps } from '../Input';\nimport { InputBase } from '../InputBase';\nimport { createPinArray } from './create-pin-array/create-pin-array';\nimport classes from './PinInput.module.css';\n\nconst regex = {\n  number: /^[0-9]+$/,\n  alphanumeric: /^[a-zA-Z0-9]+$/i,\n};\n\nexport type PinInputStylesNames = 'root' | 'pinInput' | 'input';\n\nexport type PinInputCssVariables = {\n  root: '--pin-input-size';\n};\n\nexport interface PinInputProps\n  extends BoxProps, StylesApiProps<PinInputFactory>, ElementProps<'div', 'onChange' | 'ref'> {\n  ref?: React.Ref<HTMLInputElement>;\n\n  /** Hidden input `name` attribute */\n  name?: string;\n\n  /** Hidden input `form` attribute */\n  form?: string;\n\n  /** Key of `theme.spacing` or any valid CSS value to set `gap` between inputs, numbers are converted to rem @default 'md' */\n  gap?: MantineSpacing;\n\n  /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem @default theme.defaultRadius */\n  radius?: MantineRadius;\n\n  /** Controls inputs `width` and `height` @default 'sm' */\n  size?: MantineSize;\n\n  /** If set, the first input is focused when component is mounted @default false */\n  autoFocus?: boolean;\n\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 all inputs have value */\n  onComplete?: (value: string) => void;\n\n  /** Inputs placeholder @default '○' */\n  placeholder?: string;\n\n  /** Determines whether focus should be moved automatically to the next input once filled @default true */\n  manageFocus?: boolean;\n\n  /** Determines whether `autocomplete=\"one-time-code\"` attribute should be set on all inputs @default true */\n  oneTimeCode?: boolean;\n\n  /** Base id used to generate unique ids for inputs */\n  id?: string;\n\n  /** Adds disabled attribute to all inputs */\n  disabled?: boolean;\n\n  /** Sets `aria-invalid` attribute and applies error styles to all inputs */\n  error?: boolean;\n\n  /** Determines which values can be entered @default 'alphanumeric' */\n  type?: 'alphanumeric' | 'number' | RegExp;\n\n  /** Changes input type to `\"password\"` @default false */\n  mask?: boolean;\n\n  /** Number of inputs @default 4 */\n  length?: number;\n\n  /** If set, the user cannot edit the value */\n  readOnly?: boolean;\n\n  /** Inputs `type` attribute, inferred from the `type` prop if not specified */\n  inputType?: React.HTMLInputTypeAttribute;\n\n  /** `inputmode` attribute, inferred from the `type` prop if not specified */\n  inputMode?:\n    | 'none'\n    | 'text'\n    | 'tel'\n    | 'url'\n    | 'email'\n    | 'numeric'\n    | 'decimal'\n    | 'search'\n    | undefined;\n\n  /** `aria-label` attribute */\n  ariaLabel?: string;\n\n  /** Props passed down to the hidden input */\n  hiddenInputProps?: React.ComponentProps<'input'>;\n\n  /** Assigns ref of the root element */\n  rootRef?: React.Ref<HTMLDivElement>;\n\n  /** Props added to the input element depending on its index */\n  getInputProps?: (index: number) => InputProps & ElementProps<'input', 'size'> & DataAttributes;\n}\n\nexport type PinInputFactory = Factory<{\n  props: PinInputProps;\n  ref: HTMLDivElement;\n  stylesNames: PinInputStylesNames;\n  vars: PinInputCssVariables;\n}>;\n\nconst defaultProps = {\n  gap: 'sm',\n  length: 4,\n  manageFocus: true,\n  oneTimeCode: true,\n  placeholder: '○',\n  type: 'alphanumeric',\n  ariaLabel: 'PinInput',\n  size: 'sm',\n} satisfies Partial<PinInputProps>;\n\nconst varsResolver = createVarsResolver<PinInputFactory>((_, { size }) => ({\n  root: {\n    '--pin-input-size': getSize(size ?? 'sm', 'pin-input-size'),\n  },\n}));\n\nexport const PinInput = factory<PinInputFactory>((props) => {\n  const {\n    name,\n    form,\n    className,\n    value,\n    defaultValue,\n    variant,\n    gap,\n    style,\n    size,\n    classNames,\n    styles,\n    unstyled,\n    length,\n    onChange,\n    onComplete,\n    manageFocus,\n    autoFocus,\n    error,\n    radius,\n    disabled,\n    oneTimeCode,\n    placeholder,\n    type,\n    mask,\n    readOnly,\n    inputType,\n    inputMode,\n    ariaLabel,\n    vars,\n    id,\n    hiddenInputProps,\n    rootRef,\n    getInputProps,\n    attributes,\n    ref,\n    ...others\n  } = useProps(['Input', 'PinInput'], defaultProps, props);\n\n  const uuid = useId(id);\n\n  const getStyles = useStyles<PinInputFactory>({\n    name: 'PinInput',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<PinInputFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  const [focusedIndex, setFocusedIndex] = useState(-1);\n  const inputsRef = useRef<Array<HTMLInputElement>>([]);\n  const currentLength = length ?? 4;\n\n  const completedRef = useRef(false);\n\n  const [_value, setValues] = useUncontrolled<string[]>({\n    value: value !== undefined ? createPinArray(currentLength, value) : undefined,\n    defaultValue: defaultValue?.split('').slice(0, currentLength),\n    finalValue: createPinArray(currentLength, ''),\n    onChange: (val) => {\n      const stringValue = val.join('').trim();\n      onChange?.(stringValue);\n      if (stringValue.length === currentLength && !completedRef.current) {\n        completedRef.current = true;\n        onComplete?.(stringValue);\n      } else if (stringValue.length < currentLength) {\n        completedRef.current = false;\n      }\n    },\n  });\n\n  const currentValue =\n    _value.length !== currentLength ? createPinArray(currentLength, _value.join('')) : _value;\n\n  const _valueToString = currentValue.join('').trim();\n\n  const validate = (code: string) => {\n    const re = type instanceof RegExp ? type : type && type in regex ? regex[type] : null;\n    return re?.test(code);\n  };\n\n  const focusInputField = (dir: 'next' | 'prev', index: number) => {\n    if (!manageFocus) {\n      return;\n    }\n\n    if (dir === 'next') {\n      const nextIndex = index + 1;\n      if (nextIndex < currentLength) {\n        inputsRef.current[nextIndex]?.focus();\n      }\n    } else if (dir === 'prev') {\n      const prevIndex = index - 1;\n      if (prevIndex >= 0) {\n        inputsRef.current[prevIndex]?.focus();\n      }\n    }\n  };\n\n  const setFieldValue = (val: string, index: number) => {\n    const values = [...currentValue];\n    values[index] = val;\n    setValues(values);\n    return values;\n  };\n\n  const handleChange = (event: React.ChangeEvent<HTMLInputElement>, index: number) => {\n    const inputValue = event.target.value;\n\n    if (inputValue.length > 1) {\n      const isPaste = inputValue.length > 2;\n      if (isPaste) {\n        const isValid = validate(inputValue);\n        if (isValid) {\n          setValues(createPinArray(currentLength, inputValue));\n          const filledCount = Math.min(inputValue.length, currentLength);\n          if (filledCount < currentLength) {\n            focusInputField('next', filledCount - 1);\n          }\n        }\n        return;\n      }\n\n      const newChar = inputValue.split('')[inputValue.length - 1];\n      if (validate(newChar)) {\n        setFieldValue(newChar, index);\n        focusInputField('next', index);\n      }\n      return;\n    }\n\n    if (inputValue.length === 1) {\n      if (validate(inputValue)) {\n        setFieldValue(inputValue, index);\n        focusInputField('next', index);\n      } else {\n        setFieldValue('', index);\n      }\n    } else if (inputValue.length === 0) {\n      setFieldValue('', index);\n    }\n  };\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>, index: number) => {\n    const { ctrlKey, metaKey, key, shiftKey, target } = event;\n    const inputValue = (target as HTMLInputElement).value;\n\n    if (inputMode === 'numeric') {\n      const allowedKeys = ['Backspace', 'Tab', 'Control', 'Delete', 'ArrowLeft', 'ArrowRight'];\n      const isModifierShortcut = ctrlKey || metaKey;\n      const isAllowedKey =\n        allowedKeys.includes(key) || isModifierShortcut || !Number.isNaN(Number(key));\n\n      if (!isAllowedKey) {\n        event.preventDefault();\n        return;\n      }\n    }\n\n    switch (key) {\n      case 'ArrowLeft':\n        event.preventDefault();\n        focusInputField('prev', index);\n        break;\n\n      case 'ArrowRight':\n        event.preventDefault();\n        focusInputField('next', index);\n        break;\n\n      case 'Tab':\n        if (shiftKey) {\n          if (index > 0 && manageFocus) {\n            event.preventDefault();\n            focusInputField('prev', index);\n          }\n        }\n        break;\n\n      case ' ':\n        event.preventDefault();\n        focusInputField('next', index);\n        break;\n\n      case 'Delete':\n        event.preventDefault();\n        setFieldValue('', index);\n        break;\n\n      case 'Backspace':\n        if (inputValue === '') {\n          event.preventDefault();\n          focusInputField('prev', index);\n        } else {\n          setFieldValue('', index);\n          if (index < currentLength - 1) {\n            event.preventDefault();\n            focusInputField('prev', index);\n          }\n        }\n        break;\n\n      default:\n        if (inputValue.length > 0 && key === currentValue[index]) {\n          event.preventDefault();\n          focusInputField('next', index);\n        }\n    }\n  };\n\n  const handleFocus = (event: React.FocusEvent<HTMLInputElement>, index: number) => {\n    event.target.select();\n    setFocusedIndex(index);\n  };\n\n  const handleBlur = () => {\n    setFocusedIndex(-1);\n  };\n\n  const handlePaste = (event: React.ClipboardEvent<HTMLInputElement>) => {\n    event.preventDefault();\n    const pasteData = event.clipboardData.getData('text/plain').replace(/[\\n\\r\\s]+/g, '');\n    const isValid = validate(pasteData.trim());\n\n    if (isValid) {\n      const pasteArray = createPinArray(currentLength, pasteData);\n      setValues(pasteArray);\n      const filledCount = pasteArray.filter((val) => val !== '').length;\n      if (filledCount >= currentLength) {\n        inputsRef.current[currentLength - 1]?.focus();\n      } else {\n        inputsRef.current[filledCount]?.focus();\n      }\n    }\n  };\n\n  return (\n    <>\n      <Group\n        {...others}\n        {...getStyles('root')}\n        ref={rootRef}\n        role=\"group\"\n        id={uuid}\n        gap={gap}\n        unstyled={unstyled}\n        wrap=\"nowrap\"\n        variant={variant}\n        __size={size}\n        dir=\"ltr\"\n      >\n        {currentValue.map((char: string, index: number) => (\n          <Input\n            component=\"input\"\n            {...getStyles('pinInput', {\n              style: {\n                '--input-padding': '0',\n                '--input-text-align': 'center',\n              } as React.CSSProperties,\n            })}\n            classNames={resolvedClassNames}\n            styles={resolvedStyles}\n            size={size}\n            __staticSelector=\"PinInput\"\n            id={`${uuid}-${index + 1}`}\n            key={`${uuid}-${index}`}\n            inputMode={inputMode || (type === 'number' ? 'numeric' : 'text')}\n            onChange={(event) => handleChange(event, index)}\n            onKeyDown={(event) => handleKeyDown(event, index)}\n            onFocus={(event) => handleFocus(event, index)}\n            onBlur={handleBlur}\n            onPaste={handlePaste}\n            type={inputType || (mask ? 'password' : type === 'number' ? 'tel' : 'text')}\n            radius={radius}\n            error={error}\n            variant={variant}\n            disabled={disabled}\n            ref={(node) => {\n              if (node) {\n                index === 0 && assignRef(ref, node);\n                inputsRef.current[index] = node;\n              }\n            }}\n            autoComplete={oneTimeCode ? 'one-time-code' : 'off'}\n            placeholder={focusedIndex === index ? '' : placeholder}\n            value={char}\n            autoFocus={autoFocus && index === 0}\n            unstyled={unstyled}\n            aria-label={ariaLabel}\n            readOnly={readOnly}\n            {...getInputProps?.(index)}\n          />\n        ))}\n      </Group>\n\n      <input type=\"hidden\" name={name} form={form} value={_valueToString} {...hiddenInputProps} />\n    </>\n  );\n});\n\nPinInput.classes = { ...classes, ...InputBase.classes };\nPinInput.varsResolver = varsResolver;\nPinInput.displayName = '@mantine/core/PinInput';\n\nexport namespace PinInput {\n  export type Props = PinInputProps;\n  export type StylesNames = PinInputStylesNames;\n  export type Factory = PinInputFactory;\n}\n"],"mappings":"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"}
+{"version":3,"file":"PinInput.mjs","names":["useId","classes"],"sources":["../../../src/components/PinInput/PinInput.tsx"],"sourcesContent":["import { useRef, useState } from 'react';\nimport { assignRef, useId, useUncontrolled } from '@mantine/hooks';\nimport {\n  BoxProps,\n  createVarsResolver,\n  DataAttributes,\n  ElementProps,\n  Factory,\n  factory,\n  getSize,\n  MantineRadius,\n  MantineSize,\n  MantineSpacing,\n  StylesApiProps,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '../../core';\nimport { Group } from '../Group';\nimport { Input, InputProps } from '../Input';\nimport { InputBase } from '../InputBase';\nimport { createPinArray } from './create-pin-array/create-pin-array';\nimport classes from './PinInput.module.css';\n\nconst regex = {\n  number: /^[0-9]+$/,\n  alphanumeric: /^[a-zA-Z0-9]+$/i,\n};\n\nexport type PinInputStylesNames = 'root' | 'pinInput' | 'input';\n\nexport type PinInputCssVariables = {\n  root: '--pin-input-size';\n};\n\nexport interface PinInputProps\n  extends BoxProps, StylesApiProps<PinInputFactory>, ElementProps<'div', 'onChange' | 'ref'> {\n  ref?: React.Ref<HTMLInputElement>;\n\n  /** Hidden input `name` attribute */\n  name?: string;\n\n  /** Hidden input `form` attribute */\n  form?: string;\n\n  /** Key of `theme.spacing` or any valid CSS value to set `gap` between inputs, numbers are converted to rem @default 'md' */\n  gap?: MantineSpacing;\n\n  /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem @default theme.defaultRadius */\n  radius?: MantineRadius;\n\n  /** Controls inputs `width` and `height` @default 'sm' */\n  size?: MantineSize;\n\n  /** If set, the first input is focused when component is mounted @default false */\n  autoFocus?: boolean;\n\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 all inputs have value */\n  onComplete?: (value: string) => void;\n\n  /** Inputs placeholder @default '○' */\n  placeholder?: string;\n\n  /** Determines whether focus should be moved automatically to the next input once filled @default true */\n  manageFocus?: boolean;\n\n  /** Determines whether `autocomplete=\"one-time-code\"` attribute should be set on all inputs @default true */\n  oneTimeCode?: boolean;\n\n  /** Base id used to generate unique ids for inputs */\n  id?: string;\n\n  /** Adds disabled attribute to all inputs */\n  disabled?: boolean;\n\n  /** Sets `aria-invalid` attribute and applies error styles to all inputs */\n  error?: boolean;\n\n  /** Applies success styles to all inputs */\n  success?: boolean;\n\n  /** Determines which values can be entered @default 'alphanumeric' */\n  type?: 'alphanumeric' | 'number' | RegExp;\n\n  /** Changes input type to `\"password\"` @default false */\n  mask?: boolean;\n\n  /** Number of inputs @default 4 */\n  length?: number;\n\n  /** If set, the user cannot edit the value */\n  readOnly?: boolean;\n\n  /** Inputs `type` attribute, inferred from the `type` prop if not specified */\n  inputType?: React.HTMLInputTypeAttribute;\n\n  /** `inputmode` attribute, inferred from the `type` prop if not specified */\n  inputMode?:\n    | 'none'\n    | 'text'\n    | 'tel'\n    | 'url'\n    | 'email'\n    | 'numeric'\n    | 'decimal'\n    | 'search'\n    | undefined;\n\n  /** `aria-label` attribute */\n  ariaLabel?: string;\n\n  /** Props passed down to the hidden input */\n  hiddenInputProps?: React.ComponentProps<'input'>;\n\n  /** Assigns ref of the root element */\n  rootRef?: React.Ref<HTMLDivElement>;\n\n  /** Props added to the input element depending on its index */\n  getInputProps?: (index: number) => InputProps & ElementProps<'input', 'size'> & DataAttributes;\n}\n\nexport type PinInputFactory = Factory<{\n  props: PinInputProps;\n  ref: HTMLDivElement;\n  stylesNames: PinInputStylesNames;\n  vars: PinInputCssVariables;\n}>;\n\nconst defaultProps = {\n  gap: 'sm',\n  length: 4,\n  manageFocus: true,\n  oneTimeCode: true,\n  placeholder: '○',\n  type: 'alphanumeric',\n  ariaLabel: 'PinInput',\n  size: 'sm',\n} satisfies Partial<PinInputProps>;\n\nconst varsResolver = createVarsResolver<PinInputFactory>((_, { size }) => ({\n  root: {\n    '--pin-input-size': getSize(size ?? 'sm', 'pin-input-size'),\n  },\n}));\n\nexport const PinInput = factory<PinInputFactory>((props) => {\n  const {\n    name,\n    form,\n    className,\n    value,\n    defaultValue,\n    variant,\n    gap,\n    style,\n    size,\n    classNames,\n    styles,\n    unstyled,\n    length,\n    onChange,\n    onComplete,\n    manageFocus,\n    autoFocus,\n    error,\n    success,\n    radius,\n    disabled,\n    oneTimeCode,\n    placeholder,\n    type,\n    mask,\n    readOnly,\n    inputType,\n    inputMode,\n    ariaLabel,\n    vars,\n    id,\n    hiddenInputProps,\n    rootRef,\n    getInputProps,\n    attributes,\n    ref,\n    ...others\n  } = useProps(['Input', 'PinInput'], defaultProps, props);\n\n  const uuid = useId(id);\n\n  const getStyles = useStyles<PinInputFactory>({\n    name: 'PinInput',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<PinInputFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  const [focusedIndex, setFocusedIndex] = useState(-1);\n  const inputsRef = useRef<Array<HTMLInputElement>>([]);\n  const currentLength = length ?? 4;\n\n  const completedRef = useRef(false);\n\n  const [_value, setValues] = useUncontrolled<string[]>({\n    value: value !== undefined ? createPinArray(currentLength, value) : undefined,\n    defaultValue: defaultValue?.split('').slice(0, currentLength),\n    finalValue: createPinArray(currentLength, ''),\n    onChange: (val) => {\n      const stringValue = val.join('').trim();\n      onChange?.(stringValue);\n      if (stringValue.length === currentLength && !completedRef.current) {\n        completedRef.current = true;\n        onComplete?.(stringValue);\n      } else if (stringValue.length < currentLength) {\n        completedRef.current = false;\n      }\n    },\n  });\n\n  const currentValue =\n    _value.length !== currentLength ? createPinArray(currentLength, _value.join('')) : _value;\n\n  const _valueToString = currentValue.join('').trim();\n\n  const validate = (code: string) => {\n    const re = type instanceof RegExp ? type : type && type in regex ? regex[type] : null;\n    return re?.test(code);\n  };\n\n  const focusInputField = (dir: 'next' | 'prev', index: number) => {\n    if (!manageFocus) {\n      return;\n    }\n\n    if (dir === 'next') {\n      const nextIndex = index + 1;\n      if (nextIndex < currentLength) {\n        inputsRef.current[nextIndex]?.focus();\n      }\n    } else if (dir === 'prev') {\n      const prevIndex = index - 1;\n      if (prevIndex >= 0) {\n        inputsRef.current[prevIndex]?.focus();\n      }\n    }\n  };\n\n  const setFieldValue = (val: string, index: number) => {\n    const values = [...currentValue];\n    values[index] = val;\n    setValues(values);\n    return values;\n  };\n\n  const handleChange = (event: React.ChangeEvent<HTMLInputElement>, index: number) => {\n    const inputValue = event.target.value;\n\n    if (inputValue.length > 1) {\n      const isPaste = inputValue.length > 2;\n      if (isPaste) {\n        const isValid = validate(inputValue);\n        if (isValid) {\n          setValues(createPinArray(currentLength, inputValue));\n          const filledCount = Math.min(inputValue.length, currentLength);\n          if (filledCount < currentLength) {\n            focusInputField('next', filledCount - 1);\n          }\n        }\n        return;\n      }\n\n      const newChar = inputValue.split('')[inputValue.length - 1];\n      if (validate(newChar)) {\n        setFieldValue(newChar, index);\n        focusInputField('next', index);\n      }\n      return;\n    }\n\n    if (inputValue.length === 1) {\n      if (validate(inputValue)) {\n        setFieldValue(inputValue, index);\n        focusInputField('next', index);\n      } else {\n        setFieldValue('', index);\n      }\n    } else if (inputValue.length === 0) {\n      setFieldValue('', index);\n    }\n  };\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>, index: number) => {\n    const { ctrlKey, metaKey, key, shiftKey, target } = event;\n    const inputValue = (target as HTMLInputElement).value;\n\n    if (inputMode === 'numeric') {\n      const allowedKeys = ['Backspace', 'Tab', 'Control', 'Delete', 'ArrowLeft', 'ArrowRight'];\n      const isModifierShortcut = ctrlKey || metaKey;\n      const isAllowedKey =\n        allowedKeys.includes(key) || isModifierShortcut || !Number.isNaN(Number(key));\n\n      if (!isAllowedKey) {\n        event.preventDefault();\n        return;\n      }\n    }\n\n    switch (key) {\n      case 'ArrowLeft':\n        event.preventDefault();\n        focusInputField('prev', index);\n        break;\n\n      case 'ArrowRight':\n        event.preventDefault();\n        focusInputField('next', index);\n        break;\n\n      case 'Tab':\n        if (shiftKey) {\n          if (index > 0 && manageFocus) {\n            event.preventDefault();\n            focusInputField('prev', index);\n          }\n        }\n        break;\n\n      case ' ':\n        event.preventDefault();\n        focusInputField('next', index);\n        break;\n\n      case 'Delete':\n        event.preventDefault();\n        setFieldValue('', index);\n        break;\n\n      case 'Backspace':\n        if (inputValue === '') {\n          event.preventDefault();\n          focusInputField('prev', index);\n        } else {\n          setFieldValue('', index);\n          if (index < currentLength - 1) {\n            event.preventDefault();\n            focusInputField('prev', index);\n          }\n        }\n        break;\n\n      default:\n        if (inputValue.length > 0 && key === currentValue[index]) {\n          event.preventDefault();\n          focusInputField('next', index);\n        }\n    }\n  };\n\n  const handleFocus = (event: React.FocusEvent<HTMLInputElement>, index: number) => {\n    event.target.select();\n    setFocusedIndex(index);\n  };\n\n  const handleBlur = () => {\n    setFocusedIndex(-1);\n  };\n\n  const handlePaste = (event: React.ClipboardEvent<HTMLInputElement>) => {\n    event.preventDefault();\n    const pasteData = event.clipboardData.getData('text/plain').replace(/[\\n\\r\\s]+/g, '');\n    const isValid = validate(pasteData.trim());\n\n    if (isValid) {\n      const pasteArray = createPinArray(currentLength, pasteData);\n      setValues(pasteArray);\n      const filledCount = pasteArray.filter((val) => val !== '').length;\n      if (filledCount >= currentLength) {\n        inputsRef.current[currentLength - 1]?.focus();\n      } else {\n        inputsRef.current[filledCount]?.focus();\n      }\n    }\n  };\n\n  return (\n    <>\n      <Group\n        {...others}\n        {...getStyles('root')}\n        ref={rootRef}\n        role=\"group\"\n        id={uuid}\n        gap={gap}\n        unstyled={unstyled}\n        wrap=\"nowrap\"\n        variant={variant}\n        __size={size}\n        dir=\"ltr\"\n      >\n        {currentValue.map((char: string, index: number) => (\n          <Input\n            component=\"input\"\n            {...getStyles('pinInput', {\n              style: {\n                '--input-padding': '0',\n                '--input-text-align': 'center',\n              } as React.CSSProperties,\n            })}\n            classNames={resolvedClassNames}\n            styles={resolvedStyles}\n            size={size}\n            __staticSelector=\"PinInput\"\n            id={`${uuid}-${index + 1}`}\n            key={`${uuid}-${index}`}\n            inputMode={inputMode || (type === 'number' ? 'numeric' : 'text')}\n            onChange={(event) => handleChange(event, index)}\n            onKeyDown={(event) => handleKeyDown(event, index)}\n            onFocus={(event) => handleFocus(event, index)}\n            onBlur={handleBlur}\n            onPaste={handlePaste}\n            type={inputType || (mask ? 'password' : type === 'number' ? 'tel' : 'text')}\n            radius={radius}\n            error={error}\n            success={success}\n            variant={variant}\n            disabled={disabled}\n            ref={(node) => {\n              if (node) {\n                index === 0 && assignRef(ref, node);\n                inputsRef.current[index] = node;\n              }\n            }}\n            autoComplete={oneTimeCode ? 'one-time-code' : 'off'}\n            placeholder={focusedIndex === index ? '' : placeholder}\n            value={char}\n            autoFocus={autoFocus && index === 0}\n            unstyled={unstyled}\n            aria-label={ariaLabel}\n            readOnly={readOnly}\n            {...getInputProps?.(index)}\n          />\n        ))}\n      </Group>\n\n      <input type=\"hidden\" name={name} form={form} value={_valueToString} {...hiddenInputProps} />\n    </>\n  );\n});\n\nPinInput.classes = { ...classes, ...InputBase.classes };\nPinInput.varsResolver = varsResolver;\nPinInput.displayName = '@mantine/core/PinInput';\n\nexport namespace PinInput {\n  export type Props = PinInputProps;\n  export type StylesNames = PinInputStylesNames;\n  export type Factory = PinInputFactory;\n}\n"],"mappings":"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"}

package/esm/components/PinInput/create-pin-array/create-pin-array.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"create-pin-array.mjs","names":[],"sources":["../../../../src/components/PinInput/create-pin-array/create-pin-array.ts"],"sourcesContent":["export function createPinArray(length: number, value: string): string[] {\n  if (length < 1) {\n    return [];\n  }\n\n  const values = new Array<string>(length).fill('');\n\n  if (value) {\n    const splitted = value.trim().split('');\n    for (let i = 0; i < Math.min(length, splitted.length); i += 1) {\n      values[i] = splitted[i] === ' ' ? '' : splitted[i];\n    }\n  }\n\n  return values;\n}\n"],"mappings":";;AAAA,SAAgB,eAAe,QAAgB,OAAyB;CACtE,IAAI,SAAS,GACX,OAAO,CAAC;CAGV,MAAM,SAAS,IAAI,MAAc,MAAM,EAAE,KAAK,EAAE;CAEhD,IAAI,OAAO;EACT,MAAM,WAAW,MAAM,KAAK,EAAE,MAAM,EAAE;EACtC,KAAK,IAAI,IAAI,GAAG,IAAI,KAAK,IAAI,QAAQ,SAAS,MAAM,GAAG,KAAK,GAC1D,OAAO,KAAK,SAAS,OAAO,MAAM,KAAK,SAAS;CAEpD;CAEA,OAAO;AACT"}
+{"version":3,"file":"create-pin-array.mjs","names":[],"sources":["../../../../src/components/PinInput/create-pin-array/create-pin-array.ts"],"sourcesContent":["export function createPinArray(length: number, value: string): string[] {\n  if (length < 1) {\n    return [];\n  }\n\n  const values = new Array<string>(length).fill('');\n\n  if (value) {\n    const splitted = value.trim().split('');\n    for (let i = 0; i < Math.min(length, splitted.length); i += 1) {\n      values[i] = splitted[i] === ' ' ? '' : splitted[i];\n    }\n  }\n\n  return values;\n}\n"],"mappings":";;AAAA,SAAgB,eAAe,QAAgB,OAAyB;CACtE,IAAI,SAAS,GACX,OAAO,CAAC;CAGV,MAAM,SAAS,IAAI,MAAc,MAAM,CAAC,CAAC,KAAK,EAAE;CAEhD,IAAI,OAAO;EACT,MAAM,WAAW,MAAM,KAAK,CAAC,CAAC,MAAM,EAAE;EACtC,KAAK,IAAI,IAAI,GAAG,IAAI,KAAK,IAAI,QAAQ,SAAS,MAAM,GAAG,KAAK,GAC1D,OAAO,KAAK,SAAS,OAAO,MAAM,KAAK,SAAS;CAEpD;CAEA,OAAO;AACT"}

package/esm/components/Popover/use-popover.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-popover.mjs","names":[],"sources":["../../../src/components/Popover/use-popover.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react';\nimport {\n  arrow,\n  autoUpdate,\n  flip,\n  hide,\n  inline,\n  limitShift,\n  Middleware,\n  offset,\n  shift,\n  size,\n  useFloating,\n  UseFloatingReturn,\n} from '@floating-ui/react';\nimport { useDidUpdate, useIsomorphicEffect, useUncontrolled } from '@mantine/hooks';\nimport { FloatingAxesOffsets, FloatingPosition, FloatingStrategy } from '../../utils/Floating';\nimport { PopoverMiddlewares, PopoverWidth } from './Popover.types';\n\ninterface UsePopoverOptions {\n  offset: number | FloatingAxesOffsets;\n  position: FloatingPosition;\n  onPositionChange?: (position: FloatingPosition) => void;\n  opened: boolean | undefined;\n  defaultOpened: boolean | undefined;\n  onChange?: (opened: boolean) => void;\n  onClose?: () => void;\n  onDismiss?: () => void;\n  onOpen?: () => void;\n  width: PopoverWidth;\n  middlewares: PopoverMiddlewares | undefined;\n  arrowRef: React.RefObject<HTMLDivElement | null>;\n  arrowOffset: number;\n  strategy?: FloatingStrategy;\n  disabled: boolean | undefined;\n  preventPositionChangeWhenVisible: boolean | undefined;\n  keepMounted: boolean | undefined;\n}\n\nfunction getDefaultMiddlewares(middlewares: PopoverMiddlewares | undefined): PopoverMiddlewares {\n  if (middlewares === undefined) {\n    return { shift: true, flip: true };\n  }\n\n  const result = { ...middlewares };\n  if (middlewares.shift === undefined) {\n    result.shift = true;\n  }\n\n  if (middlewares.flip === undefined) {\n    result.flip = true;\n  }\n\n  return result;\n}\n\nfunction getPopoverMiddlewares(\n  options: UsePopoverOptions,\n  getFloating: () => UseFloatingReturn<Element>,\n  disableFlip: boolean,\n  lockEnabled: boolean\n) {\n  const middlewaresOptions = getDefaultMiddlewares(options.middlewares);\n  const middlewares: Middleware[] = [offset(options.offset), hide()];\n\n  if (middlewaresOptions.flip && !disableFlip) {\n    const userFlip = typeof middlewaresOptions.flip === 'boolean' ? {} : middlewaresOptions.flip;\n    const flipOptions = lockEnabled\n      ? { fallbackStrategy: 'initialPlacement' as const, ...userFlip }\n      : userFlip;\n    middlewares.push(flip(flipOptions));\n  }\n\n  if (middlewaresOptions.shift) {\n    const shiftOptions =\n      typeof middlewaresOptions.shift === 'boolean' ? {} : middlewaresOptions.shift;\n    middlewares.push(\n      shift((state) => {\n        const isVerticalPlacement =\n          state.placement.startsWith('top') || state.placement.startsWith('bottom');\n        return {\n          limiter: limitShift(),\n          padding: 5,\n          ...(options.width === 'target' && isVerticalPlacement ? { mainAxis: false } : null),\n          ...shiftOptions,\n        };\n      })\n    );\n  }\n\n  if (middlewaresOptions.inline) {\n    middlewares.push(\n      typeof middlewaresOptions.inline === 'boolean' ? inline() : inline(middlewaresOptions.inline)\n    );\n  }\n\n  middlewares.push(arrow({ element: options.arrowRef, padding: options.arrowOffset }));\n\n  if (middlewaresOptions.size || options.width === 'target') {\n    middlewares.push(\n      size({\n        ...(typeof middlewaresOptions.size === 'boolean' ? {} : middlewaresOptions.size),\n        apply({ rects, availableWidth, availableHeight, ...rest }) {\n          const floating = getFloating();\n          const styles = floating.refs.floating.current?.style ?? {};\n\n          if (middlewaresOptions.size) {\n            // If custom apply function is given use that else set defaults\n            if (typeof middlewaresOptions.size === 'object' && !!middlewaresOptions.size.apply) {\n              middlewaresOptions.size.apply({ rects, availableWidth, availableHeight, ...rest });\n            } else {\n              Object.assign(styles, {\n                maxWidth: `${availableWidth}px`,\n                maxHeight: `${availableHeight}px`,\n              });\n            }\n          }\n\n          if (options.width === 'target') {\n            Object.assign(styles, {\n              width: `${rects.reference.width}px`,\n            });\n          }\n        },\n      })\n    );\n  }\n\n  return middlewares;\n}\n\nexport function usePopover(options: UsePopoverOptions) {\n  const [_opened, setOpened] = useUncontrolled({\n    value: options.opened,\n    defaultValue: options.defaultOpened,\n    finalValue: false,\n    onChange: options.onChange,\n  });\n\n  const previouslyOpened = useRef(_opened);\n\n  const [lockedPlacement, setLockedPlacement] = useState<FloatingPosition | null>(null);\n  const lockEnabled = options.preventPositionChangeWhenVisible !== false;\n\n  const wasOpenedRef = useRef(_opened);\n  if (_opened !== wasOpenedRef.current) {\n    wasOpenedRef.current = _opened;\n    if (_opened && lockedPlacement !== null) {\n      setLockedPlacement(null);\n    }\n  }\n\n  const resetLockedPlacement = useCallback(() => setLockedPlacement(null), []);\n\n  const onClose = () => {\n    if (_opened && !options.disabled) {\n      setOpened(false);\n    }\n  };\n\n  const onToggle = () => {\n    if (!options.disabled) {\n      setOpened(!_opened);\n    }\n  };\n\n  const floating: UseFloatingReturn<Element> = useFloating({\n    open: _opened,\n    strategy: options.strategy,\n    placement: lockEnabled ? (lockedPlacement ?? options.position) : options.position,\n    middleware: getPopoverMiddlewares(\n      options,\n      () => floating,\n      lockEnabled && lockedPlacement !== null,\n      lockEnabled\n    ),\n    whileElementsMounted: !options.keepMounted ? autoUpdate : undefined,\n  });\n\n  useEffect(() => {\n    if (!options.keepMounted) {\n      return undefined;\n    }\n\n    const referenceElement = floating.refs.reference.current;\n    const floatingElement = floating.refs.floating.current;\n\n    if (_opened && referenceElement && floatingElement) {\n      return autoUpdate(referenceElement, floatingElement, floating.update);\n    }\n\n    return undefined;\n  }, [\n    options.keepMounted,\n    _opened,\n    floating.update,\n    floating.elements.reference,\n    floating.elements.floating,\n  ]);\n\n  const measuredAfterShowRef = useRef(false);\n\n  useIsomorphicEffect(() => {\n    if (!_opened) {\n      measuredAfterShowRef.current = false;\n      return;\n    }\n\n    if (!lockEnabled || lockedPlacement !== null) {\n      return;\n    }\n\n    const flEl = floating.refs.floating.current as HTMLElement | null;\n    if (!flEl || flEl.offsetHeight === 0 || flEl.offsetWidth === 0) {\n      return;\n    }\n\n    if (!measuredAfterShowRef.current) {\n      measuredAfterShowRef.current = true;\n      floating.update();\n      return;\n    }\n\n    if (floating.isPositioned) {\n      setLockedPlacement(floating.placement);\n    }\n  }, [\n    lockEnabled,\n    _opened,\n    floating.isPositioned,\n    floating.placement,\n    lockedPlacement,\n    floating.update,\n  ]);\n\n  const previousPlacementRef = useRef(floating.placement);\n  useIsomorphicEffect(() => {\n    if (previousPlacementRef.current !== floating.placement) {\n      previousPlacementRef.current = floating.placement;\n      options.onPositionChange?.(floating.placement);\n    }\n  }, [floating.placement]);\n\n  useDidUpdate(() => {\n    if (_opened !== previouslyOpened.current) {\n      if (!_opened) {\n        options.onClose?.();\n      } else {\n        options.onOpen?.();\n      }\n    }\n\n    previouslyOpened.current = _opened;\n  }, [_opened, options.onClose, options.onOpen]);\n\n  return {\n    floating,\n    controlled: typeof options.opened === 'boolean',\n    opened: _opened,\n    onClose,\n    onToggle,\n    resetLockedPlacement,\n  };\n}\n"],"mappings":"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"}
+{"version":3,"file":"use-popover.mjs","names":[],"sources":["../../../src/components/Popover/use-popover.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react';\nimport {\n  arrow,\n  autoUpdate,\n  flip,\n  hide,\n  inline,\n  limitShift,\n  Middleware,\n  offset,\n  shift,\n  size,\n  useFloating,\n  UseFloatingReturn,\n} from '@floating-ui/react';\nimport { useDidUpdate, useIsomorphicEffect, useUncontrolled } from '@mantine/hooks';\nimport { FloatingAxesOffsets, FloatingPosition, FloatingStrategy } from '../../utils/Floating';\nimport { PopoverMiddlewares, PopoverWidth } from './Popover.types';\n\ninterface UsePopoverOptions {\n  offset: number | FloatingAxesOffsets;\n  position: FloatingPosition;\n  onPositionChange?: (position: FloatingPosition) => void;\n  opened: boolean | undefined;\n  defaultOpened: boolean | undefined;\n  onChange?: (opened: boolean) => void;\n  onClose?: () => void;\n  onDismiss?: () => void;\n  onOpen?: () => void;\n  width: PopoverWidth;\n  middlewares: PopoverMiddlewares | undefined;\n  arrowRef: React.RefObject<HTMLDivElement | null>;\n  arrowOffset: number;\n  strategy?: FloatingStrategy;\n  disabled: boolean | undefined;\n  preventPositionChangeWhenVisible: boolean | undefined;\n  keepMounted: boolean | undefined;\n}\n\nfunction getDefaultMiddlewares(middlewares: PopoverMiddlewares | undefined): PopoverMiddlewares {\n  if (middlewares === undefined) {\n    return { shift: true, flip: true };\n  }\n\n  const result = { ...middlewares };\n  if (middlewares.shift === undefined) {\n    result.shift = true;\n  }\n\n  if (middlewares.flip === undefined) {\n    result.flip = true;\n  }\n\n  return result;\n}\n\nfunction getPopoverMiddlewares(\n  options: UsePopoverOptions,\n  getFloating: () => UseFloatingReturn<Element>,\n  disableFlip: boolean,\n  lockEnabled: boolean\n) {\n  const middlewaresOptions = getDefaultMiddlewares(options.middlewares);\n  const middlewares: Middleware[] = [offset(options.offset), hide()];\n\n  if (middlewaresOptions.flip && !disableFlip) {\n    const userFlip = typeof middlewaresOptions.flip === 'boolean' ? {} : middlewaresOptions.flip;\n    const flipOptions = lockEnabled\n      ? { fallbackStrategy: 'initialPlacement' as const, ...userFlip }\n      : userFlip;\n    middlewares.push(flip(flipOptions));\n  }\n\n  if (middlewaresOptions.shift) {\n    const shiftOptions =\n      typeof middlewaresOptions.shift === 'boolean' ? {} : middlewaresOptions.shift;\n    middlewares.push(\n      shift((state) => {\n        const isVerticalPlacement =\n          state.placement.startsWith('top') || state.placement.startsWith('bottom');\n        return {\n          limiter: limitShift(),\n          padding: 5,\n          ...(options.width === 'target' && isVerticalPlacement ? { mainAxis: false } : null),\n          ...shiftOptions,\n        };\n      })\n    );\n  }\n\n  if (middlewaresOptions.inline) {\n    middlewares.push(\n      typeof middlewaresOptions.inline === 'boolean' ? inline() : inline(middlewaresOptions.inline)\n    );\n  }\n\n  middlewares.push(arrow({ element: options.arrowRef, padding: options.arrowOffset }));\n\n  if (middlewaresOptions.size || options.width === 'target') {\n    middlewares.push(\n      size({\n        ...(typeof middlewaresOptions.size === 'boolean' ? {} : middlewaresOptions.size),\n        apply({ rects, availableWidth, availableHeight, ...rest }) {\n          const floating = getFloating();\n          const styles = floating.refs.floating.current?.style ?? {};\n\n          if (middlewaresOptions.size) {\n            // If custom apply function is given use that else set defaults\n            if (typeof middlewaresOptions.size === 'object' && !!middlewaresOptions.size.apply) {\n              middlewaresOptions.size.apply({ rects, availableWidth, availableHeight, ...rest });\n            } else {\n              Object.assign(styles, {\n                maxWidth: `${availableWidth}px`,\n                maxHeight: `${availableHeight}px`,\n              });\n            }\n          }\n\n          if (options.width === 'target') {\n            Object.assign(styles, {\n              width: `${rects.reference.width}px`,\n            });\n          }\n        },\n      })\n    );\n  }\n\n  return middlewares;\n}\n\nexport function usePopover(options: UsePopoverOptions) {\n  const [_opened, setOpened] = useUncontrolled({\n    value: options.opened,\n    defaultValue: options.defaultOpened,\n    finalValue: false,\n    onChange: options.onChange,\n  });\n\n  const previouslyOpened = useRef(_opened);\n\n  const [lockedPlacement, setLockedPlacement] = useState<FloatingPosition | null>(null);\n  const lockEnabled = options.preventPositionChangeWhenVisible !== false;\n\n  const wasOpenedRef = useRef(_opened);\n  if (_opened !== wasOpenedRef.current) {\n    wasOpenedRef.current = _opened;\n    if (_opened && lockedPlacement !== null) {\n      setLockedPlacement(null);\n    }\n  }\n\n  const resetLockedPlacement = useCallback(() => setLockedPlacement(null), []);\n\n  const onClose = () => {\n    if (_opened && !options.disabled) {\n      setOpened(false);\n    }\n  };\n\n  const onToggle = () => {\n    if (!options.disabled) {\n      setOpened(!_opened);\n    }\n  };\n\n  const floating: UseFloatingReturn<Element> = useFloating({\n    open: _opened,\n    strategy: options.strategy,\n    placement: lockEnabled ? (lockedPlacement ?? options.position) : options.position,\n    middleware: getPopoverMiddlewares(\n      options,\n      () => floating,\n      lockEnabled && lockedPlacement !== null,\n      lockEnabled\n    ),\n    whileElementsMounted: !options.keepMounted ? autoUpdate : undefined,\n  });\n\n  useEffect(() => {\n    if (!options.keepMounted) {\n      return undefined;\n    }\n\n    const referenceElement = floating.refs.reference.current;\n    const floatingElement = floating.refs.floating.current;\n\n    if (_opened && referenceElement && floatingElement) {\n      return autoUpdate(referenceElement, floatingElement, floating.update);\n    }\n\n    return undefined;\n  }, [\n    options.keepMounted,\n    _opened,\n    floating.update,\n    floating.elements.reference,\n    floating.elements.floating,\n  ]);\n\n  const measuredAfterShowRef = useRef(false);\n\n  useIsomorphicEffect(() => {\n    if (!_opened) {\n      measuredAfterShowRef.current = false;\n      return;\n    }\n\n    if (!lockEnabled || lockedPlacement !== null) {\n      return;\n    }\n\n    const flEl = floating.refs.floating.current as HTMLElement | null;\n    if (!flEl || flEl.offsetHeight === 0 || flEl.offsetWidth === 0) {\n      return;\n    }\n\n    if (!measuredAfterShowRef.current) {\n      measuredAfterShowRef.current = true;\n      floating.update();\n      return;\n    }\n\n    if (floating.isPositioned) {\n      setLockedPlacement(floating.placement);\n    }\n  }, [\n    lockEnabled,\n    _opened,\n    floating.isPositioned,\n    floating.placement,\n    lockedPlacement,\n    floating.update,\n  ]);\n\n  const previousPlacementRef = useRef(floating.placement);\n  useIsomorphicEffect(() => {\n    if (previousPlacementRef.current !== floating.placement) {\n      previousPlacementRef.current = floating.placement;\n      options.onPositionChange?.(floating.placement);\n    }\n  }, [floating.placement]);\n\n  useDidUpdate(() => {\n    if (_opened !== previouslyOpened.current) {\n      if (!_opened) {\n        options.onClose?.();\n      } else {\n        options.onOpen?.();\n      }\n    }\n\n    previouslyOpened.current = _opened;\n  }, [_opened, options.onClose, options.onOpen]);\n\n  return {\n    floating,\n    controlled: typeof options.opened === 'boolean',\n    opened: _opened,\n    onClose,\n    onToggle,\n    resetLockedPlacement,\n  };\n}\n"],"mappings":"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"}

package/esm/components/Portal/Portal.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Portal.mjs","names":[],"sources":["../../../src/components/Portal/Portal.tsx"],"sourcesContent":["import { useRef, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport { assignRef, useIsomorphicEffect } from '@mantine/hooks';\nimport { Factory, factory, useProps } from '../../core';\n\nfunction createPortalNode(props: React.ComponentProps<'div'>) {\n  const node = document.createElement('div');\n  node.setAttribute('data-portal', 'true');\n  typeof props.className === 'string' &&\n    node.classList.add(...props.className.split(' ').filter(Boolean));\n  typeof props.style === 'object' && Object.assign(node.style, props.style);\n  typeof props.id === 'string' && node.setAttribute('id', props.id);\n  return node;\n}\n\nexport interface BasePortalProps extends React.ComponentProps<'div'> {\n  /**\n   * Target element where portal should be rendered. Accepts:\n   * - HTMLElement: Renders portal inside this element\n   * - string: CSS selector - renders inside first matching element\n   * - undefined: Uses shared portal node or creates new one based on `reuseTargetNode`\n   *\n   * Note: If selector doesn't match any element, portal will not render\n   */\n  target?: HTMLElement | string;\n\n  /**\n   * When true and target is not specified, all Portal instances share a single\n   * container node appended to document.body. When false, each Portal creates\n   * its own container node.\n   *\n   * Has no effect when target is specified.\n   *\n   * @default true\n   */\n  reuseTargetNode?: boolean;\n}\n\nexport interface PortalProps extends BasePortalProps {\n  /** Content to render inside the portal */\n  children: React.ReactNode;\n}\n\nfunction getTargetNode({ target, reuseTargetNode, ...others }: BasePortalProps): HTMLElement {\n  if (target) {\n    if (typeof target === 'string') {\n      return document.querySelector<HTMLElement>(target) || createPortalNode(others);\n    }\n\n    return target;\n  }\n\n  if (reuseTargetNode) {\n    const existingNode = document.querySelector<HTMLElement>('[data-mantine-shared-portal-node]');\n\n    if (existingNode) {\n      return existingNode;\n    }\n\n    const node = createPortalNode(others);\n    node.setAttribute('data-mantine-shared-portal-node', 'true');\n    document.body.appendChild(node);\n    return node;\n  }\n\n  return createPortalNode(others);\n}\n\nexport type PortalFactory = Factory<{\n  props: PortalProps;\n  ref: HTMLDivElement;\n}>;\n\nconst defaultProps = {\n  reuseTargetNode: true,\n} satisfies Partial<PortalProps>;\n\nexport const Portal = factory<PortalFactory>((props) => {\n  const { children, target, reuseTargetNode, ref, ...others } = useProps(\n    'Portal',\n    defaultProps,\n    props\n  );\n\n  const [mounted, setMounted] = useState(false);\n  const nodeRef = useRef<HTMLElement | null>(null);\n\n  useIsomorphicEffect(() => {\n    setMounted(true);\n    nodeRef.current = getTargetNode({ target, reuseTargetNode, ...others });\n    assignRef(ref, nodeRef.current);\n\n    if (!target && !reuseTargetNode && nodeRef.current) {\n      document.body.appendChild(nodeRef.current);\n    }\n\n    return () => {\n      if (!target && !reuseTargetNode && nodeRef.current) {\n        document.body.removeChild(nodeRef.current);\n      }\n    };\n  }, [target]);\n\n  if (!mounted || !nodeRef.current) {\n    return null;\n  }\n\n  return createPortal(<>{children}</>, nodeRef.current);\n});\n\nPortal.displayName = '@mantine/core/Portal';\n\nexport namespace Portal {\n  export type Props = PortalProps;\n}\n"],"mappings":";;;;;;;;AAKA,SAAS,iBAAiB,OAAoC;CAC5D,MAAM,OAAO,SAAS,cAAc,KAAK;CACzC,KAAK,aAAa,eAAe,MAAM;CACvC,OAAO,MAAM,cAAc,YACzB,KAAK,UAAU,IAAI,GAAG,MAAM,UAAU,MAAM,GAAG,EAAE,OAAO,OAAO,CAAC;CAClE,OAAO,MAAM,UAAU,YAAY,OAAO,OAAO,KAAK,OAAO,MAAM,KAAK;CACxE,OAAO,MAAM,OAAO,YAAY,KAAK,aAAa,MAAM,MAAM,EAAE;CAChE,OAAO;AACT;AA8BA,SAAS,cAAc,EAAE,QAAQ,iBAAiB,GAAG,UAAwC;CAC3F,IAAI,QAAQ;EACV,IAAI,OAAO,WAAW,UACpB,OAAO,SAAS,cAA2B,MAAM,KAAK,iBAAiB,MAAM;EAG/E,OAAO;CACT;CAEA,IAAI,iBAAiB;EACnB,MAAM,eAAe,SAAS,cAA2B,mCAAmC;EAE5F,IAAI,cACF,OAAO;EAGT,MAAM,OAAO,iBAAiB,MAAM;EACpC,KAAK,aAAa,mCAAmC,MAAM;EAC3D,SAAS,KAAK,YAAY,IAAI;EAC9B,OAAO;CACT;CAEA,OAAO,iBAAiB,MAAM;AAChC;AAOA,MAAM,eAAe,EACnB,iBAAiB,KACnB;AAEA,MAAa,SAAS,SAAwB,UAAU;CACtD,MAAM,EAAE,UAAU,QAAQ,iBAAiB,KAAK,GAAG,WAAW,SAC5D,UACA,cACA,KACF;CAEA,MAAM,CAAC,SAAS,cAAc,SAAS,KAAK;CAC5C,MAAM,UAAU,OAA2B,IAAI;CAE/C,0BAA0B;EACxB,WAAW,IAAI;EACf,QAAQ,UAAU,cAAc;GAAE;GAAQ;GAAiB,GAAG;EAAO,CAAC;EACtE,UAAU,KAAK,QAAQ,OAAO;EAE9B,IAAI,CAAC,UAAU,CAAC,mBAAmB,QAAQ,SACzC,SAAS,KAAK,YAAY,QAAQ,OAAO;EAG3C,aAAa;GACX,IAAI,CAAC,UAAU,CAAC,mBAAmB,QAAQ,SACzC,SAAS,KAAK,YAAY,QAAQ,OAAO;EAE7C;CACF,GAAG,CAAC,MAAM,CAAC;CAEX,IAAI,CAAC,WAAW,CAAC,QAAQ,SACvB,OAAO;CAGT,OAAO,aAAa,oBAAA,YAAA,EAAG,SAAW,CAAA,GAAG,QAAQ,OAAO;AACtD,CAAC;AAED,OAAO,cAAc"}
+{"version":3,"file":"Portal.mjs","names":[],"sources":["../../../src/components/Portal/Portal.tsx"],"sourcesContent":["import { useRef, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport { assignRef, useIsomorphicEffect } from '@mantine/hooks';\nimport { Factory, factory, useProps } from '../../core';\n\nfunction createPortalNode(props: React.ComponentProps<'div'>) {\n  const node = document.createElement('div');\n  node.setAttribute('data-portal', 'true');\n  typeof props.className === 'string' &&\n    node.classList.add(...props.className.split(' ').filter(Boolean));\n  typeof props.style === 'object' && Object.assign(node.style, props.style);\n  typeof props.id === 'string' && node.setAttribute('id', props.id);\n  return node;\n}\n\nexport interface BasePortalProps extends React.ComponentProps<'div'> {\n  /**\n   * Target element where portal should be rendered. Accepts:\n   * - HTMLElement: Renders portal inside this element\n   * - string: CSS selector - renders inside first matching element\n   * - undefined: Uses shared portal node or creates new one based on `reuseTargetNode`\n   *\n   * Note: If selector doesn't match any element, portal will not render\n   */\n  target?: HTMLElement | string;\n\n  /**\n   * When true and target is not specified, all Portal instances share a single\n   * container node appended to document.body. When false, each Portal creates\n   * its own container node.\n   *\n   * Has no effect when target is specified.\n   *\n   * @default true\n   */\n  reuseTargetNode?: boolean;\n}\n\nexport interface PortalProps extends BasePortalProps {\n  /** Content to render inside the portal */\n  children: React.ReactNode;\n}\n\nfunction getTargetNode({ target, reuseTargetNode, ...others }: BasePortalProps): HTMLElement {\n  if (target) {\n    if (typeof target === 'string') {\n      return document.querySelector<HTMLElement>(target) || createPortalNode(others);\n    }\n\n    return target;\n  }\n\n  if (reuseTargetNode) {\n    const existingNode = document.querySelector<HTMLElement>('[data-mantine-shared-portal-node]');\n\n    if (existingNode) {\n      return existingNode;\n    }\n\n    const node = createPortalNode(others);\n    node.setAttribute('data-mantine-shared-portal-node', 'true');\n    document.body.appendChild(node);\n    return node;\n  }\n\n  return createPortalNode(others);\n}\n\nexport type PortalFactory = Factory<{\n  props: PortalProps;\n  ref: HTMLDivElement;\n}>;\n\nconst defaultProps = {\n  reuseTargetNode: true,\n} satisfies Partial<PortalProps>;\n\nexport const Portal = factory<PortalFactory>((props) => {\n  const { children, target, reuseTargetNode, ref, ...others } = useProps(\n    'Portal',\n    defaultProps,\n    props\n  );\n\n  const [mounted, setMounted] = useState(false);\n  const nodeRef = useRef<HTMLElement | null>(null);\n\n  useIsomorphicEffect(() => {\n    setMounted(true);\n    nodeRef.current = getTargetNode({ target, reuseTargetNode, ...others });\n    assignRef(ref, nodeRef.current);\n\n    if (!target && !reuseTargetNode && nodeRef.current) {\n      document.body.appendChild(nodeRef.current);\n    }\n\n    return () => {\n      if (!target && !reuseTargetNode && nodeRef.current) {\n        document.body.removeChild(nodeRef.current);\n      }\n    };\n  }, [target]);\n\n  if (!mounted || !nodeRef.current) {\n    return null;\n  }\n\n  return createPortal(<>{children}</>, nodeRef.current);\n});\n\nPortal.displayName = '@mantine/core/Portal';\n\nexport namespace Portal {\n  export type Props = PortalProps;\n}\n"],"mappings":";;;;;;;;AAKA,SAAS,iBAAiB,OAAoC;CAC5D,MAAM,OAAO,SAAS,cAAc,KAAK;CACzC,KAAK,aAAa,eAAe,MAAM;CACvC,OAAO,MAAM,cAAc,YACzB,KAAK,UAAU,IAAI,GAAG,MAAM,UAAU,MAAM,GAAG,CAAC,CAAC,OAAO,OAAO,CAAC;CAClE,OAAO,MAAM,UAAU,YAAY,OAAO,OAAO,KAAK,OAAO,MAAM,KAAK;CACxE,OAAO,MAAM,OAAO,YAAY,KAAK,aAAa,MAAM,MAAM,EAAE;CAChE,OAAO;AACT;AA8BA,SAAS,cAAc,EAAE,QAAQ,iBAAiB,GAAG,UAAwC;CAC3F,IAAI,QAAQ;EACV,IAAI,OAAO,WAAW,UACpB,OAAO,SAAS,cAA2B,MAAM,KAAK,iBAAiB,MAAM;EAG/E,OAAO;CACT;CAEA,IAAI,iBAAiB;EACnB,MAAM,eAAe,SAAS,cAA2B,mCAAmC;EAE5F,IAAI,cACF,OAAO;EAGT,MAAM,OAAO,iBAAiB,MAAM;EACpC,KAAK,aAAa,mCAAmC,MAAM;EAC3D,SAAS,KAAK,YAAY,IAAI;EAC9B,OAAO;CACT;CAEA,OAAO,iBAAiB,MAAM;AAChC;AAOA,MAAM,eAAe,EACnB,iBAAiB,KACnB;AAEA,MAAa,SAAS,SAAwB,UAAU;CACtD,MAAM,EAAE,UAAU,QAAQ,iBAAiB,KAAK,GAAG,WAAW,SAC5D,UACA,cACA,KACF;CAEA,MAAM,CAAC,SAAS,cAAc,SAAS,KAAK;CAC5C,MAAM,UAAU,OAA2B,IAAI;CAE/C,0BAA0B;EACxB,WAAW,IAAI;EACf,QAAQ,UAAU,cAAc;GAAE;GAAQ;GAAiB,GAAG;EAAO,CAAC;EACtE,UAAU,KAAK,QAAQ,OAAO;EAE9B,IAAI,CAAC,UAAU,CAAC,mBAAmB,QAAQ,SACzC,SAAS,KAAK,YAAY,QAAQ,OAAO;EAG3C,aAAa;GACX,IAAI,CAAC,UAAU,CAAC,mBAAmB,QAAQ,SACzC,SAAS,KAAK,YAAY,QAAQ,OAAO;EAE7C;CACF,GAAG,CAAC,MAAM,CAAC;CAEX,IAAI,CAAC,WAAW,CAAC,QAAQ,SACvB,OAAO;CAGT,OAAO,aAAa,oBAAA,YAAA,EAAG,SAAW,CAAA,GAAG,QAAQ,OAAO;AACtD,CAAC;AAED,OAAO,cAAc"}

package/esm/components/Progress/ProgressLabel/ProgressLabel.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ProgressLabel.mjs","names":["classes"],"sources":["../../../../src/components/Progress/ProgressLabel/ProgressLabel.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  CompoundStylesApiProps,\n  ElementProps,\n  factory,\n  Factory,\n  useProps,\n} from '../../../core';\nimport { useProgressContext } from '../Progress.context';\nimport classes from '../Progress.module.css';\n\nexport type ProgressLabelStylesNames = 'label';\n\nexport interface ProgressLabelProps\n  extends BoxProps, CompoundStylesApiProps<ProgressLabelFactory>, ElementProps<'div'> {}\n\nexport type ProgressLabelFactory = Factory<{\n  props: ProgressLabelProps;\n  ref: HTMLDivElement;\n  stylesNames: ProgressLabelStylesNames;\n  compound: true;\n}>;\n\nexport const ProgressLabel = factory<ProgressLabelFactory>((props) => {\n  const { classNames, className, style, styles, vars, ...others } = useProps(\n    'ProgressLabel',\n    null,\n    props\n  );\n\n  const ctx = useProgressContext();\n\n  return <Box {...ctx.getStyles('label', { className, style, classNames, styles })} {...others} />;\n});\n\nProgressLabel.classes = classes;\nProgressLabel.displayName = '@mantine/core/ProgressLabel';\n"],"mappings":";;;;;;;;AAwBA,MAAa,gBAAgB,SAA+B,UAAU;CACpE,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,GAAG,WAAW,SAChE,iBACA,MACA,KACF;CAIA,OAAO,oBAAC,KAAD;EAAK,GAFA,mBAEM,EAAE,UAAU,SAAS;GAAE;GAAW;GAAO;GAAY;EAAO,CAAC;EAAG,GAAI;CAAS,CAAA;AACjG,CAAC;AAED,cAAc,UAAUA;AACxB,cAAc,cAAc"}
+{"version":3,"file":"ProgressLabel.mjs","names":["classes"],"sources":["../../../../src/components/Progress/ProgressLabel/ProgressLabel.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  CompoundStylesApiProps,\n  ElementProps,\n  factory,\n  Factory,\n  useProps,\n} from '../../../core';\nimport { useProgressContext } from '../Progress.context';\nimport classes from '../Progress.module.css';\n\nexport type ProgressLabelStylesNames = 'label';\n\nexport interface ProgressLabelProps\n  extends BoxProps, CompoundStylesApiProps<ProgressLabelFactory>, ElementProps<'div'> {}\n\nexport type ProgressLabelFactory = Factory<{\n  props: ProgressLabelProps;\n  ref: HTMLDivElement;\n  stylesNames: ProgressLabelStylesNames;\n  compound: true;\n}>;\n\nexport const ProgressLabel = factory<ProgressLabelFactory>((props) => {\n  const { classNames, className, style, styles, vars, ...others } = useProps(\n    'ProgressLabel',\n    null,\n    props\n  );\n\n  const ctx = useProgressContext();\n\n  return <Box {...ctx.getStyles('label', { className, style, classNames, styles })} {...others} />;\n});\n\nProgressLabel.classes = classes;\nProgressLabel.displayName = '@mantine/core/ProgressLabel';\n"],"mappings":";;;;;;;;AAwBA,MAAa,gBAAgB,SAA+B,UAAU;CACpE,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,GAAG,WAAW,SAChE,iBACA,MACA,KACF;CAIA,OAAO,oBAAC,KAAD;EAAK,GAFA,mBAEM,CAAC,CAAC,UAAU,SAAS;GAAE;GAAW;GAAO;GAAY;EAAO,CAAC;EAAG,GAAI;CAAS,CAAA;AACjG,CAAC;AAED,cAAc,UAAUA;AACxB,cAAc,cAAc"}

package/esm/components/Radio/Radio.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.mjs","names":["useId","classes"],"sources":["../../../src/components/Radio/Radio.tsx"],"sourcesContent":["import { use } from 'react';\nimport { useId } from '@mantine/hooks';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  DataAttributes,\n  ElementProps,\n  extractStyleProps,\n  factory,\n  Factory,\n  getAutoContrastValue,\n  getContrastColor,\n  getRadius,\n  getSize,\n  getThemeColor,\n  MantineColor,\n  MantineRadius,\n  MantineSize,\n  parseThemeColor,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { InlineInput, InlineInputStylesNames } from '../../utils/InlineInput';\nimport {\n  RadioCard,\n  type RadioCardProps,\n  type RadioCardStylesNames,\n  type RadioCardFactory,\n  type RadioCardCssVariables,\n  type RadioCardContextValue,\n} from './RadioCard/RadioCard';\nimport {\n  RadioGroup,\n  RadioGroupContext,\n  type RadioGroupProps,\n  type RadioGroupStylesNames,\n  type RadioGroupFactory,\n  type RadioGroupContextValue,\n} from './RadioGroup/RadioGroup';\nimport { RadioIcon, RadioIconProps } from './RadioIcon';\nimport {\n  RadioIndicator,\n  type RadioIndicatorProps,\n  type RadioIndicatorStylesNames,\n  type RadioIndicatorFactory,\n  type RadioIndicatorCssVariables,\n  type RadioIndicatorVariant,\n} from './RadioIndicator/RadioIndicator';\nimport classes from './Radio.module.css';\nexport type RadioVariant = 'filled' | 'outline';\nexport type RadioStylesNames = InlineInputStylesNames | 'inner' | 'radio' | 'icon';\nexport type RadioCssVariables = {\n  root:\n    | '--radio-size'\n    | '--radio-radius'\n    | '--radio-color'\n    | '--radio-icon-color'\n    | '--radio-icon-size';\n};\n\nexport interface RadioProps\n  extends BoxProps, StylesApiProps<RadioFactory>, ElementProps<'input', 'size' | 'children'> {\n  /** Content of the `label` associated with the radio */\n  label?: React.ReactNode;\n\n  /** Key of theme.colors or any valid CSS color to set radio background color in checked state @default theme.primaryColor */\n  color?: MantineColor;\n\n  /** Controls size of the component @default 'sm' */\n  size?: MantineSize | (string & {});\n\n  /** A component that replaces the default radio icon (centered dot) */\n  icon?: React.FC<RadioIconProps>;\n\n  /** Props passed down to the root element */\n  wrapperProps?: React.ComponentProps<'div'> & DataAttributes;\n\n  /** Position of the label relative to the input @default 'right' */\n  labelPosition?: 'left' | 'right';\n\n  /** Description displayed below the label */\n  description?: React.ReactNode;\n\n  /** Error displayed below the label */\n  error?: React.ReactNode;\n\n  /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default 'xl' */\n  radius?: MantineRadius;\n\n  /** Assigns ref of the root element */\n  rootRef?: React.Ref<HTMLDivElement>;\n\n  /** Key of theme.colors or any valid CSS color to set icon color. When not set, icon color is determined automatically based on theme.autoContrast setting */\n  iconColor?: MantineColor;\n\n  /** If set, adjusts text color based on background color for `filled` variant */\n  autoContrast?: boolean;\n\n  /** If set, applies error styles to the radio when `error` prop is set @default true */\n  withErrorStyles?: boolean;\n}\n\nexport type RadioFactory = Factory<{\n  props: RadioProps;\n  ref: HTMLInputElement;\n  stylesNames: RadioStylesNames;\n  vars: RadioCssVariables;\n  variant: RadioVariant;\n  staticComponents: {\n    Group: typeof RadioGroup;\n    Card: typeof RadioCard;\n    Indicator: typeof RadioIndicator;\n  };\n}>;\n\nconst defaultProps = {\n  labelPosition: 'right',\n  withErrorStyles: true,\n} satisfies Partial<RadioProps>;\n\nconst varsResolver = createVarsResolver<RadioFactory>(\n  (theme, { size, radius, color, iconColor, variant, autoContrast }) => {\n    const parsedColor = parseThemeColor({ color: color || theme.primaryColor, theme });\n    const outlineColor =\n      parsedColor.isThemeColor && parsedColor.shade === undefined\n        ? `var(--mantine-color-${parsedColor.color}-outline)`\n        : parsedColor.color;\n\n    return {\n      root: {\n        '--radio-size': getSize(size, 'radio-size'),\n        '--radio-radius': radius === undefined ? undefined : getRadius(radius),\n        '--radio-color': variant === 'outline' ? outlineColor : getThemeColor(color, theme),\n        '--radio-icon-color': iconColor\n          ? getThemeColor(iconColor, theme)\n          : getAutoContrastValue(autoContrast, theme)\n            ? getContrastColor({ color, theme, autoContrast })\n            : undefined,\n        '--radio-icon-size': getSize(size, 'radio-icon-size'),\n      },\n    };\n  }\n);\n\nexport const Radio = factory<RadioFactory>((_props) => {\n  const props = useProps('Radio', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    id,\n    size,\n    label,\n    labelPosition,\n    description,\n    error,\n    radius,\n    color,\n    variant,\n    disabled,\n    wrapperProps,\n    icon: Icon = RadioIcon,\n    rootRef,\n    iconColor,\n    onChange,\n    mod,\n    attributes,\n    withErrorStyles,\n    checked,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<RadioFactory>({\n    name: 'Radio',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const ctx = use(RadioGroupContext);\n\n  const contextSize = ctx?.size ?? size;\n  const componentSize = props.size ? size : contextSize;\n\n  const { styleProps, rest } = extractStyleProps(others);\n  const uuid = useId(id);\n  const descriptionId = description ? `${uuid}-description` : undefined;\n  const errorId = error && typeof error !== 'boolean' ? `${uuid}-error` : undefined;\n  const describedBy =\n    [descriptionId, errorId, rest['aria-describedby']].filter(Boolean).join(' ') || undefined;\n\n  const contextChecked = ctx ? ctx.value === rest.value : undefined;\n\n  const withContextProps = {\n    checked: contextChecked ?? checked,\n    name: rest.name ?? ctx?.name,\n    onChange: (event: React.ChangeEvent<HTMLInputElement>) => {\n      ctx?.onChange(event);\n      onChange?.(event);\n    },\n    disabled: ctx?.disabled ?? disabled,\n  };\n\n  return (\n    <InlineInput\n      {...getStyles('root')}\n      __staticSelector=\"Radio\"\n      __stylesApiProps={props}\n      id={uuid}\n      size={componentSize}\n      labelPosition={labelPosition}\n      label={label}\n      description={description}\n      error={error}\n      disabled={withContextProps.disabled}\n      classNames={classNames}\n      styles={styles}\n      unstyled={unstyled}\n      data-checked={(contextChecked ?? checked) || undefined}\n      variant={variant}\n      ref={rootRef}\n      mod={mod}\n      attributes={attributes}\n      {...styleProps}\n      {...wrapperProps}\n    >\n      <Box {...getStyles('inner')} mod={{ 'label-position': labelPosition }}>\n        <Box\n          {...getStyles('radio', { focusable: true, variant })}\n          {...rest}\n          {...withContextProps}\n          component=\"input\"\n          mod={{ error: !!error, 'with-error-styles': withErrorStyles }}\n          id={uuid}\n          type=\"radio\"\n          aria-describedby={describedBy}\n        />\n        <Icon {...getStyles('icon')} aria-hidden />\n      </Box>\n    </InlineInput>\n  );\n});\n\nRadio.classes = classes;\nRadio.varsResolver = varsResolver;\nRadio.displayName = '@mantine/core/Radio';\nRadio.Group = RadioGroup;\nRadio.Card = RadioCard;\nRadio.Indicator = RadioIndicator;\n\nexport namespace Radio {\n  export type Props = RadioProps;\n  export type StylesNames = RadioStylesNames;\n  export type Factory = RadioFactory;\n  export type Variant = RadioVariant;\n\n  export namespace Group {\n    export type Props = RadioGroupProps;\n    export type StylesNames = RadioGroupStylesNames;\n    export type Factory = RadioGroupFactory;\n    export type ContextValue = RadioGroupContextValue;\n  }\n\n  export namespace Card {\n    export type Props = RadioCardProps;\n    export type StylesNames = RadioCardStylesNames;\n    export type Factory = RadioCardFactory;\n    export type CssVariables = RadioCardCssVariables;\n    export type ContextValue = RadioCardContextValue;\n  }\n\n  export namespace Indicator {\n    export type Props = RadioIndicatorProps;\n    export type StylesNames = RadioIndicatorStylesNames;\n    export type Factory = RadioIndicatorFactory;\n    export type CssVariables = RadioIndicatorCssVariables;\n    export type Variant = RadioIndicatorVariant;\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"Radio.mjs","names":["useId","classes"],"sources":["../../../src/components/Radio/Radio.tsx"],"sourcesContent":["import { use } from 'react';\nimport { useId } from '@mantine/hooks';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  DataAttributes,\n  ElementProps,\n  extractStyleProps,\n  factory,\n  Factory,\n  getAutoContrastValue,\n  getContrastColor,\n  getRadius,\n  getSize,\n  getThemeColor,\n  MantineColor,\n  MantineRadius,\n  MantineSize,\n  parseThemeColor,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { InlineInput, InlineInputStylesNames } from '../../utils/InlineInput';\nimport {\n  RadioCard,\n  type RadioCardProps,\n  type RadioCardStylesNames,\n  type RadioCardFactory,\n  type RadioCardCssVariables,\n  type RadioCardContextValue,\n} from './RadioCard/RadioCard';\nimport {\n  RadioGroup,\n  RadioGroupContext,\n  type RadioGroupProps,\n  type RadioGroupStylesNames,\n  type RadioGroupFactory,\n  type RadioGroupContextValue,\n} from './RadioGroup/RadioGroup';\nimport { RadioIcon, RadioIconProps } from './RadioIcon';\nimport {\n  RadioIndicator,\n  type RadioIndicatorProps,\n  type RadioIndicatorStylesNames,\n  type RadioIndicatorFactory,\n  type RadioIndicatorCssVariables,\n  type RadioIndicatorVariant,\n} from './RadioIndicator/RadioIndicator';\nimport classes from './Radio.module.css';\nexport type RadioVariant = 'filled' | 'outline';\nexport type RadioStylesNames = InlineInputStylesNames | 'inner' | 'radio' | 'icon';\nexport type RadioCssVariables = {\n  root:\n    | '--radio-size'\n    | '--radio-radius'\n    | '--radio-color'\n    | '--radio-icon-color'\n    | '--radio-icon-size';\n};\n\nexport interface RadioProps\n  extends BoxProps, StylesApiProps<RadioFactory>, ElementProps<'input', 'size' | 'children'> {\n  /** Content of the `label` associated with the radio */\n  label?: React.ReactNode;\n\n  /** Key of theme.colors or any valid CSS color to set radio background color in checked state @default theme.primaryColor */\n  color?: MantineColor;\n\n  /** Controls size of the component @default 'sm' */\n  size?: MantineSize | (string & {});\n\n  /** A component that replaces the default radio icon (centered dot) */\n  icon?: React.FC<RadioIconProps>;\n\n  /** Props passed down to the root element */\n  wrapperProps?: React.ComponentProps<'div'> & DataAttributes;\n\n  /** Position of the label relative to the input @default 'right' */\n  labelPosition?: 'left' | 'right';\n\n  /** Description displayed below the label */\n  description?: React.ReactNode;\n\n  /** Error displayed below the label */\n  error?: React.ReactNode;\n\n  /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default 'xl' */\n  radius?: MantineRadius;\n\n  /** Assigns ref of the root element */\n  rootRef?: React.Ref<HTMLDivElement>;\n\n  /** Key of theme.colors or any valid CSS color to set icon color. When not set, icon color is determined automatically based on theme.autoContrast setting */\n  iconColor?: MantineColor;\n\n  /** If set, adjusts text color based on background color for `filled` variant */\n  autoContrast?: boolean;\n\n  /** If set, applies error styles to the radio when `error` prop is set @default true */\n  withErrorStyles?: boolean;\n}\n\nexport type RadioFactory = Factory<{\n  props: RadioProps;\n  ref: HTMLInputElement;\n  stylesNames: RadioStylesNames;\n  vars: RadioCssVariables;\n  variant: RadioVariant;\n  staticComponents: {\n    Group: typeof RadioGroup;\n    Card: typeof RadioCard;\n    Indicator: typeof RadioIndicator;\n  };\n}>;\n\nconst defaultProps = {\n  labelPosition: 'right',\n  withErrorStyles: true,\n} satisfies Partial<RadioProps>;\n\nconst varsResolver = createVarsResolver<RadioFactory>(\n  (theme, { size, radius, color, iconColor, variant, autoContrast }) => {\n    const parsedColor = parseThemeColor({ color: color || theme.primaryColor, theme });\n    const outlineColor =\n      parsedColor.isThemeColor && parsedColor.shade === undefined\n        ? `var(--mantine-color-${parsedColor.color}-outline)`\n        : parsedColor.color;\n\n    return {\n      root: {\n        '--radio-size': getSize(size, 'radio-size'),\n        '--radio-radius': radius === undefined ? undefined : getRadius(radius),\n        '--radio-color': variant === 'outline' ? outlineColor : getThemeColor(color, theme),\n        '--radio-icon-color': iconColor\n          ? getThemeColor(iconColor, theme)\n          : getAutoContrastValue(autoContrast, theme)\n            ? getContrastColor({ color, theme, autoContrast })\n            : undefined,\n        '--radio-icon-size': getSize(size, 'radio-icon-size'),\n      },\n    };\n  }\n);\n\nexport const Radio = factory<RadioFactory>((_props) => {\n  const props = useProps('Radio', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    id,\n    size,\n    label,\n    labelPosition,\n    description,\n    error,\n    radius,\n    color,\n    variant,\n    disabled,\n    wrapperProps,\n    icon: Icon = RadioIcon,\n    rootRef,\n    iconColor,\n    onChange,\n    mod,\n    attributes,\n    withErrorStyles,\n    checked,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<RadioFactory>({\n    name: 'Radio',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const ctx = use(RadioGroupContext);\n\n  const contextSize = ctx?.size ?? size;\n  const componentSize = props.size ? size : contextSize;\n\n  const { styleProps, rest } = extractStyleProps(others);\n  const uuid = useId(id);\n  const descriptionId = description ? `${uuid}-description` : undefined;\n  const errorId = error && typeof error !== 'boolean' ? `${uuid}-error` : undefined;\n  const describedBy =\n    [descriptionId, errorId, rest['aria-describedby']].filter(Boolean).join(' ') || undefined;\n\n  const contextChecked = ctx ? ctx.value === rest.value : undefined;\n\n  const withContextProps = {\n    checked: contextChecked ?? checked,\n    name: rest.name ?? ctx?.name,\n    onChange: (event: React.ChangeEvent<HTMLInputElement>) => {\n      ctx?.onChange(event);\n      onChange?.(event);\n    },\n    disabled: ctx?.disabled ?? disabled,\n  };\n\n  return (\n    <InlineInput\n      {...getStyles('root')}\n      __staticSelector=\"Radio\"\n      __stylesApiProps={props}\n      id={uuid}\n      size={componentSize}\n      labelPosition={labelPosition}\n      label={label}\n      description={description}\n      error={error}\n      disabled={withContextProps.disabled}\n      classNames={classNames}\n      styles={styles}\n      unstyled={unstyled}\n      data-checked={(contextChecked ?? checked) || undefined}\n      variant={variant}\n      ref={rootRef}\n      mod={mod}\n      attributes={attributes}\n      {...styleProps}\n      {...wrapperProps}\n    >\n      <Box {...getStyles('inner')} mod={{ 'label-position': labelPosition }}>\n        <Box\n          {...getStyles('radio', { focusable: true, variant })}\n          {...rest}\n          {...withContextProps}\n          component=\"input\"\n          mod={{ error: !!error, 'with-error-styles': withErrorStyles }}\n          id={uuid}\n          type=\"radio\"\n          aria-describedby={describedBy}\n        />\n        <Icon {...getStyles('icon')} aria-hidden />\n      </Box>\n    </InlineInput>\n  );\n});\n\nRadio.classes = classes;\nRadio.varsResolver = varsResolver;\nRadio.displayName = '@mantine/core/Radio';\nRadio.Group = RadioGroup;\nRadio.Card = RadioCard;\nRadio.Indicator = RadioIndicator;\n\nexport namespace Radio {\n  export type Props = RadioProps;\n  export type StylesNames = RadioStylesNames;\n  export type Factory = RadioFactory;\n  export type Variant = RadioVariant;\n\n  export namespace Group {\n    export type Props = RadioGroupProps;\n    export type StylesNames = RadioGroupStylesNames;\n    export type Factory = RadioGroupFactory;\n    export type ContextValue = RadioGroupContextValue;\n  }\n\n  export namespace Card {\n    export type Props = RadioCardProps;\n    export type StylesNames = RadioCardStylesNames;\n    export type Factory = RadioCardFactory;\n    export type CssVariables = RadioCardCssVariables;\n    export type ContextValue = RadioCardContextValue;\n  }\n\n  export namespace Indicator {\n    export type Props = RadioIndicatorProps;\n    export type StylesNames = RadioIndicatorStylesNames;\n    export type Factory = RadioIndicatorFactory;\n    export type CssVariables = RadioIndicatorCssVariables;\n    export type Variant = RadioIndicatorVariant;\n  }\n}\n"],"mappings":"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"}

package/esm/components/Radio/RadioCard/RadioCard.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"RadioCard.mjs","names":["classes"],"sources":["../../../../src/components/Radio/RadioCard/RadioCard.tsx"],"sourcesContent":["import { createContext, use } from 'react';\nimport {\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getRadius,\n  MantineRadius,\n  StylesApiProps,\n  useDirection,\n  useProps,\n  useStyles,\n} from '../../../core';\nimport { UnstyledButton } from '../../UnstyledButton';\nimport { RadioGroupContext } from '../RadioGroup/RadioGroup';\nimport classes from './RadioCard.module.css';\n\nexport interface RadioCardContextValue {\n  checked: boolean;\n}\n\nexport const RadioCardContext = createContext<RadioCardContextValue | null>(null);\n\nexport type RadioCardStylesNames = 'card';\nexport type RadioCardCssVariables = {\n  card: '--card-radius';\n};\n\nexport interface RadioCardProps\n  extends BoxProps, StylesApiProps<RadioCardFactory>, ElementProps<'button', 'onChange'> {\n  /** Checked state */\n  checked?: boolean;\n\n  /** Adds border to the root element */\n  withBorder?: boolean;\n\n  /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem @default theme.defaultRadius */\n  radius?: MantineRadius;\n\n  /** Value of the radio, used with Radio.Group */\n  value?: string;\n\n  /** Value used to associate all related radio cards, required for accessibility if used outside of `Radio.Group` */\n  name?: string;\n}\n\nexport type RadioCardFactory = Factory<{\n  props: RadioCardProps;\n  ref: HTMLButtonElement;\n  stylesNames: RadioCardStylesNames;\n  vars: RadioCardCssVariables;\n}>;\n\nconst defaultProps = {\n  withBorder: true,\n} satisfies Partial<RadioCardProps>;\n\nconst varsResolver = createVarsResolver<RadioCardFactory>((_, { radius }) => ({\n  card: {\n    '--card-radius': getRadius(radius),\n  },\n}));\n\nexport const RadioCard = factory<RadioCardFactory>((_props) => {\n  const props = useProps('RadioCard', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    checked,\n    mod,\n    withBorder,\n    value,\n    onClick,\n    name,\n    onKeyDown,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<RadioCardFactory>({\n    name: 'RadioCard',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n    rootSelector: 'card',\n  });\n\n  const { dir } = useDirection();\n  const ctx = use(RadioGroupContext);\n  const _checked = typeof checked === 'boolean' ? checked : ctx?.value === value || false;\n  const _name = name || ctx?.name;\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLButtonElement>) => {\n    onKeyDown?.(event);\n\n    if (!_name) {\n      return;\n    }\n\n    if (['ArrowDown', 'ArrowUp', 'ArrowLeft', 'ArrowRight'].includes(event.nativeEvent.code)) {\n      event.preventDefault();\n\n      const siblings = Array.from(\n        document.querySelectorAll<HTMLButtonElement>(`[role=\"radio\"][name=\"${_name}\"]`)\n      );\n\n      const currentIndex = siblings.findIndex((element) => element === event.target);\n      const nextIndex = currentIndex + 1 >= siblings.length ? 0 : currentIndex + 1;\n      const prevIndex = currentIndex - 1 < 0 ? siblings.length - 1 : currentIndex - 1;\n\n      if (event.nativeEvent.code === 'ArrowDown') {\n        siblings[nextIndex].focus();\n        siblings[nextIndex].click();\n      }\n\n      if (event.nativeEvent.code === 'ArrowUp') {\n        siblings[prevIndex].focus();\n        siblings[prevIndex].click();\n      }\n\n      if (event.nativeEvent.code === 'ArrowLeft') {\n        siblings[dir === 'ltr' ? prevIndex : nextIndex].focus();\n        siblings[dir === 'ltr' ? prevIndex : nextIndex].click();\n      }\n\n      if (event.nativeEvent.code === 'ArrowRight') {\n        siblings[dir === 'ltr' ? nextIndex : prevIndex].focus();\n        siblings[dir === 'ltr' ? nextIndex : prevIndex].click();\n      }\n    }\n  };\n\n  return (\n    <RadioCardContext value={{ checked: _checked }}>\n      {/* eslint-disable-next-line jsx-a11y/interactive-supports-focus -- UnstyledButton renders a native <button> which is focusable */}\n      <UnstyledButton\n        mod={[{ 'with-border': withBorder, checked: _checked }, mod]}\n        {...getStyles('card')}\n        {...others}\n        role=\"radio\"\n        aria-checked={_checked}\n        name={_name}\n        onClick={(event) => {\n          onClick?.(event);\n          ctx?.onChange(value || '');\n        }}\n        onKeyDown={handleKeyDown}\n      />\n    </RadioCardContext>\n  );\n});\n\nRadioCard.displayName = '@mantine/core/RadioCard';\nRadioCard.classes = classes;\nRadioCard.varsResolver = varsResolver;\n"],"mappings":";;;;;;;;;;;;;AAsBA,MAAa,mBAAmB,cAA4C,IAAI;AAgChF,MAAM,eAAe,EACnB,YAAY,KACd;AAEA,MAAM,eAAe,oBAAsC,GAAG,EAAE,cAAc,EAC5E,MAAM,EACJ,iBAAiB,UAAU,MAAM,EACnC,EACF,EAAE;AAEF,MAAa,YAAY,SAA2B,WAAW;CAC7D,MAAM,QAAQ,SAAS,aAAa,cAAc,MAAM;CACxD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,SACA,KACA,YACA,OACA,SACA,MACA,WACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA4B;EAC5C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;CAChB,CAAC;CAED,MAAM,EAAE,QAAQ,aAAa;CAC7B,MAAM,MAAM,IAAI,iBAAiB;CACjC,MAAM,WAAW,OAAO,YAAY,YAAY,UAAU,KAAK,UAAU,SAAS;CAClF,MAAM,QAAQ,QAAQ,KAAK;CAE3B,MAAM,iBAAiB,UAAkD;EACvE,YAAY,KAAK;EAEjB,IAAI,CAAC,OACH;EAGF,IAAI;GAAC;GAAa;GAAW;GAAa;EAAY,EAAE,SAAS,MAAM,YAAY,IAAI,GAAG;GACxF,MAAM,eAAe;GAErB,MAAM,WAAW,MAAM,KACrB,SAAS,iBAAoC,wBAAwB,MAAM,GAAG,CAChF;GAEA,MAAM,eAAe,SAAS,WAAW,YAAY,YAAY,MAAM,MAAM;GAC7E,MAAM,YAAY,eAAe,KAAK,SAAS,SAAS,IAAI,eAAe;GAC3E,MAAM,YAAY,eAAe,IAAI,IAAI,SAAS,SAAS,IAAI,eAAe;GAE9E,IAAI,MAAM,YAAY,SAAS,aAAa;IAC1C,SAAS,WAAW,MAAM;IAC1B,SAAS,WAAW,MAAM;GAC5B;GAEA,IAAI,MAAM,YAAY,SAAS,WAAW;IACxC,SAAS,WAAW,MAAM;IAC1B,SAAS,WAAW,MAAM;GAC5B;GAEA,IAAI,MAAM,YAAY,SAAS,aAAa;IAC1C,SAAS,QAAQ,QAAQ,YAAY,WAAW,MAAM;IACtD,SAAS,QAAQ,QAAQ,YAAY,WAAW,MAAM;GACxD;GAEA,IAAI,MAAM,YAAY,SAAS,cAAc;IAC3C,SAAS,QAAQ,QAAQ,YAAY,WAAW,MAAM;IACtD,SAAS,QAAQ,QAAQ,YAAY,WAAW,MAAM;GACxD;EACF;CACF;CAEA,OACE,oBAAC,kBAAD;EAAkB,OAAO,EAAE,SAAS,SAAS;YAE3C,oBAAC,gBAAD;GACE,KAAK,CAAC;IAAE,eAAe;IAAY,SAAS;GAAS,GAAG,GAAG;GAC3D,GAAI,UAAU,MAAM;GACpB,GAAI;GACJ,MAAK;GACL,gBAAc;GACd,MAAM;GACN,UAAU,UAAU;IAClB,UAAU,KAAK;IACf,KAAK,SAAS,SAAS,EAAE;GAC3B;GACA,WAAW;EACZ,CAAA;CACe,CAAA;AAEtB,CAAC;AAED,UAAU,cAAc;AACxB,UAAU,UAAUA;AACpB,UAAU,eAAe"}
+{"version":3,"file":"RadioCard.mjs","names":["classes"],"sources":["../../../../src/components/Radio/RadioCard/RadioCard.tsx"],"sourcesContent":["import { createContext, use } from 'react';\nimport {\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getRadius,\n  MantineRadius,\n  StylesApiProps,\n  useDirection,\n  useProps,\n  useStyles,\n} from '../../../core';\nimport { UnstyledButton } from '../../UnstyledButton';\nimport { RadioGroupContext } from '../RadioGroup/RadioGroup';\nimport classes from './RadioCard.module.css';\n\nexport interface RadioCardContextValue {\n  checked: boolean;\n}\n\nexport const RadioCardContext = createContext<RadioCardContextValue | null>(null);\n\nexport type RadioCardStylesNames = 'card';\nexport type RadioCardCssVariables = {\n  card: '--card-radius';\n};\n\nexport interface RadioCardProps\n  extends BoxProps, StylesApiProps<RadioCardFactory>, ElementProps<'button', 'onChange'> {\n  /** Checked state */\n  checked?: boolean;\n\n  /** Adds border to the root element */\n  withBorder?: boolean;\n\n  /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem @default theme.defaultRadius */\n  radius?: MantineRadius;\n\n  /** Value of the radio, used with Radio.Group */\n  value?: string;\n\n  /** Value used to associate all related radio cards, required for accessibility if used outside of `Radio.Group` */\n  name?: string;\n}\n\nexport type RadioCardFactory = Factory<{\n  props: RadioCardProps;\n  ref: HTMLButtonElement;\n  stylesNames: RadioCardStylesNames;\n  vars: RadioCardCssVariables;\n}>;\n\nconst defaultProps = {\n  withBorder: true,\n} satisfies Partial<RadioCardProps>;\n\nconst varsResolver = createVarsResolver<RadioCardFactory>((_, { radius }) => ({\n  card: {\n    '--card-radius': getRadius(radius),\n  },\n}));\n\nexport const RadioCard = factory<RadioCardFactory>((_props) => {\n  const props = useProps('RadioCard', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    checked,\n    mod,\n    withBorder,\n    value,\n    onClick,\n    name,\n    onKeyDown,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<RadioCardFactory>({\n    name: 'RadioCard',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n    rootSelector: 'card',\n  });\n\n  const { dir } = useDirection();\n  const ctx = use(RadioGroupContext);\n  const _checked = typeof checked === 'boolean' ? checked : ctx?.value === value || false;\n  const _name = name || ctx?.name;\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLButtonElement>) => {\n    onKeyDown?.(event);\n\n    if (!_name) {\n      return;\n    }\n\n    if (['ArrowDown', 'ArrowUp', 'ArrowLeft', 'ArrowRight'].includes(event.nativeEvent.code)) {\n      event.preventDefault();\n\n      const siblings = Array.from(\n        document.querySelectorAll<HTMLButtonElement>(`[role=\"radio\"][name=\"${_name}\"]`)\n      );\n\n      const currentIndex = siblings.findIndex((element) => element === event.target);\n      const nextIndex = currentIndex + 1 >= siblings.length ? 0 : currentIndex + 1;\n      const prevIndex = currentIndex - 1 < 0 ? siblings.length - 1 : currentIndex - 1;\n\n      if (event.nativeEvent.code === 'ArrowDown') {\n        siblings[nextIndex].focus();\n        siblings[nextIndex].click();\n      }\n\n      if (event.nativeEvent.code === 'ArrowUp') {\n        siblings[prevIndex].focus();\n        siblings[prevIndex].click();\n      }\n\n      if (event.nativeEvent.code === 'ArrowLeft') {\n        siblings[dir === 'ltr' ? prevIndex : nextIndex].focus();\n        siblings[dir === 'ltr' ? prevIndex : nextIndex].click();\n      }\n\n      if (event.nativeEvent.code === 'ArrowRight') {\n        siblings[dir === 'ltr' ? nextIndex : prevIndex].focus();\n        siblings[dir === 'ltr' ? nextIndex : prevIndex].click();\n      }\n    }\n  };\n\n  return (\n    <RadioCardContext value={{ checked: _checked }}>\n      {/* eslint-disable-next-line jsx-a11y/interactive-supports-focus -- UnstyledButton renders a native <button> which is focusable */}\n      <UnstyledButton\n        mod={[{ 'with-border': withBorder, checked: _checked }, mod]}\n        {...getStyles('card')}\n        {...others}\n        role=\"radio\"\n        aria-checked={_checked}\n        name={_name}\n        onClick={(event) => {\n          onClick?.(event);\n          ctx?.onChange(value || '');\n        }}\n        onKeyDown={handleKeyDown}\n      />\n    </RadioCardContext>\n  );\n});\n\nRadioCard.displayName = '@mantine/core/RadioCard';\nRadioCard.classes = classes;\nRadioCard.varsResolver = varsResolver;\n"],"mappings":";;;;;;;;;;;;;AAsBA,MAAa,mBAAmB,cAA4C,IAAI;AAgChF,MAAM,eAAe,EACnB,YAAY,KACd;AAEA,MAAM,eAAe,oBAAsC,GAAG,EAAE,cAAc,EAC5E,MAAM,EACJ,iBAAiB,UAAU,MAAM,EACnC,EACF,EAAE;AAEF,MAAa,YAAY,SAA2B,WAAW;CAC7D,MAAM,QAAQ,SAAS,aAAa,cAAc,MAAM;CACxD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,SACA,KACA,YACA,OACA,SACA,MACA,WACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA4B;EAC5C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;CAChB,CAAC;CAED,MAAM,EAAE,QAAQ,aAAa;CAC7B,MAAM,MAAM,IAAI,iBAAiB;CACjC,MAAM,WAAW,OAAO,YAAY,YAAY,UAAU,KAAK,UAAU,SAAS;CAClF,MAAM,QAAQ,QAAQ,KAAK;CAE3B,MAAM,iBAAiB,UAAkD;EACvE,YAAY,KAAK;EAEjB,IAAI,CAAC,OACH;EAGF,IAAI;GAAC;GAAa;GAAW;GAAa;EAAY,CAAC,CAAC,SAAS,MAAM,YAAY,IAAI,GAAG;GACxF,MAAM,eAAe;GAErB,MAAM,WAAW,MAAM,KACrB,SAAS,iBAAoC,wBAAwB,MAAM,GAAG,CAChF;GAEA,MAAM,eAAe,SAAS,WAAW,YAAY,YAAY,MAAM,MAAM;GAC7E,MAAM,YAAY,eAAe,KAAK,SAAS,SAAS,IAAI,eAAe;GAC3E,MAAM,YAAY,eAAe,IAAI,IAAI,SAAS,SAAS,IAAI,eAAe;GAE9E,IAAI,MAAM,YAAY,SAAS,aAAa;IAC1C,SAAS,UAAU,CAAC,MAAM;IAC1B,SAAS,UAAU,CAAC,MAAM;GAC5B;GAEA,IAAI,MAAM,YAAY,SAAS,WAAW;IACxC,SAAS,UAAU,CAAC,MAAM;IAC1B,SAAS,UAAU,CAAC,MAAM;GAC5B;GAEA,IAAI,MAAM,YAAY,SAAS,aAAa;IAC1C,SAAS,QAAQ,QAAQ,YAAY,UAAU,CAAC,MAAM;IACtD,SAAS,QAAQ,QAAQ,YAAY,UAAU,CAAC,MAAM;GACxD;GAEA,IAAI,MAAM,YAAY,SAAS,cAAc;IAC3C,SAAS,QAAQ,QAAQ,YAAY,UAAU,CAAC,MAAM;IACtD,SAAS,QAAQ,QAAQ,YAAY,UAAU,CAAC,MAAM;GACxD;EACF;CACF;CAEA,OACE,oBAAC,kBAAD;EAAkB,OAAO,EAAE,SAAS,SAAS;YAE3C,oBAAC,gBAAD;GACE,KAAK,CAAC;IAAE,eAAe;IAAY,SAAS;GAAS,GAAG,GAAG;GAC3D,GAAI,UAAU,MAAM;GACpB,GAAI;GACJ,MAAK;GACL,gBAAc;GACd,MAAM;GACN,UAAU,UAAU;IAClB,UAAU,KAAK;IACf,KAAK,SAAS,SAAS,EAAE;GAC3B;GACA,WAAW;EACZ,CAAA;CACe,CAAA;AAEtB,CAAC;AAED,UAAU,cAAc;AACxB,UAAU,UAAUA;AACpB,UAAU,eAAe"}

package/esm/components/Rating/Rating.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Rating.mjs","names":["useId","classes"],"sources":["../../../src/components/Rating/Rating.tsx"],"sourcesContent":["import { useRef, useState } from 'react';\nimport { clamp, useId, useMergedRef, useUncontrolled } from '@mantine/hooks';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getSize,\n  getThemeColor,\n  MantineColor,\n  MantineSize,\n  StylesApiProps,\n  useDirection,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { RatingProvider } from './Rating.context';\nimport { RatingItem } from './RatingItem/RatingItem';\nimport classes from './Rating.module.css';\n\nfunction roundValueTo(value: number, to: number) {\n  const rounded = Math.round(value / to) * to;\n  const precision = `${to}`.split('.')[1]?.length || 0;\n  return Number(rounded.toFixed(precision));\n}\n\nexport type RatingStylesNames =\n  | 'root'\n  | 'starSymbol'\n  | 'input'\n  | 'label'\n  | 'symbolBody'\n  | 'symbolGroup';\n\nexport type RatingCssVariables = {\n  root: '--rating-size' | '--rating-color';\n};\n\nexport interface RatingProps\n  extends BoxProps, StylesApiProps<RatingFactory>, ElementProps<'div', 'onChange'> {\n  /** Uncontrolled component default value */\n  defaultValue?: number;\n\n  /** Controlled component value */\n  value?: number;\n\n  /** Called when value changes */\n  onChange?: (value: number) => void;\n\n  /** Icon displayed for unselected rating items. Can be a function that receives the rating value. */\n  emptySymbol?: React.ReactNode | ((value: number) => React.ReactNode);\n\n  /** Icon displayed for selected rating items. Can be a function that receives the rating value. */\n  fullSymbol?: React.ReactNode | ((value: number) => React.ReactNode);\n\n  /** Number of fractions each item can be divided into, default is 1 */\n  fractions?: number;\n\n  /** Controls component size @default 'sm' */\n  size?: MantineSize | number | (string & {});\n\n  /** Number of rating items (stars), default is 5 */\n  count?: number;\n\n  /** Called when rating item is hovered. Receives -1 when hover ends. */\n  onHover?: (value: number) => void;\n\n  /** Function to generate aria-label for each rating value. Receives the rating value as argument, default is (value) => String(value) */\n  getSymbolLabel?: (index: number) => string;\n\n  /** Name attribute for form submission. If not provided, a unique id will be generated. */\n  name?: string;\n\n  /** When true, rating cannot be changed by user interaction, default is false */\n  readOnly?: boolean;\n\n  /** When true, clicking the same rating value clears the rating to 0, default is false */\n  allowClear?: boolean;\n\n  /** When true, only the clicked rating item is highlighted, not all items up to the selected value, default is false */\n  highlightSelectedOnly?: boolean;\n\n  /** Key of theme.colors or any CSS color value, default is 'yellow' */\n  color?: MantineColor;\n}\n\nexport type RatingFactory = Factory<{\n  props: RatingProps;\n  ref: HTMLDivElement;\n  stylesNames: RatingStylesNames;\n  vars: RatingCssVariables;\n}>;\n\nconst defaultProps = {\n  size: 'sm',\n  getSymbolLabel: (value) => `${value}`,\n  count: 5,\n  fractions: 1,\n  color: 'yellow',\n} satisfies Partial<RatingProps>;\n\nconst varsResolver = createVarsResolver<RatingFactory>((theme, { size, color }) => ({\n  root: {\n    '--rating-size': getSize(size, 'rating-size'),\n    '--rating-color': getThemeColor(color, theme),\n  },\n}));\n\nexport const Rating = factory<RatingFactory>((_props) => {\n  const props = useProps('Rating', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    name,\n    id,\n    value,\n    defaultValue,\n    onChange,\n    fractions,\n    count,\n    onMouseEnter,\n    readOnly,\n    allowClear,\n    onMouseMove,\n    onHover,\n    onMouseLeave,\n    onTouchStart,\n    onTouchEnd,\n    size,\n    variant,\n    getSymbolLabel,\n    color,\n    emptySymbol,\n    fullSymbol,\n    highlightSelectedOnly,\n    attributes,\n    ref,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<RatingFactory>({\n    name: 'Rating',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const { dir } = useDirection();\n\n  const _name = useId(name);\n  const _id = useId(id);\n  const rootRef = useRef<HTMLDivElement>(null);\n\n  const [_value, setValue] = useUncontrolled({\n    value,\n    defaultValue,\n    finalValue: 0,\n    onChange,\n  });\n\n  const [hovered, setHovered] = useState(-1);\n  const [isOutside, setOutside] = useState(true);\n\n  const _fractions = Math.floor(fractions);\n  const _count = Math.floor(count);\n\n  const decimalUnit = 1 / _fractions;\n  const stableValueRounded = roundValueTo(_value, decimalUnit);\n  const finalValue = hovered !== -1 ? hovered : stableValueRounded;\n\n  const getRatingFromCoordinates = (x: number) => {\n    if (!rootRef.current) {\n      return 0;\n    }\n\n    const { left, right, width } = rootRef.current.getBoundingClientRect();\n    const symbolWidth = width / _count;\n\n    const hoverPosition = dir === 'rtl' ? right - x : x - left;\n    const hoverValue = hoverPosition / symbolWidth;\n\n    return clamp(roundValueTo(hoverValue + decimalUnit / 2, decimalUnit), decimalUnit, _count);\n  };\n\n  const handleMouseEnter = (event: React.MouseEvent<HTMLDivElement>) => {\n    onMouseEnter?.(event);\n    !readOnly && setOutside(false);\n  };\n\n  const handleMouseMove = (event: React.MouseEvent<HTMLDivElement>) => {\n    onMouseMove?.(event);\n\n    if (readOnly) {\n      return;\n    }\n\n    const rounded = getRatingFromCoordinates(event.clientX);\n\n    setHovered(rounded);\n    rounded !== hovered && onHover?.(rounded);\n  };\n\n  const handleMouseLeave = (event: React.MouseEvent<HTMLDivElement>) => {\n    onMouseLeave?.(event);\n\n    if (readOnly) {\n      return;\n    }\n\n    setHovered(-1);\n    setOutside(true);\n    hovered !== -1 && onHover?.(-1);\n  };\n\n  const handleTouchStart = (event: React.TouchEvent<HTMLDivElement>) => {\n    const { touches } = event;\n    if (touches.length !== 1) {\n      return;\n    }\n\n    if (!readOnly) {\n      const touch = touches[0];\n      setValue(getRatingFromCoordinates(touch.clientX));\n    }\n\n    onTouchStart?.(event);\n  };\n\n  const handleTouchEnd = (event: React.TouchEvent<HTMLDivElement>) => {\n    event.preventDefault();\n\n    onTouchEnd?.(event);\n  };\n\n  const handleItemBlur = () => isOutside && setHovered(-1);\n\n  const handleInputChange = (event: React.ChangeEvent<HTMLInputElement> | number) => {\n    if (!readOnly) {\n      if (typeof event === 'number') {\n        setHovered(event);\n      } else {\n        setHovered(parseFloat(event.target.value));\n      }\n    }\n  };\n\n  const handleChange = (event: React.ChangeEvent<HTMLInputElement> | number) => {\n    if (!readOnly) {\n      const newValue = typeof event === 'number' ? event : parseFloat(event.target.value);\n\n      // If allowClear is true and clicking the same value, reset to 0\n      if (allowClear && newValue === stableValueRounded) {\n        setValue(0);\n      } else {\n        setValue(newValue);\n      }\n    }\n  };\n\n  const items = Array(_count)\n    .fill(0)\n    .map((_, index) => {\n      const integerValue = index + 1;\n      const fractionItems = Array.from(new Array(index === 0 ? _fractions + 1 : _fractions));\n      const isGroupActive = !readOnly && Math.ceil(hovered) === integerValue;\n\n      return (\n        <div\n          key={integerValue}\n          data-active={isGroupActive || undefined}\n          {...getStyles('symbolGroup')}\n        >\n          {fractionItems.map((__, fractionIndex) => {\n            const fractionValue = decimalUnit * (index === 0 ? fractionIndex : fractionIndex + 1);\n            const symbolValue = roundValueTo(integerValue - 1 + fractionValue, decimalUnit);\n\n            return (\n              <RatingItem\n                key={`${integerValue}-${symbolValue}`}\n                getSymbolLabel={getSymbolLabel}\n                emptyIcon={emptySymbol}\n                fullIcon={fullSymbol}\n                full={\n                  highlightSelectedOnly ? symbolValue === finalValue : symbolValue <= finalValue\n                }\n                active={symbolValue === finalValue}\n                checked={symbolValue === stableValueRounded}\n                readOnly={readOnly}\n                fractionValue={fractionValue}\n                value={symbolValue}\n                name={_name}\n                onChange={handleChange}\n                onBlur={handleItemBlur}\n                onInputChange={handleInputChange}\n                id={`${_id}-${index}-${fractionIndex}`}\n              />\n            );\n          })}\n        </div>\n      );\n    });\n\n  return (\n    <RatingProvider value={{ getStyles }}>\n      <Box\n        ref={useMergedRef(rootRef, ref)}\n        {...getStyles('root')}\n        onMouseMove={handleMouseMove}\n        onMouseEnter={handleMouseEnter}\n        onMouseLeave={handleMouseLeave}\n        onTouchStart={handleTouchStart}\n        onTouchEnd={handleTouchEnd}\n        variant={variant}\n        size={size}\n        id={_id}\n        {...others}\n      >\n        {items}\n      </Box>\n    </RatingProvider>\n  );\n});\n\nRating.classes = classes;\nRating.varsResolver = varsResolver;\nRating.displayName = '@mantine/core/Rating';\n\nexport namespace Rating {\n  export type Props = RatingProps;\n  export type StylesNames = RatingStylesNames;\n  export type Factory = RatingFactory;\n}\n"],"mappings":"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"}
+{"version":3,"file":"Rating.mjs","names":["useId","classes"],"sources":["../../../src/components/Rating/Rating.tsx"],"sourcesContent":["import { useRef, useState } from 'react';\nimport { clamp, useId, useMergedRef, useUncontrolled } from '@mantine/hooks';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getSize,\n  getThemeColor,\n  MantineColor,\n  MantineSize,\n  StylesApiProps,\n  useDirection,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { RatingProvider } from './Rating.context';\nimport { RatingItem } from './RatingItem/RatingItem';\nimport classes from './Rating.module.css';\n\nfunction roundValueTo(value: number, to: number) {\n  const rounded = Math.round(value / to) * to;\n  const precision = `${to}`.split('.')[1]?.length || 0;\n  return Number(rounded.toFixed(precision));\n}\n\nexport type RatingStylesNames =\n  | 'root'\n  | 'starSymbol'\n  | 'input'\n  | 'label'\n  | 'symbolBody'\n  | 'symbolGroup';\n\nexport type RatingCssVariables = {\n  root: '--rating-size' | '--rating-color';\n};\n\nexport interface RatingProps\n  extends BoxProps, StylesApiProps<RatingFactory>, ElementProps<'div', 'onChange'> {\n  /** Uncontrolled component default value */\n  defaultValue?: number;\n\n  /** Controlled component value */\n  value?: number;\n\n  /** Called when value changes */\n  onChange?: (value: number) => void;\n\n  /** Icon displayed for unselected rating items. Can be a function that receives the rating value. */\n  emptySymbol?: React.ReactNode | ((value: number) => React.ReactNode);\n\n  /** Icon displayed for selected rating items. Can be a function that receives the rating value. */\n  fullSymbol?: React.ReactNode | ((value: number) => React.ReactNode);\n\n  /** Number of fractions each item can be divided into, default is 1 */\n  fractions?: number;\n\n  /** Controls component size @default 'sm' */\n  size?: MantineSize | number | (string & {});\n\n  /** Number of rating items (stars), default is 5 */\n  count?: number;\n\n  /** Called when rating item is hovered. Receives -1 when hover ends. */\n  onHover?: (value: number) => void;\n\n  /** Function to generate aria-label for each rating value. Receives the rating value as argument, default is (value) => String(value) */\n  getSymbolLabel?: (index: number) => string;\n\n  /** Name attribute for form submission. If not provided, a unique id will be generated. */\n  name?: string;\n\n  /** When true, rating cannot be changed by user interaction, default is false */\n  readOnly?: boolean;\n\n  /** When true, clicking the same rating value clears the rating to 0, default is false */\n  allowClear?: boolean;\n\n  /** When true, only the clicked rating item is highlighted, not all items up to the selected value, default is false */\n  highlightSelectedOnly?: boolean;\n\n  /** Key of theme.colors or any CSS color value, default is 'yellow' */\n  color?: MantineColor;\n}\n\nexport type RatingFactory = Factory<{\n  props: RatingProps;\n  ref: HTMLDivElement;\n  stylesNames: RatingStylesNames;\n  vars: RatingCssVariables;\n}>;\n\nconst defaultProps = {\n  size: 'sm',\n  getSymbolLabel: (value) => `${value}`,\n  count: 5,\n  fractions: 1,\n  color: 'yellow',\n} satisfies Partial<RatingProps>;\n\nconst varsResolver = createVarsResolver<RatingFactory>((theme, { size, color }) => ({\n  root: {\n    '--rating-size': getSize(size, 'rating-size'),\n    '--rating-color': getThemeColor(color, theme),\n  },\n}));\n\nexport const Rating = factory<RatingFactory>((_props) => {\n  const props = useProps('Rating', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    name,\n    id,\n    value,\n    defaultValue,\n    onChange,\n    fractions,\n    count,\n    onMouseEnter,\n    readOnly,\n    allowClear,\n    onMouseMove,\n    onHover,\n    onMouseLeave,\n    onTouchStart,\n    onTouchEnd,\n    size,\n    variant,\n    getSymbolLabel,\n    color,\n    emptySymbol,\n    fullSymbol,\n    highlightSelectedOnly,\n    attributes,\n    ref,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<RatingFactory>({\n    name: 'Rating',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const { dir } = useDirection();\n\n  const _name = useId(name);\n  const _id = useId(id);\n  const rootRef = useRef<HTMLDivElement>(null);\n\n  const [_value, setValue] = useUncontrolled({\n    value,\n    defaultValue,\n    finalValue: 0,\n    onChange,\n  });\n\n  const [hovered, setHovered] = useState(-1);\n  const [isOutside, setOutside] = useState(true);\n\n  const _fractions = Math.floor(fractions);\n  const _count = Math.floor(count);\n\n  const decimalUnit = 1 / _fractions;\n  const stableValueRounded = roundValueTo(_value, decimalUnit);\n  const finalValue = hovered !== -1 ? hovered : stableValueRounded;\n\n  const getRatingFromCoordinates = (x: number) => {\n    if (!rootRef.current) {\n      return 0;\n    }\n\n    const { left, right, width } = rootRef.current.getBoundingClientRect();\n    const symbolWidth = width / _count;\n\n    const hoverPosition = dir === 'rtl' ? right - x : x - left;\n    const hoverValue = hoverPosition / symbolWidth;\n\n    return clamp(roundValueTo(hoverValue + decimalUnit / 2, decimalUnit), decimalUnit, _count);\n  };\n\n  const handleMouseEnter = (event: React.MouseEvent<HTMLDivElement>) => {\n    onMouseEnter?.(event);\n    !readOnly && setOutside(false);\n  };\n\n  const handleMouseMove = (event: React.MouseEvent<HTMLDivElement>) => {\n    onMouseMove?.(event);\n\n    if (readOnly) {\n      return;\n    }\n\n    const rounded = getRatingFromCoordinates(event.clientX);\n\n    setHovered(rounded);\n    rounded !== hovered && onHover?.(rounded);\n  };\n\n  const handleMouseLeave = (event: React.MouseEvent<HTMLDivElement>) => {\n    onMouseLeave?.(event);\n\n    if (readOnly) {\n      return;\n    }\n\n    setHovered(-1);\n    setOutside(true);\n    hovered !== -1 && onHover?.(-1);\n  };\n\n  const handleTouchStart = (event: React.TouchEvent<HTMLDivElement>) => {\n    const { touches } = event;\n    if (touches.length !== 1) {\n      return;\n    }\n\n    if (!readOnly) {\n      const touch = touches[0];\n      setValue(getRatingFromCoordinates(touch.clientX));\n    }\n\n    onTouchStart?.(event);\n  };\n\n  const handleTouchEnd = (event: React.TouchEvent<HTMLDivElement>) => {\n    event.preventDefault();\n\n    onTouchEnd?.(event);\n  };\n\n  const handleItemBlur = () => isOutside && setHovered(-1);\n\n  const handleInputChange = (event: React.ChangeEvent<HTMLInputElement> | number) => {\n    if (!readOnly) {\n      if (typeof event === 'number') {\n        setHovered(event);\n      } else {\n        setHovered(parseFloat(event.target.value));\n      }\n    }\n  };\n\n  const handleChange = (event: React.ChangeEvent<HTMLInputElement> | number) => {\n    if (!readOnly) {\n      const newValue = typeof event === 'number' ? event : parseFloat(event.target.value);\n\n      // If allowClear is true and clicking the same value, reset to 0\n      if (allowClear && newValue === stableValueRounded) {\n        setValue(0);\n      } else {\n        setValue(newValue);\n      }\n    }\n  };\n\n  const items = Array(_count)\n    .fill(0)\n    .map((_, index) => {\n      const integerValue = index + 1;\n      const fractionItems = Array.from(new Array(index === 0 ? _fractions + 1 : _fractions));\n      const isGroupActive = !readOnly && Math.ceil(hovered) === integerValue;\n\n      return (\n        <div\n          key={integerValue}\n          data-active={isGroupActive || undefined}\n          {...getStyles('symbolGroup')}\n        >\n          {fractionItems.map((__, fractionIndex) => {\n            const fractionValue = decimalUnit * (index === 0 ? fractionIndex : fractionIndex + 1);\n            const symbolValue = roundValueTo(integerValue - 1 + fractionValue, decimalUnit);\n\n            return (\n              <RatingItem\n                key={`${integerValue}-${symbolValue}`}\n                getSymbolLabel={getSymbolLabel}\n                emptyIcon={emptySymbol}\n                fullIcon={fullSymbol}\n                full={\n                  highlightSelectedOnly ? symbolValue === finalValue : symbolValue <= finalValue\n                }\n                active={symbolValue === finalValue}\n                checked={symbolValue === stableValueRounded}\n                readOnly={readOnly}\n                fractionValue={fractionValue}\n                value={symbolValue}\n                name={_name}\n                onChange={handleChange}\n                onBlur={handleItemBlur}\n                onInputChange={handleInputChange}\n                id={`${_id}-${index}-${fractionIndex}`}\n              />\n            );\n          })}\n        </div>\n      );\n    });\n\n  return (\n    <RatingProvider value={{ getStyles }}>\n      <Box\n        ref={useMergedRef(rootRef, ref)}\n        {...getStyles('root')}\n        onMouseMove={handleMouseMove}\n        onMouseEnter={handleMouseEnter}\n        onMouseLeave={handleMouseLeave}\n        onTouchStart={handleTouchStart}\n        onTouchEnd={handleTouchEnd}\n        variant={variant}\n        size={size}\n        id={_id}\n        {...others}\n      >\n        {items}\n      </Box>\n    </RatingProvider>\n  );\n});\n\nRating.classes = classes;\nRating.varsResolver = varsResolver;\nRating.displayName = '@mantine/core/Rating';\n\nexport namespace Rating {\n  export type Props = RatingProps;\n  export type StylesNames = RatingStylesNames;\n  export type Factory = RatingFactory;\n}\n"],"mappings":"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"}

package/esm/components/Rating/RatingItem/RatingItem.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"RatingItem.mjs","names":[],"sources":["../../../../src/components/Rating/RatingItem/RatingItem.tsx"],"sourcesContent":["import { Box, BoxProps, ElementProps, useDirection } from '../../../core';\nimport { useRatingContext } from '../Rating.context';\nimport { StarSymbol } from '../StarSymbol/StarSymbol';\n\nexport interface RatingItemProps extends BoxProps, ElementProps<'input', 'value' | 'size'> {\n  getSymbolLabel: ((value: number) => string) | undefined;\n  emptyIcon?: React.ReactNode | ((value: number) => React.ReactNode);\n  fullIcon?: React.ReactNode | ((value: number) => React.ReactNode);\n  full: boolean;\n  active: boolean;\n  fractionValue: number;\n  value: number;\n  id: string;\n  onChange: (event: React.ChangeEvent<HTMLInputElement> | number) => void;\n  onInputChange: (event: React.ChangeEvent<HTMLInputElement> | number) => void;\n}\n\nexport function RatingItem({\n  getSymbolLabel,\n  emptyIcon,\n  fullIcon,\n  full,\n  active,\n  value,\n  readOnly,\n  fractionValue,\n  color,\n  id,\n  onBlur,\n  onChange,\n  onInputChange,\n  style,\n  ...others\n}: RatingItemProps) {\n  const ctx = useRatingContext();\n  const _fullIcon = typeof fullIcon === 'function' ? fullIcon(value) : fullIcon;\n  const _emptyIcon = typeof emptyIcon === 'function' ? emptyIcon(value) : emptyIcon;\n  const { dir } = useDirection();\n\n  return (\n    <>\n      {!readOnly && (\n        <input\n          {...ctx.getStyles('input')}\n          onKeyDown={(event) => (event.key === ' ' || event.key === 'Enter') && onChange(value)}\n          id={id}\n          type=\"radio\"\n          data-active={active || undefined}\n          aria-label={getSymbolLabel?.(value)}\n          value={value}\n          onBlur={onBlur}\n          onChange={onInputChange}\n          {...others}\n        />\n      )}\n\n      <Box\n        component={readOnly ? 'div' : 'label'}\n        {...ctx.getStyles('label')}\n        data-read-only={readOnly || undefined}\n        htmlFor={id}\n        onClick={readOnly ? undefined : () => onChange(value)}\n        __vars={{\n          '--rating-item-z-index': (fractionValue === 1 ? undefined : active ? 2 : 0)?.toString(),\n        }}\n      >\n        <Box\n          {...ctx.getStyles('symbolBody')}\n          __vars={{\n            '--rating-symbol-clip-path':\n              fractionValue === 1\n                ? undefined\n                : dir === 'ltr'\n                  ? `inset(0 ${active ? 100 - fractionValue * 100 : 100}% 0 0)`\n                  : `inset(0 0 0 ${active ? 100 - fractionValue * 100 : 100}% )`,\n          }}\n        >\n          {full\n            ? _fullIcon || <StarSymbol type=\"full\" />\n            : _emptyIcon || <StarSymbol type=\"empty\" />}\n        </Box>\n      </Box>\n    </>\n  );\n}\n\nRatingItem.displayName = '@mantine/core/RatingItem';\n"],"mappings":";;;;;;;AAiBA,SAAgB,WAAW,EACzB,gBACA,WACA,UACA,MACA,QACA,OACA,UACA,eACA,OACA,IACA,QACA,UACA,eACA,OACA,GAAG,UACe;CAClB,MAAM,MAAM,iBAAiB;CAC7B,MAAM,YAAY,OAAO,aAAa,aAAa,SAAS,KAAK,IAAI;CACrE,MAAM,aAAa,OAAO,cAAc,aAAa,UAAU,KAAK,IAAI;CACxE,MAAM,EAAE,QAAQ,aAAa;CAE7B,OACE,qBAAA,UAAA,EAAA,UAAA,CACG,CAAC,YACA,oBAAC,SAAD;EACE,GAAI,IAAI,UAAU,OAAO;EACzB,YAAY,WAAW,MAAM,QAAQ,OAAO,MAAM,QAAQ,YAAY,SAAS,KAAK;EAChF;EACJ,MAAK;EACL,eAAa,UAAU,KAAA;EACvB,cAAY,iBAAiB,KAAK;EAC3B;EACC;EACR,UAAU;EACV,GAAI;CACL,CAAA,GAGH,oBAAC,KAAD;EACE,WAAW,WAAW,QAAQ;EAC9B,GAAI,IAAI,UAAU,OAAO;EACzB,kBAAgB,YAAY,KAAA;EAC5B,SAAS;EACT,SAAS,WAAW,KAAA,UAAkB,SAAS,KAAK;EACpD,QAAQ,EACN,0BAA0B,kBAAkB,IAAI,KAAA,IAAY,SAAS,IAAI,IAAI,SAAS,EACxF;YAEA,oBAAC,KAAD;GACE,GAAI,IAAI,UAAU,YAAY;GAC9B,QAAQ,EACN,6BACE,kBAAkB,IACd,KAAA,IACA,QAAQ,QACN,WAAW,SAAS,MAAM,gBAAgB,MAAM,IAAI,UACpD,eAAe,SAAS,MAAM,gBAAgB,MAAM,IAAI,KAClE;aAEC,OACG,aAAa,oBAAC,YAAD,EAAY,MAAK,OAAQ,CAAA,IACtC,cAAc,oBAAC,YAAD,EAAY,MAAK,QAAS,CAAA;EACzC,CAAA;CACF,CAAA,CACL,EAAA,CAAA;AAEN;AAEA,WAAW,cAAc"}
+{"version":3,"file":"RatingItem.mjs","names":[],"sources":["../../../../src/components/Rating/RatingItem/RatingItem.tsx"],"sourcesContent":["import { Box, BoxProps, ElementProps, useDirection } from '../../../core';\nimport { useRatingContext } from '../Rating.context';\nimport { StarSymbol } from '../StarSymbol/StarSymbol';\n\nexport interface RatingItemProps extends BoxProps, ElementProps<'input', 'value' | 'size'> {\n  getSymbolLabel: ((value: number) => string) | undefined;\n  emptyIcon?: React.ReactNode | ((value: number) => React.ReactNode);\n  fullIcon?: React.ReactNode | ((value: number) => React.ReactNode);\n  full: boolean;\n  active: boolean;\n  fractionValue: number;\n  value: number;\n  id: string;\n  onChange: (event: React.ChangeEvent<HTMLInputElement> | number) => void;\n  onInputChange: (event: React.ChangeEvent<HTMLInputElement> | number) => void;\n}\n\nexport function RatingItem({\n  getSymbolLabel,\n  emptyIcon,\n  fullIcon,\n  full,\n  active,\n  value,\n  readOnly,\n  fractionValue,\n  color,\n  id,\n  onBlur,\n  onChange,\n  onInputChange,\n  style,\n  ...others\n}: RatingItemProps) {\n  const ctx = useRatingContext();\n  const _fullIcon = typeof fullIcon === 'function' ? fullIcon(value) : fullIcon;\n  const _emptyIcon = typeof emptyIcon === 'function' ? emptyIcon(value) : emptyIcon;\n  const { dir } = useDirection();\n\n  return (\n    <>\n      {!readOnly && (\n        <input\n          {...ctx.getStyles('input')}\n          onKeyDown={(event) => (event.key === ' ' || event.key === 'Enter') && onChange(value)}\n          id={id}\n          type=\"radio\"\n          data-active={active || undefined}\n          aria-label={getSymbolLabel?.(value)}\n          value={value}\n          onBlur={onBlur}\n          onChange={onInputChange}\n          {...others}\n        />\n      )}\n\n      <Box\n        component={readOnly ? 'div' : 'label'}\n        {...ctx.getStyles('label')}\n        data-read-only={readOnly || undefined}\n        htmlFor={id}\n        onClick={readOnly ? undefined : () => onChange(value)}\n        __vars={{\n          '--rating-item-z-index': (fractionValue === 1 ? undefined : active ? 2 : 0)?.toString(),\n        }}\n      >\n        <Box\n          {...ctx.getStyles('symbolBody')}\n          __vars={{\n            '--rating-symbol-clip-path':\n              fractionValue === 1\n                ? undefined\n                : dir === 'ltr'\n                  ? `inset(0 ${active ? 100 - fractionValue * 100 : 100}% 0 0)`\n                  : `inset(0 0 0 ${active ? 100 - fractionValue * 100 : 100}% )`,\n          }}\n        >\n          {full\n            ? _fullIcon || <StarSymbol type=\"full\" />\n            : _emptyIcon || <StarSymbol type=\"empty\" />}\n        </Box>\n      </Box>\n    </>\n  );\n}\n\nRatingItem.displayName = '@mantine/core/RatingItem';\n"],"mappings":";;;;;;;AAiBA,SAAgB,WAAW,EACzB,gBACA,WACA,UACA,MACA,QACA,OACA,UACA,eACA,OACA,IACA,QACA,UACA,eACA,OACA,GAAG,UACe;CAClB,MAAM,MAAM,iBAAiB;CAC7B,MAAM,YAAY,OAAO,aAAa,aAAa,SAAS,KAAK,IAAI;CACrE,MAAM,aAAa,OAAO,cAAc,aAAa,UAAU,KAAK,IAAI;CACxE,MAAM,EAAE,QAAQ,aAAa;CAE7B,OACE,qBAAA,UAAA,EAAA,UAAA,CACG,CAAC,YACA,oBAAC,SAAD;EACE,GAAI,IAAI,UAAU,OAAO;EACzB,YAAY,WAAW,MAAM,QAAQ,OAAO,MAAM,QAAQ,YAAY,SAAS,KAAK;EAChF;EACJ,MAAK;EACL,eAAa,UAAU,KAAA;EACvB,cAAY,iBAAiB,KAAK;EAC3B;EACC;EACR,UAAU;EACV,GAAI;CACL,CAAA,GAGH,oBAAC,KAAD;EACE,WAAW,WAAW,QAAQ;EAC9B,GAAI,IAAI,UAAU,OAAO;EACzB,kBAAgB,YAAY,KAAA;EAC5B,SAAS;EACT,SAAS,WAAW,KAAA,UAAkB,SAAS,KAAK;EACpD,QAAQ,EACN,0BAA0B,kBAAkB,IAAI,KAAA,IAAY,SAAS,IAAI,EAAA,EAAI,SAAS,EACxF;YAEA,oBAAC,KAAD;GACE,GAAI,IAAI,UAAU,YAAY;GAC9B,QAAQ,EACN,6BACE,kBAAkB,IACd,KAAA,IACA,QAAQ,QACN,WAAW,SAAS,MAAM,gBAAgB,MAAM,IAAI,UACpD,eAAe,SAAS,MAAM,gBAAgB,MAAM,IAAI,KAClE;aAEC,OACG,aAAa,oBAAC,YAAD,EAAY,MAAK,OAAQ,CAAA,IACtC,cAAc,oBAAC,YAAD,EAAY,MAAK,QAAS,CAAA;EACzC,CAAA;CACF,CAAA,CACL,EAAA,CAAA;AAEN;AAEA,WAAW,cAAc"}

package/esm/components/Rating/StarSymbol/StarSymbol.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"StarSymbol.mjs","names":[],"sources":["../../../../src/components/Rating/StarSymbol/StarSymbol.tsx"],"sourcesContent":["import { useRatingContext } from '../Rating.context';\nimport { StarIcon } from './StarIcon';\n\nexport interface StarSymbolProps {\n  type: 'empty' | 'full';\n}\n\nexport function StarSymbol({ type }: StarSymbolProps) {\n  const ctx = useRatingContext();\n  return <StarIcon {...ctx.getStyles('starSymbol')} data-filled={type === 'full' || undefined} />;\n}\n\nStarSymbol.displayName = '@mantine/core/StarSymbol';\n"],"mappings":";;;;;AAOA,SAAgB,WAAW,EAAE,QAAyB;CAEpD,OAAO,oBAAC,UAAD;EAAU,GADL,iBACW,EAAE,UAAU,YAAY;EAAG,eAAa,SAAS,UAAU,KAAA;CAAY,CAAA;AAChG;AAEA,WAAW,cAAc"}
+{"version":3,"file":"StarSymbol.mjs","names":[],"sources":["../../../../src/components/Rating/StarSymbol/StarSymbol.tsx"],"sourcesContent":["import { useRatingContext } from '../Rating.context';\nimport { StarIcon } from './StarIcon';\n\nexport interface StarSymbolProps {\n  type: 'empty' | 'full';\n}\n\nexport function StarSymbol({ type }: StarSymbolProps) {\n  const ctx = useRatingContext();\n  return <StarIcon {...ctx.getStyles('starSymbol')} data-filled={type === 'full' || undefined} />;\n}\n\nStarSymbol.displayName = '@mantine/core/StarSymbol';\n"],"mappings":";;;;;AAOA,SAAgB,WAAW,EAAE,QAAyB;CAEpD,OAAO,oBAAC,UAAD;EAAU,GADL,iBACW,CAAC,CAAC,UAAU,YAAY;EAAG,eAAa,SAAS,UAAU,KAAA;CAAY,CAAA;AAChG;AAEA,WAAW,cAAc"}

package/esm/components/RingProgress/RingProgress.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"RingProgress.mjs","names":["classes"],"sources":["../../../src/components/RingProgress/RingProgress.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  DataAttributes,\n  ElementProps,\n  factory,\n  Factory,\n  MantineColor,\n  rem,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { Curve } from './Curve/Curve';\nimport { getCurves } from './get-curves/get-curves';\nimport classes from './RingProgress.module.css';\n\nfunction getClampedThickness(thickness: number, size: number) {\n  return Math.min(thickness || 12, (size || 120) / 4);\n}\n\nexport interface RingProgressSection extends React.ComponentProps<'circle'>, DataAttributes {\n  value: number;\n  color: MantineColor;\n  tooltip?: React.ReactNode;\n}\n\nexport type RingProgressStylesNames = 'root' | 'svg' | 'label' | 'curve';\nexport type RingProgressCssVariables = {\n  root: '--rp-size' | '--rp-label-offset' | '--rp-transition-duration';\n  svg: '--rp-start-angle';\n};\n\nexport interface RingProgressProps\n  extends BoxProps, StylesApiProps<RingProgressFactory>, ElementProps<'div'> {\n  /** Label displayed in the center of the ring */\n  label?: React.ReactNode;\n\n  /** Ring thickness in pixels. Cannot exceed size / 4 and will be automatically clamped if necessary @default 12 */\n  thickness?: number;\n\n  /** Width and height of the progress ring @default 120 */\n  size?: number;\n\n  /** Applies rounded line caps to the start and end of visible sections @default false */\n  roundCaps?: boolean;\n\n  /**\n   * Array of sections to display in the ring. Each section should have a `value` (0-100),\n   * `color`, and optional `tooltip`. Sections can also receive any valid SVG circle element props.\n   */\n  sections: RingProgressSection[];\n\n  /** Color of the unfilled portion of the ring (background). Defaults to gray-2 in light mode, dark-4 in dark mode */\n  rootColor?: MantineColor;\n\n  /** Transition duration in milliseconds for section value and color changes @default 0 */\n  transitionDuration?: number;\n\n  /** Gap between sections in degrees. Reduces the visual size of each section @default 0 */\n  sectionGap?: number;\n\n  /** Starting angle in degrees. 0 = right, 90 = bottom, 180 = left, 270 = top @default 270 */\n  startAngle?: number;\n}\n\nexport type RingProgressFactory = Factory<{\n  props: RingProgressProps;\n  ref: HTMLDivElement;\n  stylesNames: RingProgressStylesNames;\n  vars: RingProgressCssVariables;\n}>;\n\nconst defaultProps = {\n  size: 120,\n  thickness: 12,\n  startAngle: 270,\n} satisfies Partial<RingProgressProps>;\n\nconst varsResolver = createVarsResolver<RingProgressFactory>(\n  (_, { size, thickness, transitionDuration, startAngle }) => ({\n    root: {\n      '--rp-size': rem(size),\n      '--rp-label-offset': rem(thickness! * 2),\n      '--rp-transition-duration': transitionDuration ? `${transitionDuration}ms` : undefined,\n    },\n    svg: {\n      '--rp-start-angle': `${startAngle}deg`,\n    },\n  })\n);\n\nexport const RingProgress = factory<RingProgressFactory>((_props) => {\n  const props = useProps('RingProgress', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    label,\n    sections,\n    size,\n    thickness,\n    roundCaps,\n    rootColor,\n    transitionDuration,\n    sectionGap,\n    startAngle,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<RingProgressFactory>({\n    name: 'RingProgress',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const clampedThickness = getClampedThickness(thickness, size);\n\n  const curves = getCurves({\n    size,\n    thickness: clampedThickness,\n    sections,\n    renderRoundedLineCaps: roundCaps,\n    rootColor,\n    sectionGap,\n  }).map(({ data, sum, root, lineRoundCaps, offset }, index) => (\n    <Curve\n      {...data}\n      key={index}\n      size={size}\n      thickness={clampedThickness}\n      sum={sum}\n      offset={offset}\n      color={data?.color}\n      root={root}\n      lineRoundCaps={lineRoundCaps}\n      getStyles={getStyles}\n    />\n  ));\n\n  return (\n    <Box {...getStyles('root')} size={size} {...others}>\n      <svg {...getStyles('svg')} viewBox={`0 0 ${size} ${size}`}>\n        {curves}\n      </svg>\n      {label && <div {...getStyles('label')}>{label}</div>}\n    </Box>\n  );\n});\n\nRingProgress.classes = classes;\nRingProgress.varsResolver = varsResolver;\nRingProgress.displayName = '@mantine/core/RingProgress';\n\nexport namespace RingProgress {\n  export type Props = RingProgressProps;\n  export type StylesNames = RingProgressStylesNames;\n  export type Factory = RingProgressFactory;\n  export type CssVariables = RingProgressCssVariables;\n  export type Section = RingProgressSection;\n}\n"],"mappings":";;;;;;;;;;;;;AAkBA,SAAS,oBAAoB,WAAmB,MAAc;CAC5D,OAAO,KAAK,IAAI,aAAa,KAAK,QAAQ,OAAO,CAAC;AACpD;AAsDA,MAAM,eAAe;CACnB,MAAM;CACN,WAAW;CACX,YAAY;AACd;AAEA,MAAM,eAAe,oBAClB,GAAG,EAAE,MAAM,WAAW,oBAAoB,kBAAkB;CAC3D,MAAM;EACJ,aAAa,IAAI,IAAI;EACrB,qBAAqB,IAAI,YAAa,CAAC;EACvC,4BAA4B,qBAAqB,GAAG,mBAAmB,MAAM,KAAA;CAC/E;CACA,KAAK,EACH,oBAAoB,GAAG,WAAW,KACpC;AACF,EACF;AAEA,MAAa,eAAe,SAA8B,WAAW;CACnE,MAAM,QAAQ,SAAS,gBAAgB,cAAc,MAAM;CAC3D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,OACA,UACA,MACA,WACA,WACA,WACA,oBACA,YACA,YACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA+B;EAC/C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,mBAAmB,oBAAoB,WAAW,IAAI;CAE5D,MAAM,SAAS,UAAU;EACvB;EACA,WAAW;EACX;EACA,uBAAuB;EACvB;EACA;CACF,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,eAAe,UAAU,UAClD,8BAAC,OAAD;EACE,GAAI;EACJ,KAAK;EACC;EACN,WAAW;EACN;EACG;EACR,OAAO,MAAM;EACP;EACS;EACJ;CACZ,CAAA,CACF;CAED,OACE,qBAAC,KAAD;EAAK,GAAI,UAAU,MAAM;EAAS;EAAM,GAAI;YAA5C,CACE,oBAAC,OAAD;GAAK,GAAI,UAAU,KAAK;GAAG,SAAS,OAAO,KAAK,GAAG;aAChD;EACE,CAAA,GACJ,SAAS,oBAAC,OAAD;GAAK,GAAI,UAAU,OAAO;aAAI;EAAW,CAAA,CAChD;;AAET,CAAC;AAED,aAAa,UAAUA;AACvB,aAAa,eAAe;AAC5B,aAAa,cAAc"}
+{"version":3,"file":"RingProgress.mjs","names":["classes"],"sources":["../../../src/components/RingProgress/RingProgress.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  DataAttributes,\n  ElementProps,\n  factory,\n  Factory,\n  MantineColor,\n  rem,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { Curve } from './Curve/Curve';\nimport { getCurves } from './get-curves/get-curves';\nimport classes from './RingProgress.module.css';\n\nfunction getClampedThickness(thickness: number, size: number) {\n  return Math.min(thickness || 12, (size || 120) / 4);\n}\n\nexport interface RingProgressSection extends React.ComponentProps<'circle'>, DataAttributes {\n  value: number;\n  color: MantineColor;\n  tooltip?: React.ReactNode;\n}\n\nexport type RingProgressStylesNames = 'root' | 'svg' | 'label' | 'curve';\nexport type RingProgressCssVariables = {\n  root: '--rp-size' | '--rp-label-offset' | '--rp-transition-duration';\n  svg: '--rp-start-angle';\n};\n\nexport interface RingProgressProps\n  extends BoxProps, StylesApiProps<RingProgressFactory>, ElementProps<'div'> {\n  /** Label displayed in the center of the ring */\n  label?: React.ReactNode;\n\n  /** Ring thickness in pixels. Cannot exceed size / 4 and will be automatically clamped if necessary @default 12 */\n  thickness?: number;\n\n  /** Width and height of the progress ring @default 120 */\n  size?: number;\n\n  /** Applies rounded line caps to the start and end of visible sections @default false */\n  roundCaps?: boolean;\n\n  /**\n   * Array of sections to display in the ring. Each section should have a `value` (0-100),\n   * `color`, and optional `tooltip`. Sections can also receive any valid SVG circle element props.\n   */\n  sections: RingProgressSection[];\n\n  /** Color of the unfilled portion of the ring (background). Defaults to gray-2 in light mode, dark-4 in dark mode */\n  rootColor?: MantineColor;\n\n  /** Transition duration in milliseconds for section value and color changes @default 0 */\n  transitionDuration?: number;\n\n  /** Gap between sections in degrees. Reduces the visual size of each section @default 0 */\n  sectionGap?: number;\n\n  /** Starting angle in degrees. 0 = right, 90 = bottom, 180 = left, 270 = top @default 270 */\n  startAngle?: number;\n}\n\nexport type RingProgressFactory = Factory<{\n  props: RingProgressProps;\n  ref: HTMLDivElement;\n  stylesNames: RingProgressStylesNames;\n  vars: RingProgressCssVariables;\n}>;\n\nconst defaultProps = {\n  size: 120,\n  thickness: 12,\n  startAngle: 270,\n} satisfies Partial<RingProgressProps>;\n\nconst varsResolver = createVarsResolver<RingProgressFactory>(\n  (_, { size, thickness, transitionDuration, startAngle }) => ({\n    root: {\n      '--rp-size': rem(size),\n      '--rp-label-offset': rem(thickness! * 2),\n      '--rp-transition-duration': transitionDuration ? `${transitionDuration}ms` : undefined,\n    },\n    svg: {\n      '--rp-start-angle': `${startAngle}deg`,\n    },\n  })\n);\n\nexport const RingProgress = factory<RingProgressFactory>((_props) => {\n  const props = useProps('RingProgress', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    label,\n    sections,\n    size,\n    thickness,\n    roundCaps,\n    rootColor,\n    transitionDuration,\n    sectionGap,\n    startAngle,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<RingProgressFactory>({\n    name: 'RingProgress',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const clampedThickness = getClampedThickness(thickness, size);\n\n  const curves = getCurves({\n    size,\n    thickness: clampedThickness,\n    sections,\n    renderRoundedLineCaps: roundCaps,\n    rootColor,\n    sectionGap,\n  }).map(({ data, sum, root, lineRoundCaps, offset }, index) => (\n    <Curve\n      {...data}\n      key={index}\n      size={size}\n      thickness={clampedThickness}\n      sum={sum}\n      offset={offset}\n      color={data?.color}\n      root={root}\n      lineRoundCaps={lineRoundCaps}\n      getStyles={getStyles}\n    />\n  ));\n\n  return (\n    <Box {...getStyles('root')} size={size} {...others}>\n      <svg {...getStyles('svg')} viewBox={`0 0 ${size} ${size}`}>\n        {curves}\n      </svg>\n      {label && <div {...getStyles('label')}>{label}</div>}\n    </Box>\n  );\n});\n\nRingProgress.classes = classes;\nRingProgress.varsResolver = varsResolver;\nRingProgress.displayName = '@mantine/core/RingProgress';\n\nexport namespace RingProgress {\n  export type Props = RingProgressProps;\n  export type StylesNames = RingProgressStylesNames;\n  export type Factory = RingProgressFactory;\n  export type CssVariables = RingProgressCssVariables;\n  export type Section = RingProgressSection;\n}\n"],"mappings":";;;;;;;;;;;;;AAkBA,SAAS,oBAAoB,WAAmB,MAAc;CAC5D,OAAO,KAAK,IAAI,aAAa,KAAK,QAAQ,OAAO,CAAC;AACpD;AAsDA,MAAM,eAAe;CACnB,MAAM;CACN,WAAW;CACX,YAAY;AACd;AAEA,MAAM,eAAe,oBAClB,GAAG,EAAE,MAAM,WAAW,oBAAoB,kBAAkB;CAC3D,MAAM;EACJ,aAAa,IAAI,IAAI;EACrB,qBAAqB,IAAI,YAAa,CAAC;EACvC,4BAA4B,qBAAqB,GAAG,mBAAmB,MAAM,KAAA;CAC/E;CACA,KAAK,EACH,oBAAoB,GAAG,WAAW,KACpC;AACF,EACF;AAEA,MAAa,eAAe,SAA8B,WAAW;CACnE,MAAM,QAAQ,SAAS,gBAAgB,cAAc,MAAM;CAC3D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,OACA,UACA,MACA,WACA,WACA,WACA,oBACA,YACA,YACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA+B;EAC/C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,mBAAmB,oBAAoB,WAAW,IAAI;CAE5D,MAAM,SAAS,UAAU;EACvB;EACA,WAAW;EACX;EACA,uBAAuB;EACvB;EACA;CACF,CAAC,CAAC,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,eAAe,UAAU,UAClD,8BAAC,OAAD;EACE,GAAI;EACJ,KAAK;EACC;EACN,WAAW;EACN;EACG;EACR,OAAO,MAAM;EACP;EACS;EACJ;CACZ,CAAA,CACF;CAED,OACE,qBAAC,KAAD;EAAK,GAAI,UAAU,MAAM;EAAS;EAAM,GAAI;YAA5C,CACE,oBAAC,OAAD;GAAK,GAAI,UAAU,KAAK;GAAG,SAAS,OAAO,KAAK,GAAG;aAChD;EACE,CAAA,GACJ,SAAS,oBAAC,OAAD;GAAK,GAAI,UAAU,OAAO;aAAI;EAAW,CAAA,CAChD;;AAET,CAAC;AAED,aAAa,UAAUA;AACvB,aAAa,eAAe;AAC5B,aAAa,cAAc"}

package/esm/components/RingProgress/get-curves/get-curves.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"get-curves.mjs","names":[],"sources":["../../../../src/components/RingProgress/get-curves/get-curves.ts"],"sourcesContent":["import type { DataAttributes, MantineColor } from '../../../core';\n\ninterface CurveData extends React.ComponentProps<'circle'>, DataAttributes {\n  value: number;\n  color: MantineColor;\n  tooltip?: React.ReactNode;\n}\n\ninterface RootCurveData extends React.ComponentProps<'circle'>, DataAttributes {\n  value?: never;\n  color?: MantineColor;\n}\n\ninterface GetCurves {\n  sections: CurveData[];\n  size: number;\n  thickness: number;\n  renderRoundedLineCaps: boolean | undefined;\n  rootColor?: MantineColor;\n  sectionGap?: number;\n}\n\ninterface Curve {\n  sum: number;\n  offset: number;\n  root: boolean;\n  data: CurveData | RootCurveData;\n  lineRoundCaps?: boolean;\n}\n\nexport function getCurves({\n  size,\n  thickness,\n  sections,\n  renderRoundedLineCaps,\n  rootColor,\n  sectionGap = 0,\n}: GetCurves) {\n  const sum = sections.reduce((acc, current) => acc + current.value, 0);\n  const accumulated = Math.PI * ((size * 0.9 - thickness * 2) / 2) * 2;\n  let offset = accumulated;\n  const curves: Curve[] = [];\n  const curvesInOrder: Curve[] = [];\n\n  // Convert gap from degrees to percentage of the circle\n  const gapPercentage = (sectionGap / 360) * 100;\n\n  for (let i = 0; i < sections.length; i += 1) {\n    // Reduce section value by gap amount to create visual separation\n    const adjustedValue = Math.max(0, sections[i].value - gapPercentage);\n    curves.push({ sum, offset, data: { ...sections[i], value: adjustedValue }, root: false });\n    offset -= (sections[i].value / 100) * accumulated;\n  }\n\n  curves.push({ sum, offset, data: { color: rootColor }, root: true });\n\n  // Reorder curves to layer appropriately and selectively set caps to round\n\n  curvesInOrder.push({ ...curves[curves.length - 1], lineRoundCaps: false });\n  if (curves.length > 2) {\n    curvesInOrder.push({ ...curves[0], lineRoundCaps: renderRoundedLineCaps });\n    curvesInOrder.push({ ...curves[curves.length - 2], lineRoundCaps: renderRoundedLineCaps });\n    for (let i = 1; i <= curves.length - 3; i += 1) {\n      curvesInOrder.push({ ...curves[i], lineRoundCaps: false });\n    }\n  } else {\n    curvesInOrder.push({ ...curves[0], lineRoundCaps: renderRoundedLineCaps });\n  }\n\n  return curvesInOrder;\n}\n"],"mappings":";;AA8BA,SAAgB,UAAU,EACxB,MACA,WACA,UACA,uBACA,WACA,aAAa,KACD;CACZ,MAAM,MAAM,SAAS,QAAQ,KAAK,YAAY,MAAM,QAAQ,OAAO,CAAC;CACpE,MAAM,cAAc,KAAK,OAAO,OAAO,KAAM,YAAY,KAAK,KAAK;CACnE,IAAI,SAAS;CACb,MAAM,SAAkB,CAAC;CACzB,MAAM,gBAAyB,CAAC;CAGhC,MAAM,gBAAiB,aAAa,MAAO;CAE3C,KAAK,IAAI,IAAI,GAAG,IAAI,SAAS,QAAQ,KAAK,GAAG;EAE3C,MAAM,gBAAgB,KAAK,IAAI,GAAG,SAAS,GAAG,QAAQ,aAAa;EACnE,OAAO,KAAK;GAAE;GAAK;GAAQ,MAAM;IAAE,GAAG,SAAS;IAAI,OAAO;GAAc;GAAG,MAAM;EAAM,CAAC;EACxF,UAAW,SAAS,GAAG,QAAQ,MAAO;CACxC;CAEA,OAAO,KAAK;EAAE;EAAK;EAAQ,MAAM,EAAE,OAAO,UAAU;EAAG,MAAM;CAAK,CAAC;CAInE,cAAc,KAAK;EAAE,GAAG,OAAO,OAAO,SAAS;EAAI,eAAe;CAAM,CAAC;CACzE,IAAI,OAAO,SAAS,GAAG;EACrB,cAAc,KAAK;GAAE,GAAG,OAAO;GAAI,eAAe;EAAsB,CAAC;EACzE,cAAc,KAAK;GAAE,GAAG,OAAO,OAAO,SAAS;GAAI,eAAe;EAAsB,CAAC;EACzF,KAAK,IAAI,IAAI,GAAG,KAAK,OAAO,SAAS,GAAG,KAAK,GAC3C,cAAc,KAAK;GAAE,GAAG,OAAO;GAAI,eAAe;EAAM,CAAC;CAE7D,OACE,cAAc,KAAK;EAAE,GAAG,OAAO;EAAI,eAAe;CAAsB,CAAC;CAG3E,OAAO;AACT"}
+{"version":3,"file":"get-curves.mjs","names":[],"sources":["../../../../src/components/RingProgress/get-curves/get-curves.ts"],"sourcesContent":["import type { DataAttributes, MantineColor } from '../../../core';\n\ninterface CurveData extends React.ComponentProps<'circle'>, DataAttributes {\n  value: number;\n  color: MantineColor;\n  tooltip?: React.ReactNode;\n}\n\ninterface RootCurveData extends React.ComponentProps<'circle'>, DataAttributes {\n  value?: never;\n  color?: MantineColor;\n}\n\ninterface GetCurves {\n  sections: CurveData[];\n  size: number;\n  thickness: number;\n  renderRoundedLineCaps: boolean | undefined;\n  rootColor?: MantineColor;\n  sectionGap?: number;\n}\n\ninterface Curve {\n  sum: number;\n  offset: number;\n  root: boolean;\n  data: CurveData | RootCurveData;\n  lineRoundCaps?: boolean;\n}\n\nexport function getCurves({\n  size,\n  thickness,\n  sections,\n  renderRoundedLineCaps,\n  rootColor,\n  sectionGap = 0,\n}: GetCurves) {\n  const sum = sections.reduce((acc, current) => acc + current.value, 0);\n  const accumulated = Math.PI * ((size * 0.9 - thickness * 2) / 2) * 2;\n  let offset = accumulated;\n  const curves: Curve[] = [];\n  const curvesInOrder: Curve[] = [];\n\n  // Convert gap from degrees to percentage of the circle\n  const gapPercentage = (sectionGap / 360) * 100;\n\n  for (let i = 0; i < sections.length; i += 1) {\n    // Reduce section value by gap amount to create visual separation\n    const adjustedValue = Math.max(0, sections[i].value - gapPercentage);\n    curves.push({ sum, offset, data: { ...sections[i], value: adjustedValue }, root: false });\n    offset -= (sections[i].value / 100) * accumulated;\n  }\n\n  curves.push({ sum, offset, data: { color: rootColor }, root: true });\n\n  // Reorder curves to layer appropriately and selectively set caps to round\n\n  curvesInOrder.push({ ...curves[curves.length - 1], lineRoundCaps: false });\n  if (curves.length > 2) {\n    curvesInOrder.push({ ...curves[0], lineRoundCaps: renderRoundedLineCaps });\n    curvesInOrder.push({ ...curves[curves.length - 2], lineRoundCaps: renderRoundedLineCaps });\n    for (let i = 1; i <= curves.length - 3; i += 1) {\n      curvesInOrder.push({ ...curves[i], lineRoundCaps: false });\n    }\n  } else {\n    curvesInOrder.push({ ...curves[0], lineRoundCaps: renderRoundedLineCaps });\n  }\n\n  return curvesInOrder;\n}\n"],"mappings":";;AA8BA,SAAgB,UAAU,EACxB,MACA,WACA,UACA,uBACA,WACA,aAAa,KACD;CACZ,MAAM,MAAM,SAAS,QAAQ,KAAK,YAAY,MAAM,QAAQ,OAAO,CAAC;CACpE,MAAM,cAAc,KAAK,OAAO,OAAO,KAAM,YAAY,KAAK,KAAK;CACnE,IAAI,SAAS;CACb,MAAM,SAAkB,CAAC;CACzB,MAAM,gBAAyB,CAAC;CAGhC,MAAM,gBAAiB,aAAa,MAAO;CAE3C,KAAK,IAAI,IAAI,GAAG,IAAI,SAAS,QAAQ,KAAK,GAAG;EAE3C,MAAM,gBAAgB,KAAK,IAAI,GAAG,SAAS,EAAE,CAAC,QAAQ,aAAa;EACnE,OAAO,KAAK;GAAE;GAAK;GAAQ,MAAM;IAAE,GAAG,SAAS;IAAI,OAAO;GAAc;GAAG,MAAM;EAAM,CAAC;EACxF,UAAW,SAAS,EAAE,CAAC,QAAQ,MAAO;CACxC;CAEA,OAAO,KAAK;EAAE;EAAK;EAAQ,MAAM,EAAE,OAAO,UAAU;EAAG,MAAM;CAAK,CAAC;CAInE,cAAc,KAAK;EAAE,GAAG,OAAO,OAAO,SAAS;EAAI,eAAe;CAAM,CAAC;CACzE,IAAI,OAAO,SAAS,GAAG;EACrB,cAAc,KAAK;GAAE,GAAG,OAAO;GAAI,eAAe;EAAsB,CAAC;EACzE,cAAc,KAAK;GAAE,GAAG,OAAO,OAAO,SAAS;GAAI,eAAe;EAAsB,CAAC;EACzF,KAAK,IAAI,IAAI,GAAG,KAAK,OAAO,SAAS,GAAG,KAAK,GAC3C,cAAc,KAAK;GAAE,GAAG,OAAO;GAAI,eAAe;EAAM,CAAC;CAE7D,OACE,cAAc,KAAK;EAAE,GAAG,OAAO;EAAI,eAAe;CAAsB,CAAC;CAG3E,OAAO;AACT"}

package/esm/components/RollingNumber/get-digit-parts.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"get-digit-parts.mjs","names":[],"sources":["../../../src/components/RollingNumber/get-digit-parts.ts"],"sourcesContent":["export interface DigitParts {\n  negative: boolean;\n  intDigits: string[];\n  fracDigits: string[];\n  hasDecimal: boolean;\n}\n\nexport interface GetDigitPartsInput {\n  value: number;\n  decimalScale?: number;\n  fixedDecimalScale?: boolean;\n}\n\nconst PLAIN_FORMAT = new Intl.NumberFormat('en-US', {\n  useGrouping: false,\n  maximumFractionDigits: 20,\n});\n\nfunction toPlainString(num: number, decimalScale?: number): string {\n  if (!Number.isFinite(num)) {\n    return '0';\n  }\n\n  if (decimalScale !== undefined) {\n    return new Intl.NumberFormat('en-US', {\n      useGrouping: false,\n      minimumFractionDigits: decimalScale,\n      maximumFractionDigits: decimalScale,\n    }).format(num);\n  }\n\n  const str = String(num);\n  if (!str.includes('e') && !str.includes('E')) {\n    return str;\n  }\n\n  return PLAIN_FORMAT.format(num);\n}\n\nexport function getDigitParts({\n  value,\n  decimalScale,\n  fixedDecimalScale,\n}: GetDigitPartsInput): DigitParts {\n  const abs = Math.abs(value);\n  let str = toPlainString(abs, decimalScale);\n\n  if (!fixedDecimalScale && decimalScale !== undefined) {\n    const parts = str.split('.');\n    if (parts[1]) {\n      const trimmed = parts[1].replace(/0+$/, '');\n      str = trimmed ? `${parts[0]}.${trimmed}` : parts[0];\n    }\n  }\n\n  const dotIdx = str.indexOf('.');\n  const intStr = dotIdx >= 0 ? str.slice(0, dotIdx) : str;\n  const fracStr = dotIdx >= 0 ? str.slice(dotIdx + 1) : '';\n\n  return {\n    negative: value < 0,\n    intDigits: intStr.split(''),\n    fracDigits: fracStr ? fracStr.split('') : [],\n    hasDecimal: dotIdx >= 0,\n  };\n}\n"],"mappings":";;AAaA,MAAM,eAAe,IAAI,KAAK,aAAa,SAAS;CAClD,aAAa;CACb,uBAAuB;AACzB,CAAC;AAED,SAAS,cAAc,KAAa,cAA+B;CACjE,IAAI,CAAC,OAAO,SAAS,GAAG,GACtB,OAAO;CAGT,IAAI,iBAAiB,KAAA,GACnB,OAAO,IAAI,KAAK,aAAa,SAAS;EACpC,aAAa;EACb,uBAAuB;EACvB,uBAAuB;CACzB,CAAC,EAAE,OAAO,GAAG;CAGf,MAAM,MAAM,OAAO,GAAG;CACtB,IAAI,CAAC,IAAI,SAAS,GAAG,KAAK,CAAC,IAAI,SAAS,GAAG,GACzC,OAAO;CAGT,OAAO,aAAa,OAAO,GAAG;AAChC;AAEA,SAAgB,cAAc,EAC5B,OACA,cACA,qBACiC;CAEjC,IAAI,MAAM,cADE,KAAK,IAAI,KACK,GAAG,YAAY;CAEzC,IAAI,CAAC,qBAAqB,iBAAiB,KAAA,GAAW;EACpD,MAAM,QAAQ,IAAI,MAAM,GAAG;EAC3B,IAAI,MAAM,IAAI;GACZ,MAAM,UAAU,MAAM,GAAG,QAAQ,OAAO,EAAE;GAC1C,MAAM,UAAU,GAAG,MAAM,GAAG,GAAG,YAAY,MAAM;EACnD;CACF;CAEA,MAAM,SAAS,IAAI,QAAQ,GAAG;CAC9B,MAAM,SAAS,UAAU,IAAI,IAAI,MAAM,GAAG,MAAM,IAAI;CACpD,MAAM,UAAU,UAAU,IAAI,IAAI,MAAM,SAAS,CAAC,IAAI;CAEtD,OAAO;EACL,UAAU,QAAQ;EAClB,WAAW,OAAO,MAAM,EAAE;EAC1B,YAAY,UAAU,QAAQ,MAAM,EAAE,IAAI,CAAC;EAC3C,YAAY,UAAU;CACxB;AACF"}
+{"version":3,"file":"get-digit-parts.mjs","names":[],"sources":["../../../src/components/RollingNumber/get-digit-parts.ts"],"sourcesContent":["export interface DigitParts {\n  negative: boolean;\n  intDigits: string[];\n  fracDigits: string[];\n  hasDecimal: boolean;\n}\n\nexport interface GetDigitPartsInput {\n  value: number;\n  decimalScale?: number;\n  fixedDecimalScale?: boolean;\n}\n\nconst PLAIN_FORMAT = new Intl.NumberFormat('en-US', {\n  useGrouping: false,\n  maximumFractionDigits: 20,\n});\n\nfunction toPlainString(num: number, decimalScale?: number): string {\n  if (!Number.isFinite(num)) {\n    return '0';\n  }\n\n  if (decimalScale !== undefined) {\n    return new Intl.NumberFormat('en-US', {\n      useGrouping: false,\n      minimumFractionDigits: decimalScale,\n      maximumFractionDigits: decimalScale,\n    }).format(num);\n  }\n\n  const str = String(num);\n  if (!str.includes('e') && !str.includes('E')) {\n    return str;\n  }\n\n  return PLAIN_FORMAT.format(num);\n}\n\nexport function getDigitParts({\n  value,\n  decimalScale,\n  fixedDecimalScale,\n}: GetDigitPartsInput): DigitParts {\n  const abs = Math.abs(value);\n  let str = toPlainString(abs, decimalScale);\n\n  if (!fixedDecimalScale && decimalScale !== undefined) {\n    const parts = str.split('.');\n    if (parts[1]) {\n      const trimmed = parts[1].replace(/0+$/, '');\n      str = trimmed ? `${parts[0]}.${trimmed}` : parts[0];\n    }\n  }\n\n  const dotIdx = str.indexOf('.');\n  const intStr = dotIdx >= 0 ? str.slice(0, dotIdx) : str;\n  const fracStr = dotIdx >= 0 ? str.slice(dotIdx + 1) : '';\n\n  return {\n    negative: value < 0,\n    intDigits: intStr.split(''),\n    fracDigits: fracStr ? fracStr.split('') : [],\n    hasDecimal: dotIdx >= 0,\n  };\n}\n"],"mappings":";;AAaA,MAAM,eAAe,IAAI,KAAK,aAAa,SAAS;CAClD,aAAa;CACb,uBAAuB;AACzB,CAAC;AAED,SAAS,cAAc,KAAa,cAA+B;CACjE,IAAI,CAAC,OAAO,SAAS,GAAG,GACtB,OAAO;CAGT,IAAI,iBAAiB,KAAA,GACnB,OAAO,IAAI,KAAK,aAAa,SAAS;EACpC,aAAa;EACb,uBAAuB;EACvB,uBAAuB;CACzB,CAAC,CAAC,CAAC,OAAO,GAAG;CAGf,MAAM,MAAM,OAAO,GAAG;CACtB,IAAI,CAAC,IAAI,SAAS,GAAG,KAAK,CAAC,IAAI,SAAS,GAAG,GACzC,OAAO;CAGT,OAAO,aAAa,OAAO,GAAG;AAChC;AAEA,SAAgB,cAAc,EAC5B,OACA,cACA,qBACiC;CAEjC,IAAI,MAAM,cADE,KAAK,IAAI,KACK,GAAG,YAAY;CAEzC,IAAI,CAAC,qBAAqB,iBAAiB,KAAA,GAAW;EACpD,MAAM,QAAQ,IAAI,MAAM,GAAG;EAC3B,IAAI,MAAM,IAAI;GACZ,MAAM,UAAU,MAAM,EAAE,CAAC,QAAQ,OAAO,EAAE;GAC1C,MAAM,UAAU,GAAG,MAAM,GAAG,GAAG,YAAY,MAAM;EACnD;CACF;CAEA,MAAM,SAAS,IAAI,QAAQ,GAAG;CAC9B,MAAM,SAAS,UAAU,IAAI,IAAI,MAAM,GAAG,MAAM,IAAI;CACpD,MAAM,UAAU,UAAU,IAAI,IAAI,MAAM,SAAS,CAAC,IAAI;CAEtD,OAAO;EACL,UAAU,QAAQ;EAClB,WAAW,OAAO,MAAM,EAAE;EAC1B,YAAY,UAAU,QAAQ,MAAM,EAAE,IAAI,CAAC;EAC3C,YAAY,UAAU;CACxB;AACF"}

package/esm/components/RollingNumber/get-render-slots.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"get-render-slots.mjs","names":[],"sources":["../../../src/components/RollingNumber/get-render-slots.ts"],"sourcesContent":["import { getDigitParts, type DigitParts } from './get-digit-parts';\n\nexport interface DigitSlot {\n  type: 'digit';\n  key: string;\n  digit: string;\n  previousDigit: string | null;\n  empty: boolean;\n}\n\nexport interface CharSlot {\n  type: 'char';\n  key: string;\n  char: string;\n  empty: boolean;\n}\n\nexport type RenderSlot = DigitSlot | CharSlot;\n\nexport interface GetRenderSlotsInput {\n  current: DigitParts;\n  previous: DigitParts;\n  prefix?: string;\n  suffix?: string;\n  decimalSeparator?: string;\n  thousandSeparator?: string | boolean;\n}\n\nfunction padLeft(arr: string[], length: number): (string | null)[] {\n  return [...Array(length - arr.length).fill(null), ...arr];\n}\n\nfunction padRight(arr: string[], length: number): (string | null)[] {\n  return [...arr, ...Array(length - arr.length).fill(null)];\n}\n\nexport function getRenderSlots({\n  current,\n  previous,\n  prefix,\n  suffix,\n  decimalSeparator = '.',\n  thousandSeparator,\n}: GetRenderSlotsInput): RenderSlot[] {\n  const maxIntLen = Math.max(current.intDigits.length, previous.intDigits.length);\n  const maxFracLen = Math.max(current.fracDigits.length, previous.fracDigits.length);\n\n  const currIntPadded = padLeft(current.intDigits, maxIntLen);\n  const prevIntPadded = padLeft(previous.intDigits, maxIntLen);\n  const currFracPadded = padRight(current.fracDigits, maxFracLen);\n  const prevFracPadded = padRight(previous.fracDigits, maxFracLen);\n\n  const sep = thousandSeparator\n    ? typeof thousandSeparator === 'string'\n      ? thousandSeparator\n      : ','\n    : null;\n\n  const slots: RenderSlot[] = [];\n\n  if (prefix) {\n    for (let i = 0; i < prefix.length; i++) {\n      slots.push({ type: 'char', key: `prefix-${i}`, char: prefix[i], empty: false });\n    }\n  }\n\n  if (current.negative || previous.negative) {\n    slots.push({ type: 'char', key: 'sign', char: '-', empty: !current.negative });\n  }\n\n  for (let i = 0; i < maxIntLen; i++) {\n    const posFromRight = maxIntLen - 1 - i;\n    const currDigit = currIntPadded[i];\n    const prevDigit = prevIntPadded[i];\n    const isEmpty = currDigit === null;\n\n    slots.push({\n      type: 'digit',\n      key: `int-${posFromRight}`,\n      digit: currDigit ?? '0',\n      previousDigit: prevDigit,\n      empty: isEmpty,\n    });\n\n    if (sep && posFromRight > 0 && posFromRight % 3 === 0) {\n      slots.push({ type: 'char', key: `sep-${posFromRight}`, char: sep, empty: isEmpty });\n    }\n  }\n\n  if (current.hasDecimal || previous.hasDecimal) {\n    slots.push({\n      type: 'char',\n      key: 'dec',\n      char: decimalSeparator,\n      empty: !current.hasDecimal,\n    });\n  }\n\n  for (let i = 0; i < maxFracLen; i++) {\n    const currDigit = currFracPadded[i];\n    const prevDigit = prevFracPadded[i];\n    const isEmpty = currDigit === null;\n\n    slots.push({\n      type: 'digit',\n      key: `frac-${i}`,\n      digit: currDigit ?? '0',\n      previousDigit: prevDigit,\n      empty: isEmpty,\n    });\n  }\n\n  if (suffix) {\n    for (let i = 0; i < suffix.length; i++) {\n      slots.push({ type: 'char', key: `suffix-${i}`, char: suffix[i], empty: false });\n    }\n  }\n\n  return slots;\n}\n\nexport interface GetRenderSlotsFromValuesInput {\n  value: number;\n  previousValue: number;\n  prefix?: string;\n  suffix?: string;\n  decimalSeparator?: string;\n  thousandSeparator?: string | boolean;\n  decimalScale?: number;\n  fixedDecimalScale?: boolean;\n}\n\nexport function getRenderSlotsFromValues({\n  value,\n  previousValue,\n  prefix,\n  suffix,\n  decimalSeparator,\n  thousandSeparator,\n  decimalScale,\n  fixedDecimalScale,\n}: GetRenderSlotsFromValuesInput): RenderSlot[] {\n  const current = getDigitParts({ value, decimalScale, fixedDecimalScale });\n  const prev = getDigitParts({ value: previousValue, decimalScale, fixedDecimalScale });\n\n  return getRenderSlots({\n    current,\n    previous: prev,\n    prefix,\n    suffix,\n    decimalSeparator,\n    thousandSeparator,\n  });\n}\n"],"mappings":";;AA4BA,SAAS,QAAQ,KAAe,QAAmC;CACjE,OAAO,CAAC,GAAG,MAAM,SAAS,IAAI,MAAM,EAAE,KAAK,IAAI,GAAG,GAAG,GAAG;AAC1D;AAEA,SAAS,SAAS,KAAe,QAAmC;CAClE,OAAO,CAAC,GAAG,KAAK,GAAG,MAAM,SAAS,IAAI,MAAM,EAAE,KAAK,IAAI,CAAC;AAC1D;AAEA,SAAgB,eAAe,EAC7B,SACA,UACA,QACA,QACA,mBAAmB,KACnB,qBACoC;CACpC,MAAM,YAAY,KAAK,IAAI,QAAQ,UAAU,QAAQ,SAAS,UAAU,MAAM;CAC9E,MAAM,aAAa,KAAK,IAAI,QAAQ,WAAW,QAAQ,SAAS,WAAW,MAAM;CAEjF,MAAM,gBAAgB,QAAQ,QAAQ,WAAW,SAAS;CAC1D,MAAM,gBAAgB,QAAQ,SAAS,WAAW,SAAS;CAC3D,MAAM,iBAAiB,SAAS,QAAQ,YAAY,UAAU;CAC9D,MAAM,iBAAiB,SAAS,SAAS,YAAY,UAAU;CAE/D,MAAM,MAAM,oBACR,OAAO,sBAAsB,WAC3B,oBACA,MACF;CAEJ,MAAM,QAAsB,CAAC;CAE7B,IAAI,QACF,KAAK,IAAI,IAAI,GAAG,IAAI,OAAO,QAAQ,KACjC,MAAM,KAAK;EAAE,MAAM;EAAQ,KAAK,UAAU;EAAK,MAAM,OAAO;EAAI,OAAO;CAAM,CAAC;CAIlF,IAAI,QAAQ,YAAY,SAAS,UAC/B,MAAM,KAAK;EAAE,MAAM;EAAQ,KAAK;EAAQ,MAAM;EAAK,OAAO,CAAC,QAAQ;CAAS,CAAC;CAG/E,KAAK,IAAI,IAAI,GAAG,IAAI,WAAW,KAAK;EAClC,MAAM,eAAe,YAAY,IAAI;EACrC,MAAM,YAAY,cAAc;EAChC,MAAM,YAAY,cAAc;EAChC,MAAM,UAAU,cAAc;EAE9B,MAAM,KAAK;GACT,MAAM;GACN,KAAK,OAAO;GACZ,OAAO,aAAa;GACpB,eAAe;GACf,OAAO;EACT,CAAC;EAED,IAAI,OAAO,eAAe,KAAK,eAAe,MAAM,GAClD,MAAM,KAAK;GAAE,MAAM;GAAQ,KAAK,OAAO;GAAgB,MAAM;GAAK,OAAO;EAAQ,CAAC;CAEtF;CAEA,IAAI,QAAQ,cAAc,SAAS,YACjC,MAAM,KAAK;EACT,MAAM;EACN,KAAK;EACL,MAAM;EACN,OAAO,CAAC,QAAQ;CAClB,CAAC;CAGH,KAAK,IAAI,IAAI,GAAG,IAAI,YAAY,KAAK;EACnC,MAAM,YAAY,eAAe;EACjC,MAAM,YAAY,eAAe;EACjC,MAAM,UAAU,cAAc;EAE9B,MAAM,KAAK;GACT,MAAM;GACN,KAAK,QAAQ;GACb,OAAO,aAAa;GACpB,eAAe;GACf,OAAO;EACT,CAAC;CACH;CAEA,IAAI,QACF,KAAK,IAAI,IAAI,GAAG,IAAI,OAAO,QAAQ,KACjC,MAAM,KAAK;EAAE,MAAM;EAAQ,KAAK,UAAU;EAAK,MAAM,OAAO;EAAI,OAAO;CAAM,CAAC;CAIlF,OAAO;AACT"}
+{"version":3,"file":"get-render-slots.mjs","names":[],"sources":["../../../src/components/RollingNumber/get-render-slots.ts"],"sourcesContent":["import { getDigitParts, type DigitParts } from './get-digit-parts';\n\nexport interface DigitSlot {\n  type: 'digit';\n  key: string;\n  digit: string;\n  previousDigit: string | null;\n  empty: boolean;\n}\n\nexport interface CharSlot {\n  type: 'char';\n  key: string;\n  char: string;\n  empty: boolean;\n}\n\nexport type RenderSlot = DigitSlot | CharSlot;\n\nexport interface GetRenderSlotsInput {\n  current: DigitParts;\n  previous: DigitParts;\n  prefix?: string;\n  suffix?: string;\n  decimalSeparator?: string;\n  thousandSeparator?: string | boolean;\n}\n\nfunction padLeft(arr: string[], length: number): (string | null)[] {\n  return [...Array(length - arr.length).fill(null), ...arr];\n}\n\nfunction padRight(arr: string[], length: number): (string | null)[] {\n  return [...arr, ...Array(length - arr.length).fill(null)];\n}\n\nexport function getRenderSlots({\n  current,\n  previous,\n  prefix,\n  suffix,\n  decimalSeparator = '.',\n  thousandSeparator,\n}: GetRenderSlotsInput): RenderSlot[] {\n  const maxIntLen = Math.max(current.intDigits.length, previous.intDigits.length);\n  const maxFracLen = Math.max(current.fracDigits.length, previous.fracDigits.length);\n\n  const currIntPadded = padLeft(current.intDigits, maxIntLen);\n  const prevIntPadded = padLeft(previous.intDigits, maxIntLen);\n  const currFracPadded = padRight(current.fracDigits, maxFracLen);\n  const prevFracPadded = padRight(previous.fracDigits, maxFracLen);\n\n  const sep = thousandSeparator\n    ? typeof thousandSeparator === 'string'\n      ? thousandSeparator\n      : ','\n    : null;\n\n  const slots: RenderSlot[] = [];\n\n  if (prefix) {\n    for (let i = 0; i < prefix.length; i++) {\n      slots.push({ type: 'char', key: `prefix-${i}`, char: prefix[i], empty: false });\n    }\n  }\n\n  if (current.negative || previous.negative) {\n    slots.push({ type: 'char', key: 'sign', char: '-', empty: !current.negative });\n  }\n\n  for (let i = 0; i < maxIntLen; i++) {\n    const posFromRight = maxIntLen - 1 - i;\n    const currDigit = currIntPadded[i];\n    const prevDigit = prevIntPadded[i];\n    const isEmpty = currDigit === null;\n\n    slots.push({\n      type: 'digit',\n      key: `int-${posFromRight}`,\n      digit: currDigit ?? '0',\n      previousDigit: prevDigit,\n      empty: isEmpty,\n    });\n\n    if (sep && posFromRight > 0 && posFromRight % 3 === 0) {\n      slots.push({ type: 'char', key: `sep-${posFromRight}`, char: sep, empty: isEmpty });\n    }\n  }\n\n  if (current.hasDecimal || previous.hasDecimal) {\n    slots.push({\n      type: 'char',\n      key: 'dec',\n      char: decimalSeparator,\n      empty: !current.hasDecimal,\n    });\n  }\n\n  for (let i = 0; i < maxFracLen; i++) {\n    const currDigit = currFracPadded[i];\n    const prevDigit = prevFracPadded[i];\n    const isEmpty = currDigit === null;\n\n    slots.push({\n      type: 'digit',\n      key: `frac-${i}`,\n      digit: currDigit ?? '0',\n      previousDigit: prevDigit,\n      empty: isEmpty,\n    });\n  }\n\n  if (suffix) {\n    for (let i = 0; i < suffix.length; i++) {\n      slots.push({ type: 'char', key: `suffix-${i}`, char: suffix[i], empty: false });\n    }\n  }\n\n  return slots;\n}\n\nexport interface GetRenderSlotsFromValuesInput {\n  value: number;\n  previousValue: number;\n  prefix?: string;\n  suffix?: string;\n  decimalSeparator?: string;\n  thousandSeparator?: string | boolean;\n  decimalScale?: number;\n  fixedDecimalScale?: boolean;\n}\n\nexport function getRenderSlotsFromValues({\n  value,\n  previousValue,\n  prefix,\n  suffix,\n  decimalSeparator,\n  thousandSeparator,\n  decimalScale,\n  fixedDecimalScale,\n}: GetRenderSlotsFromValuesInput): RenderSlot[] {\n  const current = getDigitParts({ value, decimalScale, fixedDecimalScale });\n  const prev = getDigitParts({ value: previousValue, decimalScale, fixedDecimalScale });\n\n  return getRenderSlots({\n    current,\n    previous: prev,\n    prefix,\n    suffix,\n    decimalSeparator,\n    thousandSeparator,\n  });\n}\n"],"mappings":";;AA4BA,SAAS,QAAQ,KAAe,QAAmC;CACjE,OAAO,CAAC,GAAG,MAAM,SAAS,IAAI,MAAM,CAAC,CAAC,KAAK,IAAI,GAAG,GAAG,GAAG;AAC1D;AAEA,SAAS,SAAS,KAAe,QAAmC;CAClE,OAAO,CAAC,GAAG,KAAK,GAAG,MAAM,SAAS,IAAI,MAAM,CAAC,CAAC,KAAK,IAAI,CAAC;AAC1D;AAEA,SAAgB,eAAe,EAC7B,SACA,UACA,QACA,QACA,mBAAmB,KACnB,qBACoC;CACpC,MAAM,YAAY,KAAK,IAAI,QAAQ,UAAU,QAAQ,SAAS,UAAU,MAAM;CAC9E,MAAM,aAAa,KAAK,IAAI,QAAQ,WAAW,QAAQ,SAAS,WAAW,MAAM;CAEjF,MAAM,gBAAgB,QAAQ,QAAQ,WAAW,SAAS;CAC1D,MAAM,gBAAgB,QAAQ,SAAS,WAAW,SAAS;CAC3D,MAAM,iBAAiB,SAAS,QAAQ,YAAY,UAAU;CAC9D,MAAM,iBAAiB,SAAS,SAAS,YAAY,UAAU;CAE/D,MAAM,MAAM,oBACR,OAAO,sBAAsB,WAC3B,oBACA,MACF;CAEJ,MAAM,QAAsB,CAAC;CAE7B,IAAI,QACF,KAAK,IAAI,IAAI,GAAG,IAAI,OAAO,QAAQ,KACjC,MAAM,KAAK;EAAE,MAAM;EAAQ,KAAK,UAAU;EAAK,MAAM,OAAO;EAAI,OAAO;CAAM,CAAC;CAIlF,IAAI,QAAQ,YAAY,SAAS,UAC/B,MAAM,KAAK;EAAE,MAAM;EAAQ,KAAK;EAAQ,MAAM;EAAK,OAAO,CAAC,QAAQ;CAAS,CAAC;CAG/E,KAAK,IAAI,IAAI,GAAG,IAAI,WAAW,KAAK;EAClC,MAAM,eAAe,YAAY,IAAI;EACrC,MAAM,YAAY,cAAc;EAChC,MAAM,YAAY,cAAc;EAChC,MAAM,UAAU,cAAc;EAE9B,MAAM,KAAK;GACT,MAAM;GACN,KAAK,OAAO;GACZ,OAAO,aAAa;GACpB,eAAe;GACf,OAAO;EACT,CAAC;EAED,IAAI,OAAO,eAAe,KAAK,eAAe,MAAM,GAClD,MAAM,KAAK;GAAE,MAAM;GAAQ,KAAK,OAAO;GAAgB,MAAM;GAAK,OAAO;EAAQ,CAAC;CAEtF;CAEA,IAAI,QAAQ,cAAc,SAAS,YACjC,MAAM,KAAK;EACT,MAAM;EACN,KAAK;EACL,MAAM;EACN,OAAO,CAAC,QAAQ;CAClB,CAAC;CAGH,KAAK,IAAI,IAAI,GAAG,IAAI,YAAY,KAAK;EACnC,MAAM,YAAY,eAAe;EACjC,MAAM,YAAY,eAAe;EACjC,MAAM,UAAU,cAAc;EAE9B,MAAM,KAAK;GACT,MAAM;GACN,KAAK,QAAQ;GACb,OAAO,aAAa;GACpB,eAAe;GACf,OAAO;EACT,CAAC;CACH;CAEA,IAAI,QACF,KAAK,IAAI,IAAI,GAAG,IAAI,OAAO,QAAQ,KACjC,MAAM,KAAK;EAAE,MAAM;EAAQ,KAAK,UAAU;EAAK,MAAM,OAAO;EAAI,OAAO;CAAM,CAAC;CAIlF,OAAO;AACT"}

package/esm/components/ScrollArea/ScrollAreaViewport/ScrollAreaViewport.mjs

@@ -20,6 +20,7 @@ function ScrollAreaViewport({ children, style, ref, onWheel, ...others }) {
 		...others,
 		ref: rootRef,
 		onWheel: handleWheel,
+		"data-scrollarea-viewport": true,
 		style: {
 			overflowX: ctx.scrollbarXEnabled ? "scroll" : "hidden",
 			overflowY: ctx.scrollbarYEnabled ? "scroll" : "hidden",

package/esm/components/ScrollArea/ScrollAreaViewport/ScrollAreaViewport.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollAreaViewport.mjs","names":[],"sources":["../../../../src/components/ScrollArea/ScrollAreaViewport/ScrollAreaViewport.tsx"],"sourcesContent":["import { useMergedRef } from '@mantine/hooks';\nimport { Box, BoxProps, ElementProps } from '../../../core';\nimport { useScrollAreaContext } from '../ScrollArea.context';\n\nexport interface ScrollAreaViewportProps extends BoxProps, ElementProps<'div'> {}\n\nexport function ScrollAreaViewport({\n  children,\n  style,\n  ref,\n  onWheel,\n  ...others\n}: ScrollAreaViewportProps) {\n  const ctx = useScrollAreaContext();\n  const rootRef = useMergedRef(ref, ctx.onViewportChange);\n\n  const handleWheel = (event: React.WheelEvent<HTMLDivElement>) => {\n    onWheel?.(event);\n\n    // Fix for Windows: Allow horizontal scrolling even when vertical scroll is at boundaries\n    // When at vertical boundaries, Windows tries to scroll the parent/page instead of allowing horizontal scroll\n    if (ctx.scrollbarXEnabled && ctx.viewport && event.shiftKey) {\n      const { scrollTop, scrollHeight, clientHeight, scrollWidth, clientWidth } = ctx.viewport;\n      const isAtTop = scrollTop < 1;\n      const isAtBottom = scrollTop >= scrollHeight - clientHeight - 1;\n      const canScrollHorizontally = scrollWidth > clientWidth;\n\n      if (canScrollHorizontally && (isAtTop || isAtBottom)) {\n        event.stopPropagation();\n      }\n    }\n  };\n\n  return (\n    <Box\n      {...others}\n      ref={rootRef}\n      onWheel={handleWheel}\n      style={{\n        overflowX: ctx.scrollbarXEnabled ? 'scroll' : 'hidden',\n        overflowY: ctx.scrollbarYEnabled ? 'scroll' : 'hidden',\n        ...style,\n      }}\n    >\n      <div {...ctx.getStyles('content')} ref={ctx.onContentChange}>\n        {children}\n      </div>\n    </Box>\n  );\n}\n\nScrollAreaViewport.displayName = '@mantine/core/ScrollAreaViewport';\n"],"mappings":";;;;;;AAMA,SAAgB,mBAAmB,EACjC,UACA,OACA,KACA,SACA,GAAG,UACuB;CAC1B,MAAM,MAAM,qBAAqB;CACjC,MAAM,UAAU,aAAa,KAAK,IAAI,gBAAgB;CAEtD,MAAM,eAAe,UAA4C;EAC/D,UAAU,KAAK;EAIf,IAAI,IAAI,qBAAqB,IAAI,YAAY,MAAM,UAAU;GAC3D,MAAM,EAAE,WAAW,cAAc,cAAc,aAAa,gBAAgB,IAAI;GAChF,MAAM,UAAU,YAAY;GAC5B,MAAM,aAAa,aAAa,eAAe,eAAe;GAG9D,IAF8B,cAAc,gBAEd,WAAW,aACvC,MAAM,gBAAgB;EAE1B;CACF;CAEA,OACE,oBAAC,KAAD;EACE,GAAI;EACJ,KAAK;EACL,SAAS;EACT,OAAO;GACL,WAAW,IAAI,oBAAoB,WAAW;GAC9C,WAAW,IAAI,oBAAoB,WAAW;GAC9C,GAAG;EACL;YAEA,oBAAC,OAAD;GAAK,GAAI,IAAI,UAAU,SAAS;GAAG,KAAK,IAAI;GACzC;EACE,CAAA;CACF,CAAA;AAET;AAEA,mBAAmB,cAAc"}
+{"version":3,"file":"ScrollAreaViewport.mjs","names":[],"sources":["../../../../src/components/ScrollArea/ScrollAreaViewport/ScrollAreaViewport.tsx"],"sourcesContent":["import { useMergedRef } from '@mantine/hooks';\nimport { Box, BoxProps, ElementProps } from '../../../core';\nimport { useScrollAreaContext } from '../ScrollArea.context';\n\nexport interface ScrollAreaViewportProps extends BoxProps, ElementProps<'div'> {}\n\nexport function ScrollAreaViewport({\n  children,\n  style,\n  ref,\n  onWheel,\n  ...others\n}: ScrollAreaViewportProps) {\n  const ctx = useScrollAreaContext();\n  const rootRef = useMergedRef(ref, ctx.onViewportChange);\n\n  const handleWheel = (event: React.WheelEvent<HTMLDivElement>) => {\n    onWheel?.(event);\n\n    // Fix for Windows: Allow horizontal scrolling even when vertical scroll is at boundaries\n    // When at vertical boundaries, Windows tries to scroll the parent/page instead of allowing horizontal scroll\n    if (ctx.scrollbarXEnabled && ctx.viewport && event.shiftKey) {\n      const { scrollTop, scrollHeight, clientHeight, scrollWidth, clientWidth } = ctx.viewport;\n      const isAtTop = scrollTop < 1;\n      const isAtBottom = scrollTop >= scrollHeight - clientHeight - 1;\n      const canScrollHorizontally = scrollWidth > clientWidth;\n\n      if (canScrollHorizontally && (isAtTop || isAtBottom)) {\n        event.stopPropagation();\n      }\n    }\n  };\n\n  return (\n    <Box\n      {...others}\n      ref={rootRef}\n      onWheel={handleWheel}\n      data-scrollarea-viewport\n      style={{\n        overflowX: ctx.scrollbarXEnabled ? 'scroll' : 'hidden',\n        overflowY: ctx.scrollbarYEnabled ? 'scroll' : 'hidden',\n        ...style,\n      }}\n    >\n      <div {...ctx.getStyles('content')} ref={ctx.onContentChange}>\n        {children}\n      </div>\n    </Box>\n  );\n}\n\nScrollAreaViewport.displayName = '@mantine/core/ScrollAreaViewport';\n"],"mappings":";;;;;;AAMA,SAAgB,mBAAmB,EACjC,UACA,OACA,KACA,SACA,GAAG,UACuB;CAC1B,MAAM,MAAM,qBAAqB;CACjC,MAAM,UAAU,aAAa,KAAK,IAAI,gBAAgB;CAEtD,MAAM,eAAe,UAA4C;EAC/D,UAAU,KAAK;EAIf,IAAI,IAAI,qBAAqB,IAAI,YAAY,MAAM,UAAU;GAC3D,MAAM,EAAE,WAAW,cAAc,cAAc,aAAa,gBAAgB,IAAI;GAChF,MAAM,UAAU,YAAY;GAC5B,MAAM,aAAa,aAAa,eAAe,eAAe;GAG9D,IAF8B,cAAc,gBAEd,WAAW,aACvC,MAAM,gBAAgB;EAE1B;CACF;CAEA,OACE,oBAAC,KAAD;EACE,GAAI;EACJ,KAAK;EACL,SAAS;EACT,4BAAA;EACA,OAAO;GACL,WAAW,IAAI,oBAAoB,WAAW;GAC9C,WAAW,IAAI,oBAAoB,WAAW;GAC9C,GAAG;EACL;YAEA,oBAAC,OAAD;GAAK,GAAI,IAAI,UAAU,SAAS;GAAG,KAAK,IAAI;GACzC;EACE,CAAA;CACF,CAAA;AAET;AAEA,mBAAmB,cAAc"}

package/esm/components/ScrollArea/utils/add-unlinked-scroll-listener.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"add-unlinked-scroll-listener.mjs","names":[],"sources":["../../../../src/components/ScrollArea/utils/add-unlinked-scroll-listener.tsx"],"sourcesContent":["export function addUnlinkedScrollListener(node: HTMLElement, handler = () => {}) {\n  let prevPosition = { left: node.scrollLeft, top: node.scrollTop };\n  let rAF = 0;\n  (function loop() {\n    const position = { left: node.scrollLeft, top: node.scrollTop };\n    const isHorizontalScroll = prevPosition.left !== position.left;\n    const isVerticalScroll = prevPosition.top !== position.top;\n    if (isHorizontalScroll || isVerticalScroll) {\n      handler();\n    }\n    prevPosition = position;\n    rAF = window.requestAnimationFrame(loop);\n  })();\n  return () => window.cancelAnimationFrame(rAF);\n}\n"],"mappings":";;AAAA,SAAgB,0BAA0B,MAAmB,gBAAgB,CAAC,GAAG;CAC/E,IAAI,eAAe;EAAE,MAAM,KAAK;EAAY,KAAK,KAAK;CAAU;CAChE,IAAI,MAAM;CACV,CAAC,SAAS,OAAO;EACf,MAAM,WAAW;GAAE,MAAM,KAAK;GAAY,KAAK,KAAK;EAAU;EAC9D,MAAM,qBAAqB,aAAa,SAAS,SAAS;EAC1D,MAAM,mBAAmB,aAAa,QAAQ,SAAS;EACvD,IAAI,sBAAsB,kBACxB,QAAQ;EAEV,eAAe;EACf,MAAM,OAAO,sBAAsB,IAAI;CACzC,GAAG;CACH,aAAa,OAAO,qBAAqB,GAAG;AAC9C"}
+{"version":3,"file":"add-unlinked-scroll-listener.mjs","names":[],"sources":["../../../../src/components/ScrollArea/utils/add-unlinked-scroll-listener.tsx"],"sourcesContent":["export function addUnlinkedScrollListener(node: HTMLElement, handler = () => {}) {\n  let prevPosition = { left: node.scrollLeft, top: node.scrollTop };\n  let rAF = 0;\n  (function loop() {\n    const position = { left: node.scrollLeft, top: node.scrollTop };\n    const isHorizontalScroll = prevPosition.left !== position.left;\n    const isVerticalScroll = prevPosition.top !== position.top;\n    if (isHorizontalScroll || isVerticalScroll) {\n      handler();\n    }\n    prevPosition = position;\n    rAF = window.requestAnimationFrame(loop);\n  })();\n  return () => window.cancelAnimationFrame(rAF);\n}\n"],"mappings":";;AAAA,SAAgB,0BAA0B,MAAmB,gBAAgB,CAAC,GAAG;CAC/E,IAAI,eAAe;EAAE,MAAM,KAAK;EAAY,KAAK,KAAK;CAAU;CAChE,IAAI,MAAM;CACV,CAAC,SAAS,OAAO;EACf,MAAM,WAAW;GAAE,MAAM,KAAK;GAAY,KAAK,KAAK;EAAU;EAC9D,MAAM,qBAAqB,aAAa,SAAS,SAAS;EAC1D,MAAM,mBAAmB,aAAa,QAAQ,SAAS;EACvD,IAAI,sBAAsB,kBACxB,QAAQ;EAEV,eAAe;EACf,MAAM,OAAO,sBAAsB,IAAI;CACzC,EAAA,CAAG;CACH,aAAa,OAAO,qBAAqB,GAAG;AAC9C"}

package/esm/components/ScrollArea/utils/get-scroll-position-from-pointer.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"get-scroll-position-from-pointer.mjs","names":[],"sources":["../../../../src/components/ScrollArea/utils/get-scroll-position-from-pointer.ts"],"sourcesContent":["import type { Sizes } from '../ScrollArea.types';\nimport { getThumbSize } from './get-thumb-size';\nimport { linearScale } from './linear-scale';\n\nexport function getScrollPositionFromPointer(\n  pointerPos: number,\n  pointerOffset: number,\n  sizes: Sizes,\n  dir: 'ltr' | 'rtl' = 'ltr'\n) {\n  const thumbSizePx = getThumbSize(sizes);\n  const thumbCenter = thumbSizePx / 2;\n  const offset = pointerOffset || thumbCenter;\n  const thumbOffsetFromEnd = thumbSizePx - offset;\n  const minPointerPos = sizes.scrollbar.paddingStart + offset;\n  const maxPointerPos = sizes.scrollbar.size - sizes.scrollbar.paddingEnd - thumbOffsetFromEnd;\n  const maxScrollPos = sizes.content - sizes.viewport;\n  const scrollRange = dir === 'ltr' ? [0, maxScrollPos] : [maxScrollPos * -1, 0];\n  const interpolate = linearScale([minPointerPos, maxPointerPos], scrollRange as [number, number]);\n  return interpolate(pointerPos);\n}\n"],"mappings":";;;;AAIA,SAAgB,6BACd,YACA,eACA,OACA,MAAqB,OACrB;CACA,MAAM,cAAc,aAAa,KAAK;CACtC,MAAM,cAAc,cAAc;CAClC,MAAM,SAAS,iBAAiB;CAChC,MAAM,qBAAqB,cAAc;CACzC,MAAM,gBAAgB,MAAM,UAAU,eAAe;CACrD,MAAM,gBAAgB,MAAM,UAAU,OAAO,MAAM,UAAU,aAAa;CAC1E,MAAM,eAAe,MAAM,UAAU,MAAM;CAC3C,MAAM,cAAc,QAAQ,QAAQ,CAAC,GAAG,YAAY,IAAI,CAAC,eAAe,IAAI,CAAC;CAE7E,OADoB,YAAY,CAAC,eAAe,aAAa,GAAG,WAC/C,EAAE,UAAU;AAC/B"}
+{"version":3,"file":"get-scroll-position-from-pointer.mjs","names":[],"sources":["../../../../src/components/ScrollArea/utils/get-scroll-position-from-pointer.ts"],"sourcesContent":["import type { Sizes } from '../ScrollArea.types';\nimport { getThumbSize } from './get-thumb-size';\nimport { linearScale } from './linear-scale';\n\nexport function getScrollPositionFromPointer(\n  pointerPos: number,\n  pointerOffset: number,\n  sizes: Sizes,\n  dir: 'ltr' | 'rtl' = 'ltr'\n) {\n  const thumbSizePx = getThumbSize(sizes);\n  const thumbCenter = thumbSizePx / 2;\n  const offset = pointerOffset || thumbCenter;\n  const thumbOffsetFromEnd = thumbSizePx - offset;\n  const minPointerPos = sizes.scrollbar.paddingStart + offset;\n  const maxPointerPos = sizes.scrollbar.size - sizes.scrollbar.paddingEnd - thumbOffsetFromEnd;\n  const maxScrollPos = sizes.content - sizes.viewport;\n  const scrollRange = dir === 'ltr' ? [0, maxScrollPos] : [maxScrollPos * -1, 0];\n  const interpolate = linearScale([minPointerPos, maxPointerPos], scrollRange as [number, number]);\n  return interpolate(pointerPos);\n}\n"],"mappings":";;;;AAIA,SAAgB,6BACd,YACA,eACA,OACA,MAAqB,OACrB;CACA,MAAM,cAAc,aAAa,KAAK;CACtC,MAAM,cAAc,cAAc;CAClC,MAAM,SAAS,iBAAiB;CAChC,MAAM,qBAAqB,cAAc;CACzC,MAAM,gBAAgB,MAAM,UAAU,eAAe;CACrD,MAAM,gBAAgB,MAAM,UAAU,OAAO,MAAM,UAAU,aAAa;CAC1E,MAAM,eAAe,MAAM,UAAU,MAAM;CAC3C,MAAM,cAAc,QAAQ,QAAQ,CAAC,GAAG,YAAY,IAAI,CAAC,eAAe,IAAI,CAAC;CAE7E,OADoB,YAAY,CAAC,eAAe,aAAa,GAAG,WAC/C,CAAC,CAAC,UAAU;AAC/B"}

package/esm/components/ScrollArea/utils/get-thumb-offset-from-scroll.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"get-thumb-offset-from-scroll.mjs","names":[],"sources":["../../../../src/components/ScrollArea/utils/get-thumb-offset-from-scroll.ts"],"sourcesContent":["import type { Sizes } from '../ScrollArea.types';\nimport { getThumbSize } from './get-thumb-size';\nimport { linearScale } from './linear-scale';\n\nfunction clamp(value: number, [min, max]: [number, number]): number {\n  return Math.min(max, Math.max(min, value));\n}\n\nexport function getThumbOffsetFromScroll(\n  scrollPos: number,\n  sizes: Sizes,\n  dir: 'rtl' | 'ltr' = 'ltr'\n) {\n  const thumbSizePx = getThumbSize(sizes);\n  const scrollbarPadding = sizes.scrollbar.paddingStart + sizes.scrollbar.paddingEnd;\n  const scrollbar = sizes.scrollbar.size - scrollbarPadding;\n  const maxScrollPos = sizes.content - sizes.viewport;\n  const maxThumbPos = scrollbar - thumbSizePx;\n  const scrollClampRange = dir === 'ltr' ? [0, maxScrollPos] : [maxScrollPos * -1, 0];\n  const scrollWithoutMomentum = clamp(scrollPos, scrollClampRange as [number, number]);\n  const interpolate = linearScale([0, maxScrollPos], [0, maxThumbPos]);\n  return interpolate(scrollWithoutMomentum);\n}\n"],"mappings":";;;;AAIA,SAAS,MAAM,OAAe,CAAC,KAAK,MAAgC;CAClE,OAAO,KAAK,IAAI,KAAK,KAAK,IAAI,KAAK,KAAK,CAAC;AAC3C;AAEA,SAAgB,yBACd,WACA,OACA,MAAqB,OACrB;CACA,MAAM,cAAc,aAAa,KAAK;CACtC,MAAM,mBAAmB,MAAM,UAAU,eAAe,MAAM,UAAU;CACxE,MAAM,YAAY,MAAM,UAAU,OAAO;CACzC,MAAM,eAAe,MAAM,UAAU,MAAM;CAC3C,MAAM,cAAc,YAAY;CAEhC,MAAM,wBAAwB,MAAM,WADX,QAAQ,QAAQ,CAAC,GAAG,YAAY,IAAI,CAAC,eAAe,IAAI,CAAC,CACC;CAEnF,OADoB,YAAY,CAAC,GAAG,YAAY,GAAG,CAAC,GAAG,WAAW,CACjD,EAAE,qBAAqB;AAC1C"}
+{"version":3,"file":"get-thumb-offset-from-scroll.mjs","names":[],"sources":["../../../../src/components/ScrollArea/utils/get-thumb-offset-from-scroll.ts"],"sourcesContent":["import type { Sizes } from '../ScrollArea.types';\nimport { getThumbSize } from './get-thumb-size';\nimport { linearScale } from './linear-scale';\n\nfunction clamp(value: number, [min, max]: [number, number]): number {\n  return Math.min(max, Math.max(min, value));\n}\n\nexport function getThumbOffsetFromScroll(\n  scrollPos: number,\n  sizes: Sizes,\n  dir: 'rtl' | 'ltr' = 'ltr'\n) {\n  const thumbSizePx = getThumbSize(sizes);\n  const scrollbarPadding = sizes.scrollbar.paddingStart + sizes.scrollbar.paddingEnd;\n  const scrollbar = sizes.scrollbar.size - scrollbarPadding;\n  const maxScrollPos = sizes.content - sizes.viewport;\n  const maxThumbPos = scrollbar - thumbSizePx;\n  const scrollClampRange = dir === 'ltr' ? [0, maxScrollPos] : [maxScrollPos * -1, 0];\n  const scrollWithoutMomentum = clamp(scrollPos, scrollClampRange as [number, number]);\n  const interpolate = linearScale([0, maxScrollPos], [0, maxThumbPos]);\n  return interpolate(scrollWithoutMomentum);\n}\n"],"mappings":";;;;AAIA,SAAS,MAAM,OAAe,CAAC,KAAK,MAAgC;CAClE,OAAO,KAAK,IAAI,KAAK,KAAK,IAAI,KAAK,KAAK,CAAC;AAC3C;AAEA,SAAgB,yBACd,WACA,OACA,MAAqB,OACrB;CACA,MAAM,cAAc,aAAa,KAAK;CACtC,MAAM,mBAAmB,MAAM,UAAU,eAAe,MAAM,UAAU;CACxE,MAAM,YAAY,MAAM,UAAU,OAAO;CACzC,MAAM,eAAe,MAAM,UAAU,MAAM;CAC3C,MAAM,cAAc,YAAY;CAEhC,MAAM,wBAAwB,MAAM,WADX,QAAQ,QAAQ,CAAC,GAAG,YAAY,IAAI,CAAC,eAAe,IAAI,CAAC,CACC;CAEnF,OADoB,YAAY,CAAC,GAAG,YAAY,GAAG,CAAC,GAAG,WAAW,CACjD,CAAC,CAAC,qBAAqB;AAC1C"}