npm - @mantine/core - Versions diffs - 9.0.0 → 9.0.1 - Mend

@mantine/core 9.0.0 → 9.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (466) hide show

package/esm/components/ColorPicker/ColorPicker.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ColorPicker.mjs","names":["classes"],"sources":["../../../src/components/ColorPicker/ColorPicker.tsx"],"sourcesContent":["import { useRef, useState } from 'react';\nimport { useDidUpdate, useUncontrolled } from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n DataAttributes,\n ElementProps,\n factory,\n Factory,\n getSize,\n getSpacing,\n MantineSize,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { ColorSwatch } from '../ColorSwatch';\nimport { AlphaSlider } from './AlphaSlider/AlphaSlider';\nimport { ColorPickerContext } from './ColorPicker.context';\nimport { ColorFormat, HsvaColor } from './ColorPicker.types';\nimport { convertHsvaTo, isColorValid, parseColor } from './converters';\nimport { HueSlider } from './HueSlider/HueSlider';\nimport { Saturation } from './Saturation/Saturation';\nimport { Swatches } from './Swatches/Swatches';\nimport classes from './ColorPicker.module.css';\n\nexport type ColorPickerStylesNames =\n \| 'wrapper'\n \| 'preview'\n \| 'body'\n \| 'sliders'\n \| 'slider'\n \| 'sliderOverlay'\n \| 'thumb'\n \| 'saturation'\n \| 'thumb'\n \| 'saturationOverlay'\n \| 'thumb'\n \| 'swatches'\n \| 'swatch';\n\nexport type ColorPickerCssVariables = {\n wrapper:\n \| '--cp-preview-size'\n \| '--cp-width'\n \| '--cp-body-spacing'\n \| '--cp-swatch-size'\n \| '--cp-thumb-size'\n \| '--cp-saturation-height';\n};\n\nexport interface __ColorPickerProps {\n /** Controlled component value /\n value?: string;\n\n /* Uncontrolled component default value /\n defaultValue?: string;\n\n /* Called when value changes /\n onChange?: (value: string) => void;\n\n /* Called when the user stops dragging one of the sliders or changes the value with keyboard /\n onChangeEnd?: (value: string) => void;\n\n /* Color format. `hexa`, `rgba`, `hsla` values render alpha channel slider @default 'hex' /\n format?: ColorFormat;\n\n /* If `false`, the component displays only swatches @default true /\n withPicker?: boolean;\n\n /* A list of colors used to display swatches list below the color picker /\n swatches?: string[];\n\n /* Number of swatches per row @default 7 /\n swatchesPerRow?: number;\n\n /* Component size @default 'md' /\n size?: MantineSize \| (string & {});\n}\n\nexport interface ColorPickerProps\n extends\n BoxProps,\n __ColorPickerProps,\n StylesApiProps<ColorPickerFactory>,\n ElementProps<'div', 'onChange' \| 'value' \| 'defaultValue'> {\n __staticSelector?: string;\n\n /* If set, the component takes 100% width of its container @default false /\n fullWidth?: boolean;\n\n /* If set, interactive elements (sliders thumbs and swatches) are focusable with keyboard @default true /\n focusable?: boolean;\n\n /* Saturation slider `aria-label` /\n saturationLabel?: string;\n\n /* Hue slider `aria-label` /\n hueLabel?: string;\n\n /* Alpha slider `aria-label` /\n alphaLabel?: string;\n\n /* Called when one of the color swatches is clicked /\n onColorSwatchClick?: (color: string) => void;\n\n /* Hidden input `name` attribute, if not set, the input will not be rendered /\n name?: string;\n\n /* Props spread to the hidden input */\n hiddenInputProps?: React.ComponentProps<'input'> & DataAttributes;\n}\n\nexport type ColorPickerFactory = Factory<{\n props: ColorPickerProps;\n ref: HTMLDivElement;\n stylesNames: ColorPickerStylesNames;\n vars: ColorPickerCssVariables;\n}>;\n\nconst defaultProps = {\n swatchesPerRow: 7,\n withPicker: true,\n focusable: true,\n size: 'md',\n __staticSelector: 'ColorPicker',\n} satisfies Partial<ColorPickerProps>;\n\nconst varsResolver = createVarsResolver<ColorPickerFactory>((_, { size, swatchesPerRow }) => ({\n wrapper: {\n '--cp-preview-size': getSize(size, 'cp-preview-size'),\n '--cp-width': getSize(size, 'cp-width'),\n '--cp-body-spacing': getSpacing(size),\n '--cp-swatch-size': `${100 / swatchesPerRow!}%`,\n '--cp-thumb-size': getSize(size, 'cp-thumb-size'),\n '--cp-saturation-height': getSize(size, 'cp-saturation-height'),\n },\n}));\n\nexport const ColorPicker = factory<ColorPickerFactory>((_props) => {\n const props = useProps('ColorPicker', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n format = 'hex',\n value,\n defaultValue,\n onChange,\n onChangeEnd,\n withPicker,\n size,\n saturationLabel,\n hueLabel,\n alphaLabel,\n focusable,\n swatches,\n swatchesPerRow,\n fullWidth,\n onColorSwatchClick,\n __staticSelector,\n mod,\n attributes,\n name,\n hiddenInputProps,\n ...others\n } = props;\n\n const getStyles = useStyles<ColorPickerFactory>({\n name: __staticSelector,\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n rootSelector: 'wrapper',\n vars,\n varsResolver,\n });\n\n const formatRef = useRef(format \|\| 'hex');\n const valueRef = useRef<string>('');\n const scrubTimeoutRef = useRef<number>(-1);\n const isScrubbingRef = useRef(false);\n const withAlpha = format === 'hexa' \|\| format === 'rgba' \|\| format === 'hsla';\n\n const [_value, setValue, controlled] = useUncontrolled({\n value,\n defaultValue,\n finalValue: '#FFFFFF',\n onChange,\n });\n\n const [parsed, setParsed] = useState<HsvaColor>(parseColor(_value));\n\n const startScrubbing = () => {\n window.clearTimeout(scrubTimeoutRef.current);\n isScrubbingRef.current = true;\n };\n\n const stopScrubbing = () => {\n window.clearTimeout(scrubTimeoutRef.current);\n scrubTimeoutRef.current = window.setTimeout(() => {\n isScrubbingRef.current = false;\n }, 200);\n };\n\n const handleChange = (color: Partial<HsvaColor>) => {\n setParsed((current) => {\n const next = { ...current, ...color };\n valueRef.current = convertHsvaTo(formatRef.current, next);\n return next;\n });\n\n setValue(valueRef.current);\n };\n\n useDidUpdate(() => {\n if (typeof value === 'string' && isColorValid(value) && !isScrubbingRef.current) {\n setParsed(parseColor(value));\n }\n }, [value]);\n\n useDidUpdate(() => {\n formatRef.current = format \|\| 'hex';\n setValue(convertHsvaTo(formatRef.current, parsed));\n }, [format]);\n\n return (\n <ColorPickerContext value={{ getStyles, unstyled }}>\n <Box\n {...getStyles('wrapper')}\n size={size}\n mod={[{ 'full-width': fullWidth }, mod]}\n {...others}\n >\n {name && <input type=\"hidden\" name={name} value={_value} {...hiddenInputProps} />}\n\n {withPicker && (\n <>\n <Saturation\n value={parsed}\n onChange={handleChange}\n onChangeEnd={({ s, v }) =>\n onChangeEnd?.(convertHsvaTo(formatRef.current, { ...parsed, s: s!, v: v! }))\n }\n color={_value}\n size={size}\n focusable={focusable}\n saturationLabel={saturationLabel}\n onScrubStart={startScrubbing}\n onScrubEnd={stopScrubbing}\n />\n\n <div {...getStyles('body')}>\n <div {...getStyles('sliders')}>\n <HueSlider\n value={parsed.h}\n onChange={(h) => handleChange({ h })}\n onChangeEnd={(h) =>\n onChangeEnd?.(convertHsvaTo(formatRef.current, { ...parsed, h }))\n }\n size={size}\n focusable={focusable}\n aria-label={hueLabel}\n onScrubStart={startScrubbing}\n onScrubEnd={stopScrubbing}\n />\n\n {withAlpha && (\n <AlphaSlider\n value={parsed.a}\n onChange={(a) => handleChange({ a })}\n onChangeEnd={(a) => {\n onChangeEnd?.(convertHsvaTo(formatRef.current, { ...parsed, a }));\n }}\n size={size}\n color={convertHsvaTo('hex', parsed)}\n focusable={focusable}\n aria-label={alphaLabel}\n onScrubStart={startScrubbing}\n onScrubEnd={stopScrubbing}\n />\n )}\n </div>\n\n {withAlpha && (\n <ColorSwatch\n color={_value}\n radius=\"sm\"\n size=\"var(--cp-preview-size)\"\n {...getStyles('preview')}\n />\n )}\n </div>\n </>\n )}\n\n {Array.isArray(swatches) && (\n <Swatches\n data={swatches}\n swatchesPerRow={swatchesPerRow}\n focusable={focusable}\n setValue={setValue}\n value={_value}\n onChangeEnd={(color) => {\n const convertedColor = convertHsvaTo(format, parseColor(color));\n onColorSwatchClick?.(convertedColor);\n onChangeEnd?.(convertedColor);\n if (!controlled) {\n setParsed(parseColor(color));\n }\n }}\n />\n )}\n </Box>\n </ColorPickerContext>\n );\n});\n\nColorPicker.classes = classes;\nColorPicker.varsResolver = varsResolver;\nColorPicker.displayName = '@mantine/core/ColorPicker';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAyHA,MAAM,eAAe;CACnB,gBAAgB;CAChB,YAAY;CACZ,WAAW;CACX,MAAM;CACN,kBAAkB;CACnB;AAED,MAAM,eAAe,oBAAwC,GAAG,EAAE,MAAM,sBAAsB,EAC5F,SAAS;CACP,qBAAqB,QAAQ,MAAM,kBAAkB;CACrD,cAAc,QAAQ,MAAM,WAAW;CACvC,qBAAqB,WAAW,KAAK;CACrC,oBAAoB,GAAG,MAAM,eAAgB;CAC7C,mBAAmB,QAAQ,MAAM,gBAAgB;CACjD,0BAA0B,QAAQ,MAAM,uBAAuB;CAChE,EACF,EAAE;AAEH,MAAa,cAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,cAAc,OAAO;CAC3D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,SAAS,OACT,OACA,cACA,UACA,aACA,YACA,MACA,iBACA,UACA,YACA,WACA,UACA,gBACA,WACA,oBACA,kBACA,KACA,YACA,MACA,kBACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA8B;EAC9C,MAAM;EACN;EACA,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;EACd;EACA;EACD,CAAC;CAEF,MAAM,YAAY,OAAO,UAAU,MAAM;CACzC,MAAM,WAAW,OAAe,GAAG;CACnC,MAAM,kBAAkB,OAAe,GAAG;CAC1C,MAAM,iBAAiB,OAAO,MAAM;CACpC,MAAM,YAAY,WAAW,UAAU,WAAW,UAAU,WAAW;CAEvE,MAAM,CAAC,QAAQ,UAAU,cAAc,gBAAgB;EACrD;EACA;EACA,YAAY;EACZ;EACD,CAAC;CAEF,MAAM,CAAC,QAAQ,aAAa,SAAoB,WAAW,OAAO,CAAC;CAEnE,MAAM,uBAAuB;AAC3B,SAAO,aAAa,gBAAgB,QAAQ;AAC5C,iBAAe,UAAU;;CAG3B,MAAM,sBAAsB;AAC1B,SAAO,aAAa,gBAAgB,QAAQ;AAC5C,kBAAgB,UAAU,OAAO,iBAAiB;AAChD,kBAAe,UAAU;KACxB,IAAI;;CAGT,MAAM,gBAAgB,UAA8B;AAClD,aAAW,YAAY;GACrB,MAAM,OAAO;IAAE,GAAG;IAAS,GAAG;IAAO;AACrC,YAAS,UAAU,cAAc,UAAU,SAAS,KAAK;AACzD,UAAO;IACP;AAEF,WAAS,SAAS,QAAQ;;AAG5B,oBAAmB;AACjB,MAAI,OAAO,UAAU,YAAY,aAAa,MAAM,IAAI,CAAC,eAAe,QACtE,WAAU,WAAW,MAAM,CAAC;IAE7B,CAAC,MAAM,CAAC;AAEX,oBAAmB;AACjB,YAAU,UAAU,UAAU;AAC9B,WAAS,cAAc,UAAU,SAAS,OAAO,CAAC;IACjD,CAAC,OAAO,CAAC;AAEZ,QACE,oBAAC,oBAAD;EAAoB,OAAO;GAAE;GAAW;GAAU;YAChD,qBAAC,KAAD;GACE,GAAI,UAAU,UAAU;GAClB;GACN,KAAK,CAAC,EAAE,cAAc,WAAW,EAAE,IAAI;GACvC,GAAI;aAJN;IAMG,QAAQ,oBAAC,SAAD;KAAO,MAAK;KAAe;KAAM,OAAO;KAAQ,GAAI;KAAoB,CAAA;IAEhF,cACC,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,YAAD;KACE,OAAO;KACP,UAAU;KACV,cAAc,EAAE,GAAG,QACjB,cAAc,cAAc,UAAU,SAAS;MAAE,GAAG;MAAW;MAAO;MAAI,CAAC,CAAC;KAE9E,OAAO;KACD;KACK;KACM;KACjB,cAAc;KACd,YAAY;KACZ,CAAA,EAEF,qBAAC,OAAD;KAAK,GAAI,UAAU,OAAO;eAA1B,CACE,qBAAC,OAAD;MAAK,GAAI,UAAU,UAAU;gBAA7B,CACE,oBAAC,WAAD;OACE,OAAO,OAAO;OACd,WAAW,MAAM,aAAa,EAAE,GAAG,CAAC;OACpC,cAAc,MACZ,cAAc,cAAc,UAAU,SAAS;QAAE,GAAG;QAAQ;QAAG,CAAC,CAAC;OAE7D;OACK;OACX,cAAY;OACZ,cAAc;OACd,YAAY;OACZ,CAAA,EAED,aACC,oBAAC,aAAD;OACE,OAAO,OAAO;OACd,WAAW,MAAM,aAAa,EAAE,GAAG,CAAC;OACpC,cAAc,MAAM;AAClB,sBAAc,cAAc,UAAU,SAAS;SAAE,GAAG;SAAQ;SAAG,CAAC,CAAC;;OAE7D;OACN,OAAO,cAAc,OAAO,OAAO;OACxB;OACX,cAAY;OACZ,cAAc;OACd,YAAY;OACZ,CAAA,CAEA;SAEL,aACC,oBAAC,aAAD;MACE,OAAO;MACP,QAAO;MACP,MAAK;MACL,GAAI,UAAU,UAAU;MACxB,CAAA,CAEA;OACL,EAAA,CAAA;IAGJ,MAAM,QAAQ,SAAS,IACtB,oBAAC,UAAD;KACE,MAAM;KACU;KACL;KACD;KACV,OAAO;KACP,cAAc,UAAU;MACtB,MAAM,iBAAiB,cAAc,QAAQ,WAAW,MAAM,CAAC;AAC/D,2BAAqB,eAAe;AACpC,oBAAc,eAAe;AAC7B,UAAI,CAAC,WACH,WAAU,WAAW,MAAM,CAAC;;KAGhC,CAAA;IAEA;;EACa,CAAA;EAEvB;AAEF,YAAY,UAAUA;AACtB,YAAY,eAAe;AAC3B,YAAY,cAAc"}
1	+ {"version":3,"file":"ColorPicker.mjs","names":["classes"],"sources":["../../../src/components/ColorPicker/ColorPicker.tsx"],"sourcesContent":["import { useRef, useState } from 'react';\nimport { useDidUpdate, useUncontrolled } from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n DataAttributes,\n ElementProps,\n factory,\n Factory,\n getSize,\n getSpacing,\n MantineSize,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { ColorSwatch } from '../ColorSwatch';\nimport { AlphaSlider } from './AlphaSlider/AlphaSlider';\nimport { ColorPickerContext } from './ColorPicker.context';\nimport { ColorFormat, HsvaColor } from './ColorPicker.types';\nimport { convertHsvaTo, isColorValid, parseColor } from './converters';\nimport { HueSlider } from './HueSlider/HueSlider';\nimport { Saturation } from './Saturation/Saturation';\nimport { Swatches } from './Swatches/Swatches';\nimport classes from './ColorPicker.module.css';\n\nexport type ColorPickerStylesNames =\n \| 'wrapper'\n \| 'preview'\n \| 'body'\n \| 'sliders'\n \| 'slider'\n \| 'sliderOverlay'\n \| 'thumb'\n \| 'saturation'\n \| 'thumb'\n \| 'saturationOverlay'\n \| 'thumb'\n \| 'swatches'\n \| 'swatch';\n\nexport type ColorPickerCssVariables = {\n wrapper:\n \| '--cp-preview-size'\n \| '--cp-width'\n \| '--cp-body-spacing'\n \| '--cp-swatch-size'\n \| '--cp-thumb-size'\n \| '--cp-saturation-height';\n};\n\nexport interface __ColorPickerProps {\n /** Controlled component value /\n value?: string;\n\n /* Uncontrolled component default value /\n defaultValue?: string;\n\n /* Called when value changes /\n onChange?: (value: string) => void;\n\n /* Called when the user stops dragging one of the sliders or changes the value with keyboard /\n onChangeEnd?: (value: string) => void;\n\n /* Color format. `hexa`, `rgba`, `hsla` values render alpha channel slider @default 'hex' /\n format?: ColorFormat;\n\n /* If `false`, the component displays only swatches @default true /\n withPicker?: boolean;\n\n /* A list of colors used to display swatches list below the color picker /\n swatches?: string[];\n\n /* Number of swatches per row @default 7 /\n swatchesPerRow?: number;\n\n /* Component size @default 'md' /\n size?: MantineSize \| (string & {});\n}\n\nexport interface ColorPickerProps\n extends\n BoxProps,\n __ColorPickerProps,\n StylesApiProps<ColorPickerFactory>,\n ElementProps<'div', 'onChange' \| 'value' \| 'defaultValue'> {\n __staticSelector?: string;\n\n /* If set, the component takes 100% width of its container @default false /\n fullWidth?: boolean;\n\n /* If set, interactive elements (sliders thumbs and swatches) are focusable with keyboard @default true /\n focusable?: boolean;\n\n /* Saturation slider `aria-label` /\n saturationLabel?: string;\n\n /* Hue slider `aria-label` /\n hueLabel?: string;\n\n /* Alpha slider `aria-label` /\n alphaLabel?: string;\n\n /* Called when one of the color swatches is clicked /\n onColorSwatchClick?: (color: string) => void;\n\n /* Hidden input `name` attribute, if not set, the input will not be rendered /\n name?: string;\n\n /* Props spread to the hidden input */\n hiddenInputProps?: React.ComponentProps<'input'> & DataAttributes;\n}\n\nexport type ColorPickerFactory = Factory<{\n props: ColorPickerProps;\n ref: HTMLDivElement;\n stylesNames: ColorPickerStylesNames;\n vars: ColorPickerCssVariables;\n}>;\n\nconst defaultProps = {\n swatchesPerRow: 7,\n withPicker: true,\n focusable: true,\n size: 'md',\n __staticSelector: 'ColorPicker',\n} satisfies Partial<ColorPickerProps>;\n\nconst varsResolver = createVarsResolver<ColorPickerFactory>((_, { size, swatchesPerRow }) => ({\n wrapper: {\n '--cp-preview-size': getSize(size, 'cp-preview-size'),\n '--cp-width': getSize(size, 'cp-width'),\n '--cp-body-spacing': getSpacing(size),\n '--cp-swatch-size': `${100 / swatchesPerRow!}%`,\n '--cp-thumb-size': getSize(size, 'cp-thumb-size'),\n '--cp-saturation-height': getSize(size, 'cp-saturation-height'),\n },\n}));\n\nexport const ColorPicker = factory<ColorPickerFactory>((_props) => {\n const props = useProps('ColorPicker', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n format = 'hex',\n value,\n defaultValue,\n onChange,\n onChangeEnd,\n withPicker,\n size,\n saturationLabel,\n hueLabel,\n alphaLabel,\n focusable,\n swatches,\n swatchesPerRow,\n fullWidth,\n onColorSwatchClick,\n __staticSelector,\n mod,\n attributes,\n name,\n hiddenInputProps,\n ...others\n } = props;\n\n const getStyles = useStyles<ColorPickerFactory>({\n name: __staticSelector,\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n rootSelector: 'wrapper',\n vars,\n varsResolver,\n });\n\n const formatRef = useRef(format \|\| 'hex');\n const valueRef = useRef<string>('');\n const scrubTimeoutRef = useRef<number>(-1);\n const isScrubbingRef = useRef(false);\n const withAlpha = format === 'hexa' \|\| format === 'rgba' \|\| format === 'hsla';\n\n const [_value, setValue, controlled] = useUncontrolled({\n value,\n defaultValue,\n finalValue: '#FFFFFF',\n onChange,\n });\n\n const [parsed, setParsed] = useState<HsvaColor>(parseColor(_value));\n\n const startScrubbing = () => {\n window.clearTimeout(scrubTimeoutRef.current);\n isScrubbingRef.current = true;\n };\n\n const stopScrubbing = () => {\n window.clearTimeout(scrubTimeoutRef.current);\n scrubTimeoutRef.current = window.setTimeout(() => {\n isScrubbingRef.current = false;\n }, 200);\n };\n\n const handleChange = (color: Partial<HsvaColor>) => {\n setParsed((current) => {\n const next = { ...current, ...color };\n valueRef.current = convertHsvaTo(formatRef.current, next);\n return next;\n });\n\n setValue(valueRef.current);\n };\n\n useDidUpdate(() => {\n if (typeof value === 'string' && isColorValid(value) && !isScrubbingRef.current) {\n setParsed(parseColor(value));\n }\n }, [value]);\n\n useDidUpdate(() => {\n formatRef.current = format \|\| 'hex';\n setValue(convertHsvaTo(formatRef.current, parsed));\n }, [format]);\n\n return (\n <ColorPickerContext value={{ getStyles, unstyled }}>\n <Box\n {...getStyles('wrapper')}\n size={size}\n mod={[{ 'full-width': fullWidth }, mod]}\n {...others}\n >\n {name && <input type=\"hidden\" name={name} value={_value} {...hiddenInputProps} />}\n\n {withPicker && (\n <>\n <Saturation\n value={parsed}\n onChange={handleChange}\n onChangeEnd={({ s, v }) =>\n onChangeEnd?.(convertHsvaTo(formatRef.current, { ...parsed, s: s!, v: v! }))\n }\n color={_value}\n size={size}\n focusable={focusable}\n saturationLabel={saturationLabel}\n onScrubStart={startScrubbing}\n onScrubEnd={stopScrubbing}\n />\n\n <div {...getStyles('body')}>\n <div {...getStyles('sliders')}>\n <HueSlider\n value={parsed.h}\n onChange={(h) => handleChange({ h })}\n onChangeEnd={(h) =>\n onChangeEnd?.(convertHsvaTo(formatRef.current, { ...parsed, h }))\n }\n size={size}\n focusable={focusable}\n aria-label={hueLabel}\n onScrubStart={startScrubbing}\n onScrubEnd={stopScrubbing}\n />\n\n {withAlpha && (\n <AlphaSlider\n value={parsed.a}\n onChange={(a) => handleChange({ a })}\n onChangeEnd={(a) => {\n onChangeEnd?.(convertHsvaTo(formatRef.current, { ...parsed, a }));\n }}\n size={size}\n color={convertHsvaTo('hex', parsed)}\n focusable={focusable}\n aria-label={alphaLabel}\n onScrubStart={startScrubbing}\n onScrubEnd={stopScrubbing}\n />\n )}\n </div>\n\n {withAlpha && (\n <ColorSwatch\n color={_value}\n radius=\"sm\"\n size=\"var(--cp-preview-size)\"\n {...getStyles('preview')}\n />\n )}\n </div>\n </>\n )}\n\n {Array.isArray(swatches) && (\n <Swatches\n data={swatches}\n swatchesPerRow={swatchesPerRow}\n focusable={focusable}\n setValue={setValue}\n value={_value}\n onChangeEnd={(color) => {\n const convertedColor = convertHsvaTo(format, parseColor(color));\n onColorSwatchClick?.(convertedColor);\n onChangeEnd?.(convertedColor);\n if (!controlled) {\n setParsed(parseColor(color));\n }\n }}\n />\n )}\n </Box>\n </ColorPickerContext>\n );\n});\n\nColorPicker.classes = classes;\nColorPicker.varsResolver = varsResolver;\nColorPicker.displayName = '@mantine/core/ColorPicker';\n\nexport namespace ColorPicker {\n export type Props = ColorPickerProps;\n export type CssVariables = ColorPickerCssVariables;\n export type Factory = ColorPickerFactory;\n export type StylesNames = ColorPickerStylesNames;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAyHA,MAAM,eAAe;CACnB,gBAAgB;CAChB,YAAY;CACZ,WAAW;CACX,MAAM;CACN,kBAAkB;CACnB;AAED,MAAM,eAAe,oBAAwC,GAAG,EAAE,MAAM,sBAAsB,EAC5F,SAAS;CACP,qBAAqB,QAAQ,MAAM,kBAAkB;CACrD,cAAc,QAAQ,MAAM,WAAW;CACvC,qBAAqB,WAAW,KAAK;CACrC,oBAAoB,GAAG,MAAM,eAAgB;CAC7C,mBAAmB,QAAQ,MAAM,gBAAgB;CACjD,0BAA0B,QAAQ,MAAM,uBAAuB;CAChE,EACF,EAAE;AAEH,MAAa,cAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,cAAc,OAAO;CAC3D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,SAAS,OACT,OACA,cACA,UACA,aACA,YACA,MACA,iBACA,UACA,YACA,WACA,UACA,gBACA,WACA,oBACA,kBACA,KACA,YACA,MACA,kBACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA8B;EAC9C,MAAM;EACN;EACA,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;EACd;EACA;EACD,CAAC;CAEF,MAAM,YAAY,OAAO,UAAU,MAAM;CACzC,MAAM,WAAW,OAAe,GAAG;CACnC,MAAM,kBAAkB,OAAe,GAAG;CAC1C,MAAM,iBAAiB,OAAO,MAAM;CACpC,MAAM,YAAY,WAAW,UAAU,WAAW,UAAU,WAAW;CAEvE,MAAM,CAAC,QAAQ,UAAU,cAAc,gBAAgB;EACrD;EACA;EACA,YAAY;EACZ;EACD,CAAC;CAEF,MAAM,CAAC,QAAQ,aAAa,SAAoB,WAAW,OAAO,CAAC;CAEnE,MAAM,uBAAuB;AAC3B,SAAO,aAAa,gBAAgB,QAAQ;AAC5C,iBAAe,UAAU;;CAG3B,MAAM,sBAAsB;AAC1B,SAAO,aAAa,gBAAgB,QAAQ;AAC5C,kBAAgB,UAAU,OAAO,iBAAiB;AAChD,kBAAe,UAAU;KACxB,IAAI;;CAGT,MAAM,gBAAgB,UAA8B;AAClD,aAAW,YAAY;GACrB,MAAM,OAAO;IAAE,GAAG;IAAS,GAAG;IAAO;AACrC,YAAS,UAAU,cAAc,UAAU,SAAS,KAAK;AACzD,UAAO;IACP;AAEF,WAAS,SAAS,QAAQ;;AAG5B,oBAAmB;AACjB,MAAI,OAAO,UAAU,YAAY,aAAa,MAAM,IAAI,CAAC,eAAe,QACtE,WAAU,WAAW,MAAM,CAAC;IAE7B,CAAC,MAAM,CAAC;AAEX,oBAAmB;AACjB,YAAU,UAAU,UAAU;AAC9B,WAAS,cAAc,UAAU,SAAS,OAAO,CAAC;IACjD,CAAC,OAAO,CAAC;AAEZ,QACE,oBAAC,oBAAD;EAAoB,OAAO;GAAE;GAAW;GAAU;YAChD,qBAAC,KAAD;GACE,GAAI,UAAU,UAAU;GAClB;GACN,KAAK,CAAC,EAAE,cAAc,WAAW,EAAE,IAAI;GACvC,GAAI;aAJN;IAMG,QAAQ,oBAAC,SAAD;KAAO,MAAK;KAAe;KAAM,OAAO;KAAQ,GAAI;KAAoB,CAAA;IAEhF,cACC,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,YAAD;KACE,OAAO;KACP,UAAU;KACV,cAAc,EAAE,GAAG,QACjB,cAAc,cAAc,UAAU,SAAS;MAAE,GAAG;MAAW;MAAO;MAAI,CAAC,CAAC;KAE9E,OAAO;KACD;KACK;KACM;KACjB,cAAc;KACd,YAAY;KACZ,CAAA,EAEF,qBAAC,OAAD;KAAK,GAAI,UAAU,OAAO;eAA1B,CACE,qBAAC,OAAD;MAAK,GAAI,UAAU,UAAU;gBAA7B,CACE,oBAAC,WAAD;OACE,OAAO,OAAO;OACd,WAAW,MAAM,aAAa,EAAE,GAAG,CAAC;OACpC,cAAc,MACZ,cAAc,cAAc,UAAU,SAAS;QAAE,GAAG;QAAQ;QAAG,CAAC,CAAC;OAE7D;OACK;OACX,cAAY;OACZ,cAAc;OACd,YAAY;OACZ,CAAA,EAED,aACC,oBAAC,aAAD;OACE,OAAO,OAAO;OACd,WAAW,MAAM,aAAa,EAAE,GAAG,CAAC;OACpC,cAAc,MAAM;AAClB,sBAAc,cAAc,UAAU,SAAS;SAAE,GAAG;SAAQ;SAAG,CAAC,CAAC;;OAE7D;OACN,OAAO,cAAc,OAAO,OAAO;OACxB;OACX,cAAY;OACZ,cAAc;OACd,YAAY;OACZ,CAAA,CAEA;SAEL,aACC,oBAAC,aAAD;MACE,OAAO;MACP,QAAO;MACP,MAAK;MACL,GAAI,UAAU,UAAU;MACxB,CAAA,CAEA;OACL,EAAA,CAAA;IAGJ,MAAM,QAAQ,SAAS,IACtB,oBAAC,UAAD;KACE,MAAM;KACU;KACL;KACD;KACV,OAAO;KACP,cAAc,UAAU;MACtB,MAAM,iBAAiB,cAAc,QAAQ,WAAW,MAAM,CAAC;AAC/D,2BAAqB,eAAe;AACpC,oBAAc,eAAe;AAC7B,UAAI,CAAC,WACH,WAAU,WAAW,MAAM,CAAC;;KAGhC,CAAA;IAEA;;EACa,CAAA;EAEvB;AAEF,YAAY,UAAUA;AACtB,YAAY,eAAe;AAC3B,YAAY,cAAc"}

package/esm/components/ColorPicker/HueSlider/HueSlider.mjs.map CHANGED Viewed

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

package/esm/components/ColorSwatch/ColorSwatch.mjs.map CHANGED Viewed

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

package/esm/components/Combobox/ComboboxTarget/ComboboxTarget.mjs CHANGED Viewed

@@ -34,6 +34,7 @@ const ComboboxTarget = factory((props) => {
 		...others
 	});
 	return /* @__PURE__ */ jsx(Popover.Target, {
+		refProp,
 		ref: useMergedRef(ref, ctx.store.targetRef),
 		children: clonedElement
 	});

package/esm/components/Combobox/ComboboxTarget/ComboboxTarget.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ComboboxTarget.mjs","names":[],"sources":["../../../../src/components/Combobox/ComboboxTarget/ComboboxTarget.tsx"],"sourcesContent":["import { cloneElement } from 'react';\nimport { useMergedRef } from '@mantine/hooks';\nimport { factory, Factory, getSingleElementChild, useProps } from '../../../core';\nimport { Popover } from '../../Popover';\nimport { useComboboxContext } from '../Combobox.context';\nimport { useComboboxTargetProps } from '../use-combobox-target-props/use-combobox-target-props';\n\nexport interface ComboboxTargetProps {\n /** Target element /\n children: React.ReactNode;\n\n /* Key of the prop that is used to access element ref /\n refProp?: string;\n\n /* If set, the component responds to keyboard events @default true /\n withKeyboardNavigation?: boolean;\n\n /* If set, the target has `aria-` attributes @default true /\n withAriaAttributes?: boolean;\n\n /* If set, the target has `aria-expanded` attribute @default false /\n withExpandedAttribute?: boolean;\n\n /* Determines which events is handled by the target element.\n * `button` target type handles `Space` and `Enter` keys to toggle dropdown opened state.\n * @default input\n * /\n targetType?: 'button' \| 'input';\n\n /* Input autocomplete attribute */\n autoComplete?: string;\n}\n\nconst defaultProps = {\n refProp: 'ref',\n targetType: 'input',\n withKeyboardNavigation: true,\n withAriaAttributes: true,\n withExpandedAttribute: false,\n autoComplete: 'off',\n} satisfies Partial<ComboboxTargetProps>;\n\nexport type ComboboxTargetFactory = Factory<{\n props: ComboboxTargetProps;\n ref: HTMLElement;\n compound: true;\n}>;\n\nexport const ComboboxTarget = factory<ComboboxTargetFactory>((props) => {\n const {\n children,\n refProp,\n withKeyboardNavigation,\n withAriaAttributes,\n withExpandedAttribute,\n targetType,\n autoComplete,\n ref,\n ...others\n } = useProps('ComboboxTarget', defaultProps, props);\n\n const child = getSingleElementChild(children);\n if (!child) {\n throw new Error(\n 'Combobox.Target component children should be an element or a component that accepts ref. Fragments, strings, numbers and other primitive values are not supported'\n );\n }\n\n const ctx = useComboboxContext();\n\n const targetProps = useComboboxTargetProps({\n targetType,\n withAriaAttributes,\n withKeyboardNavigation,\n withExpandedAttribute,\n onKeyDown: (child.props as any).onKeyDown,\n autoComplete,\n });\n\n const clonedElement = cloneElement(child, {\n ...targetProps,\n ...others,\n });\n\n return (\n <Popover.Target ref={useMergedRef(ref, ctx.store.targetRef)}>{clonedElement}</Popover.Target>\n );\n});\n\nComboboxTarget.displayName = '@mantine/core/ComboboxTarget';\n"],"mappings":";;;;;;;;;;;AAiCA,MAAM,eAAe;CACnB,SAAS;CACT,YAAY;CACZ,wBAAwB;CACxB,oBAAoB;CACpB,uBAAuB;CACvB,cAAc;CACf;AAQD,MAAa,iBAAiB,SAAgC,UAAU;CACtE,MAAM,EACJ,UACA,SACA,wBACA,oBACA,uBACA,YACA,cACA,KACA,GAAG,WACD,SAAS,kBAAkB,cAAc,MAAM;CAEnD,MAAM,QAAQ,sBAAsB,SAAS;AAC7C,KAAI,CAAC,MACH,OAAM,IAAI,MACR,oKACD;CAGH,MAAM,MAAM,oBAAoB;CAWhC,MAAM,gBAAgB,aAAa,OAAO;EACxC,GAVkB,uBAAuB;GACzC;GACA;GACA;GACA;GACA,WAAY,MAAM,MAAc;GAChC;GACD,CAAC;EAIA,GAAG;EACJ,CAAC;AAEF,QACE,oBAAC,QAAQ,QAAT;~~EAAgB~~,KAAK,aAAa,KAAK,IAAI,MAAM,UAAU;~~YAAG~~;~~EAA+B~~,CAAA;~~EAE/F~~;AAEF,eAAe,cAAc"}
1	+ {"version":3,"file":"ComboboxTarget.mjs","names":[],"sources":["../../../../src/components/Combobox/ComboboxTarget/ComboboxTarget.tsx"],"sourcesContent":["import { cloneElement } from 'react';\nimport { useMergedRef } from '@mantine/hooks';\nimport { factory, Factory, getSingleElementChild, useProps } from '../../../core';\nimport { Popover } from '../../Popover';\nimport { useComboboxContext } from '../Combobox.context';\nimport { useComboboxTargetProps } from '../use-combobox-target-props/use-combobox-target-props';\n\nexport interface ComboboxTargetProps {\n /** Target element /\n children: React.ReactNode;\n\n /* Key of the prop that is used to access element ref /\n refProp?: string;\n\n /* If set, the component responds to keyboard events @default true /\n withKeyboardNavigation?: boolean;\n\n /* If set, the target has `aria-` attributes @default true /\n withAriaAttributes?: boolean;\n\n /* If set, the target has `aria-expanded` attribute @default false /\n withExpandedAttribute?: boolean;\n\n /* Determines which events is handled by the target element.\n * `button` target type handles `Space` and `Enter` keys to toggle dropdown opened state.\n * @default input\n * /\n targetType?: 'button' \| 'input';\n\n /* Input autocomplete attribute */\n autoComplete?: string;\n}\n\nconst defaultProps = {\n refProp: 'ref',\n targetType: 'input',\n withKeyboardNavigation: true,\n withAriaAttributes: true,\n withExpandedAttribute: false,\n autoComplete: 'off',\n} satisfies Partial<ComboboxTargetProps>;\n\nexport type ComboboxTargetFactory = Factory<{\n props: ComboboxTargetProps;\n ref: HTMLElement;\n compound: true;\n}>;\n\nexport const ComboboxTarget = factory<ComboboxTargetFactory>((props) => {\n const {\n children,\n refProp,\n withKeyboardNavigation,\n withAriaAttributes,\n withExpandedAttribute,\n targetType,\n autoComplete,\n ref,\n ...others\n } = useProps('ComboboxTarget', defaultProps, props);\n\n const child = getSingleElementChild(children);\n if (!child) {\n throw new Error(\n 'Combobox.Target component children should be an element or a component that accepts ref. Fragments, strings, numbers and other primitive values are not supported'\n );\n }\n\n const ctx = useComboboxContext();\n\n const targetProps = useComboboxTargetProps({\n targetType,\n withAriaAttributes,\n withKeyboardNavigation,\n withExpandedAttribute,\n onKeyDown: (child.props as any).onKeyDown,\n autoComplete,\n });\n\n const clonedElement = cloneElement(child, {\n ...targetProps,\n ...others,\n });\n\n return (\n <Popover.Target refProp={refProp} ref={useMergedRef(ref, ctx.store.targetRef)}>\n {clonedElement}\n </Popover.Target>\n );\n});\n\nComboboxTarget.displayName = '@mantine/core/ComboboxTarget';\n"],"mappings":";;;;;;;;;;;AAiCA,MAAM,eAAe;CACnB,SAAS;CACT,YAAY;CACZ,wBAAwB;CACxB,oBAAoB;CACpB,uBAAuB;CACvB,cAAc;CACf;AAQD,MAAa,iBAAiB,SAAgC,UAAU;CACtE,MAAM,EACJ,UACA,SACA,wBACA,oBACA,uBACA,YACA,cACA,KACA,GAAG,WACD,SAAS,kBAAkB,cAAc,MAAM;CAEnD,MAAM,QAAQ,sBAAsB,SAAS;AAC7C,KAAI,CAAC,MACH,OAAM,IAAI,MACR,oKACD;CAGH,MAAM,MAAM,oBAAoB;CAWhC,MAAM,gBAAgB,aAAa,OAAO;EACxC,GAVkB,uBAAuB;GACzC;GACA;GACA;GACA;GACA,WAAY,MAAM,MAAc;GAChC;GACD,CAAC;EAIA,GAAG;EACJ,CAAC;AAEF,QACE,oBAAC,QAAQ,QAAT;EAAyB;EAAS,KAAK,aAAa,KAAK,IAAI,MAAM,UAAU;YAC1E;EACc,CAAA;EAEnB;AAEF,eAAe,cAAc"}

package/esm/components/Combobox/use-combobox-target-props/use-combobox-target-props.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"use-combobox-target-props.mjs","names":[],"sources":["../../../../src/components/Combobox/use-combobox-target-props/use-combobox-target-props.ts"],"sourcesContent":["import { useState } from 'react';\nimport { useComboboxContext } from '../Combobox.context';\n\ninterface UseComboboxTargetPropsInput {\n targetType: 'input' \| 'button' \| undefined;\n withAriaAttributes: boolean \| undefined;\n withKeyboardNavigation: boolean \| undefined;\n withExpandedAttribute: boolean \| undefined;\n onKeyDown: React.KeyboardEventHandler<HTMLInputElement> \| undefined;\n autoComplete: string \| undefined;\n}\n\nexport function useComboboxTargetProps({\n onKeyDown,\n withKeyboardNavigation,\n withAriaAttributes,\n withExpandedAttribute,\n targetType,\n autoComplete,\n}: UseComboboxTargetPropsInput) {\n const ctx = useComboboxContext();\n const [selectedOptionId, setSelectedOptionId] = useState<string \| null>(null);\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n onKeyDown?.(event);\n\n if (ctx.readOnly) {\n return;\n }\n\n if (withKeyboardNavigation) {\n // Ignore during composition in IME\n if (event.nativeEvent.isComposing) {\n return;\n }\n\n if (event.nativeEvent.code === 'ArrowDown') {\n event.preventDefault();\n\n if (!ctx.store.dropdownOpened) {\n ctx.store.openDropdown('keyboard');\n setSelectedOptionId(ctx.store.selectActiveOption());\n ctx.store.updateSelectedOptionIndex('selected', { scrollIntoView: true });\n } else {\n setSelectedOptionId(ctx.store.selectNextOption());\n }\n }\n\n if (event.nativeEvent.code === 'ArrowUp') {\n event.preventDefault();\n\n if (!ctx.store.dropdownOpened) {\n ctx.store.openDropdown('keyboard');\n setSelectedOptionId(ctx.store.selectActiveOption());\n ctx.store.updateSelectedOptionIndex('selected', { scrollIntoView: true });\n } else {\n setSelectedOptionId(ctx.store.selectPreviousOption());\n }\n }\n\n if (event.nativeEvent.code === 'Enter' \|\| event.nativeEvent.code === 'NumpadEnter') {\n // This is a workaround for handling differences in behavior of isComposing property in Safari\n // See: https://dninomiya.github.io/form-guide/stop-enter-submit\n // ~~eslint~~-disable-next-line @typescript~~-eslint~~/no-deprecated\n if (event.nativeEvent.keyCode === 229) {\n return;\n }\n\n const selectedOptionIndex = ctx.store.getSelectedOptionIndex();\n\n if (ctx.store.dropdownOpened && selectedOptionIndex !== -1) {\n event.preventDefault();\n ctx.store.clickSelectedOption();\n } else if (targetType === 'button') {\n event.preventDefault();\n ctx.store.openDropdown('keyboard');\n }\n }\n\n if (event.key === 'Escape') {\n ctx.store.closeDropdown('keyboard');\n }\n\n if (event.nativeEvent.code === 'Space') {\n if (targetType === 'button') {\n event.preventDefault();\n ctx.store.toggleDropdown('keyboard');\n }\n }\n }\n };\n\n const ariaAttributes = withAriaAttributes\n ? {\n ...(withExpandedAttribute ? { role: 'combobox' as const } : {}),\n 'aria-haspopup': 'listbox' as const,\n 'aria-expanded': withExpandedAttribute\n ? !!(ctx.store.listId && ctx.store.dropdownOpened)\n : undefined,\n 'aria-controls':\n ctx.store.dropdownOpened && ctx.store.listId ? ctx.store.listId : undefined,\n 'aria-activedescendant': ctx.store.dropdownOpened\n ? selectedOptionId \|\| undefined\n : undefined,\n autoComplete,\n 'data-expanded': ctx.store.dropdownOpened \|\| undefined,\n 'data-mantine-stop-propagation': ctx.store.dropdownOpened \|\| undefined,\n }\n : {};\n\n return {\n ...ariaAttributes,\n onKeyDown: handleKeyDown,\n };\n}\n"],"mappings":";;;;AAYA,SAAgB,uBAAuB,EACrC,WACA,wBACA,oBACA,uBACA,YACA,gBAC8B;CAC9B,MAAM,MAAM,oBAAoB;CAChC,MAAM,CAAC,kBAAkB,uBAAuB,SAAwB,KAAK;CAE7E,MAAM,iBAAiB,UAAiD;AACtE,cAAY,MAAM;AAElB,MAAI,IAAI,SACN;AAGF,MAAI,wBAAwB;AAE1B,OAAI,MAAM,YAAY,YACpB;AAGF,OAAI,MAAM,YAAY,SAAS,aAAa;AAC1C,UAAM,gBAAgB;AAEtB,QAAI,CAAC,IAAI,MAAM,gBAAgB;AAC7B,SAAI,MAAM,aAAa,WAAW;AAClC,yBAAoB,IAAI,MAAM,oBAAoB,CAAC;AACnD,SAAI,MAAM,0BAA0B,YAAY,EAAE,gBAAgB,MAAM,CAAC;UAEzE,qBAAoB,IAAI,MAAM,kBAAkB,CAAC;;AAIrD,OAAI,MAAM,YAAY,SAAS,WAAW;AACxC,UAAM,gBAAgB;AAEtB,QAAI,CAAC,IAAI,MAAM,gBAAgB;AAC7B,SAAI,MAAM,aAAa,WAAW;AAClC,yBAAoB,IAAI,MAAM,oBAAoB,CAAC;AACnD,SAAI,MAAM,0BAA0B,YAAY,EAAE,gBAAgB,MAAM,CAAC;UAEzE,qBAAoB,IAAI,MAAM,sBAAsB,CAAC;;AAIzD,OAAI,MAAM,YAAY,SAAS,WAAW,MAAM,YAAY,SAAS,eAAe;AAIlF,QAAI,MAAM,YAAY,YAAY,IAChC;IAGF,MAAM,sBAAsB,IAAI,MAAM,wBAAwB;AAE9D,QAAI,IAAI,MAAM,kBAAkB,wBAAwB,IAAI;AAC1D,WAAM,gBAAgB;AACtB,SAAI,MAAM,qBAAqB;eACtB,eAAe,UAAU;AAClC,WAAM,gBAAgB;AACtB,SAAI,MAAM,aAAa,WAAW;;;AAItC,OAAI,MAAM,QAAQ,SAChB,KAAI,MAAM,cAAc,WAAW;AAGrC,OAAI,MAAM,YAAY,SAAS;QACzB,eAAe,UAAU;AAC3B,WAAM,gBAAgB;AACtB,SAAI,MAAM,eAAe,WAAW;;;;;AAwB5C,QAAO;EACL,GAnBqB,qBACnB;GACE,GAAI,wBAAwB,EAAE,MAAM,YAAqB,GAAG,EAAE;GAC9D,iBAAiB;GACjB,iBAAiB,wBACb,CAAC,EAAE,IAAI,MAAM,UAAU,IAAI,MAAM,kBACjC,KAAA;GACJ,iBACE,IAAI,MAAM,kBAAkB,IAAI,MAAM,SAAS,IAAI,MAAM,SAAS,KAAA;GACpE,yBAAyB,IAAI,MAAM,iBAC/B,oBAAoB,KAAA,IACpB,KAAA;GACJ;GACA,iBAAiB,IAAI,MAAM,kBAAkB,KAAA;GAC7C,iCAAiC,IAAI,MAAM,kBAAkB,KAAA;GAC9D,GACD,EAAE;EAIJ,WAAW;EACZ"}
1	+ {"version":3,"file":"use-combobox-target-props.mjs","names":[],"sources":["../../../../src/components/Combobox/use-combobox-target-props/use-combobox-target-props.ts"],"sourcesContent":["import { useState } from 'react';\nimport { useComboboxContext } from '../Combobox.context';\n\ninterface UseComboboxTargetPropsInput {\n targetType: 'input' \| 'button' \| undefined;\n withAriaAttributes: boolean \| undefined;\n withKeyboardNavigation: boolean \| undefined;\n withExpandedAttribute: boolean \| undefined;\n onKeyDown: React.KeyboardEventHandler<HTMLInputElement> \| undefined;\n autoComplete: string \| undefined;\n}\n\nexport function useComboboxTargetProps({\n onKeyDown,\n withKeyboardNavigation,\n withAriaAttributes,\n withExpandedAttribute,\n targetType,\n autoComplete,\n}: UseComboboxTargetPropsInput) {\n const ctx = useComboboxContext();\n const [selectedOptionId, setSelectedOptionId] = useState<string \| null>(null);\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n onKeyDown?.(event);\n\n if (ctx.readOnly) {\n return;\n }\n\n if (withKeyboardNavigation) {\n // Ignore during composition in IME\n if (event.nativeEvent.isComposing) {\n return;\n }\n\n if (event.nativeEvent.code === 'ArrowDown') {\n event.preventDefault();\n\n if (!ctx.store.dropdownOpened) {\n ctx.store.openDropdown('keyboard');\n setSelectedOptionId(ctx.store.selectActiveOption());\n ctx.store.updateSelectedOptionIndex('selected', { scrollIntoView: true });\n } else {\n setSelectedOptionId(ctx.store.selectNextOption());\n }\n }\n\n if (event.nativeEvent.code === 'ArrowUp') {\n event.preventDefault();\n\n if (!ctx.store.dropdownOpened) {\n ctx.store.openDropdown('keyboard');\n setSelectedOptionId(ctx.store.selectActiveOption());\n ctx.store.updateSelectedOptionIndex('selected', { scrollIntoView: true });\n } else {\n setSelectedOptionId(ctx.store.selectPreviousOption());\n }\n }\n\n if (event.nativeEvent.code === 'Enter' \|\| event.nativeEvent.code === 'NumpadEnter') {\n // This is a workaround for handling differences in behavior of isComposing property in Safari\n // See: https://dninomiya.github.io/form-guide/stop-enter-submit\n // oxlint-disable-next-line typescript/no-deprecated\n if (event.nativeEvent.keyCode === 229) {\n return;\n }\n\n const selectedOptionIndex = ctx.store.getSelectedOptionIndex();\n\n if (ctx.store.dropdownOpened && selectedOptionIndex !== -1) {\n event.preventDefault();\n ctx.store.clickSelectedOption();\n } else if (targetType === 'button') {\n event.preventDefault();\n ctx.store.openDropdown('keyboard');\n }\n }\n\n if (event.key === 'Escape') {\n ctx.store.closeDropdown('keyboard');\n }\n\n if (event.nativeEvent.code === 'Space') {\n if (targetType === 'button') {\n event.preventDefault();\n ctx.store.toggleDropdown('keyboard');\n }\n }\n }\n };\n\n const ariaAttributes = withAriaAttributes\n ? {\n ...(withExpandedAttribute ? { role: 'combobox' as const } : {}),\n 'aria-haspopup': 'listbox' as const,\n 'aria-expanded': withExpandedAttribute\n ? !!(ctx.store.listId && ctx.store.dropdownOpened)\n : undefined,\n 'aria-controls':\n ctx.store.dropdownOpened && ctx.store.listId ? ctx.store.listId : undefined,\n 'aria-activedescendant': ctx.store.dropdownOpened\n ? selectedOptionId \|\| undefined\n : undefined,\n autoComplete,\n 'data-expanded': ctx.store.dropdownOpened \|\| undefined,\n 'data-mantine-stop-propagation': ctx.store.dropdownOpened \|\| undefined,\n }\n : {};\n\n return {\n ...ariaAttributes,\n onKeyDown: handleKeyDown,\n };\n}\n"],"mappings":";;;;AAYA,SAAgB,uBAAuB,EACrC,WACA,wBACA,oBACA,uBACA,YACA,gBAC8B;CAC9B,MAAM,MAAM,oBAAoB;CAChC,MAAM,CAAC,kBAAkB,uBAAuB,SAAwB,KAAK;CAE7E,MAAM,iBAAiB,UAAiD;AACtE,cAAY,MAAM;AAElB,MAAI,IAAI,SACN;AAGF,MAAI,wBAAwB;AAE1B,OAAI,MAAM,YAAY,YACpB;AAGF,OAAI,MAAM,YAAY,SAAS,aAAa;AAC1C,UAAM,gBAAgB;AAEtB,QAAI,CAAC,IAAI,MAAM,gBAAgB;AAC7B,SAAI,MAAM,aAAa,WAAW;AAClC,yBAAoB,IAAI,MAAM,oBAAoB,CAAC;AACnD,SAAI,MAAM,0BAA0B,YAAY,EAAE,gBAAgB,MAAM,CAAC;UAEzE,qBAAoB,IAAI,MAAM,kBAAkB,CAAC;;AAIrD,OAAI,MAAM,YAAY,SAAS,WAAW;AACxC,UAAM,gBAAgB;AAEtB,QAAI,CAAC,IAAI,MAAM,gBAAgB;AAC7B,SAAI,MAAM,aAAa,WAAW;AAClC,yBAAoB,IAAI,MAAM,oBAAoB,CAAC;AACnD,SAAI,MAAM,0BAA0B,YAAY,EAAE,gBAAgB,MAAM,CAAC;UAEzE,qBAAoB,IAAI,MAAM,sBAAsB,CAAC;;AAIzD,OAAI,MAAM,YAAY,SAAS,WAAW,MAAM,YAAY,SAAS,eAAe;AAIlF,QAAI,MAAM,YAAY,YAAY,IAChC;IAGF,MAAM,sBAAsB,IAAI,MAAM,wBAAwB;AAE9D,QAAI,IAAI,MAAM,kBAAkB,wBAAwB,IAAI;AAC1D,WAAM,gBAAgB;AACtB,SAAI,MAAM,qBAAqB;eACtB,eAAe,UAAU;AAClC,WAAM,gBAAgB;AACtB,SAAI,MAAM,aAAa,WAAW;;;AAItC,OAAI,MAAM,QAAQ,SAChB,KAAI,MAAM,cAAc,WAAW;AAGrC,OAAI,MAAM,YAAY,SAAS;QACzB,eAAe,UAAU;AAC3B,WAAM,gBAAgB;AACtB,SAAI,MAAM,eAAe,WAAW;;;;;AAwB5C,QAAO;EACL,GAnBqB,qBACnB;GACE,GAAI,wBAAwB,EAAE,MAAM,YAAqB,GAAG,EAAE;GAC9D,iBAAiB;GACjB,iBAAiB,wBACb,CAAC,EAAE,IAAI,MAAM,UAAU,IAAI,MAAM,kBACjC,KAAA;GACJ,iBACE,IAAI,MAAM,kBAAkB,IAAI,MAAM,SAAS,IAAI,MAAM,SAAS,KAAA;GACpE,yBAAyB,IAAI,MAAM,iBAC/B,oBAAoB,KAAA,IACpB,KAAA;GACJ;GACA,iBAAiB,IAAI,MAAM,kBAAkB,KAAA;GAC7C,iCAAiC,IAAI,MAAM,kBAAkB,KAAA;GAC9D,GACD,EAAE;EAIJ,WAAW;EACZ"}

package/esm/components/Container/Container.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Container.mjs","names":["classes"],"sources":["../../../src/components/Container/Container.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSize,\n MantineSize,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Container.module.css';\n\nexport type ContainerStylesNames = 'root';\nexport type ContainerCssVariables = {\n root: '--container-size';\n};\n\nexport interface ContainerProps\n extends BoxProps, StylesApiProps<ContainerFactory>, ElementProps<'div'> {\n /** `max-width` of the container, value is not responsive – it is the same for all screen sizes. Numbers are converted to rem. Ignored when `fluid` prop is set. @default 'md' /\n size?: MantineSize \| (string & {}) \| number;\n\n /* If set, the container takes 100% width of its parent and `size` prop is ignored. @default false /\n fluid?: boolean;\n\n /* Centering strategy @default 'block' */\n strategy?: 'block' \| 'grid';\n}\n\nexport type ContainerFactory = Factory<{\n props: ContainerProps;\n ref: HTMLDivElement;\n stylesNames: ContainerStylesNames;\n vars: ContainerCssVariables;\n}>;\n\nconst defaultProps = {\n strategy: 'block',\n} satisfies Partial<ContainerProps>;\n\nconst varsResolver = createVarsResolver<ContainerFactory>((_, { size, fluid }) => ({\n root: {\n '--container-size': fluid ? undefined : getSize(size, 'container-size'),\n },\n}));\n\nexport const Container = factory<ContainerFactory>((_props) => {\n const props = useProps('Container', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n fluid,\n mod,\n attributes,\n strategy,\n ...others\n } = props;\n\n const getStyles = useStyles<ContainerFactory>({\n name: 'Container',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return <Box mod={[{ fluid, strategy }, mod]} {...getStyles('root')} {...others} />;\n});\n\nContainer.classes = classes;\nContainer.varsResolver = varsResolver;\nContainer.displayName = '@mantine/core/Container';\n"],"mappings":";;;;;;;;;;AAuCA,MAAM,eAAe,EACnB,UAAU,SACX;AAED,MAAM,eAAe,oBAAsC,GAAG,EAAE,MAAM,aAAa,EACjF,MAAM,EACJ,oBAAoB,QAAQ,KAAA,IAAY,QAAQ,MAAM,iBAAiB,EACxE,EACF,EAAE;AAEH,MAAa,YAAY,SAA2B,WAAW;CAC7D,MAAM,QAAQ,SAAS,aAAa,cAAc,OAAO;CACzD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,OACA,KACA,YACA,UACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA4B;EAC5C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,QAAO,oBAAC,KAAD;EAAK,KAAK,CAAC;GAAE;GAAO;GAAU,EAAE,IAAI;EAAE,GAAI,UAAU,OAAO;EAAE,GAAI;EAAU,CAAA;EAClF;AAEF,UAAU,UAAUA;AACpB,UAAU,eAAe;AACzB,UAAU,cAAc"}
1	+ {"version":3,"file":"Container.mjs","names":["classes"],"sources":["../../../src/components/Container/Container.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSize,\n MantineSize,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Container.module.css';\n\nexport type ContainerStylesNames = 'root';\nexport type ContainerCssVariables = {\n root: '--container-size';\n};\n\nexport interface ContainerProps\n extends BoxProps, StylesApiProps<ContainerFactory>, ElementProps<'div'> {\n /** `max-width` of the container, value is not responsive – it is the same for all screen sizes. Numbers are converted to rem. Ignored when `fluid` prop is set. @default 'md' /\n size?: MantineSize \| (string & {}) \| number;\n\n /* If set, the container takes 100% width of its parent and `size` prop is ignored. @default false /\n fluid?: boolean;\n\n /* Centering strategy @default 'block' */\n strategy?: 'block' \| 'grid';\n}\n\nexport type ContainerFactory = Factory<{\n props: ContainerProps;\n ref: HTMLDivElement;\n stylesNames: ContainerStylesNames;\n vars: ContainerCssVariables;\n}>;\n\nconst defaultProps = {\n strategy: 'block',\n} satisfies Partial<ContainerProps>;\n\nconst varsResolver = createVarsResolver<ContainerFactory>((_, { size, fluid }) => ({\n root: {\n '--container-size': fluid ? undefined : getSize(size, 'container-size'),\n },\n}));\n\nexport const Container = factory<ContainerFactory>((_props) => {\n const props = useProps('Container', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n fluid,\n mod,\n attributes,\n strategy,\n ...others\n } = props;\n\n const getStyles = useStyles<ContainerFactory>({\n name: 'Container',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return <Box mod={[{ fluid, strategy }, mod]} {...getStyles('root')} {...others} />;\n});\n\nContainer.classes = classes;\nContainer.varsResolver = varsResolver;\nContainer.displayName = '@mantine/core/Container';\n\nexport namespace Container {\n export type Props = ContainerProps;\n export type StylesNames = ContainerStylesNames;\n export type CssVariables = ContainerCssVariables;\n export type Factory = ContainerFactory;\n}\n"],"mappings":";;;;;;;;;;AAuCA,MAAM,eAAe,EACnB,UAAU,SACX;AAED,MAAM,eAAe,oBAAsC,GAAG,EAAE,MAAM,aAAa,EACjF,MAAM,EACJ,oBAAoB,QAAQ,KAAA,IAAY,QAAQ,MAAM,iBAAiB,EACxE,EACF,EAAE;AAEH,MAAa,YAAY,SAA2B,WAAW;CAC7D,MAAM,QAAQ,SAAS,aAAa,cAAc,OAAO;CACzD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,OACA,KACA,YACA,UACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA4B;EAC5C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,QAAO,oBAAC,KAAD;EAAK,KAAK,CAAC;GAAE;GAAO;GAAU,EAAE,IAAI;EAAE,GAAI,UAAU,OAAO;EAAE,GAAI;EAAU,CAAA;EAClF;AAEF,UAAU,UAAUA;AACpB,UAAU,eAAe;AACzB,UAAU,cAAc"}

package/esm/components/Dialog/Dialog.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Dialog.mjs","names":["classes"],"sources":["../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import {\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSize,\n MantineSize,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { Affix, AffixBaseProps } from '../Affix';\nimport { CloseButton } from '../CloseButton';\nimport { Paper, PaperBaseProps } from '../Paper';\nimport { Transition, TransitionOverride } from '../Transition';\nimport classes from './Dialog.module.css';\n\nexport type DialogStylesNames = 'root' \| 'closeButton';\nexport type DialogCssVariables = {\n root: '--dialog-size';\n};\n\nexport interface DialogProps\n extends\n BoxProps,\n AffixBaseProps,\n PaperBaseProps,\n StylesApiProps<DialogFactory>,\n ElementProps<'div'> {\n /** If set, the component uses `display: none` to hide the root element instead of removing the DOM node @default false /\n keepMounted?: boolean;\n\n /* If set, displays the close button @default true /\n withCloseButton?: boolean;\n\n /* Called on close button click /\n onClose?: () => void;\n\n /* Dialog content /\n children?: React.ReactNode;\n\n /* Opened state /\n opened: boolean;\n\n /* Props passed down to the underlying `Transition` component @default { transition: 'pop-top-right', duration: 200 } /\n transitionProps?: TransitionOverride;\n\n /* Controls `width` of the dialog @default 'md' */\n size?: MantineSize \| (string & {}) \| number;\n}\n\nexport type DialogFactory = Factory<{\n props: DialogProps;\n ref: HTMLDivElement;\n stylesNames: DialogStylesNames;\n vars: DialogCssVariables;\n}>;\n\nconst defaultProps = {\n shadow: 'md',\n p: 'md',\n withBorder: true,\n transitionProps: { transition: 'pop-top-right', duration: 200 },\n position: {\n bottom: 30,\n right: 30,\n },\n} satisfies Partial<DialogProps>;\n\nconst varsResolver = createVarsResolver<DialogFactory>((_, { size }) => ({\n root: {\n '--dialog-size': getSize(size, 'dialog-size'),\n },\n}));\n\nexport const Dialog = factory<DialogFactory>((_props) => {\n const props = useProps('Dialog', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n zIndex,\n position,\n keepMounted,\n opened,\n transitionProps,\n withCloseButton,\n withinPortal,\n children,\n onClose,\n portalProps,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<DialogFactory>({\n name: 'Dialog',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return (\n <Affix\n zIndex={zIndex}\n position={position}\n withinPortal={withinPortal}\n portalProps={portalProps}\n unstyled={unstyled}\n >\n <Transition keepMounted={keepMounted} mounted={opened} {...transitionProps}>\n {(transitionStyles) => (\n <Paper\n unstyled={unstyled}\n {...getStyles('root', { style: transitionStyles })}\n {...others}\n >\n {withCloseButton && (\n <CloseButton onClick={onClose} unstyled={unstyled} {...getStyles('closeButton')} />\n )}\n {children}\n </Paper>\n )}\n </Transition>\n </Affix>\n );\n});\n\nDialog.classes = classes;\nDialog.varsResolver = varsResolver;\nDialog.displayName = '@mantine/core/Dialog';\n"],"mappings":";;;;;;;;;;;;;AA2DA,MAAM,eAAe;CACnB,QAAQ;CACR,GAAG;CACH,YAAY;CACZ,iBAAiB;EAAE,YAAY;EAAiB,UAAU;EAAK;CAC/D,UAAU;EACR,QAAQ;EACR,OAAO;EACR;CACF;AAED,MAAM,eAAe,oBAAmC,GAAG,EAAE,YAAY,EACvE,MAAM,EACJ,iBAAiB,QAAQ,MAAM,cAAc,EAC9C,EACF,EAAE;AAEH,MAAa,SAAS,SAAwB,WAAW;CACvD,MAAM,QAAQ,SAAS,UAAU,cAAc,OAAO;CACtD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,QACA,UACA,aACA,QACA,iBACA,iBACA,cACA,UACA,SACA,aACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAAyB;EACzC,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,QACE,oBAAC,OAAD;EACU;EACE;EACI;EACD;EACH;YAEV,oBAAC,YAAD;GAAyB;GAAa,SAAS;GAAQ,GAAI;cACvD,qBACA,qBAAC,OAAD;IACY;IACV,GAAI,UAAU,QAAQ,EAAE,OAAO,kBAAkB,CAAC;IAClD,GAAI;cAHN,CAKG,mBACC,oBAAC,aAAD;KAAa,SAAS;KAAmB;KAAU,GAAI,UAAU,cAAc;KAAI,CAAA,EAEpF,SACK;;GAEC,CAAA;EACP,CAAA;EAEV;AAEF,OAAO,UAAUA;AACjB,OAAO,eAAe;AACtB,OAAO,cAAc"}
1	+ {"version":3,"file":"Dialog.mjs","names":["classes"],"sources":["../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import {\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSize,\n MantineSize,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { Affix, AffixBaseProps } from '../Affix';\nimport { CloseButton } from '../CloseButton';\nimport { Paper, PaperBaseProps } from '../Paper';\nimport { Transition, TransitionOverride } from '../Transition';\nimport classes from './Dialog.module.css';\n\nexport type DialogStylesNames = 'root' \| 'closeButton';\nexport type DialogCssVariables = {\n root: '--dialog-size';\n};\n\nexport interface DialogProps\n extends\n BoxProps,\n AffixBaseProps,\n PaperBaseProps,\n StylesApiProps<DialogFactory>,\n ElementProps<'div'> {\n /** If set, the component uses `display: none` to hide the root element instead of removing the DOM node @default false /\n keepMounted?: boolean;\n\n /* If set, displays the close button @default true /\n withCloseButton?: boolean;\n\n /* Called on close button click /\n onClose?: () => void;\n\n /* Dialog content /\n children?: React.ReactNode;\n\n /* Opened state /\n opened: boolean;\n\n /* Props passed down to the underlying `Transition` component @default { transition: 'pop-top-right', duration: 200 } /\n transitionProps?: TransitionOverride;\n\n /* Controls `width` of the dialog @default 'md' */\n size?: MantineSize \| (string & {}) \| number;\n}\n\nexport type DialogFactory = Factory<{\n props: DialogProps;\n ref: HTMLDivElement;\n stylesNames: DialogStylesNames;\n vars: DialogCssVariables;\n}>;\n\nconst defaultProps = {\n shadow: 'md',\n p: 'md',\n withBorder: true,\n transitionProps: { transition: 'pop-top-right', duration: 200 },\n position: {\n bottom: 30,\n right: 30,\n },\n} satisfies Partial<DialogProps>;\n\nconst varsResolver = createVarsResolver<DialogFactory>((_, { size }) => ({\n root: {\n '--dialog-size': getSize(size, 'dialog-size'),\n },\n}));\n\nexport const Dialog = factory<DialogFactory>((_props) => {\n const props = useProps('Dialog', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n zIndex,\n position,\n keepMounted,\n opened,\n transitionProps,\n withCloseButton,\n withinPortal,\n children,\n onClose,\n portalProps,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<DialogFactory>({\n name: 'Dialog',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return (\n <Affix\n zIndex={zIndex}\n position={position}\n withinPortal={withinPortal}\n portalProps={portalProps}\n unstyled={unstyled}\n >\n <Transition keepMounted={keepMounted} mounted={opened} {...transitionProps}>\n {(transitionStyles) => (\n <Paper\n unstyled={unstyled}\n {...getStyles('root', { style: transitionStyles })}\n {...others}\n >\n {withCloseButton && (\n <CloseButton onClick={onClose} unstyled={unstyled} {...getStyles('closeButton')} />\n )}\n {children}\n </Paper>\n )}\n </Transition>\n </Affix>\n );\n});\n\nDialog.classes = classes;\nDialog.varsResolver = varsResolver;\nDialog.displayName = '@mantine/core/Dialog';\n\nexport namespace Dialog {\n export type Props = DialogProps;\n export type StylesNames = DialogStylesNames;\n export type CssVariables = DialogCssVariables;\n export type Factory = DialogFactory;\n}\n"],"mappings":";;;;;;;;;;;;;AA2DA,MAAM,eAAe;CACnB,QAAQ;CACR,GAAG;CACH,YAAY;CACZ,iBAAiB;EAAE,YAAY;EAAiB,UAAU;EAAK;CAC/D,UAAU;EACR,QAAQ;EACR,OAAO;EACR;CACF;AAED,MAAM,eAAe,oBAAmC,GAAG,EAAE,YAAY,EACvE,MAAM,EACJ,iBAAiB,QAAQ,MAAM,cAAc,EAC9C,EACF,EAAE;AAEH,MAAa,SAAS,SAAwB,WAAW;CACvD,MAAM,QAAQ,SAAS,UAAU,cAAc,OAAO;CACtD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,QACA,UACA,aACA,QACA,iBACA,iBACA,cACA,UACA,SACA,aACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAAyB;EACzC,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,QACE,oBAAC,OAAD;EACU;EACE;EACI;EACD;EACH;YAEV,oBAAC,YAAD;GAAyB;GAAa,SAAS;GAAQ,GAAI;cACvD,qBACA,qBAAC,OAAD;IACY;IACV,GAAI,UAAU,QAAQ,EAAE,OAAO,kBAAkB,CAAC;IAClD,GAAI;cAHN,CAKG,mBACC,oBAAC,aAAD;KAAa,SAAS;KAAmB;KAAU,GAAI,UAAU,cAAc;KAAI,CAAA,EAEpF,SACK;;GAEC,CAAA;EACP,CAAA;EAEV;AAEF,OAAO,UAAUA;AACjB,OAAO,eAAe;AACtB,OAAO,cAAc"}

package/esm/components/Divider/Divider.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Divider.mjs","names":["classes"],"sources":["../../../src/components/Divider/Divider.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSize,\n getThemeColor,\n MantineColor,\n MantineSize,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Divider.module.css';\n\nexport type DividerStylesNames = 'root' \| 'label';\nexport type DividerVariant = 'solid' \| 'dashed' \| 'dotted';\nexport type DividerCssVariables = {\n root: '--divider-color' \| '--divider-border-style' \| '--divider-size';\n};\n\nexport interface DividerProps\n extends BoxProps, StylesApiProps<DividerFactory>, ElementProps<'div'> {\n /** Key of `theme.colors` or any valid CSS color value /\n color?: MantineColor;\n\n /* Controls width/height (depends on orientation) @default 'xs' /\n size?: MantineSize \| number \| (string & {});\n\n /* Divider label, visible only with `orientation=\"horizontal\"` /\n label?: React.ReactNode;\n\n /* Label position @default 'center' /\n labelPosition?: 'left' \| 'center' \| 'right';\n\n /* Divider orientation @default 'horizontal' */\n orientation?: 'horizontal' \| 'vertical';\n}\n\nexport type DividerFactory = Factory<{\n props: DividerProps;\n ref: HTMLDivElement;\n stylesNames: DividerStylesNames;\n vars: DividerCssVariables;\n variant: DividerVariant;\n}>;\n\nconst defaultProps = {\n orientation: 'horizontal',\n} satisfies Partial<DividerProps>;\n\nconst varsResolver = createVarsResolver<DividerFactory>((theme, { color, variant, size }) => ({\n root: {\n '--divider-color': color ? getThemeColor(color, theme) : undefined,\n '--divider-border-style': variant,\n '--divider-size': getSize(size, 'divider-size'),\n },\n}));\n\nexport const Divider = factory<DividerFactory>((_props) => {\n const props = useProps('Divider', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n color,\n orientation,\n label,\n labelPosition,\n mod,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<DividerFactory>({\n name: 'Divider',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return (\n <Box\n mod={[{ orientation, withLabel: !!label }, mod]}\n role=\"separator\"\n {...getStyles('root')}\n {...others}\n >\n {label && (\n <Box component=\"span\" mod={{ position: labelPosition }} {...getStyles('label')}>\n {label}\n </Box>\n )}\n </Box>\n );\n});\n\nDivider.classes = classes;\nDivider.varsResolver = varsResolver;\nDivider.displayName = '@mantine/core/Divider';\n"],"mappings":";;;;;;;;;;;AAiDA,MAAM,eAAe,EACnB,aAAa,cACd;AAED,MAAM,eAAe,oBAAoC,OAAO,EAAE,OAAO,SAAS,YAAY,EAC5F,MAAM;CACJ,mBAAmB,QAAQ,cAAc,OAAO,MAAM,GAAG,KAAA;CACzD,0BAA0B;CAC1B,kBAAkB,QAAQ,MAAM,eAAe;CAChD,EACF,EAAE;AAEH,MAAa,UAAU,SAAyB,WAAW;CACzD,MAAM,QAAQ,SAAS,WAAW,cAAc,OAAO;CACvD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,OACA,aACA,OACA,eACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA0B;EAC1C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,QACE,oBAAC,KAAD;EACE,KAAK,CAAC;GAAE;GAAa,WAAW,CAAC,CAAC;GAAO,EAAE,IAAI;EAC/C,MAAK;EACL,GAAI,UAAU,OAAO;EACrB,GAAI;YAEH,SACC,oBAAC,KAAD;GAAK,WAAU;GAAO,KAAK,EAAE,UAAU,eAAe;GAAE,GAAI,UAAU,QAAQ;aAC3E;GACG,CAAA;EAEJ,CAAA;EAER;AAEF,QAAQ,UAAUA;AAClB,QAAQ,eAAe;AACvB,QAAQ,cAAc"}
1	+ {"version":3,"file":"Divider.mjs","names":["classes"],"sources":["../../../src/components/Divider/Divider.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSize,\n getThemeColor,\n MantineColor,\n MantineSize,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Divider.module.css';\n\nexport type DividerStylesNames = 'root' \| 'label';\nexport type DividerVariant = 'solid' \| 'dashed' \| 'dotted';\nexport type DividerCssVariables = {\n root: '--divider-color' \| '--divider-border-style' \| '--divider-size';\n};\n\nexport interface DividerProps\n extends BoxProps, StylesApiProps<DividerFactory>, ElementProps<'div'> {\n /** Key of `theme.colors` or any valid CSS color value /\n color?: MantineColor;\n\n /* Controls width/height (depends on orientation) @default 'xs' /\n size?: MantineSize \| number \| (string & {});\n\n /* Divider label, visible only with `orientation=\"horizontal\"` /\n label?: React.ReactNode;\n\n /* Label position @default 'center' /\n labelPosition?: 'left' \| 'center' \| 'right';\n\n /* Divider orientation @default 'horizontal' */\n orientation?: 'horizontal' \| 'vertical';\n}\n\nexport type DividerFactory = Factory<{\n props: DividerProps;\n ref: HTMLDivElement;\n stylesNames: DividerStylesNames;\n vars: DividerCssVariables;\n variant: DividerVariant;\n}>;\n\nconst defaultProps = {\n orientation: 'horizontal',\n} satisfies Partial<DividerProps>;\n\nconst varsResolver = createVarsResolver<DividerFactory>((theme, { color, variant, size }) => ({\n root: {\n '--divider-color': color ? getThemeColor(color, theme) : undefined,\n '--divider-border-style': variant,\n '--divider-size': getSize(size, 'divider-size'),\n },\n}));\n\nexport const Divider = factory<DividerFactory>((_props) => {\n const props = useProps('Divider', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n color,\n orientation,\n label,\n labelPosition,\n mod,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<DividerFactory>({\n name: 'Divider',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return (\n <Box\n mod={[{ orientation, withLabel: !!label }, mod]}\n role=\"separator\"\n {...getStyles('root')}\n {...others}\n >\n {label && (\n <Box component=\"span\" mod={{ position: labelPosition }} {...getStyles('label')}>\n {label}\n </Box>\n )}\n </Box>\n );\n});\n\nDivider.classes = classes;\nDivider.varsResolver = varsResolver;\nDivider.displayName = '@mantine/core/Divider';\n\nexport namespace Divider {\n export type Props = DividerProps;\n export type StylesNames = DividerStylesNames;\n export type CssVariables = DividerCssVariables;\n export type Factory = DividerFactory;\n export type Variant = DividerVariant;\n}\n"],"mappings":";;;;;;;;;;;AAiDA,MAAM,eAAe,EACnB,aAAa,cACd;AAED,MAAM,eAAe,oBAAoC,OAAO,EAAE,OAAO,SAAS,YAAY,EAC5F,MAAM;CACJ,mBAAmB,QAAQ,cAAc,OAAO,MAAM,GAAG,KAAA;CACzD,0BAA0B;CAC1B,kBAAkB,QAAQ,MAAM,eAAe;CAChD,EACF,EAAE;AAEH,MAAa,UAAU,SAAyB,WAAW;CACzD,MAAM,QAAQ,SAAS,WAAW,cAAc,OAAO;CACvD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,OACA,aACA,OACA,eACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA0B;EAC1C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,QACE,oBAAC,KAAD;EACE,KAAK,CAAC;GAAE;GAAa,WAAW,CAAC,CAAC;GAAO,EAAE,IAAI;EAC/C,MAAK;EACL,GAAI,UAAU,OAAO;EACrB,GAAI;YAEH,SACC,oBAAC,KAAD;GAAK,WAAU;GAAO,KAAK,EAAE,UAAU,eAAe;GAAE,GAAI,UAAU,QAAQ;aAC3E;GACG,CAAA;EAEJ,CAAA;EAER;AAEF,QAAQ,UAAUA;AAClB,QAAQ,eAAe;AACvB,QAAQ,cAAc"}

package/esm/components/Fieldset/Fieldset.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Fieldset.mjs","names":["classes"],"sources":["../../../src/components/Fieldset/Fieldset.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getRadius,\n MantineRadius,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Fieldset.module.css';\n\nexport type FieldsetStylesNames = 'root' \| 'legend';\nexport type FieldsetVariant = 'default' \| 'filled' \| 'unstyled';\nexport type FieldsetCSSVariables = {\n root: '--fieldset-radius';\n};\n\nexport interface FieldsetProps\n extends BoxProps, StylesApiProps<FieldsetFactory>, ElementProps<'fieldset'> {\n /** Fieldset legend /\n legend?: React.ReactNode;\n\n /* Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius */\n radius?: MantineRadius;\n}\n\nexport type FieldsetFactory = Factory<{\n props: FieldsetProps;\n ref: HTMLFieldSetElement;\n stylesNames: FieldsetStylesNames;\n vars: FieldsetCSSVariables;\n variant: FieldsetVariant;\n}>;\n\nconst defaultProps = {\n variant: 'default',\n} satisfies Partial<FieldsetProps>;\n\nconst varsResolver = createVarsResolver<FieldsetFactory>((_, { radius }) => ({\n root: {\n '--fieldset-radius': radius === undefined ? undefined : getRadius(radius),\n },\n}));\n\nexport const Fieldset = factory<FieldsetFactory>((_props) => {\n const props = useProps('Fieldset', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n legend,\n variant,\n children,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<FieldsetFactory>({\n name: 'Fieldset',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return (\n <Box component=\"fieldset\" variant={variant} {...getStyles('root', { variant })} {...others}>\n {legend && <legend {...getStyles('legend', { variant })}>{legend}</legend>}\n {children}\n </Box>\n );\n});\n\nFieldset.classes = classes;\nFieldset.varsResolver = varsResolver;\nFieldset.displayName = '@mantine/core/Fieldset';\n"],"mappings":";;;;;;;;;;AAsCA,MAAM,eAAe,EACnB,SAAS,WACV;AAED,MAAM,eAAe,oBAAqC,GAAG,EAAE,cAAc,EAC3E,MAAM,EACJ,qBAAqB,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,OAAO,EAC1E,EACF,EAAE;AAEH,MAAa,WAAW,SAA0B,WAAW;CAC3D,MAAM,QAAQ,SAAS,YAAY,cAAc,OAAO;CACxD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,QACA,SACA,UACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA2B;EAC3C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,QACE,qBAAC,KAAD;EAAK,WAAU;EAAoB;EAAS,GAAI,UAAU,QAAQ,EAAE,SAAS,CAAC;EAAE,GAAI;YAApF,CACG,UAAU,oBAAC,UAAD;GAAQ,GAAI,UAAU,UAAU,EAAE,SAAS,CAAC;aAAG;GAAgB,CAAA,EACzE,SACG;;EAER;AAEF,SAAS,UAAUA;AACnB,SAAS,eAAe;AACxB,SAAS,cAAc"}
1	+ {"version":3,"file":"Fieldset.mjs","names":["classes"],"sources":["../../../src/components/Fieldset/Fieldset.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getRadius,\n MantineRadius,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Fieldset.module.css';\n\nexport type FieldsetStylesNames = 'root' \| 'legend';\nexport type FieldsetVariant = 'default' \| 'filled' \| 'unstyled';\nexport type FieldsetCSSVariables = {\n root: '--fieldset-radius';\n};\n\nexport interface FieldsetProps\n extends BoxProps, StylesApiProps<FieldsetFactory>, ElementProps<'fieldset'> {\n /** Fieldset legend /\n legend?: React.ReactNode;\n\n /* Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius */\n radius?: MantineRadius;\n}\n\nexport type FieldsetFactory = Factory<{\n props: FieldsetProps;\n ref: HTMLFieldSetElement;\n stylesNames: FieldsetStylesNames;\n vars: FieldsetCSSVariables;\n variant: FieldsetVariant;\n}>;\n\nconst defaultProps = {\n variant: 'default',\n} satisfies Partial<FieldsetProps>;\n\nconst varsResolver = createVarsResolver<FieldsetFactory>((_, { radius }) => ({\n root: {\n '--fieldset-radius': radius === undefined ? undefined : getRadius(radius),\n },\n}));\n\nexport const Fieldset = factory<FieldsetFactory>((_props) => {\n const props = useProps('Fieldset', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n legend,\n variant,\n children,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<FieldsetFactory>({\n name: 'Fieldset',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return (\n <Box component=\"fieldset\" variant={variant} {...getStyles('root', { variant })} {...others}>\n {legend && <legend {...getStyles('legend', { variant })}>{legend}</legend>}\n {children}\n </Box>\n );\n});\n\nFieldset.classes = classes;\nFieldset.varsResolver = varsResolver;\nFieldset.displayName = '@mantine/core/Fieldset';\n\nexport namespace Fieldset {\n export type Props = FieldsetProps;\n export type StylesNames = FieldsetStylesNames;\n export type Factory = FieldsetFactory;\n export type Variant = FieldsetVariant;\n}\n"],"mappings":";;;;;;;;;;AAsCA,MAAM,eAAe,EACnB,SAAS,WACV;AAED,MAAM,eAAe,oBAAqC,GAAG,EAAE,cAAc,EAC3E,MAAM,EACJ,qBAAqB,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,OAAO,EAC1E,EACF,EAAE;AAEH,MAAa,WAAW,SAA0B,WAAW;CAC3D,MAAM,QAAQ,SAAS,YAAY,cAAc,OAAO;CACxD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,QACA,SACA,UACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA2B;EAC3C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,QACE,qBAAC,KAAD;EAAK,WAAU;EAAoB;EAAS,GAAI,UAAU,QAAQ,EAAE,SAAS,CAAC;EAAE,GAAI;YAApF,CACG,UAAU,oBAAC,UAAD;GAAQ,GAAI,UAAU,UAAU,EAAE,SAAS,CAAC;aAAG;GAAgB,CAAA,EACzE,SACG;;EAER;AAEF,SAAS,UAAUA;AACnB,SAAS,eAAe;AACxB,SAAS,cAAc"}

package/esm/components/FileButton/FileButton.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FileButton.mjs","names":[],"sources":["../../../src/components/FileButton/FileButton.tsx"],"sourcesContent":["import React, { useRef } from 'react';\nimport { assignRef, useMergedRef } from '@mantine/hooks';\nimport { Factory, genericFactory, useProps } from '../../core';\n\nexport interface FileButtonProps<Multiple extends boolean = false> {\n ref?: React.Ref<HTMLInputElement>;\n\n /** Called when files are picked /\n onChange: (payload: Multiple extends true ? File[] : File \| null) => void;\n\n /* Function that receives button props and returns react node that should be rendered /\n children: (props: { onClick: () => void }) => React.ReactNode;\n\n /* If set, user can pick more than one file /\n multiple?: Multiple;\n\n /* File input accept attribute, for example, `\"image/png,image/jpeg\"` /\n accept?: string;\n\n /* Input name attribute /\n name?: string;\n\n /* Input form attribute /\n form?: string;\n\n /* Reference of the function that should be called when value changes to null or empty array /\n resetRef?: React.Ref<() => void>;\n\n /* Disables file picker /\n disabled?: boolean;\n\n /* Specifies that, optionally, a new file should be captured, and which device should be used to capture that new media of a type defined by the accept attribute. /\n capture?: boolean \| 'user' \| 'environment';\n\n /* Passes down props to the input element used to capture files */\n inputProps?: React.ComponentProps<'input'>;\n}\n\nexport type FileButtonFactory = Factory<{\n props: FileButtonProps;\n signature: <Multiple extends boolean = false>(\n props: FileButtonProps<Multiple>\n ) => React.JSX.Element;\n}>;\n\nexport const FileButton = genericFactory<FileButtonFactory>((props) => {\n const {\n onChange,\n children,\n multiple,\n accept,\n name,\n form,\n resetRef,\n disabled,\n capture,\n inputProps,\n ref,\n ...others\n } = useProps('FileButton', null, props);\n\n const inputRef = useRef<HTMLInputElement>(null);\n\n const onClick = () => {\n !disabled && inputRef.current?.click();\n };\n\n const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n if (event.currentTarget.files === null) {\n return onChange(multiple ? ([] as any) : null);\n }\n\n if (multiple) {\n onChange(Array.from(event.currentTarget.files) as any);\n } else {\n onChange((event.currentTarget.files[0] as any) \|\| null);\n }\n };\n\n const reset = () => {\n if (inputRef.current) {\n inputRef.current.value = '';\n }\n };\n\n assignRef(resetRef, reset);\n\n return (\n <>\n <input\n style={{ display: 'none' }}\n type=\"file\"\n accept={accept}\n multiple={multiple}\n onChange={handleChange}\n ref={useMergedRef(ref, inputRef)}\n name={name}\n form={form}\n capture={capture}\n {...inputProps}\n />\n\n {children({ onClick, ...others })}\n </>\n );\n});\n\nFileButton.displayName = '@mantine/core/FileButton';\n"],"mappings":";;;;;;;AA6CA,MAAa,aAAa,gBAAmC,UAAU;CACrE,MAAM,EACJ,UACA,UACA,UACA,QACA,MACA,MACA,UACA,UACA,SACA,YACA,KACA,GAAG,WACD,SAAS,cAAc,MAAM,MAAM;CAEvC,MAAM,WAAW,OAAyB,KAAK;CAE/C,MAAM,gBAAgB;AACpB,GAAC,YAAY,SAAS,SAAS,OAAO;;CAGxC,MAAM,gBAAgB,UAA+C;AACnE,MAAI,MAAM,cAAc,UAAU,KAChC,QAAO,SAAS,WAAY,EAAE,GAAW,KAAK;AAGhD,MAAI,SACF,UAAS,MAAM,KAAK,MAAM,cAAc,MAAM,CAAQ;MAEtD,UAAU,MAAM,cAAc,MAAM,MAAc,KAAK;;CAI3D,MAAM,cAAc;AAClB,MAAI,SAAS,QACX,UAAS,QAAQ,QAAQ;;AAI7B,WAAU,UAAU,MAAM;AAE1B,QACE,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,SAAD;EACE,OAAO,EAAE,SAAS,QAAQ;EAC1B,MAAK;EACG;EACE;EACV,UAAU;EACV,KAAK,aAAa,KAAK,SAAS;EAC1B;EACA;EACG;EACT,GAAI;EACJ,CAAA,EAED,SAAS;EAAE;EAAS,GAAG;EAAQ,CAAC,CAChC,EAAA,CAAA;EAEL;AAEF,WAAW,cAAc"}
1	+ {"version":3,"file":"FileButton.mjs","names":[],"sources":["../../../src/components/FileButton/FileButton.tsx"],"sourcesContent":["import React, { useRef } from 'react';\nimport { assignRef, useMergedRef } from '@mantine/hooks';\nimport { Factory, genericFactory, useProps } from '../../core';\n\nexport interface FileButtonProps<Multiple extends boolean = false> {\n ref?: React.Ref<HTMLInputElement>;\n\n /** Called when files are picked /\n onChange: (payload: Multiple extends true ? File[] : File \| null) => void;\n\n /* Function that receives button props and returns react node that should be rendered /\n children: (props: { onClick: () => void }) => React.ReactNode;\n\n /* If set, user can pick more than one file /\n multiple?: Multiple;\n\n /* File input accept attribute, for example, `\"image/png,image/jpeg\"` /\n accept?: string;\n\n /* Input name attribute /\n name?: string;\n\n /* Input form attribute /\n form?: string;\n\n /* Reference of the function that should be called when value changes to null or empty array /\n resetRef?: React.Ref<() => void>;\n\n /* Disables file picker /\n disabled?: boolean;\n\n /* Specifies that, optionally, a new file should be captured, and which device should be used to capture that new media of a type defined by the accept attribute. /\n capture?: boolean \| 'user' \| 'environment';\n\n /* Passes down props to the input element used to capture files */\n inputProps?: React.ComponentProps<'input'>;\n}\n\nexport type FileButtonFactory = Factory<{\n props: FileButtonProps;\n signature: <Multiple extends boolean = false>(\n props: FileButtonProps<Multiple>\n ) => React.JSX.Element;\n}>;\n\nexport const FileButton = genericFactory<FileButtonFactory>((props) => {\n const {\n onChange,\n children,\n multiple,\n accept,\n name,\n form,\n resetRef,\n disabled,\n capture,\n inputProps,\n ref,\n ...others\n } = useProps('FileButton', null, props);\n\n const inputRef = useRef<HTMLInputElement>(null);\n\n const onClick = () => {\n !disabled && inputRef.current?.click();\n };\n\n const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n if (event.currentTarget.files === null) {\n return onChange(multiple ? ([] as any) : null);\n }\n\n if (multiple) {\n onChange(Array.from(event.currentTarget.files) as any);\n } else {\n onChange((event.currentTarget.files[0] as any) \|\| null);\n }\n };\n\n const reset = () => {\n if (inputRef.current) {\n inputRef.current.value = '';\n }\n };\n\n assignRef(resetRef, reset);\n\n return (\n <>\n <input\n style={{ display: 'none' }}\n type=\"file\"\n accept={accept}\n multiple={multiple}\n onChange={handleChange}\n ref={useMergedRef(ref, inputRef)}\n name={name}\n form={form}\n capture={capture}\n {...inputProps}\n />\n\n {children({ onClick, ...others })}\n </>\n );\n});\n\nFileButton.displayName = '@mantine/core/FileButton';\n\nexport namespace FileButton {\n export type Props<Multiple extends boolean = false> = FileButtonProps<Multiple>;\n export type Factory = FileButtonFactory;\n}\n"],"mappings":";;;;;;;AA6CA,MAAa,aAAa,gBAAmC,UAAU;CACrE,MAAM,EACJ,UACA,UACA,UACA,QACA,MACA,MACA,UACA,UACA,SACA,YACA,KACA,GAAG,WACD,SAAS,cAAc,MAAM,MAAM;CAEvC,MAAM,WAAW,OAAyB,KAAK;CAE/C,MAAM,gBAAgB;AACpB,GAAC,YAAY,SAAS,SAAS,OAAO;;CAGxC,MAAM,gBAAgB,UAA+C;AACnE,MAAI,MAAM,cAAc,UAAU,KAChC,QAAO,SAAS,WAAY,EAAE,GAAW,KAAK;AAGhD,MAAI,SACF,UAAS,MAAM,KAAK,MAAM,cAAc,MAAM,CAAQ;MAEtD,UAAU,MAAM,cAAc,MAAM,MAAc,KAAK;;CAI3D,MAAM,cAAc;AAClB,MAAI,SAAS,QACX,UAAS,QAAQ,QAAQ;;AAI7B,WAAU,UAAU,MAAM;AAE1B,QACE,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,SAAD;EACE,OAAO,EAAE,SAAS,QAAQ;EAC1B,MAAK;EACG;EACE;EACV,UAAU;EACV,KAAK,aAAa,KAAK,SAAS;EAC1B;EACA;EACG;EACT,GAAI;EACJ,CAAA,EAED,SAAS;EAAE;EAAS,GAAG;EAAQ,CAAC,CAChC,EAAA,CAAA;EAEL;AAEF,WAAW,cAAc"}

package/esm/components/FileInput/FileInput.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FileInput.mjs","names":[],"sources":["../../../src/components/FileInput/FileInput.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport { useMergedRef, useUncontrolled } from '@mantine/hooks';\nimport {\n BoxProps,\n ElementProps,\n Factory,\n genericFactory,\n StylesApiProps,\n useProps,\n useResolvedStylesApi,\n} from '../../core';\nimport { CloseButton } from '../CloseButton';\nimport { FileButton } from '../FileButton';\nimport {\n __BaseInputProps,\n __InputStylesNames,\n ClearSectionMode,\n Input,\n InputVariant,\n} from '../Input';\nimport { InputBase } from '../InputBase/InputBase';\n\nexport interface FileInputProps<Multiple = false>\n extends\n BoxProps,\n __BaseInputProps,\n StylesApiProps<FileInputFactory>,\n ElementProps<'button', 'value' \| 'defaultValue' \| 'onChange' \| 'placeholder'> {\n component?: any;\n\n /** Called when value changes /\n onChange?: (payload: Multiple extends true ? File[] : File \| null) => void;\n\n /* Controlled component value /\n value?: Multiple extends true ? File[] : File \| null;\n\n /* Uncontrolled component default value /\n defaultValue?: Multiple extends true ? File[] : File \| null;\n\n /* If set, user can pick more than one file @default false /\n multiple?: Multiple;\n\n /* File input accept attribute, for example, `\"image/png,image/jpeg\"` /\n accept?: string;\n\n /* Input name attribute /\n name?: string;\n\n /* Input form attribute /\n form?: string;\n\n /* Value renderer. By default, displays file name. /\n valueComponent?: React.FC<{ value: null \| File \| File[] }>;\n\n /* If set, the clear button is displayed in the right section @default false /\n clearable?: boolean;\n\n /* Determines how the clear button and rightSection are rendered @default 'both' /\n clearSectionMode?: ClearSectionMode;\n\n /* Props passed down to the clear button /\n clearButtonProps?: React.ComponentProps<'button'>;\n\n /* If set, the input value cannot be changed /\n readOnly?: boolean;\n\n /* Specifies that, optionally, a new file should be captured, and which device should be used to capture that new media of a type defined by the accept attribute. /\n capture?: boolean \| 'user' \| 'environment';\n\n /* Props passed down to the hidden `input[type=\"file\"]` /\n fileInputProps?: React.ComponentProps<'input'>;\n\n /* Input placeholder /\n placeholder?: React.ReactNode;\n\n /* Reference of the function that should be called when value changes to null or empty array */\n resetRef?: React.Ref<() => void>;\n}\n\nexport type FileInputFactory = Factory<{\n props: FileInputProps;\n ref: HTMLButtonElement;\n stylesNames: __InputStylesNames \| 'placeholder';\n variant: InputVariant;\n signature: <Multiple extends boolean = false>(\n props: FileInputProps<Multiple>\n ) => React.JSX.Element;\n}>;\n\nconst DefaultValue: FileInputProps['valueComponent'] = ({ value }) => (\n <div style={{ overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>\n {Array.isArray(value) ? value.map((file) => file.name).join(', ') : value?.name}\n </div>\n);\n\nconst defaultProps = {\n valueComponent: DefaultValue,\n size: 'sm',\n} satisfies Partial<FileInputProps>;\n\nexport const FileInput = genericFactory<FileInputFactory>((_props) => {\n const props = useProps('FileInput', defaultProps, _props);\n const {\n unstyled,\n vars,\n onChange,\n value,\n defaultValue,\n multiple,\n accept,\n name,\n form,\n valueComponent: ValueComponent,\n clearable,\n clearSectionMode,\n clearButtonProps,\n readOnly,\n capture,\n fileInputProps,\n rightSection,\n size,\n placeholder,\n component,\n resetRef: resetRefProp,\n classNames,\n styles,\n attributes,\n ...others\n } = props;\n\n const resetRef = useRef<() => void>(null);\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<FileInputFactory>({\n classNames,\n styles,\n props,\n });\n\n const [_value, setValue] = useUncontrolled<null \| File \| File[]>({\n value,\n defaultValue,\n onChange: onChange as any,\n finalValue: multiple ? [] : null,\n });\n\n const hasValue = Array.isArray(_value) ? _value.length !== 0 : _value !== null;\n\n const clearButton = (\n <CloseButton\n {...clearButtonProps}\n variant=\"subtle\"\n onClick={() => setValue(multiple ? [] : null)}\n size={size}\n unstyled={unstyled}\n />\n );\n\n const _clearable = clearable && hasValue && !readOnly;\n\n useEffect(() => {\n if ((Array.isArray(_value) && _value.length === 0) \|\| _value === null) {\n resetRef.current?.();\n }\n }, [_value]);\n\n return (\n <FileButton\n onChange={setValue}\n multiple={multiple}\n accept={accept}\n name={name}\n form={form}\n resetRef={useMergedRef(resetRef, resetRefProp)}\n disabled={readOnly}\n capture={capture}\n inputProps={fileInputProps}\n >\n {(fileButtonProps) => (\n <InputBase\n component={component \|\| 'button'}\n rightSection={rightSection}\n __clearSection={clearButton}\n __clearable={_clearable}\n __clearSectionMode={clearSectionMode}\n {...fileButtonProps}\n {...others}\n __staticSelector=\"FileInput\"\n multiline\n type=\"button\"\n pointer\n __stylesApiProps={props}\n unstyled={unstyled}\n size={size}\n classNames={classNames}\n styles={styles}\n attributes={attributes}\n >\n {!hasValue ? (\n <Input.Placeholder\n __staticSelector=\"FileInput\"\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n attributes={attributes}\n >\n {placeholder}\n </Input.Placeholder>\n ) : (\n <ValueComponent value={_value} />\n )}\n </InputBase>\n )}\n </FileButton>\n );\n});\n\nFileInput.classes = InputBase.classes;\nFileInput.displayName = '@mantine/core/FileInput';\n"],"mappings":";;;;;;;;;;;;AAyFA,MAAM,gBAAkD,EAAE,YACxD,oBAAC,OAAD;CAAK,OAAO;EAAE,UAAU;EAAU,cAAc;EAAY,YAAY;EAAU;WAC/E,MAAM,QAAQ,MAAM,GAAG,MAAM,KAAK,SAAS,KAAK,KAAK,CAAC,KAAK,KAAK,GAAG,OAAO;CACvE,CAAA;AAGR,MAAM,eAAe;CACnB,gBAAgB;CAChB,MAAM;CACP;AAED,MAAa,YAAY,gBAAkC,WAAW;CACpE,MAAM,QAAQ,SAAS,aAAa,cAAc,OAAO;CACzD,MAAM,EACJ,UACA,MACA,UACA,OACA,cACA,UACA,QACA,MACA,MACA,gBAAgB,gBAChB,WACA,kBACA,kBACA,UACA,SACA,gBACA,cACA,MACA,aACA,WACA,UAAU,cACV,YACA,QACA,YACA,GAAG,WACD;CAEJ,MAAM,WAAW,OAAmB,KAAK;CACzC,MAAM,EAAE,oBAAoB,mBAAmB,qBAAuC;EACpF;EACA;EACA;EACD,CAAC;CAEF,MAAM,CAAC,QAAQ,YAAY,gBAAsC;EAC/D;EACA;EACU;EACV,YAAY,WAAW,EAAE,GAAG;EAC7B,CAAC;CAEF,MAAM,WAAW,MAAM,QAAQ,OAAO,GAAG,OAAO,WAAW,IAAI,WAAW;CAE1E,MAAM,cACJ,oBAAC,aAAD;EACE,GAAI;EACJ,SAAQ;EACR,eAAe,SAAS,WAAW,EAAE,GAAG,KAAK;EACvC;EACI;EACV,CAAA;CAGJ,MAAM,aAAa,aAAa,YAAY,CAAC;AAE7C,iBAAgB;AACd,MAAK,MAAM,QAAQ,OAAO,IAAI,OAAO,WAAW,KAAM,WAAW,KAC/D,UAAS,WAAW;IAErB,CAAC,OAAO,CAAC;AAEZ,QACE,oBAAC,YAAD;EACE,UAAU;EACA;EACF;EACF;EACA;EACN,UAAU,aAAa,UAAU,aAAa;EAC9C,UAAU;EACD;EACT,YAAY;aAEV,oBACA,oBAAC,WAAD;GACE,WAAW,aAAa;GACV;GACd,gBAAgB;GAChB,aAAa;GACb,oBAAoB;GACpB,GAAI;GACJ,GAAI;GACJ,kBAAiB;GACjB,WAAA;GACA,MAAK;GACL,SAAA;GACA,kBAAkB;GACR;GACJ;GACM;GACJ;GACI;aAEX,CAAC,WACA,oBAAC,MAAM,aAAP;IACE,kBAAiB;IACjB,YAAY;IACZ,QAAQ;IACI;cAEX;IACiB,CAAA,GAEpB,oBAAC,gBAAD,EAAgB,OAAO,QAAU,CAAA;GAEzB,CAAA;EAEH,CAAA;EAEf;AAEF,UAAU,UAAU,UAAU;AAC9B,UAAU,cAAc"}
1	+ {"version":3,"file":"FileInput.mjs","names":[],"sources":["../../../src/components/FileInput/FileInput.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport { useMergedRef, useUncontrolled } from '@mantine/hooks';\nimport {\n BoxProps,\n ElementProps,\n Factory,\n genericFactory,\n StylesApiProps,\n useProps,\n useResolvedStylesApi,\n} from '../../core';\nimport { CloseButton } from '../CloseButton';\nimport { FileButton } from '../FileButton';\nimport {\n __BaseInputProps,\n __InputStylesNames,\n ClearSectionMode,\n Input,\n InputVariant,\n} from '../Input';\nimport { InputBase } from '../InputBase/InputBase';\n\nexport interface FileInputProps<Multiple = false>\n extends\n BoxProps,\n __BaseInputProps,\n StylesApiProps<FileInputFactory>,\n ElementProps<'button', 'value' \| 'defaultValue' \| 'onChange' \| 'placeholder'> {\n component?: any;\n\n /** Called when value changes /\n onChange?: (payload: Multiple extends true ? File[] : File \| null) => void;\n\n /* Controlled component value /\n value?: Multiple extends true ? File[] : File \| null;\n\n /* Uncontrolled component default value /\n defaultValue?: Multiple extends true ? File[] : File \| null;\n\n /* If set, user can pick more than one file @default false /\n multiple?: Multiple;\n\n /* File input accept attribute, for example, `\"image/png,image/jpeg\"` /\n accept?: string;\n\n /* Input name attribute /\n name?: string;\n\n /* Input form attribute /\n form?: string;\n\n /* Value renderer. By default, displays file name. /\n valueComponent?: React.FC<{ value: null \| File \| File[] }>;\n\n /* If set, the clear button is displayed in the right section @default false /\n clearable?: boolean;\n\n /* Determines how the clear button and rightSection are rendered @default 'both' /\n clearSectionMode?: ClearSectionMode;\n\n /* Props passed down to the clear button /\n clearButtonProps?: React.ComponentProps<'button'>;\n\n /* If set, the input value cannot be changed /\n readOnly?: boolean;\n\n /* Specifies that, optionally, a new file should be captured, and which device should be used to capture that new media of a type defined by the accept attribute. /\n capture?: boolean \| 'user' \| 'environment';\n\n /* Props passed down to the hidden `input[type=\"file\"]` /\n fileInputProps?: React.ComponentProps<'input'>;\n\n /* Input placeholder /\n placeholder?: React.ReactNode;\n\n /* Reference of the function that should be called when value changes to null or empty array */\n resetRef?: React.Ref<() => void>;\n}\n\nexport type FileInputFactory = Factory<{\n props: FileInputProps;\n ref: HTMLButtonElement;\n stylesNames: __InputStylesNames \| 'placeholder';\n variant: InputVariant;\n signature: <Multiple extends boolean = false>(\n props: FileInputProps<Multiple>\n ) => React.JSX.Element;\n}>;\n\nconst DefaultValue: FileInputProps['valueComponent'] = ({ value }) => (\n <div style={{ overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>\n {Array.isArray(value) ? value.map((file) => file.name).join(', ') : value?.name}\n </div>\n);\n\nconst defaultProps = {\n valueComponent: DefaultValue,\n size: 'sm',\n} satisfies Partial<FileInputProps>;\n\nexport const FileInput = genericFactory<FileInputFactory>((_props) => {\n const props = useProps('FileInput', defaultProps, _props);\n const {\n unstyled,\n vars,\n onChange,\n value,\n defaultValue,\n multiple,\n accept,\n name,\n form,\n valueComponent: ValueComponent,\n clearable,\n clearSectionMode,\n clearButtonProps,\n readOnly,\n capture,\n fileInputProps,\n rightSection,\n size,\n placeholder,\n component,\n resetRef: resetRefProp,\n classNames,\n styles,\n attributes,\n ...others\n } = props;\n\n const resetRef = useRef<() => void>(null);\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<FileInputFactory>({\n classNames,\n styles,\n props,\n });\n\n const [_value, setValue] = useUncontrolled<null \| File \| File[]>({\n value,\n defaultValue,\n onChange: onChange as any,\n finalValue: multiple ? [] : null,\n });\n\n const hasValue = Array.isArray(_value) ? _value.length !== 0 : _value !== null;\n\n const clearButton = (\n <CloseButton\n {...clearButtonProps}\n variant=\"subtle\"\n onClick={() => setValue(multiple ? [] : null)}\n size={size}\n unstyled={unstyled}\n />\n );\n\n const _clearable = clearable && hasValue && !readOnly;\n\n useEffect(() => {\n if ((Array.isArray(_value) && _value.length === 0) \|\| _value === null) {\n resetRef.current?.();\n }\n }, [_value]);\n\n return (\n <FileButton\n onChange={setValue}\n multiple={multiple}\n accept={accept}\n name={name}\n form={form}\n resetRef={useMergedRef(resetRef, resetRefProp)}\n disabled={readOnly}\n capture={capture}\n inputProps={fileInputProps}\n >\n {(fileButtonProps) => (\n <InputBase\n component={component \|\| 'button'}\n rightSection={rightSection}\n __clearSection={clearButton}\n __clearable={_clearable}\n __clearSectionMode={clearSectionMode}\n {...fileButtonProps}\n {...others}\n __staticSelector=\"FileInput\"\n multiline\n type=\"button\"\n pointer\n __stylesApiProps={props}\n unstyled={unstyled}\n size={size}\n classNames={classNames}\n styles={styles}\n attributes={attributes}\n >\n {!hasValue ? (\n <Input.Placeholder\n __staticSelector=\"FileInput\"\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n attributes={attributes}\n >\n {placeholder}\n </Input.Placeholder>\n ) : (\n <ValueComponent value={_value} />\n )}\n </InputBase>\n )}\n </FileButton>\n );\n});\n\nFileInput.classes = InputBase.classes;\nFileInput.displayName = '@mantine/core/FileInput';\n\nexport namespace FileInput {\n export type Props<Multiple extends boolean = false> = FileInputProps<Multiple>;\n export type Factory = FileInputFactory;\n}\n"],"mappings":";;;;;;;;;;;;AAyFA,MAAM,gBAAkD,EAAE,YACxD,oBAAC,OAAD;CAAK,OAAO;EAAE,UAAU;EAAU,cAAc;EAAY,YAAY;EAAU;WAC/E,MAAM,QAAQ,MAAM,GAAG,MAAM,KAAK,SAAS,KAAK,KAAK,CAAC,KAAK,KAAK,GAAG,OAAO;CACvE,CAAA;AAGR,MAAM,eAAe;CACnB,gBAAgB;CAChB,MAAM;CACP;AAED,MAAa,YAAY,gBAAkC,WAAW;CACpE,MAAM,QAAQ,SAAS,aAAa,cAAc,OAAO;CACzD,MAAM,EACJ,UACA,MACA,UACA,OACA,cACA,UACA,QACA,MACA,MACA,gBAAgB,gBAChB,WACA,kBACA,kBACA,UACA,SACA,gBACA,cACA,MACA,aACA,WACA,UAAU,cACV,YACA,QACA,YACA,GAAG,WACD;CAEJ,MAAM,WAAW,OAAmB,KAAK;CACzC,MAAM,EAAE,oBAAoB,mBAAmB,qBAAuC;EACpF;EACA;EACA;EACD,CAAC;CAEF,MAAM,CAAC,QAAQ,YAAY,gBAAsC;EAC/D;EACA;EACU;EACV,YAAY,WAAW,EAAE,GAAG;EAC7B,CAAC;CAEF,MAAM,WAAW,MAAM,QAAQ,OAAO,GAAG,OAAO,WAAW,IAAI,WAAW;CAE1E,MAAM,cACJ,oBAAC,aAAD;EACE,GAAI;EACJ,SAAQ;EACR,eAAe,SAAS,WAAW,EAAE,GAAG,KAAK;EACvC;EACI;EACV,CAAA;CAGJ,MAAM,aAAa,aAAa,YAAY,CAAC;AAE7C,iBAAgB;AACd,MAAK,MAAM,QAAQ,OAAO,IAAI,OAAO,WAAW,KAAM,WAAW,KAC/D,UAAS,WAAW;IAErB,CAAC,OAAO,CAAC;AAEZ,QACE,oBAAC,YAAD;EACE,UAAU;EACA;EACF;EACF;EACA;EACN,UAAU,aAAa,UAAU,aAAa;EAC9C,UAAU;EACD;EACT,YAAY;aAEV,oBACA,oBAAC,WAAD;GACE,WAAW,aAAa;GACV;GACd,gBAAgB;GAChB,aAAa;GACb,oBAAoB;GACpB,GAAI;GACJ,GAAI;GACJ,kBAAiB;GACjB,WAAA;GACA,MAAK;GACL,SAAA;GACA,kBAAkB;GACR;GACJ;GACM;GACJ;GACI;aAEX,CAAC,WACA,oBAAC,MAAM,aAAP;IACE,kBAAiB;IACjB,YAAY;IACZ,QAAQ;IACI;cAEX;IACiB,CAAA,GAEpB,oBAAC,gBAAD,EAAgB,OAAO,QAAU,CAAA;GAEzB,CAAA;EAEH,CAAA;EAEf;AAEF,UAAU,UAAU,UAAU;AAC9B,UAAU,cAAc"}

package/esm/components/Flex/Flex.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Flex.mjs","names":["classes"],"sources":["../../../src/components/Flex/Flex.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n ElementProps,\n filterProps,\n InlineStyles,\n MantineSpacing,\n parseStyleProps,\n polymorphicFactory,\n PolymorphicFactory,\n StyleProp,\n StylesApiProps,\n useMantineTheme,\n useProps,\n useRandomClassName,\n useStyles,\n} from '../../core';\nimport { FLEX_STYLE_PROPS_DATA } from './flex-props';\nimport classes from './Flex.module.css';\n\nexport type FlexStylesNames = 'root';\n\nexport interface FlexProps extends BoxProps, StylesApiProps<FlexFactory>, ElementProps<'div'> {\n /** `gap` CSS property /\n gap?: StyleProp<MantineSpacing>;\n\n /* `row-gap` CSS property /\n rowGap?: StyleProp<MantineSpacing>;\n\n /* `column-gap` CSS property /\n columnGap?: StyleProp<MantineSpacing>;\n\n /* `align-items` CSS property /\n align?: StyleProp<React.CSSProperties['alignItems']>;\n\n /* `justify-content` CSS property /\n justify?: StyleProp<React.CSSProperties['justifyContent']>;\n\n /* `flex-wrap` CSS property /\n wrap?: StyleProp<React.CSSProperties['flexWrap']>;\n\n /* `flex-direction` CSS property */\n direction?: StyleProp<React.CSSProperties['flexDirection']>;\n}\n\nexport type FlexFactory = PolymorphicFactory<{\n props: FlexProps;\n defaultRef: HTMLDivElement;\n defaultComponent: 'div';\n stylesNames: FlexStylesNames;\n}>;\n\nexport const Flex = polymorphicFactory<FlexFactory>((_props) => {\n const props = useProps('Flex', null, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n gap,\n rowGap,\n columnGap,\n align,\n justify,\n wrap,\n direction,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<FlexFactory>({\n name: 'Flex',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n });\n\n const theme = useMantineTheme();\n const responsiveClassName = useRandomClassName();\n const parsedStyleProps = parseStyleProps({\n styleProps: { gap, rowGap, columnGap, align, justify, wrap, direction },\n theme,\n data: FLEX_STYLE_PROPS_DATA,\n });\n\n return (\n <>\n {parsedStyleProps.hasResponsiveStyles && (\n <InlineStyles\n selector={`.${responsiveClassName}`}\n styles={parsedStyleProps.styles}\n media={parsedStyleProps.media}\n />\n )}\n <Box\n {...getStyles('root', {\n className: responsiveClassName,\n style: filterProps(parsedStyleProps.inlineStyles),\n })}\n {...others}\n />\n </>\n );\n});\n\nFlex.classes = classes;\nFlex.displayName = '@mantine/core/Flex';\n"],"mappings":";;;;;;;;;;;;;;AAoDA,MAAa,OAAO,oBAAiC,WAAW;CAC9D,MAAM,QAAQ,SAAS,QAAQ,MAAM,OAAO;CAC5C,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,KACA,QACA,WACA,OACA,SACA,MACA,WACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAAuB;EACvC,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,QAAQ,iBAAiB;CAC/B,MAAM,sBAAsB,oBAAoB;CAChD,MAAM,mBAAmB,gBAAgB;EACvC,YAAY;GAAE;GAAK;GAAQ;GAAW;GAAO;GAAS;GAAM;GAAW;EACvE;EACA,MAAM;EACP,CAAC;AAEF,QACE,qBAAA,UAAA,EAAA,UAAA,CACG,iBAAiB,uBAChB,oBAAC,cAAD;EACE,UAAU,IAAI;EACd,QAAQ,iBAAiB;EACzB,OAAO,iBAAiB;EACxB,CAAA,EAEJ,oBAAC,KAAD;EACE,GAAI,UAAU,QAAQ;GACpB,WAAW;GACX,OAAO,YAAY,iBAAiB,aAAa;GAClD,CAAC;EACF,GAAI;EACJ,CAAA,CACD,EAAA,CAAA;EAEL;AAEF,KAAK,UAAUA;AACf,KAAK,cAAc"}
1	+ {"version":3,"file":"Flex.mjs","names":["classes"],"sources":["../../../src/components/Flex/Flex.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n ElementProps,\n filterProps,\n InlineStyles,\n MantineSpacing,\n parseStyleProps,\n polymorphicFactory,\n PolymorphicFactory,\n StyleProp,\n StylesApiProps,\n useMantineTheme,\n useProps,\n useRandomClassName,\n useStyles,\n} from '../../core';\nimport { FLEX_STYLE_PROPS_DATA } from './flex-props';\nimport classes from './Flex.module.css';\n\nexport type FlexStylesNames = 'root';\n\nexport interface FlexProps extends BoxProps, StylesApiProps<FlexFactory>, ElementProps<'div'> {\n /** `gap` CSS property /\n gap?: StyleProp<MantineSpacing>;\n\n /* `row-gap` CSS property /\n rowGap?: StyleProp<MantineSpacing>;\n\n /* `column-gap` CSS property /\n columnGap?: StyleProp<MantineSpacing>;\n\n /* `align-items` CSS property /\n align?: StyleProp<React.CSSProperties['alignItems']>;\n\n /* `justify-content` CSS property /\n justify?: StyleProp<React.CSSProperties['justifyContent']>;\n\n /* `flex-wrap` CSS property /\n wrap?: StyleProp<React.CSSProperties['flexWrap']>;\n\n /* `flex-direction` CSS property */\n direction?: StyleProp<React.CSSProperties['flexDirection']>;\n}\n\nexport type FlexFactory = PolymorphicFactory<{\n props: FlexProps;\n defaultRef: HTMLDivElement;\n defaultComponent: 'div';\n stylesNames: FlexStylesNames;\n}>;\n\nexport const Flex = polymorphicFactory<FlexFactory>((_props) => {\n const props = useProps('Flex', null, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n gap,\n rowGap,\n columnGap,\n align,\n justify,\n wrap,\n direction,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<FlexFactory>({\n name: 'Flex',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n });\n\n const theme = useMantineTheme();\n const responsiveClassName = useRandomClassName();\n const parsedStyleProps = parseStyleProps({\n styleProps: { gap, rowGap, columnGap, align, justify, wrap, direction },\n theme,\n data: FLEX_STYLE_PROPS_DATA,\n });\n\n return (\n <>\n {parsedStyleProps.hasResponsiveStyles && (\n <InlineStyles\n selector={`.${responsiveClassName}`}\n styles={parsedStyleProps.styles}\n media={parsedStyleProps.media}\n />\n )}\n <Box\n {...getStyles('root', {\n className: responsiveClassName,\n style: filterProps(parsedStyleProps.inlineStyles),\n })}\n {...others}\n />\n </>\n );\n});\n\nFlex.classes = classes;\nFlex.displayName = '@mantine/core/Flex';\n\nexport namespace Flex {\n export type Props = FlexProps;\n export type StylesNames = FlexStylesNames;\n export type Factory = FlexFactory;\n}\n"],"mappings":";;;;;;;;;;;;;;AAoDA,MAAa,OAAO,oBAAiC,WAAW;CAC9D,MAAM,QAAQ,SAAS,QAAQ,MAAM,OAAO;CAC5C,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,KACA,QACA,WACA,OACA,SACA,MACA,WACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAAuB;EACvC,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,QAAQ,iBAAiB;CAC/B,MAAM,sBAAsB,oBAAoB;CAChD,MAAM,mBAAmB,gBAAgB;EACvC,YAAY;GAAE;GAAK;GAAQ;GAAW;GAAO;GAAS;GAAM;GAAW;EACvE;EACA,MAAM;EACP,CAAC;AAEF,QACE,qBAAA,UAAA,EAAA,UAAA,CACG,iBAAiB,uBAChB,oBAAC,cAAD;EACE,UAAU,IAAI;EACd,QAAQ,iBAAiB;EACzB,OAAO,iBAAiB;EACxB,CAAA,EAEJ,oBAAC,KAAD;EACE,GAAI,UAAU,QAAQ;GACpB,WAAW;GACX,OAAO,YAAY,iBAAiB,aAAa;GAClD,CAAC;EACF,GAAI;EACJ,CAAA,CACD,EAAA,CAAA;EAEL;AAEF,KAAK,UAAUA;AACf,KAAK,cAAc"}

package/esm/components/FloatingIndicator/FloatingIndicator.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FloatingIndicator.mjs","names":["classes"],"sources":["../../../src/components/FloatingIndicator/FloatingIndicator.tsx"],"sourcesContent":["import { useRef } from 'react';\nimport { useMergedRef, useReducedMotion } from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { useFloatingIndicator } from './use-floating-indicator';\nimport classes from './FloatingIndicator.module.css';\n\nexport type FloatingIndicatorStylesNames = 'root';\nexport type FloatingIndicatorCssVariables = {\n root: '--transition-duration';\n};\n\nexport interface FloatingIndicatorProps\n extends BoxProps, StylesApiProps<FloatingIndicatorFactory>, ElementProps<'div'> {\n /** Target element over which the indicator is displayed.\n * The indicator will be positioned to match the target's size and position.\n * /\n target: HTMLElement \| null \| undefined;\n\n /* Parent container element that must have `position: relative`.\n * The indicator's position is calculated relative to this element.\n * /\n parent: HTMLElement \| null \| undefined;\n\n /* Transition duration in ms @default 150 /\n transitionDuration?: number \| string;\n\n /* Controls whether the indicator should be hidden initially and displayed after the parent's transition ends.\n * Set to `true` when the parent container has CSS transitions (e.g., `transform: scale()`) to prevent\n * the indicator from appearing at the wrong position during the parent's animation.\n * @default false\n * /\n displayAfterTransitionEnd?: boolean;\n\n /* Called when the indicator starts transitioning to a new position /\n onTransitionStart?: () => void;\n\n /* Called when the indicator finishes transitioning to a new position */\n onTransitionEnd?: () => void;\n}\n\nexport type FloatingIndicatorFactory = Factory<{\n props: FloatingIndicatorProps;\n ref: HTMLDivElement;\n stylesNames: FloatingIndicatorStylesNames;\n vars: FloatingIndicatorCssVariables;\n ctx: { shouldReduceMotion: boolean };\n}>;\n\nconst varsResolver = createVarsResolver<FloatingIndicatorFactory>(\n (theme, { transitionDuration }, { shouldReduceMotion }) => {\n const reduceMotion = theme.respectReducedMotion ? shouldReduceMotion : false;\n const duration = reduceMotion\n ? '0ms'\n : typeof transitionDuration === 'number'\n ? `${transitionDuration}ms`\n : transitionDuration \|\| '150ms';\n\n return {\n root: {\n '--transition-duration': duration,\n },\n };\n }\n);\n\nexport const FloatingIndicator = factory<FloatingIndicatorFactory>((_props) => {\n const props = useProps('FloatingIndicator', null, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n target,\n parent,\n transitionDuration,\n mod,\n displayAfterTransitionEnd,\n onTransitionStart,\n onTransitionEnd,\n attributes,\n ref,\n ...others\n } = props;\n\n const shouldReduceMotion = useReducedMotion();\n\n const getStyles = useStyles<FloatingIndicatorFactory>({\n name: 'FloatingIndicator',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n stylesCtx: { shouldReduceMotion },\n });\n\n const innerRef = useRef<HTMLDivElement>(null);\n const { initialized, hidden } = useFloatingIndicator({\n target,\n parent,\n ref: innerRef,\n displayAfterTransitionEnd,\n onTransitionStart,\n onTransitionEnd,\n });\n\n const mergedRef = useMergedRef(ref, innerRef);\n\n if (!target \|\| !parent) {\n return null;\n }\n\n return (\n <Box ref={mergedRef} mod={[{ initialized, hidden }, mod]} {...getStyles('root')} {...others} />\n );\n});\n\nFloatingIndicator.displayName = '@mantine/core/FloatingIndicator';\nFloatingIndicator.classes = classes;\nFloatingIndicator.varsResolver = varsResolver;\n"],"mappings":";;;;;;;;;;;;AA0DA,MAAM,eAAe,oBAClB,OAAO,EAAE,sBAAsB,EAAE,yBAAyB;CAEzD,MAAM,YADe,MAAM,uBAAuB,qBAAqB,SAEnE,QACA,OAAO,uBAAuB,WAC5B,GAAG,mBAAmB,MACtB,sBAAsB;AAE5B,QAAO,EACL,MAAM,EACJ,yBAAyB,UAC1B,EACF;EAEJ;AAED,MAAa,oBAAoB,SAAmC,WAAW;CAC7E,MAAM,QAAQ,SAAS,qBAAqB,MAAM,OAAO;CACzD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,QACA,QACA,oBACA,KACA,2BACA,mBACA,iBACA,YACA,KACA,GAAG,WACD;CAIJ,MAAM,YAAY,UAAoC;EACpD,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,WAAW,EAAE,oBAdY,kBAAkB,EAcV;EAClC,CAAC;CAEF,MAAM,WAAW,OAAuB,KAAK;CAC7C,MAAM,EAAE,aAAa,WAAW,qBAAqB;EACnD;EACA;EACA,KAAK;EACL;EACA;EACA;EACD,CAAC;CAEF,MAAM,YAAY,aAAa,KAAK,SAAS;AAE7C,KAAI,CAAC,UAAU,CAAC,OACd,QAAO;AAGT,QACE,oBAAC,KAAD;EAAK,KAAK;EAAW,KAAK,CAAC;GAAE;GAAa;GAAQ,EAAE,IAAI;EAAE,GAAI,UAAU,OAAO;EAAE,GAAI;EAAU,CAAA;EAEjG;AAEF,kBAAkB,cAAc;AAChC,kBAAkB,UAAUA;AAC5B,kBAAkB,eAAe"}
1	+ {"version":3,"file":"FloatingIndicator.mjs","names":["classes"],"sources":["../../../src/components/FloatingIndicator/FloatingIndicator.tsx"],"sourcesContent":["import { useRef } from 'react';\nimport { useMergedRef, useReducedMotion } from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { useFloatingIndicator } from './use-floating-indicator';\nimport classes from './FloatingIndicator.module.css';\n\nexport type FloatingIndicatorStylesNames = 'root';\nexport type FloatingIndicatorCssVariables = {\n root: '--transition-duration';\n};\n\nexport interface FloatingIndicatorProps\n extends BoxProps, StylesApiProps<FloatingIndicatorFactory>, ElementProps<'div'> {\n /** Target element over which the indicator is displayed.\n * The indicator will be positioned to match the target's size and position.\n * /\n target: HTMLElement \| null \| undefined;\n\n /* Parent container element that must have `position: relative`.\n * The indicator's position is calculated relative to this element.\n * /\n parent: HTMLElement \| null \| undefined;\n\n /* Transition duration in ms @default 150 /\n transitionDuration?: number \| string;\n\n /* Controls whether the indicator should be hidden initially and displayed after the parent's transition ends.\n * Set to `true` when the parent container has CSS transitions (e.g., `transform: scale()`) to prevent\n * the indicator from appearing at the wrong position during the parent's animation.\n * @default false\n * /\n displayAfterTransitionEnd?: boolean;\n\n /* Called when the indicator starts transitioning to a new position /\n onTransitionStart?: () => void;\n\n /* Called when the indicator finishes transitioning to a new position */\n onTransitionEnd?: () => void;\n}\n\nexport type FloatingIndicatorFactory = Factory<{\n props: FloatingIndicatorProps;\n ref: HTMLDivElement;\n stylesNames: FloatingIndicatorStylesNames;\n vars: FloatingIndicatorCssVariables;\n ctx: { shouldReduceMotion: boolean };\n}>;\n\nconst varsResolver = createVarsResolver<FloatingIndicatorFactory>(\n (theme, { transitionDuration }, { shouldReduceMotion }) => {\n const reduceMotion = theme.respectReducedMotion ? shouldReduceMotion : false;\n const duration = reduceMotion\n ? '0ms'\n : typeof transitionDuration === 'number'\n ? `${transitionDuration}ms`\n : transitionDuration \|\| '150ms';\n\n return {\n root: {\n '--transition-duration': duration,\n },\n };\n }\n);\n\nexport const FloatingIndicator = factory<FloatingIndicatorFactory>((_props) => {\n const props = useProps('FloatingIndicator', null, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n target,\n parent,\n transitionDuration,\n mod,\n displayAfterTransitionEnd,\n onTransitionStart,\n onTransitionEnd,\n attributes,\n ref,\n ...others\n } = props;\n\n const shouldReduceMotion = useReducedMotion();\n\n const getStyles = useStyles<FloatingIndicatorFactory>({\n name: 'FloatingIndicator',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n stylesCtx: { shouldReduceMotion },\n });\n\n const innerRef = useRef<HTMLDivElement>(null);\n const { initialized, hidden } = useFloatingIndicator({\n target,\n parent,\n ref: innerRef,\n displayAfterTransitionEnd,\n onTransitionStart,\n onTransitionEnd,\n });\n\n const mergedRef = useMergedRef(ref, innerRef);\n\n if (!target \|\| !parent) {\n return null;\n }\n\n return (\n <Box ref={mergedRef} mod={[{ initialized, hidden }, mod]} {...getStyles('root')} {...others} />\n );\n});\n\nFloatingIndicator.displayName = '@mantine/core/FloatingIndicator';\nFloatingIndicator.classes = classes;\nFloatingIndicator.varsResolver = varsResolver;\n\nexport namespace FloatingIndicator {\n export type Props = FloatingIndicatorProps;\n export type StylesNames = FloatingIndicatorStylesNames;\n export type CssVariables = FloatingIndicatorCssVariables;\n export type Factory = FloatingIndicatorFactory;\n}\n"],"mappings":";;;;;;;;;;;;AA0DA,MAAM,eAAe,oBAClB,OAAO,EAAE,sBAAsB,EAAE,yBAAyB;CAEzD,MAAM,YADe,MAAM,uBAAuB,qBAAqB,SAEnE,QACA,OAAO,uBAAuB,WAC5B,GAAG,mBAAmB,MACtB,sBAAsB;AAE5B,QAAO,EACL,MAAM,EACJ,yBAAyB,UAC1B,EACF;EAEJ;AAED,MAAa,oBAAoB,SAAmC,WAAW;CAC7E,MAAM,QAAQ,SAAS,qBAAqB,MAAM,OAAO;CACzD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,QACA,QACA,oBACA,KACA,2BACA,mBACA,iBACA,YACA,KACA,GAAG,WACD;CAIJ,MAAM,YAAY,UAAoC;EACpD,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,WAAW,EAAE,oBAdY,kBAAkB,EAcV;EAClC,CAAC;CAEF,MAAM,WAAW,OAAuB,KAAK;CAC7C,MAAM,EAAE,aAAa,WAAW,qBAAqB;EACnD;EACA;EACA,KAAK;EACL;EACA;EACA;EACD,CAAC;CAEF,MAAM,YAAY,aAAa,KAAK,SAAS;AAE7C,KAAI,CAAC,UAAU,CAAC,OACd,QAAO;AAGT,QACE,oBAAC,KAAD;EAAK,KAAK;EAAW,KAAK,CAAC;GAAE;GAAa;GAAQ,EAAE,IAAI;EAAE,GAAI,UAAU,OAAO;EAAE,GAAI;EAAU,CAAA;EAEjG;AAEF,kBAAkB,cAAc;AAChC,kBAAkB,UAAUA;AAC5B,kBAAkB,eAAe"}

package/esm/components/FloatingWindow/FloatingWindow.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FloatingWindow.mjs","names":["classes"],"sources":["../../../src/components/FloatingWindow/FloatingWindow.tsx"],"sourcesContent":["import { useImperativeHandle } from 'react';\nimport {\n SetFloatingWindowPosition,\n useFloatingWindow,\n UseFloatingWindowOptions,\n useMergedRef,\n} from '@mantine/hooks';\nimport {\n BoxProps,\n ElementProps,\n factory,\n Factory,\n getDefaultZIndex,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { Paper, PaperBaseProps } from '../Paper';\nimport { OptionalPortal, PortalProps } from '../Portal';\nimport classes from './FloatingWindow.module.css';\n\nexport type FloatingWindowStylesNames = 'root';\n\nexport interface FloatingWindowProps\n extends\n UseFloatingWindowOptions,\n PaperBaseProps,\n BoxProps,\n StylesApiProps<FloatingWindowFactory>,\n ElementProps<'div', keyof UseFloatingWindowOptions> {\n /** Assigns ref to set position programmatically /\n setPositionRef?: React.RefObject<SetFloatingWindowPosition \| null>;\n\n /* Determines whether the window should be rendered inside `Portal` @default true /\n withinPortal?: boolean;\n\n /* Props passed down to `Portal` component /\n portalProps?: Omit<PortalProps, 'children'>;\n\n /* `z-index` of the root element @default 400 */\n zIndex?: React.CSSProperties['zIndex'];\n}\n\nexport type FloatingWindowFactory = Factory<{\n props: FloatingWindowProps;\n ref: HTMLDivElement;\n stylesNames: FloatingWindowStylesNames;\n}>;\n\nconst defaultProps = {\n constrainToViewport: true,\n zIndex: getDefaultZIndex('overlay'),\n} satisfies Partial<FloatingWindowProps>;\n\nexport const FloatingWindow = factory<FloatingWindowFactory>((_props) => {\n const props = useProps('FloatingWindow', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n mod,\n enabled,\n constrainToViewport,\n constrainOffset,\n dragHandleSelector,\n excludeDragHandleSelector,\n axis,\n initialPosition,\n onPositionChange,\n onDragStart,\n onDragEnd,\n setPositionRef,\n withinPortal,\n portalProps,\n zIndex,\n ref,\n ...others\n } = props;\n\n const getStyles = useStyles<FloatingWindowFactory>({\n name: 'FloatingWindow',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n vars,\n });\n\n const floatingWindow = useFloatingWindow({\n enabled,\n constrainToViewport,\n constrainOffset,\n dragHandleSelector,\n excludeDragHandleSelector,\n axis,\n initialPosition,\n onPositionChange,\n onDragStart,\n onDragEnd,\n });\n\n useImperativeHandle(setPositionRef, () => floatingWindow.setPosition, [\n floatingWindow.setPosition,\n ]);\n\n return (\n <OptionalPortal withinPortal={withinPortal} {...portalProps}>\n <Paper\n ref={useMergedRef(ref, floatingWindow.ref)}\n mod={[{ dragging: floatingWindow.isDragging }, mod]}\n {...getStyles('root')}\n {...others}\n __vars={{ '--floating-window-z-index': zIndex.toString() }}\n />\n </OptionalPortal>\n );\n});\n\nFloatingWindow.displayName = '@mantine/core/FloatingWindow';\nFloatingWindow.classes = classes;\n"],"mappings":";;;;;;;;;;;;AAiDA,MAAM,eAAe;CACnB,qBAAqB;CACrB,QAAQ,iBAAiB,UAAU;CACpC;AAED,MAAa,iBAAiB,SAAgC,WAAW;CACvE,MAAM,QAAQ,SAAS,kBAAkB,cAAc,OAAO;CAC9D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,KACA,SACA,qBACA,iBACA,oBACA,2BACA,MACA,iBACA,kBACA,aACA,WACA,gBACA,cACA,aACA,QACA,KACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAAiC;EACjD,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,iBAAiB,kBAAkB;EACvC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,qBAAoB,sBAAsB,eAAe,aAAa,CACpE,eAAe,YAChB,CAAC;AAEF,QACE,oBAAC,gBAAD;EAA8B;EAAc,GAAI;YAC9C,oBAAC,OAAD;GACE,KAAK,aAAa,KAAK,eAAe,IAAI;GAC1C,KAAK,CAAC,EAAE,UAAU,eAAe,YAAY,EAAE,IAAI;GACnD,GAAI,UAAU,OAAO;GACrB,GAAI;GACJ,QAAQ,EAAE,6BAA6B,OAAO,UAAU,EAAE;GAC1D,CAAA;EACa,CAAA;EAEnB;AAEF,eAAe,cAAc;AAC7B,eAAe,UAAUA"}
1	+ {"version":3,"file":"FloatingWindow.mjs","names":["classes"],"sources":["../../../src/components/FloatingWindow/FloatingWindow.tsx"],"sourcesContent":["import { useImperativeHandle } from 'react';\nimport {\n SetFloatingWindowPosition,\n useFloatingWindow,\n UseFloatingWindowOptions,\n useMergedRef,\n} from '@mantine/hooks';\nimport {\n BoxProps,\n ElementProps,\n factory,\n Factory,\n getDefaultZIndex,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { Paper, PaperBaseProps } from '../Paper';\nimport { OptionalPortal, PortalProps } from '../Portal';\nimport classes from './FloatingWindow.module.css';\n\nexport type FloatingWindowStylesNames = 'root';\n\nexport interface FloatingWindowProps\n extends\n UseFloatingWindowOptions,\n PaperBaseProps,\n BoxProps,\n StylesApiProps<FloatingWindowFactory>,\n ElementProps<'div', keyof UseFloatingWindowOptions> {\n /** Assigns ref to set position programmatically /\n setPositionRef?: React.RefObject<SetFloatingWindowPosition \| null>;\n\n /* Determines whether the window should be rendered inside `Portal` @default true /\n withinPortal?: boolean;\n\n /* Props passed down to `Portal` component /\n portalProps?: Omit<PortalProps, 'children'>;\n\n /* `z-index` of the root element @default 400 */\n zIndex?: React.CSSProperties['zIndex'];\n}\n\nexport type FloatingWindowFactory = Factory<{\n props: FloatingWindowProps;\n ref: HTMLDivElement;\n stylesNames: FloatingWindowStylesNames;\n}>;\n\nconst defaultProps = {\n constrainToViewport: true,\n zIndex: getDefaultZIndex('overlay'),\n} satisfies Partial<FloatingWindowProps>;\n\nexport const FloatingWindow = factory<FloatingWindowFactory>((_props) => {\n const props = useProps('FloatingWindow', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n mod,\n enabled,\n constrainToViewport,\n constrainOffset,\n dragHandleSelector,\n excludeDragHandleSelector,\n axis,\n initialPosition,\n onPositionChange,\n onDragStart,\n onDragEnd,\n setPositionRef,\n withinPortal,\n portalProps,\n zIndex,\n ref,\n ...others\n } = props;\n\n const getStyles = useStyles<FloatingWindowFactory>({\n name: 'FloatingWindow',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n vars,\n });\n\n const floatingWindow = useFloatingWindow({\n enabled,\n constrainToViewport,\n constrainOffset,\n dragHandleSelector,\n excludeDragHandleSelector,\n axis,\n initialPosition,\n onPositionChange,\n onDragStart,\n onDragEnd,\n });\n\n useImperativeHandle(setPositionRef, () => floatingWindow.setPosition, [\n floatingWindow.setPosition,\n ]);\n\n return (\n <OptionalPortal withinPortal={withinPortal} {...portalProps}>\n <Paper\n ref={useMergedRef(ref, floatingWindow.ref)}\n mod={[{ dragging: floatingWindow.isDragging }, mod]}\n {...getStyles('root')}\n {...others}\n __vars={{ '--floating-window-z-index': zIndex.toString() }}\n />\n </OptionalPortal>\n );\n});\n\nFloatingWindow.displayName = '@mantine/core/FloatingWindow';\nFloatingWindow.classes = classes;\n\nexport namespace FloatingWindow {\n export type Props = FloatingWindowProps;\n export type StylesNames = FloatingWindowStylesNames;\n export type Factory = FloatingWindowFactory;\n}\n"],"mappings":";;;;;;;;;;;;AAiDA,MAAM,eAAe;CACnB,qBAAqB;CACrB,QAAQ,iBAAiB,UAAU;CACpC;AAED,MAAa,iBAAiB,SAAgC,WAAW;CACvE,MAAM,QAAQ,SAAS,kBAAkB,cAAc,OAAO;CAC9D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,KACA,SACA,qBACA,iBACA,oBACA,2BACA,MACA,iBACA,kBACA,aACA,WACA,gBACA,cACA,aACA,QACA,KACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAAiC;EACjD,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,iBAAiB,kBAAkB;EACvC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,qBAAoB,sBAAsB,eAAe,aAAa,CACpE,eAAe,YAChB,CAAC;AAEF,QACE,oBAAC,gBAAD;EAA8B;EAAc,GAAI;YAC9C,oBAAC,OAAD;GACE,KAAK,aAAa,KAAK,eAAe,IAAI;GAC1C,KAAK,CAAC,EAAE,UAAU,eAAe,YAAY,EAAE,IAAI;GACnD,GAAI,UAAU,OAAO;GACrB,GAAI;GACJ,QAAQ,EAAE,6BAA6B,OAAO,UAAU,EAAE;GAC1D,CAAA;EACa,CAAA;EAEnB;AAEF,eAAe,cAAc;AAC7B,eAAe,UAAUA"}

package/esm/components/Grid/Grid.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Grid.mjs","names":["classes"],"sources":["../../../src/components/Grid/Grid.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n MantineSpacing,\n StyleProp,\n StylesApiProps,\n useProps,\n useRandomClassName,\n useStyles,\n} from '../../core';\nimport { GridBreakpoints, GridProvider } from './Grid.context';\nimport { GridCol } from './GridCol/GridCol';\nimport { GridVariables } from './GridVariables';\nimport classes from './Grid.module.css';\n\nexport type GridStylesNames = 'root' \| 'col' \| 'inner' \| 'container';\nexport type GridCssVariables = {\n root: '--grid-justify' \| '--grid-align' \| '--grid-overflow';\n};\n\nexport interface GridProps extends BoxProps, StylesApiProps<GridFactory>, ElementProps<'div'> {\n /** Gap between columns and rows, key of `theme.spacing` or any valid CSS value @default 'md' /\n gap?: StyleProp<MantineSpacing>;\n\n /* Row gap, overrides `gap` for vertical spacing /\n rowGap?: StyleProp<MantineSpacing>;\n\n /* Column gap, overrides `gap` for horizontal spacing /\n columnGap?: StyleProp<MantineSpacing>;\n\n /* If set, columns in the last row expand to fill all available space @default false /\n grow?: boolean;\n\n /* Sets `justify-content` @default flex-start /\n justify?: React.CSSProperties['justifyContent'];\n\n /* Sets `align-items` @default stretch /\n align?: React.CSSProperties['alignItems'];\n\n /* Number of columns in each row @default 12 /\n columns?: number;\n\n /* Sets `overflow` CSS property on the root element @default 'visible' /\n overflow?: React.CSSProperties['overflow'];\n\n /* Type of queries used for responsive styles @default 'media' /\n type?: 'media' \| 'container';\n\n /* Breakpoints values, only used with `type=\"container\"` */\n breakpoints?: GridBreakpoints;\n}\n\nexport type GridFactory = Factory<{\n props: GridProps;\n ref: HTMLDivElement;\n stylesNames: GridStylesNames;\n vars: GridCssVariables;\n staticComponents: {\n Col: typeof GridCol;\n };\n}>;\n\nconst defaultProps = {\n gap: 'md',\n columns: 12,\n} satisfies Partial<GridProps>;\n\nconst varsResolver = createVarsResolver<GridFactory>((_, { justify, align, overflow }) => ({\n root: {\n '--grid-justify': justify,\n '--grid-align': align,\n '--grid-overflow': overflow,\n },\n}));\n\nexport const Grid = factory<GridFactory>((_props) => {\n const props = useProps('Grid', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n grow,\n gap,\n rowGap,\n columnGap,\n columns,\n align,\n justify,\n children,\n breakpoints,\n type,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<GridFactory>({\n name: 'Grid',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const responsiveClassName = useRandomClassName();\n\n if (type === 'container' && breakpoints) {\n return (\n <GridProvider value={{ getStyles, grow, columns, breakpoints, type }}>\n <GridVariables selector={`.${responsiveClassName}`} {...props} />\n <div {...getStyles('container')}>\n <Box {...getStyles('root', { className: responsiveClassName })} {...others}>\n <div {...getStyles('inner')}>{children}</div>\n </Box>\n </div>\n </GridProvider>\n );\n }\n\n return (\n <GridProvider value={{ getStyles, grow, columns, breakpoints, type }}>\n <GridVariables selector={`.${responsiveClassName}`} {...props} />\n <Box {...getStyles('root', { className: responsiveClassName })} {...others}>\n <div {...getStyles('inner')}>{children}</div>\n </Box>\n </GridProvider>\n );\n});\n\nGrid.classes = classes;\nGrid.varsResolver = varsResolver;\nGrid.displayName = '@mantine/core/Grid';\nGrid.Col = GridCol;\n"],"mappings":";;;;;;;;;;;;;~~AAkEA~~,MAAM,eAAe;CACnB,KAAK;CACL,SAAS;CACV;AAED,MAAM,eAAe,oBAAiC,GAAG,EAAE,SAAS,OAAO,gBAAgB,EACzF,MAAM;CACJ,kBAAkB;CAClB,gBAAgB;CAChB,mBAAmB;CACpB,EACF,EAAE;AAEH,MAAa,OAAO,SAAsB,WAAW;CACnD,MAAM,QAAQ,SAAS,QAAQ,cAAc,OAAO;CACpD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,MACA,KACA,QACA,WACA,SACA,OACA,SACA,UACA,aACA,MACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAAuB;EACvC,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,sBAAsB,oBAAoB;AAEhD,KAAI,SAAS,eAAe,YAC1B,QACE,qBAAC,cAAD;EAAc,OAAO;GAAE;GAAW;GAAM;GAAS;GAAa;GAAM;YAApE,CACE,oBAAC,eAAD;GAAe,UAAU,IAAI;GAAuB,GAAI;GAAS,CAAA,EACjE,oBAAC,OAAD;GAAK,GAAI,UAAU,YAAY;aAC7B,oBAAC,KAAD;IAAK,GAAI,UAAU,QAAQ,EAAE,WAAW,qBAAqB,CAAC;IAAE,GAAI;cAClE,oBAAC,OAAD;KAAK,GAAI,UAAU,QAAQ;KAAG;KAAe,CAAA;IACzC,CAAA;GACF,CAAA,CACO;;AAInB,QACE,qBAAC,cAAD;EAAc,OAAO;GAAE;GAAW;GAAM;GAAS;GAAa;GAAM;YAApE,CACE,oBAAC,eAAD;GAAe,UAAU,IAAI;GAAuB,GAAI;GAAS,CAAA,EACjE,oBAAC,KAAD;GAAK,GAAI,UAAU,QAAQ,EAAE,WAAW,qBAAqB,CAAC;GAAE,GAAI;aAClE,oBAAC,OAAD;IAAK,GAAI,UAAU,QAAQ;IAAG;IAAe,CAAA;GACzC,CAAA,CACO;;EAEjB;AAEF,KAAK,UAAUA;AACf,KAAK,eAAe;AACpB,KAAK,cAAc;AACnB,KAAK,MAAM"}
1	+ {"version":3,"file":"Grid.mjs","names":["classes"],"sources":["../../../src/components/Grid/Grid.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n MantineSpacing,\n StyleProp,\n StylesApiProps,\n useProps,\n useRandomClassName,\n useStyles,\n} from '../../core';\nimport { GridBreakpoints, GridProvider, type GridContextValue } from './Grid.context';\nimport { GridCol, type GridColProps } from './GridCol/GridCol';\nimport { GridVariables } from './GridVariables';\nimport classes from './Grid.module.css';\nexport type GridStylesNames = 'root' \| 'col' \| 'inner' \| 'container';\nexport type GridCssVariables = {\n root: '--grid-justify' \| '--grid-align' \| '--grid-overflow';\n};\n\nexport interface GridProps extends BoxProps, StylesApiProps<GridFactory>, ElementProps<'div'> {\n /** Gap between columns and rows, key of `theme.spacing` or any valid CSS value @default 'md' /\n gap?: StyleProp<MantineSpacing>;\n\n /* Row gap, overrides `gap` for vertical spacing /\n rowGap?: StyleProp<MantineSpacing>;\n\n /* Column gap, overrides `gap` for horizontal spacing /\n columnGap?: StyleProp<MantineSpacing>;\n\n /* If set, columns in the last row expand to fill all available space @default false /\n grow?: boolean;\n\n /* Sets `justify-content` @default flex-start /\n justify?: React.CSSProperties['justifyContent'];\n\n /* Sets `align-items` @default stretch /\n align?: React.CSSProperties['alignItems'];\n\n /* Number of columns in each row @default 12 /\n columns?: number;\n\n /* Sets `overflow` CSS property on the root element @default 'visible' /\n overflow?: React.CSSProperties['overflow'];\n\n /* Type of queries used for responsive styles @default 'media' /\n type?: 'media' \| 'container';\n\n /* Breakpoints values, only used with `type=\"container\"` */\n breakpoints?: GridBreakpoints;\n}\n\nexport type GridFactory = Factory<{\n props: GridProps;\n ref: HTMLDivElement;\n stylesNames: GridStylesNames;\n vars: GridCssVariables;\n staticComponents: {\n Col: typeof GridCol;\n };\n}>;\n\nconst defaultProps = {\n gap: 'md',\n columns: 12,\n} satisfies Partial<GridProps>;\n\nconst varsResolver = createVarsResolver<GridFactory>((_, { justify, align, overflow }) => ({\n root: {\n '--grid-justify': justify,\n '--grid-align': align,\n '--grid-overflow': overflow,\n },\n}));\n\nexport const Grid = factory<GridFactory>((_props) => {\n const props = useProps('Grid', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n grow,\n gap,\n rowGap,\n columnGap,\n columns,\n align,\n justify,\n children,\n breakpoints,\n type,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<GridFactory>({\n name: 'Grid',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const responsiveClassName = useRandomClassName();\n\n if (type === 'container' && breakpoints) {\n return (\n <GridProvider value={{ getStyles, grow, columns, breakpoints, type }}>\n <GridVariables selector={`.${responsiveClassName}`} {...props} />\n <div {...getStyles('container')}>\n <Box {...getStyles('root', { className: responsiveClassName })} {...others}>\n <div {...getStyles('inner')}>{children}</div>\n </Box>\n </div>\n </GridProvider>\n );\n }\n\n return (\n <GridProvider value={{ getStyles, grow, columns, breakpoints, type }}>\n <GridVariables selector={`.${responsiveClassName}`} {...props} />\n <Box {...getStyles('root', { className: responsiveClassName })} {...others}>\n <div {...getStyles('inner')}>{children}</div>\n </Box>\n </GridProvider>\n );\n});\n\nGrid.classes = classes;\nGrid.varsResolver = varsResolver;\nGrid.displayName = '@mantine/core/Grid';\nGrid.Col = GridCol;\n\nexport namespace Grid {\n export type Props = GridProps;\n export type Factory = GridFactory;\n export type StylesNames = GridStylesNames;\n export type CssVariables = GridCssVariables;\n export type ColProps = GridColProps;\n export type ContextValue = GridContextValue;\n\n export namespace Col {\n export type Props = GridColProps;\n }\n}\n"],"mappings":";;;;;;;;;;;;;AAiEA,MAAM,eAAe;CACnB,KAAK;CACL,SAAS;CACV;AAED,MAAM,eAAe,oBAAiC,GAAG,EAAE,SAAS,OAAO,gBAAgB,EACzF,MAAM;CACJ,kBAAkB;CAClB,gBAAgB;CAChB,mBAAmB;CACpB,EACF,EAAE;AAEH,MAAa,OAAO,SAAsB,WAAW;CACnD,MAAM,QAAQ,SAAS,QAAQ,cAAc,OAAO;CACpD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,MACA,KACA,QACA,WACA,SACA,OACA,SACA,UACA,aACA,MACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAAuB;EACvC,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,sBAAsB,oBAAoB;AAEhD,KAAI,SAAS,eAAe,YAC1B,QACE,qBAAC,cAAD;EAAc,OAAO;GAAE;GAAW;GAAM;GAAS;GAAa;GAAM;YAApE,CACE,oBAAC,eAAD;GAAe,UAAU,IAAI;GAAuB,GAAI;GAAS,CAAA,EACjE,oBAAC,OAAD;GAAK,GAAI,UAAU,YAAY;aAC7B,oBAAC,KAAD;IAAK,GAAI,UAAU,QAAQ,EAAE,WAAW,qBAAqB,CAAC;IAAE,GAAI;cAClE,oBAAC,OAAD;KAAK,GAAI,UAAU,QAAQ;KAAG;KAAe,CAAA;IACzC,CAAA;GACF,CAAA,CACO;;AAInB,QACE,qBAAC,cAAD;EAAc,OAAO;GAAE;GAAW;GAAM;GAAS;GAAa;GAAM;YAApE,CACE,oBAAC,eAAD;GAAe,UAAU,IAAI;GAAuB,GAAI;GAAS,CAAA,EACjE,oBAAC,KAAD;GAAK,GAAI,UAAU,QAAQ,EAAE,WAAW,qBAAqB,CAAC;GAAE,GAAI;aAClE,oBAAC,OAAD;IAAK,GAAI,UAAU,QAAQ;IAAG;IAAe,CAAA;GACzC,CAAA,CACO;;EAEjB;AAEF,KAAK,UAAUA;AACf,KAAK,eAAe;AACpB,KAAK,cAAc;AACnB,KAAK,MAAM"}

package/esm/components/Group/Group.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Group.mjs","names":["classes"],"sources":["../../../src/components/Group/Group.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSpacing,\n MantineSpacing,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { filterFalsyChildren } from './filter-falsy-children/filter-falsy-children';\nimport classes from './Group.module.css';\n\nexport type GroupStylesNames = 'root';\nexport type GroupCssVariables = {\n root:\n \| '--group-gap'\n \| '--group-align'\n \| '--group-justify'\n \| '--group-wrap'\n \| '--group-child-width';\n};\n\nexport interface GroupStylesCtx {\n childWidth: string;\n}\n\nexport interface GroupProps extends BoxProps, StylesApiProps<GroupFactory>, ElementProps<'div'> {\n __size?: any;\n\n /** Controls `justify-content` CSS property @default 'flex-start' /\n justify?: React.CSSProperties['justifyContent'];\n\n /* Controls `align-items` CSS property @default 'center' /\n align?: React.CSSProperties['alignItems'];\n\n /* Controls `flex-wrap` CSS property @default 'wrap' /\n wrap?: React.CSSProperties['flexWrap'];\n\n /* Key of `theme.spacing` or any valid CSS value for `gap`, numbers are converted to rem @default 'md' /\n gap?: MantineSpacing;\n\n /* Determines whether each child element should have `flex-grow: 1` style @default false /\n grow?: boolean;\n\n /* Determines whether children should take only dedicated amount of space (`max-width` style is set based on the number of children) @default true */\n preventGrowOverflow?: boolean;\n}\n\nexport type GroupFactory = Factory<{\n props: GroupProps;\n ref: HTMLDivElement;\n stylesNames: GroupStylesNames;\n vars: GroupCssVariables;\n ctx: GroupStylesCtx;\n}>;\n\nconst defaultProps = {\n preventGrowOverflow: true,\n gap: 'md',\n align: 'center',\n justify: 'flex-start',\n wrap: 'wrap',\n} satisfies Partial<GroupProps>;\n\nconst varsResolver = createVarsResolver<GroupFactory>(\n (_, { grow, preventGrowOverflow, gap, align, justify, wrap }, { childWidth }) => ({\n root: {\n '--group-child-width': grow && preventGrowOverflow ? childWidth : undefined,\n '--group-gap': getSpacing(gap),\n '--group-align': align,\n '--group-justify': justify,\n '--group-wrap': wrap,\n },\n })\n);\n\nexport const Group = factory<GroupFactory>((_props) => {\n const props = useProps('Group', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n children,\n gap,\n align,\n justify,\n wrap,\n grow,\n preventGrowOverflow,\n vars,\n variant,\n __size,\n mod,\n attributes,\n ...others\n } = props;\n\n const filteredChildren = filterFalsyChildren(children);\n const childrenCount = filteredChildren.length;\n const resolvedGap = getSpacing(gap ?? 'md');\n const childWidth = `calc(${\n 100 / childrenCount\n }% - (${resolvedGap} - ${resolvedGap} / ${childrenCount}))`;\n\n const stylesCtx: GroupStylesCtx = { childWidth };\n\n const getStyles = useStyles<GroupFactory>({\n name: 'Group',\n props,\n stylesCtx,\n className,\n style,\n classes,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return (\n <Box {...getStyles('root')} variant={variant} mod={[{ grow }, mod]} size={__size} {...others}>\n {filteredChildren}\n </Box>\n );\n});\n\nGroup.classes = classes;\nGroup.varsResolver = varsResolver;\nGroup.displayName = '@mantine/core/Group';\n"],"mappings":";;;;;;;;;;;AA4DA,MAAM,eAAe;CACnB,qBAAqB;CACrB,KAAK;CACL,OAAO;CACP,SAAS;CACT,MAAM;CACP;AAED,MAAM,eAAe,oBAClB,GAAG,EAAE,MAAM,qBAAqB,KAAK,OAAO,SAAS,QAAQ,EAAE,kBAAkB,EAChF,MAAM;CACJ,uBAAuB,QAAQ,sBAAsB,aAAa,KAAA;CAClE,eAAe,WAAW,IAAI;CAC9B,iBAAiB;CACjB,mBAAmB;CACnB,gBAAgB;CACjB,EACF,EACF;AAED,MAAa,QAAQ,SAAuB,WAAW;CACrD,MAAM,QAAQ,SAAS,SAAS,cAAc,OAAO;CACrD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,UACA,KACA,OACA,SACA,MACA,MACA,qBACA,MACA,SACA,QACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,mBAAmB,oBAAoB,SAAS;CACtD,MAAM,gBAAgB,iBAAiB;CACvC,MAAM,cAAc,WAAW,OAAO,KAAK;AAsB3C,QACE,oBAAC,KAAD;EAAK,GAhBW,UAAwB;GACxC,MAAM;GACN;GACA,WALgC,EAAE,YAJjB,QACjB,MAAM,cACP,OAAO,YAAY,KAAK,YAAY,KAAK,cAAc,KAER;GAM9C;GACA;GACA,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CAAC,CAGmB,OAAO;EAAW;EAAS,KAAK,CAAC,EAAE,MAAM,EAAE,IAAI;EAAE,MAAM;EAAQ,GAAI;YACnF;EACG,CAAA;EAER;AAEF,MAAM,UAAUA;AAChB,MAAM,eAAe;AACrB,MAAM,cAAc"}
1	+ {"version":3,"file":"Group.mjs","names":["classes"],"sources":["../../../src/components/Group/Group.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSpacing,\n MantineSpacing,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { filterFalsyChildren } from './filter-falsy-children/filter-falsy-children';\nimport classes from './Group.module.css';\n\nexport type GroupStylesNames = 'root';\nexport type GroupCssVariables = {\n root:\n \| '--group-gap'\n \| '--group-align'\n \| '--group-justify'\n \| '--group-wrap'\n \| '--group-child-width';\n};\n\nexport interface GroupStylesCtx {\n childWidth: string;\n}\n\nexport interface GroupProps extends BoxProps, StylesApiProps<GroupFactory>, ElementProps<'div'> {\n __size?: any;\n\n /** Controls `justify-content` CSS property @default 'flex-start' /\n justify?: React.CSSProperties['justifyContent'];\n\n /* Controls `align-items` CSS property @default 'center' /\n align?: React.CSSProperties['alignItems'];\n\n /* Controls `flex-wrap` CSS property @default 'wrap' /\n wrap?: React.CSSProperties['flexWrap'];\n\n /* Key of `theme.spacing` or any valid CSS value for `gap`, numbers are converted to rem @default 'md' /\n gap?: MantineSpacing;\n\n /* Determines whether each child element should have `flex-grow: 1` style @default false /\n grow?: boolean;\n\n /* Determines whether children should take only dedicated amount of space (`max-width` style is set based on the number of children) @default true */\n preventGrowOverflow?: boolean;\n}\n\nexport type GroupFactory = Factory<{\n props: GroupProps;\n ref: HTMLDivElement;\n stylesNames: GroupStylesNames;\n vars: GroupCssVariables;\n ctx: GroupStylesCtx;\n}>;\n\nconst defaultProps = {\n preventGrowOverflow: true,\n gap: 'md',\n align: 'center',\n justify: 'flex-start',\n wrap: 'wrap',\n} satisfies Partial<GroupProps>;\n\nconst varsResolver = createVarsResolver<GroupFactory>(\n (_, { grow, preventGrowOverflow, gap, align, justify, wrap }, { childWidth }) => ({\n root: {\n '--group-child-width': grow && preventGrowOverflow ? childWidth : undefined,\n '--group-gap': getSpacing(gap),\n '--group-align': align,\n '--group-justify': justify,\n '--group-wrap': wrap,\n },\n })\n);\n\nexport const Group = factory<GroupFactory>((_props) => {\n const props = useProps('Group', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n children,\n gap,\n align,\n justify,\n wrap,\n grow,\n preventGrowOverflow,\n vars,\n variant,\n __size,\n mod,\n attributes,\n ...others\n } = props;\n\n const filteredChildren = filterFalsyChildren(children);\n const childrenCount = filteredChildren.length;\n const resolvedGap = getSpacing(gap ?? 'md');\n const childWidth = `calc(${\n 100 / childrenCount\n }% - (${resolvedGap} - ${resolvedGap} / ${childrenCount}))`;\n\n const stylesCtx: GroupStylesCtx = { childWidth };\n\n const getStyles = useStyles<GroupFactory>({\n name: 'Group',\n props,\n stylesCtx,\n className,\n style,\n classes,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return (\n <Box {...getStyles('root')} variant={variant} mod={[{ grow }, mod]} size={__size} {...others}>\n {filteredChildren}\n </Box>\n );\n});\n\nGroup.classes = classes;\nGroup.varsResolver = varsResolver;\nGroup.displayName = '@mantine/core/Group';\n\nexport namespace Group {\n export type Props = GroupProps;\n export type StylesNames = GroupStylesNames;\n export type CssVariables = GroupCssVariables;\n export type StylesCtx = GroupStylesCtx;\n export type Factory = GroupFactory;\n}\n"],"mappings":";;;;;;;;;;;AA4DA,MAAM,eAAe;CACnB,qBAAqB;CACrB,KAAK;CACL,OAAO;CACP,SAAS;CACT,MAAM;CACP;AAED,MAAM,eAAe,oBAClB,GAAG,EAAE,MAAM,qBAAqB,KAAK,OAAO,SAAS,QAAQ,EAAE,kBAAkB,EAChF,MAAM;CACJ,uBAAuB,QAAQ,sBAAsB,aAAa,KAAA;CAClE,eAAe,WAAW,IAAI;CAC9B,iBAAiB;CACjB,mBAAmB;CACnB,gBAAgB;CACjB,EACF,EACF;AAED,MAAa,QAAQ,SAAuB,WAAW;CACrD,MAAM,QAAQ,SAAS,SAAS,cAAc,OAAO;CACrD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,UACA,KACA,OACA,SACA,MACA,MACA,qBACA,MACA,SACA,QACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,mBAAmB,oBAAoB,SAAS;CACtD,MAAM,gBAAgB,iBAAiB;CACvC,MAAM,cAAc,WAAW,OAAO,KAAK;AAsB3C,QACE,oBAAC,KAAD;EAAK,GAhBW,UAAwB;GACxC,MAAM;GACN;GACA,WALgC,EAAE,YAJjB,QACjB,MAAM,cACP,OAAO,YAAY,KAAK,YAAY,KAAK,cAAc,KAER;GAM9C;GACA;GACA,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CAAC,CAGmB,OAAO;EAAW;EAAS,KAAK,CAAC,EAAE,MAAM,EAAE,IAAI;EAAE,MAAM;EAAQ,GAAI;YACnF;EACG,CAAA;EAER;AAEF,MAAM,UAAUA;AAChB,MAAM,eAAe;AACrB,MAAM,cAAc"}

package/esm/components/Highlight/Highlight.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Highlight.mjs","names":[],"sources":["../../../src/components/Highlight/Highlight.tsx"],"sourcesContent":["import {\n MantineColor,\n MantineTheme,\n polymorphicFactory,\n PolymorphicFactory,\n useProps,\n} from '../../core';\nimport { Mark } from '../Mark';\nimport { Text, TextProps, TextStylesNames, TextVariant } from '../Text';\nimport { highlighter } from './highlighter/highlighter';\n\nexport interface HighlightTerm {\n /** Text to highlight /\n text: string;\n\n /* Background color for this specific term. Key of `theme.colors` or any valid CSS color /\n color?: MantineColor \| string;\n}\n\nexport interface HighlightProps extends Omit<TextProps, 'color'> {\n /\n Substring(s) to highlight in `children`. Can be:\n * - string: single term\n * - string[]: multiple terms with same color\n * - HighlightTerm[]: multiple terms with custom colors per term\n \n - Matching is case-insensitive\n * - Regex special characters are automatically escaped\n * - When multiple substrings are provided, longer matches take precedence\n * - Empty strings and whitespace-only strings are ignored\n /\n highlight: string \| string[] \| HighlightTerm[];\n\n /\n Default background color for all highlighted text.\n * Key of `theme.colors` or any valid CSS color, passed to `Mark` component.\n * Can be overridden per term when using HighlightTerm objects.\n * @default 'yellow'\n /\n color?: MantineColor \| string;\n\n /* Styles applied to `mark` elements /\n highlightStyles?: React.CSSProperties \| ((theme: MantineTheme) => React.CSSProperties);\n\n /* String in which to highlight substrings /\n children: string;\n\n /\n Only match whole words (adds word boundaries to regex).\n * When enabled, 'the' will not match 'there'.\n * @default false\n */\n wholeWord?: boolean;\n}\n\nexport type HighlightFactory = PolymorphicFactory<{\n props: HighlightProps;\n defaultRef: HTMLDivElement;\n defaultComponent: 'div';\n stylesNames: TextStylesNames;\n variant: TextVariant;\n}>;\n\nconst defaultProps = {\n color: 'yellow',\n wholeWord: false,\n} satisfies Partial<HighlightProps>;\n\nexport const Highlight = polymorphicFactory<HighlightFactory>((_props) => {\n const { unstyled, children, highlight, highlightStyles, color, wholeWord, ...others } = useProps(\n 'Highlight',\n defaultProps,\n _props\n );\n\n const isTermArray = Array.isArray(highlight) && typeof highlight[0] === 'object';\n const colorMap = new Map<string, string>();\n\n let highlightStrings: string[];\n if (isTermArray) {\n highlightStrings = (highlight as HighlightTerm[]).map((term) => {\n if (term.color) {\n colorMap.set(term.text.toLowerCase(), term.color);\n }\n return term.text;\n });\n } else if (Array.isArray(highlight)) {\n highlightStrings = highlight as string[];\n } else {\n highlightStrings = [highlight as string];\n }\n\n const highlightChunks = highlighter(children, highlightStrings, { wholeWord });\n\n return (\n <Text unstyled={unstyled} {...others} __staticSelector=\"Highlight\">\n {highlightChunks.map(({ chunk, highlighted }, i) =>\n highlighted ? (\n <Mark\n unstyled={unstyled}\n key={i}\n color={colorMap.get(chunk.toLowerCase()) \|\| color}\n style={highlightStyles}\n data-highlight={chunk}\n >\n {chunk}\n </Mark>\n ) : (\n <span key={i}>{chunk}</span>\n )\n )}\n </Text>\n );\n});\n\nHighlight.classes = Text.classes;\nHighlight.displayName = '@mantine/core/Highlight';\n"],"mappings":";;;;;;;;AA+DA,MAAM,eAAe;CACnB,OAAO;CACP,WAAW;CACZ;AAED,MAAa,YAAY,oBAAsC,WAAW;CACxE,MAAM,EAAE,UAAU,UAAU,WAAW,iBAAiB,OAAO,WAAW,GAAG,WAAW,SACtF,aACA,cACA,OACD;CAED,MAAM,cAAc,MAAM,QAAQ,UAAU,IAAI,OAAO,UAAU,OAAO;CACxE,MAAM,2BAAW,IAAI,KAAqB;CAE1C,IAAI;AACJ,KAAI,YACF,oBAAoB,UAA8B,KAAK,SAAS;AAC9D,MAAI,KAAK,MACP,UAAS,IAAI,KAAK,KAAK,aAAa,EAAE,KAAK,MAAM;AAEnD,SAAO,KAAK;GACZ;UACO,MAAM,QAAQ,UAAU,CACjC,oBAAmB;KAEnB,oBAAmB,CAAC,UAAoB;CAG1C,MAAM,kBAAkB,YAAY,UAAU,kBAAkB,EAAE,WAAW,CAAC;AAE9E,QACE,oBAAC,MAAD;EAAgB;EAAU,GAAI;EAAQ,kBAAiB;YACpD,gBAAgB,KAAK,EAAE,OAAO,eAAe,MAC5C,cACE,oBAAC,MAAD;GACY;GAEV,OAAO,SAAS,IAAI,MAAM,aAAa,CAAC,IAAI;GAC5C,OAAO;GACP,kBAAgB;aAEf;GACI,EANA,EAMA,GAEP,oBAAC,QAAD,EAAA,UAAe,OAAa,EAAjB,EAAiB,CAE/B;EACI,CAAA;EAET;AAEF,UAAU,UAAU,KAAK;AACzB,UAAU,cAAc"}
1	+ {"version":3,"file":"Highlight.mjs","names":[],"sources":["../../../src/components/Highlight/Highlight.tsx"],"sourcesContent":["import {\n MantineColor,\n MantineTheme,\n polymorphicFactory,\n PolymorphicFactory,\n useProps,\n} from '../../core';\nimport { Mark } from '../Mark';\nimport { Text, TextProps, TextStylesNames, TextVariant } from '../Text';\nimport { highlighter } from './highlighter/highlighter';\n\nexport interface HighlightTerm {\n /** Text to highlight /\n text: string;\n\n /* Background color for this specific term. Key of `theme.colors` or any valid CSS color /\n color?: MantineColor \| string;\n}\n\nexport interface HighlightProps extends Omit<TextProps, 'color'> {\n /\n Substring(s) to highlight in `children`. Can be:\n * - string: single term\n * - string[]: multiple terms with same color\n * - HighlightTerm[]: multiple terms with custom colors per term\n \n - Matching is case-insensitive\n * - Regex special characters are automatically escaped\n * - When multiple substrings are provided, longer matches take precedence\n * - Empty strings and whitespace-only strings are ignored\n /\n highlight: string \| string[] \| HighlightTerm[];\n\n /\n Default background color for all highlighted text.\n * Key of `theme.colors` or any valid CSS color, passed to `Mark` component.\n * Can be overridden per term when using HighlightTerm objects.\n * @default 'yellow'\n /\n color?: MantineColor \| string;\n\n /* Styles applied to `mark` elements /\n highlightStyles?: React.CSSProperties \| ((theme: MantineTheme) => React.CSSProperties);\n\n /* String in which to highlight substrings /\n children: string;\n\n /\n Only match whole words (adds word boundaries to regex).\n * When enabled, 'the' will not match 'there'.\n * @default false\n */\n wholeWord?: boolean;\n}\n\nexport type HighlightFactory = PolymorphicFactory<{\n props: HighlightProps;\n defaultRef: HTMLDivElement;\n defaultComponent: 'div';\n stylesNames: TextStylesNames;\n variant: TextVariant;\n}>;\n\nconst defaultProps = {\n color: 'yellow',\n wholeWord: false,\n} satisfies Partial<HighlightProps>;\n\nexport const Highlight = polymorphicFactory<HighlightFactory>((_props) => {\n const { unstyled, children, highlight, highlightStyles, color, wholeWord, ...others } = useProps(\n 'Highlight',\n defaultProps,\n _props\n );\n\n const isTermArray = Array.isArray(highlight) && typeof highlight[0] === 'object';\n const colorMap = new Map<string, string>();\n\n let highlightStrings: string[];\n if (isTermArray) {\n highlightStrings = (highlight as HighlightTerm[]).map((term) => {\n if (term.color) {\n colorMap.set(term.text.toLowerCase(), term.color);\n }\n return term.text;\n });\n } else if (Array.isArray(highlight)) {\n highlightStrings = highlight as string[];\n } else {\n highlightStrings = [highlight as string];\n }\n\n const highlightChunks = highlighter(children, highlightStrings, { wholeWord });\n\n return (\n <Text unstyled={unstyled} {...others} __staticSelector=\"Highlight\">\n {highlightChunks.map(({ chunk, highlighted }, i) =>\n highlighted ? (\n <Mark\n unstyled={unstyled}\n key={i}\n color={colorMap.get(chunk.toLowerCase()) \|\| color}\n style={highlightStyles}\n data-highlight={chunk}\n >\n {chunk}\n </Mark>\n ) : (\n <span key={i}>{chunk}</span>\n )\n )}\n </Text>\n );\n});\n\nHighlight.classes = Text.classes;\nHighlight.displayName = '@mantine/core/Highlight';\n\nexport namespace Highlight {\n export type Props = HighlightProps;\n export type Factory = HighlightFactory;\n export type Term = HighlightTerm;\n}\n"],"mappings":";;;;;;;;AA+DA,MAAM,eAAe;CACnB,OAAO;CACP,WAAW;CACZ;AAED,MAAa,YAAY,oBAAsC,WAAW;CACxE,MAAM,EAAE,UAAU,UAAU,WAAW,iBAAiB,OAAO,WAAW,GAAG,WAAW,SACtF,aACA,cACA,OACD;CAED,MAAM,cAAc,MAAM,QAAQ,UAAU,IAAI,OAAO,UAAU,OAAO;CACxE,MAAM,2BAAW,IAAI,KAAqB;CAE1C,IAAI;AACJ,KAAI,YACF,oBAAoB,UAA8B,KAAK,SAAS;AAC9D,MAAI,KAAK,MACP,UAAS,IAAI,KAAK,KAAK,aAAa,EAAE,KAAK,MAAM;AAEnD,SAAO,KAAK;GACZ;UACO,MAAM,QAAQ,UAAU,CACjC,oBAAmB;KAEnB,oBAAmB,CAAC,UAAoB;CAG1C,MAAM,kBAAkB,YAAY,UAAU,kBAAkB,EAAE,WAAW,CAAC;AAE9E,QACE,oBAAC,MAAD;EAAgB;EAAU,GAAI;EAAQ,kBAAiB;YACpD,gBAAgB,KAAK,EAAE,OAAO,eAAe,MAC5C,cACE,oBAAC,MAAD;GACY;GAEV,OAAO,SAAS,IAAI,MAAM,aAAa,CAAC,IAAI;GAC5C,OAAO;GACP,kBAAgB;aAEf;GACI,EANA,EAMA,GAEP,oBAAC,QAAD,EAAA,UAAe,OAAa,EAAjB,EAAiB,CAE/B;EACI,CAAA;EAET;AAEF,UAAU,UAAU,KAAK;AACzB,UAAU,cAAc"}

package/esm/components/Image/Image.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Image.mjs","names":["classes"],"sources":["../../../src/components/Image/Image.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n getRadius,\n MantineRadius,\n polymorphicFactory,\n PolymorphicFactory,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Image.module.css';\n\nexport type ImageStylesNames = 'root';\nexport type ImageCssVariables = {\n root: '--image-radius' \| '--image-object-fit';\n};\n\nexport interface ImageProps extends BoxProps, StylesApiProps<ImageFactory> {\n /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default 0 /\n radius?: MantineRadius;\n\n /* Controls `object-fit` style @default 'cover' /\n fit?: React.CSSProperties['objectFit'];\n\n /* Image url used as a fallback if the image cannot be loaded /\n fallbackSrc?: string;\n\n /* Image url /\n src?: any;\n\n /* Called when image fails to load */\n onError?: (event: React.SyntheticEvent<HTMLImageElement, Event>) => void;\n}\n\nexport type ImageFactory = PolymorphicFactory<{\n props: ImageProps;\n defaultRef: HTMLImageElement;\n defaultComponent: 'img';\n stylesNames: ImageStylesNames;\n vars: ImageCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<ImageFactory>((_, { radius, fit }) => ({\n root: {\n '--image-radius': radius === undefined ? undefined : getRadius(radius),\n '--image-object-fit': fit,\n },\n}));\n\nexport const Image = polymorphicFactory<ImageFactory>((_props) => {\n const props = useProps('Image', null, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n onError,\n src,\n radius,\n fit,\n fallbackSrc,\n mod,\n attributes,\n ...others\n } = props;\n\n const [error, setError] = useState(!src);\n\n useEffect(() => setError(!src), [src]);\n\n const getStyles = useStyles<ImageFactory>({\n name: 'Image',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n if (error && fallbackSrc) {\n return (\n <Box\n component=\"img\"\n src={fallbackSrc}\n {...getStyles('root')}\n onError={onError}\n mod={['fallback', mod]}\n {...others}\n />\n );\n }\n\n return (\n <Box\n component=\"img\"\n {...getStyles('root')}\n src={src}\n onError={(event) => {\n onError?.(event);\n setError(true);\n }}\n mod={mod}\n {...others}\n />\n );\n});\n\nImage.classes = classes;\nImage.varsResolver = varsResolver;\nImage.displayName = '@mantine/core/Image';\n"],"mappings":";;;;;;;;;;;AA6CA,MAAM,eAAe,oBAAkC,GAAG,EAAE,QAAQ,WAAW,EAC7E,MAAM;CACJ,kBAAkB,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,OAAO;CACtE,sBAAsB;CACvB,EACF,EAAE;AAEH,MAAa,QAAQ,oBAAkC,WAAW;CAChE,MAAM,QAAQ,SAAS,SAAS,MAAM,OAAO;CAC7C,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,SACA,KACA,QACA,KACA,aACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,CAAC,OAAO,YAAY,SAAS,CAAC,IAAI;AAExC,iBAAgB,SAAS,CAAC,IAAI,EAAE,CAAC,IAAI,CAAC;CAEtC,MAAM,YAAY,UAAwB;EACxC,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,KAAI,SAAS,YACX,QACE,oBAAC,KAAD;EACE,WAAU;EACV,KAAK;EACL,GAAI,UAAU,OAAO;EACZ;EACT,KAAK,CAAC,YAAY,IAAI;EACtB,GAAI;EACJ,CAAA;AAIN,QACE,oBAAC,KAAD;EACE,WAAU;EACV,GAAI,UAAU,OAAO;EAChB;EACL,UAAU,UAAU;AAClB,aAAU,MAAM;AAChB,YAAS,KAAK;;EAEX;EACL,GAAI;EACJ,CAAA;EAEJ;AAEF,MAAM,UAAUA;AAChB,MAAM,eAAe;AACrB,MAAM,cAAc"}
1	+ {"version":3,"file":"Image.mjs","names":["classes"],"sources":["../../../src/components/Image/Image.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n getRadius,\n MantineRadius,\n polymorphicFactory,\n PolymorphicFactory,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Image.module.css';\n\nexport type ImageStylesNames = 'root';\nexport type ImageCssVariables = {\n root: '--image-radius' \| '--image-object-fit';\n};\n\nexport interface ImageProps extends BoxProps, StylesApiProps<ImageFactory> {\n /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default 0 /\n radius?: MantineRadius;\n\n /* Controls `object-fit` style @default 'cover' /\n fit?: React.CSSProperties['objectFit'];\n\n /* Image url used as a fallback if the image cannot be loaded /\n fallbackSrc?: string;\n\n /* Image url /\n src?: any;\n\n /* Called when image fails to load */\n onError?: (event: React.SyntheticEvent<HTMLImageElement, Event>) => void;\n}\n\nexport type ImageFactory = PolymorphicFactory<{\n props: ImageProps;\n defaultRef: HTMLImageElement;\n defaultComponent: 'img';\n stylesNames: ImageStylesNames;\n vars: ImageCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<ImageFactory>((_, { radius, fit }) => ({\n root: {\n '--image-radius': radius === undefined ? undefined : getRadius(radius),\n '--image-object-fit': fit,\n },\n}));\n\nexport const Image = polymorphicFactory<ImageFactory>((_props) => {\n const props = useProps('Image', null, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n onError,\n src,\n radius,\n fit,\n fallbackSrc,\n mod,\n attributes,\n ...others\n } = props;\n\n const [error, setError] = useState(!src);\n\n useEffect(() => setError(!src), [src]);\n\n const getStyles = useStyles<ImageFactory>({\n name: 'Image',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n if (error && fallbackSrc) {\n return (\n <Box\n component=\"img\"\n src={fallbackSrc}\n {...getStyles('root')}\n onError={onError}\n mod={['fallback', mod]}\n {...others}\n />\n );\n }\n\n return (\n <Box\n component=\"img\"\n {...getStyles('root')}\n src={src}\n onError={(event) => {\n onError?.(event);\n setError(true);\n }}\n mod={mod}\n {...others}\n />\n );\n});\n\nImage.classes = classes;\nImage.varsResolver = varsResolver;\nImage.displayName = '@mantine/core/Image';\n\nexport namespace Image {\n export type Props = ImageProps;\n export type StylesNames = ImageStylesNames;\n export type CssVariables = ImageCssVariables;\n export type Factory = ImageFactory;\n}\n"],"mappings":";;;;;;;;;;;AA6CA,MAAM,eAAe,oBAAkC,GAAG,EAAE,QAAQ,WAAW,EAC7E,MAAM;CACJ,kBAAkB,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,OAAO;CACtE,sBAAsB;CACvB,EACF,EAAE;AAEH,MAAa,QAAQ,oBAAkC,WAAW;CAChE,MAAM,QAAQ,SAAS,SAAS,MAAM,OAAO;CAC7C,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,SACA,KACA,QACA,KACA,aACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,CAAC,OAAO,YAAY,SAAS,CAAC,IAAI;AAExC,iBAAgB,SAAS,CAAC,IAAI,EAAE,CAAC,IAAI,CAAC;CAEtC,MAAM,YAAY,UAAwB;EACxC,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,KAAI,SAAS,YACX,QACE,oBAAC,KAAD;EACE,WAAU;EACV,KAAK;EACL,GAAI,UAAU,OAAO;EACZ;EACT,KAAK,CAAC,YAAY,IAAI;EACtB,GAAI;EACJ,CAAA;AAIN,QACE,oBAAC,KAAD;EACE,WAAU;EACV,GAAI,UAAU,OAAO;EAChB;EACL,UAAU,UAAU;AAClB,aAAU,MAAM;AAChB,YAAS,KAAK;;EAEX;EACL,GAAI;EACJ,CAAA;EAEJ;AAEF,MAAM,UAAUA;AAChB,MAAM,eAAe;AACrB,MAAM,cAAc"}

package/esm/components/Indicator/Indicator.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Indicator.mjs","names":["classes"],"sources":["../../../src/components/Indicator/Indicator.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getAutoContrastValue,\n getContrastColor,\n getRadius,\n getThemeColor,\n MantineColor,\n MantineRadius,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { getPositionVariables } from './get-position-variables/get-position-variables';\nimport { IndicatorPosition } from './Indicator.types';\nimport classes from './Indicator.module.css';\n\nexport type IndicatorPositionVariables =\n \| '--indicator-top'\n \| '--indicator-bottom'\n \| '--indicator-left'\n \| '--indicator-right'\n \| '--indicator-translate-x'\n \| '--indicator-translate-y';\n\nexport type IndicatorStylesNames = 'root' \| 'indicator';\nexport type IndicatorCssVariables = {\n root:\n \| '--indicator-color'\n \| '--indicator-text-color'\n \| '--indicator-size'\n \| '--indicator-radius'\n \| '--indicator-z-index'\n \| IndicatorPositionVariables;\n};\n\nexport interface IndicatorProps\n extends BoxProps, StylesApiProps<IndicatorFactory>, ElementProps<'div'> {\n /** Indicator position relative to the target element @default 'top-end' /\n position?: IndicatorPosition;\n\n /* Distance in pixels to offset the indicator from its default position, useful for elements with border-radius. Can be a number for uniform offset or an object with `x` and `y` properties for separate horizontal and vertical offsets @default 0 /\n offset?: number \| { x: number; y: number };\n\n /* Changes container display from block to inline-block, use when wrapping elements with fixed width @default false /\n inline?: boolean;\n\n /* Indicator width and height @default 10 /\n size?: number \| string;\n\n /* Label displayed inside the indicator, for example, notification count /\n label?: React.ReactNode;\n\n /* Key of `theme.radius` or any valid CSS value to set `border-radius` @default 100 /\n radius?: MantineRadius;\n\n /* Key of `theme.colors` or any valid CSS color value @default theme.primaryColor /\n color?: MantineColor;\n\n /* Adds border to the root element /\n withBorder?: boolean;\n\n /* Hides the indicator when set /\n disabled?: boolean;\n\n /* If set, the indicator has processing animation @default false /\n processing?: boolean;\n\n /* Indicator z-index @default 200 /\n zIndex?: string \| number;\n\n /* If set, adjusts text color based on background color /\n autoContrast?: boolean;\n\n /* Maximum value to display. If label is a number greater than this value, it will be displayed as `{maxValue}+` /\n maxValue?: number;\n\n /* Determines whether indicator with label `0` should be displayed @default true */\n showZero?: boolean;\n}\n\nexport type IndicatorFactory = Factory<{\n props: IndicatorProps;\n ref: HTMLDivElement;\n stylesNames: IndicatorStylesNames;\n vars: IndicatorCssVariables;\n}>;\n\nconst defaultProps = {\n position: 'top-end',\n offset: 0,\n showZero: true,\n} satisfies Partial<IndicatorProps>;\n\nconst varsResolver = createVarsResolver<IndicatorFactory>(\n (theme, { color, position, offset, size, radius, zIndex, autoContrast }) => ({\n root: {\n '--indicator-color': color ? getThemeColor(color, theme) : undefined,\n '--indicator-text-color': getAutoContrastValue(autoContrast, theme)\n ? getContrastColor({ color, theme, autoContrast })\n : undefined,\n '--indicator-size': rem(size),\n '--indicator-radius': radius === undefined ? undefined : getRadius(radius),\n '--indicator-z-index': zIndex?.toString(),\n ...getPositionVariables(position, offset),\n },\n })\n);\n\nexport const Indicator = factory<IndicatorFactory>((_props) => {\n const props = useProps('Indicator', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n position,\n offset,\n inline,\n label,\n radius,\n color,\n withBorder,\n disabled,\n processing,\n zIndex,\n autoContrast,\n maxValue,\n showZero,\n mod,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<IndicatorFactory>({\n name: 'Indicator',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const shouldHideZero = !showZero && (label === 0 \|\| label === '0');\n const formattedLabel =\n maxValue !== undefined && typeof label === 'number' && label > maxValue\n ? `${maxValue}+`\n : label;\n\n return (\n <Box {...getStyles('root')} mod={[{ inline }, mod]} {...others}>\n {!disabled && !shouldHideZero && (\n <Box\n mod={{ 'with-label': !!label, 'with-border': withBorder, processing }}\n {...getStyles('indicator')}\n >\n {formattedLabel}\n </Box>\n )}\n {children}\n </Box>\n );\n});\n\nIndicator.classes = classes;\nIndicator.varsResolver = varsResolver;\nIndicator.displayName = '@mantine/core/Indicator';\n"],"mappings":";;;;;;;;;;;;;;;AA6FA,MAAM,eAAe;CACnB,UAAU;CACV,QAAQ;CACR,UAAU;CACX;AAED,MAAM,eAAe,oBAClB,OAAO,EAAE,OAAO,UAAU,QAAQ,MAAM,QAAQ,QAAQ,oBAAoB,EAC3E,MAAM;CACJ,qBAAqB,QAAQ,cAAc,OAAO,MAAM,GAAG,KAAA;CAC3D,0BAA0B,qBAAqB,cAAc,MAAM,GAC/D,iBAAiB;EAAE;EAAO;EAAO;EAAc,CAAC,GAChD,KAAA;CACJ,oBAAoB,IAAI,KAAK;CAC7B,sBAAsB,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,OAAO;CAC1E,uBAAuB,QAAQ,UAAU;CACzC,GAAG,qBAAqB,UAAU,OAAO;CAC1C,EACF,EACF;AAED,MAAa,YAAY,SAA2B,WAAW;CAC7D,MAAM,QAAQ,SAAS,aAAa,cAAc,OAAO;CACzD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,UACA,QACA,QACA,OACA,QACA,OACA,YACA,UACA,YACA,QACA,cACA,UACA,UACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA4B;EAC5C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,iBAAiB,CAAC,aAAa,UAAU,KAAK,UAAU;CAC9D,MAAM,iBACJ,aAAa,KAAA,KAAa,OAAO,UAAU,YAAY,QAAQ,WAC3D,GAAG,SAAS,KACZ;AAEN,QACE,qBAAC,KAAD;EAAK,GAAI,UAAU,OAAO;EAAE,KAAK,CAAC,EAAE,QAAQ,EAAE,IAAI;EAAE,GAAI;YAAxD,CACG,CAAC,YAAY,CAAC,kBACb,oBAAC,KAAD;GACE,KAAK;IAAE,cAAc,CAAC,CAAC;IAAO,eAAe;IAAY;IAAY;GACrE,GAAI,UAAU,YAAY;aAEzB;GACG,CAAA,EAEP,SACG;;EAER;AAEF,UAAU,UAAUA;AACpB,UAAU,eAAe;AACzB,UAAU,cAAc"}
1	+ {"version":3,"file":"Indicator.mjs","names":["classes"],"sources":["../../../src/components/Indicator/Indicator.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getAutoContrastValue,\n getContrastColor,\n getRadius,\n getThemeColor,\n MantineColor,\n MantineRadius,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { getPositionVariables } from './get-position-variables/get-position-variables';\nimport { IndicatorPosition } from './Indicator.types';\nimport classes from './Indicator.module.css';\n\nexport type IndicatorPositionVariables =\n \| '--indicator-top'\n \| '--indicator-bottom'\n \| '--indicator-left'\n \| '--indicator-right'\n \| '--indicator-translate-x'\n \| '--indicator-translate-y';\n\nexport type IndicatorStylesNames = 'root' \| 'indicator';\nexport type IndicatorCssVariables = {\n root:\n \| '--indicator-color'\n \| '--indicator-text-color'\n \| '--indicator-size'\n \| '--indicator-radius'\n \| '--indicator-z-index'\n \| IndicatorPositionVariables;\n};\n\nexport interface IndicatorProps\n extends BoxProps, StylesApiProps<IndicatorFactory>, ElementProps<'div'> {\n /** Indicator position relative to the target element @default 'top-end' /\n position?: IndicatorPosition;\n\n /* Distance in pixels to offset the indicator from its default position, useful for elements with border-radius. Can be a number for uniform offset or an object with `x` and `y` properties for separate horizontal and vertical offsets @default 0 /\n offset?: number \| { x: number; y: number };\n\n /* Changes container display from block to inline-block, use when wrapping elements with fixed width @default false /\n inline?: boolean;\n\n /* Indicator width and height @default 10 /\n size?: number \| string;\n\n /* Label displayed inside the indicator, for example, notification count /\n label?: React.ReactNode;\n\n /* Key of `theme.radius` or any valid CSS value to set `border-radius` @default 100 /\n radius?: MantineRadius;\n\n /* Key of `theme.colors` or any valid CSS color value @default theme.primaryColor /\n color?: MantineColor;\n\n /* Adds border to the root element /\n withBorder?: boolean;\n\n /* Hides the indicator when set /\n disabled?: boolean;\n\n /* If set, the indicator has processing animation @default false /\n processing?: boolean;\n\n /* Indicator z-index @default 200 /\n zIndex?: string \| number;\n\n /* If set, adjusts text color based on background color /\n autoContrast?: boolean;\n\n /* Maximum value to display. If label is a number greater than this value, it will be displayed as `{maxValue}+` /\n maxValue?: number;\n\n /* Determines whether indicator with label `0` should be displayed @default true */\n showZero?: boolean;\n}\n\nexport type IndicatorFactory = Factory<{\n props: IndicatorProps;\n ref: HTMLDivElement;\n stylesNames: IndicatorStylesNames;\n vars: IndicatorCssVariables;\n}>;\n\nconst defaultProps = {\n position: 'top-end',\n offset: 0,\n showZero: true,\n} satisfies Partial<IndicatorProps>;\n\nconst varsResolver = createVarsResolver<IndicatorFactory>(\n (theme, { color, position, offset, size, radius, zIndex, autoContrast }) => ({\n root: {\n '--indicator-color': color ? getThemeColor(color, theme) : undefined,\n '--indicator-text-color': getAutoContrastValue(autoContrast, theme)\n ? getContrastColor({ color, theme, autoContrast })\n : undefined,\n '--indicator-size': rem(size),\n '--indicator-radius': radius === undefined ? undefined : getRadius(radius),\n '--indicator-z-index': zIndex?.toString(),\n ...getPositionVariables(position, offset),\n },\n })\n);\n\nexport const Indicator = factory<IndicatorFactory>((_props) => {\n const props = useProps('Indicator', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n position,\n offset,\n inline,\n label,\n radius,\n color,\n withBorder,\n disabled,\n processing,\n zIndex,\n autoContrast,\n maxValue,\n showZero,\n mod,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<IndicatorFactory>({\n name: 'Indicator',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const shouldHideZero = !showZero && (label === 0 \|\| label === '0');\n const formattedLabel =\n maxValue !== undefined && typeof label === 'number' && label > maxValue\n ? `${maxValue}+`\n : label;\n\n return (\n <Box {...getStyles('root')} mod={[{ inline }, mod]} {...others}>\n {!disabled && !shouldHideZero && (\n <Box\n mod={{ 'with-label': !!label, 'with-border': withBorder, processing }}\n {...getStyles('indicator')}\n >\n {formattedLabel}\n </Box>\n )}\n {children}\n </Box>\n );\n});\n\nIndicator.classes = classes;\nIndicator.varsResolver = varsResolver;\nIndicator.displayName = '@mantine/core/Indicator';\n\nexport namespace Indicator {\n export type Props = IndicatorProps;\n export type StylesNames = IndicatorStylesNames;\n export type CssVariables = IndicatorCssVariables;\n export type Factory = IndicatorFactory;\n}\n"],"mappings":";;;;;;;;;;;;;;;AA6FA,MAAM,eAAe;CACnB,UAAU;CACV,QAAQ;CACR,UAAU;CACX;AAED,MAAM,eAAe,oBAClB,OAAO,EAAE,OAAO,UAAU,QAAQ,MAAM,QAAQ,QAAQ,oBAAoB,EAC3E,MAAM;CACJ,qBAAqB,QAAQ,cAAc,OAAO,MAAM,GAAG,KAAA;CAC3D,0BAA0B,qBAAqB,cAAc,MAAM,GAC/D,iBAAiB;EAAE;EAAO;EAAO;EAAc,CAAC,GAChD,KAAA;CACJ,oBAAoB,IAAI,KAAK;CAC7B,sBAAsB,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,OAAO;CAC1E,uBAAuB,QAAQ,UAAU;CACzC,GAAG,qBAAqB,UAAU,OAAO;CAC1C,EACF,EACF;AAED,MAAa,YAAY,SAA2B,WAAW;CAC7D,MAAM,QAAQ,SAAS,aAAa,cAAc,OAAO;CACzD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,UACA,QACA,QACA,OACA,QACA,OACA,YACA,UACA,YACA,QACA,cACA,UACA,UACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA4B;EAC5C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,iBAAiB,CAAC,aAAa,UAAU,KAAK,UAAU;CAC9D,MAAM,iBACJ,aAAa,KAAA,KAAa,OAAO,UAAU,YAAY,QAAQ,WAC3D,GAAG,SAAS,KACZ;AAEN,QACE,qBAAC,KAAD;EAAK,GAAI,UAAU,OAAO;EAAE,KAAK,CAAC,EAAE,QAAQ,EAAE,IAAI;EAAE,GAAI;YAAxD,CACG,CAAC,YAAY,CAAC,kBACb,oBAAC,KAAD;GACE,KAAK;IAAE,cAAc,CAAC,CAAC;IAAO,eAAe;IAAY;IAAY;GACrE,GAAI,UAAU,YAAY;aAEzB;GACG,CAAA,EAEP,SACG;;EAER;AAEF,UAAU,UAAUA;AACpB,UAAU,eAAe;AACzB,UAAU,cAAc"}

package/esm/components/Input/Input.mjs CHANGED Viewed

@@ -45,7 +45,7 @@ const varsResolver = createVarsResolver((_, props, ctx) => ({ wrapper: {
 } }));
 const Input = polymorphicFactory((_props) => {
 	const props = useProps("Input", defaultProps, _props);
-	const { classNames, className, style, styles, unstyled, required, __staticSelector, __stylesApiProps, size, wrapperProps, error, disabled, leftSection, leftSectionProps, leftSectionWidth, rightSection, rightSectionProps, rightSectionWidth, rightSectionPointerEvents, leftSectionPointerEvents, variant, vars, pointer, multiline, radius, id, withAria, withErrorStyles, mod, inputSize, attributes, __clearSection, __clearable, __clearSectionMode, __defaultRightSection, loading, loadingPosition, ...others } = props;
+	const { classNames, className, style, styles, unstyled, required, __staticSelector, __stylesApiProps, size, wrapperProps, error, disabled, leftSection, leftSectionProps, leftSectionWidth, rightSection, rightSectionProps, rightSectionWidth, rightSectionPointerEvents, leftSectionPointerEvents, variant, vars, pointer, multiline, radius, id, withAria, withErrorStyles, mod, inputSize, attributes, __clearSection, __clearable, __clearSectionMode, __defaultRightSection, loading, loadingPosition, rootRef, ...others } = props;
 	const { styleProps, rest } = extractStyleProps(others);
 	const ctx = use(InputWrapperContext);
 	const stylesCtx = {
@@ -70,7 +70,7 @@ const Input = polymorphicFactory((_props) => {
 	const ariaAttributes = withAria ? {
 		required,
 		disabled,
-		"aria-invalid": !!error,
+		"aria-invalid": error ? true : void 0,
 		"aria-describedby": ctx?.describedBy,
 		id: ctx?.inputId || id
 	} : {};
@@ -87,6 +87,7 @@ const Input = polymorphicFactory((_props) => {
 	return /* @__PURE__ */ jsx(InputContext, {
 		value: { size: size || "sm" },
 		children: /* @__PURE__ */ jsxs(Box, {
+			ref: rootRef,
 			...getStyles("wrapper"),
 			...styleProps,
 			...wrapperProps,