npm - @mantine/core - Versions diffs - 9.3.2 → 9.4.0 - Mend

@mantine/core 9.3.2 → 9.4.0

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 (828) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Blockquote.mjs","names":["classes"],"sources":["../../../src/components/Blockquote/Blockquote.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getRadius,\n getThemeColor,\n MantineColor,\n MantineRadius,\n parseThemeColor,\n rem,\n rgba,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Blockquote.module.css';\n\nexport type BlockquoteStylesNames = 'root' \| 'icon' \| 'cite';\nexport type BlockquoteCssVariables = {\n root:\n \| '--bq-bg-light'\n \| '--bq-bg-dark'\n \| '--bq-bd'\n \| '--bq-icon-size'\n \| '--bq-radius'\n \| '--bq-text-wrap';\n};\n\nexport interface BlockquoteProps\n extends BoxProps, StylesApiProps<BlockquoteFactory>, ElementProps<'blockquote', 'cite'> {\n /** Blockquote icon, displayed at the top left side /\n icon?: React.ReactNode;\n\n /* Controls icon `width` and `height`, numbers are converted to rem @default 40 /\n iconSize?: number \| string;\n\n /* Key of `theme.colors` or any valid CSS color @default theme.primaryColor /\n color?: MantineColor;\n\n /* Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius /\n radius?: MantineRadius;\n\n /* Reference to a cited quote /\n cite?: React.ReactNode;\n\n /* Controls `text-wrap` CSS property */\n textWrap?: 'wrap' \| 'nowrap' \| 'balance' \| 'pretty' \| 'stable';\n}\n\nexport type BlockquoteFactory = Factory<{\n props: BlockquoteProps;\n ref: HTMLQuoteElement;\n stylesNames: BlockquoteStylesNames;\n vars: BlockquoteCssVariables;\n}>;\n\nconst defaultProps = {\n iconSize: 48,\n} satisfies Partial<BlockquoteProps>;\n\nconst varsResolver = createVarsResolver<BlockquoteFactory>(\n (theme, { color, iconSize, radius, textWrap }) => {\n const darkParsed = parseThemeColor({\n color: color \|\| theme.primaryColor,\n theme,\n colorScheme: 'dark',\n });\n\n const lightParsed = parseThemeColor({\n color: color \|\| theme.primaryColor,\n theme,\n colorScheme: 'light',\n });\n\n return {\n root: {\n '--bq-bg-light': rgba(lightParsed.value, 0.07),\n '--bq-bg-dark': rgba(darkParsed.value, 0.06),\n '--bq-bd': getThemeColor(color, theme),\n '--bq-icon-size': rem(iconSize),\n '--bq-radius': getRadius(radius),\n '--bq-text-wrap': textWrap,\n },\n };\n }\n);\n\nexport const Blockquote = factory<BlockquoteFactory>((_props) => {\n const props = useProps('Blockquote', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n icon,\n iconSize,\n cite,\n textWrap,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<BlockquoteFactory>({\n name: 'Blockquote',\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=\"blockquote\" {...getStyles('root')} {...others}>\n {icon && <span {...getStyles('icon')}>{icon}</span>}\n {children}\n {cite && <cite {...getStyles('cite')}>{cite}</cite>}\n </Box>\n );\n});\n\nBlockquote.classes = classes;\nBlockquote.varsResolver = varsResolver;\nBlockquote.displayName = '@mantine/core/Blockquote';\n\nexport namespace Blockquote {\n export type Props = BlockquoteProps;\n export type StylesNames = BlockquoteStylesNames;\n export type CssVariables = BlockquoteCssVariables;\n export type Factory = BlockquoteFactory;\n}\n"],"mappings":";;;;;;;;;;;;;;AA2DA,MAAM,eAAe,EACnB,UAAU,GACZ;AAEA,MAAM,eAAe,oBAClB,OAAO,EAAE,OAAO,UAAU,QAAQ,eAAe;CAChD,MAAM,aAAa,gBAAgB;EACjC,OAAO,SAAS,MAAM;EACtB;EACA,aAAa;CACf,CAAC;CAQD,OAAO,EACL,MAAM;EACJ,iBAAiB,KARD,gBAAgB;GAClC,OAAO,SAAS,MAAM;GACtB;GACA,aAAa;EACf,CAIoC,~~EAAE~~,OAAO,GAAI;EAC7C,gBAAgB,KAAK,WAAW,OAAO,GAAI;EAC3C,WAAW,cAAc,OAAO,KAAK;EACrC,kBAAkB,IAAI,QAAQ;EAC9B,eAAe,UAAU,MAAM;EAC/B,kBAAkB;CACpB,EACF;AACF,CACF;AAEA,MAAa,aAAa,SAA4B,WAAW;CAC/D,MAAM,QAAQ,SAAS,cAAc,cAAc,MAAM;CACzD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,MACA,UACA,MACA,UACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA6B;EAC7C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,OACE,qBAAC,KAAD;EAAK,WAAU;EAAa,GAAI,UAAU,MAAM;EAAG,GAAI;YAAvD;GACG,QAAQ,oBAAC,QAAD;IAAM,GAAI,UAAU,MAAM;cAAI;GAAW,CAAA;GACjD;GACA,QAAQ,oBAAC,QAAD;IAAM,GAAI,UAAU,MAAM;cAAI;GAAW,CAAA;EAC/C;;AAET,CAAC;AAED,WAAW,UAAUA;AACrB,WAAW,eAAe;AAC1B,WAAW,cAAc"}
1	+ {"version":3,"file":"Blockquote.mjs","names":["classes"],"sources":["../../../src/components/Blockquote/Blockquote.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getRadius,\n getThemeColor,\n MantineColor,\n MantineRadius,\n parseThemeColor,\n rem,\n rgba,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Blockquote.module.css';\n\nexport type BlockquoteStylesNames = 'root' \| 'icon' \| 'cite';\nexport type BlockquoteCssVariables = {\n root:\n \| '--bq-bg-light'\n \| '--bq-bg-dark'\n \| '--bq-bd'\n \| '--bq-icon-size'\n \| '--bq-radius'\n \| '--bq-text-wrap';\n};\n\nexport interface BlockquoteProps\n extends BoxProps, StylesApiProps<BlockquoteFactory>, ElementProps<'blockquote', 'cite'> {\n /** Blockquote icon, displayed at the top left side /\n icon?: React.ReactNode;\n\n /* Controls icon `width` and `height`, numbers are converted to rem @default 40 /\n iconSize?: number \| string;\n\n /* Key of `theme.colors` or any valid CSS color @default theme.primaryColor /\n color?: MantineColor;\n\n /* Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius /\n radius?: MantineRadius;\n\n /* Reference to a cited quote /\n cite?: React.ReactNode;\n\n /* Controls `text-wrap` CSS property */\n textWrap?: 'wrap' \| 'nowrap' \| 'balance' \| 'pretty' \| 'stable';\n}\n\nexport type BlockquoteFactory = Factory<{\n props: BlockquoteProps;\n ref: HTMLQuoteElement;\n stylesNames: BlockquoteStylesNames;\n vars: BlockquoteCssVariables;\n}>;\n\nconst defaultProps = {\n iconSize: 48,\n} satisfies Partial<BlockquoteProps>;\n\nconst varsResolver = createVarsResolver<BlockquoteFactory>(\n (theme, { color, iconSize, radius, textWrap }) => {\n const darkParsed = parseThemeColor({\n color: color \|\| theme.primaryColor,\n theme,\n colorScheme: 'dark',\n });\n\n const lightParsed = parseThemeColor({\n color: color \|\| theme.primaryColor,\n theme,\n colorScheme: 'light',\n });\n\n return {\n root: {\n '--bq-bg-light': rgba(lightParsed.value, 0.07),\n '--bq-bg-dark': rgba(darkParsed.value, 0.06),\n '--bq-bd': getThemeColor(color, theme),\n '--bq-icon-size': rem(iconSize),\n '--bq-radius': getRadius(radius),\n '--bq-text-wrap': textWrap,\n },\n };\n }\n);\n\nexport const Blockquote = factory<BlockquoteFactory>((_props) => {\n const props = useProps('Blockquote', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n icon,\n iconSize,\n cite,\n textWrap,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<BlockquoteFactory>({\n name: 'Blockquote',\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=\"blockquote\" {...getStyles('root')} {...others}>\n {icon && <span {...getStyles('icon')}>{icon}</span>}\n {children}\n {cite && <cite {...getStyles('cite')}>{cite}</cite>}\n </Box>\n );\n});\n\nBlockquote.classes = classes;\nBlockquote.varsResolver = varsResolver;\nBlockquote.displayName = '@mantine/core/Blockquote';\n\nexport namespace Blockquote {\n export type Props = BlockquoteProps;\n export type StylesNames = BlockquoteStylesNames;\n export type CssVariables = BlockquoteCssVariables;\n export type Factory = BlockquoteFactory;\n}\n"],"mappings":";;;;;;;;;;;;;;AA2DA,MAAM,eAAe,EACnB,UAAU,GACZ;AAEA,MAAM,eAAe,oBAClB,OAAO,EAAE,OAAO,UAAU,QAAQ,eAAe;CAChD,MAAM,aAAa,gBAAgB;EACjC,OAAO,SAAS,MAAM;EACtB;EACA,aAAa;CACf,CAAC;CAQD,OAAO,EACL,MAAM;EACJ,iBAAiB,KARD,gBAAgB;GAClC,OAAO,SAAS,MAAM;GACtB;GACA,aAAa;EACf,CAIoC,CAAC,CAAC,OAAO,GAAI;EAC7C,gBAAgB,KAAK,WAAW,OAAO,GAAI;EAC3C,WAAW,cAAc,OAAO,KAAK;EACrC,kBAAkB,IAAI,QAAQ;EAC9B,eAAe,UAAU,MAAM;EAC/B,kBAAkB;CACpB,EACF;AACF,CACF;AAEA,MAAa,aAAa,SAA4B,WAAW;CAC/D,MAAM,QAAQ,SAAS,cAAc,cAAc,MAAM;CACzD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,MACA,UACA,MACA,UACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA6B;EAC7C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,OACE,qBAAC,KAAD;EAAK,WAAU;EAAa,GAAI,UAAU,MAAM;EAAG,GAAI;YAAvD;GACG,QAAQ,oBAAC,QAAD;IAAM,GAAI,UAAU,MAAM;cAAI;GAAW,CAAA;GACjD;GACA,QAAQ,oBAAC,QAAD;IAAM,GAAI,UAAU,MAAM;cAAI;GAAW,CAAA;EAC/C;;AAET,CAAC;AAED,WAAW,UAAUA;AACrB,WAAW,eAAe;AAC1B,WAAW,cAAc"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Breadcrumbs.mjs","names":["classes"],"sources":["../../../src/components/Breadcrumbs/Breadcrumbs.tsx"],"sourcesContent":["import { Children, cloneElement } from 'react';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSpacing,\n isElement,\n MantineSpacing,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Breadcrumbs.module.css';\n\nexport type BreadcrumbsStylesNames = 'root' \| 'separator' \| 'breadcrumb';\nexport type BreadcrumbsCssVariables = {\n root: '--bc-separator-margin';\n};\n\nexport interface BreadcrumbsProps\n extends BoxProps, StylesApiProps<BreadcrumbsFactory>, ElementProps<'div'> {\n /** Separator between children @default '/' /\n separator?: React.ReactNode;\n\n /* Controls spacing between separator and breadcrumb @default 'xs' /\n separatorMargin?: MantineSpacing;\n\n /* React nodes that should be separated with `separator` */\n children: React.ReactNode;\n}\n\nexport type BreadcrumbsFactory = Factory<{\n props: BreadcrumbsProps;\n ref: HTMLDivElement;\n stylesNames: BreadcrumbsStylesNames;\n vars: BreadcrumbsCssVariables;\n}>;\n\nconst defaultProps = {\n separator: '/',\n} satisfies Partial<BreadcrumbsProps>;\n\nconst varsResolver = createVarsResolver<BreadcrumbsFactory>((_, { separatorMargin }) => ({\n root: {\n '--bc-separator-margin': getSpacing(separatorMargin),\n },\n}));\n\nexport const Breadcrumbs = factory<BreadcrumbsFactory>((_props) => {\n const props = useProps('Breadcrumbs', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n separator,\n separatorMargin,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<BreadcrumbsFactory>({\n name: 'Breadcrumbs',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const items = Children.toArray(children).reduce<React.ReactNode[]>((acc, child, index, array) => {\n const item = isElement(child) ? (\n cloneElement(child, {\n ...getStyles('breadcrumb', { className: (child.props as any)?.className }),\n key: index,\n })\n ) : (\n <div {...getStyles('breadcrumb')} key={index}>\n {child}\n </div>\n );\n\n acc.push(item);\n\n if (index !== array.length - 1) {\n acc.push(\n <Box {...getStyles('separator')} key={`separator-${index}`}>\n {separator}\n </Box>\n );\n }\n\n return acc;\n }, []);\n\n return (\n <Box {...getStyles('root')} {...others}>\n {items}\n </Box>\n );\n});\n\nBreadcrumbs.classes = classes;\nBreadcrumbs.varsResolver = varsResolver;\nBreadcrumbs.displayName = '@mantine/core/Breadcrumbs';\n\nexport namespace Breadcrumbs {\n export type Props = BreadcrumbsProps;\n export type StylesNames = BreadcrumbsStylesNames;\n export type CssVariables = BreadcrumbsCssVariables;\n export type Factory = BreadcrumbsFactory;\n}\n"],"mappings":";;;;;;;;;;;;AAyCA,MAAM,eAAe,EACnB,WAAW,IACb;AAEA,MAAM,eAAe,oBAAwC,GAAG,EAAE,uBAAuB,EACvF,MAAM,EACJ,yBAAyB,WAAW,eAAe,EACrD,EACF,EAAE;AAEF,MAAa,cAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,cAAc,MAAM;CAC1D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,WACA,iBACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA8B;EAC9C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,QAAQ,SAAS,QAAQ,QAAQ,~~EAAE~~,QAA2B,KAAK,OAAO,OAAO,UAAU;EAC/F,MAAM,OAAO,UAAU,KAAK,IAC1B,aAAa,OAAO;GAClB,GAAG,UAAU,cAAc,EAAE,WAAY,MAAM,OAAe,UAAU,CAAC;GACzE,KAAK;EACP,CAAC,IAED,8BAAC,OAAD;GAAK,GAAI,UAAU,YAAY;GAAG,KAAK;EAElC,GADF,KACE;EAGP,IAAI,KAAK,IAAI;EAEb,IAAI,UAAU,MAAM,SAAS,GAC3B,IAAI,KACF,8BAAC,KAAD;GAAK,GAAI,UAAU,WAAW;GAAG,KAAK,aAAa;EAE9C,GADF,SACE,CACP;EAGF,OAAO;CACT,GAAG,CAAC,CAAC;CAEL,OACE,oBAAC,KAAD;EAAK,GAAI,UAAU,MAAM;EAAG,GAAI;YAC7B;CACE,CAAA;AAET,CAAC;AAED,YAAY,UAAUA;AACtB,YAAY,eAAe;AAC3B,YAAY,cAAc"}
1	+ {"version":3,"file":"Breadcrumbs.mjs","names":["classes"],"sources":["../../../src/components/Breadcrumbs/Breadcrumbs.tsx"],"sourcesContent":["import { Children, cloneElement } from 'react';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSpacing,\n isElement,\n MantineSpacing,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Breadcrumbs.module.css';\n\nexport type BreadcrumbsStylesNames = 'root' \| 'separator' \| 'breadcrumb';\nexport type BreadcrumbsCssVariables = {\n root: '--bc-separator-margin';\n};\n\nexport interface BreadcrumbsProps\n extends BoxProps, StylesApiProps<BreadcrumbsFactory>, ElementProps<'div'> {\n /** Separator between children @default '/' /\n separator?: React.ReactNode;\n\n /* Controls spacing between separator and breadcrumb @default 'xs' /\n separatorMargin?: MantineSpacing;\n\n /* React nodes that should be separated with `separator` */\n children: React.ReactNode;\n}\n\nexport type BreadcrumbsFactory = Factory<{\n props: BreadcrumbsProps;\n ref: HTMLDivElement;\n stylesNames: BreadcrumbsStylesNames;\n vars: BreadcrumbsCssVariables;\n}>;\n\nconst defaultProps = {\n separator: '/',\n} satisfies Partial<BreadcrumbsProps>;\n\nconst varsResolver = createVarsResolver<BreadcrumbsFactory>((_, { separatorMargin }) => ({\n root: {\n '--bc-separator-margin': getSpacing(separatorMargin),\n },\n}));\n\nexport const Breadcrumbs = factory<BreadcrumbsFactory>((_props) => {\n const props = useProps('Breadcrumbs', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n separator,\n separatorMargin,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<BreadcrumbsFactory>({\n name: 'Breadcrumbs',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const items = Children.toArray(children).reduce<React.ReactNode[]>((acc, child, index, array) => {\n const item = isElement(child) ? (\n cloneElement(child, {\n ...getStyles('breadcrumb', { className: (child.props as any)?.className }),\n key: index,\n })\n ) : (\n <div {...getStyles('breadcrumb')} key={index}>\n {child}\n </div>\n );\n\n acc.push(item);\n\n if (index !== array.length - 1) {\n acc.push(\n <Box {...getStyles('separator')} key={`separator-${index}`}>\n {separator}\n </Box>\n );\n }\n\n return acc;\n }, []);\n\n return (\n <Box {...getStyles('root')} {...others}>\n {items}\n </Box>\n );\n});\n\nBreadcrumbs.classes = classes;\nBreadcrumbs.varsResolver = varsResolver;\nBreadcrumbs.displayName = '@mantine/core/Breadcrumbs';\n\nexport namespace Breadcrumbs {\n export type Props = BreadcrumbsProps;\n export type StylesNames = BreadcrumbsStylesNames;\n export type CssVariables = BreadcrumbsCssVariables;\n export type Factory = BreadcrumbsFactory;\n}\n"],"mappings":";;;;;;;;;;;;AAyCA,MAAM,eAAe,EACnB,WAAW,IACb;AAEA,MAAM,eAAe,oBAAwC,GAAG,EAAE,uBAAuB,EACvF,MAAM,EACJ,yBAAyB,WAAW,eAAe,EACrD,EACF,EAAE;AAEF,MAAa,cAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,cAAc,MAAM;CAC1D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,WACA,iBACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA8B;EAC9C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,QAAQ,SAAS,QAAQ,QAAQ,CAAC,CAAC,QAA2B,KAAK,OAAO,OAAO,UAAU;EAC/F,MAAM,OAAO,UAAU,KAAK,IAC1B,aAAa,OAAO;GAClB,GAAG,UAAU,cAAc,EAAE,WAAY,MAAM,OAAe,UAAU,CAAC;GACzE,KAAK;EACP,CAAC,IAED,8BAAC,OAAD;GAAK,GAAI,UAAU,YAAY;GAAG,KAAK;EAElC,GADF,KACE;EAGP,IAAI,KAAK,IAAI;EAEb,IAAI,UAAU,MAAM,SAAS,GAC3B,IAAI,KACF,8BAAC,KAAD;GAAK,GAAI,UAAU,WAAW;GAAG,KAAK,aAAa;EAE9C,GADF,SACE,CACP;EAGF,OAAO;CACT,GAAG,CAAC,CAAC;CAEL,OACE,oBAAC,KAAD;EAAK,GAAI,UAAU,MAAM;EAAG,GAAI;YAC7B;CACE,CAAA;AAET,CAAC;AAED,YAAY,UAAUA;AACtB,YAAY,eAAe;AAC3B,YAAY,cAAc"}

package/esm/components/Button/ButtonGroup/ButtonGroup.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ButtonGroup.mjs","names":["classes"],"sources":["../../../../src/components/Button/ButtonGroup/ButtonGroup.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n factory,\n Factory,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../../core';\nimport classes from '../Button.module.css';\n\nexport type ButtonGroupStylesNames = 'group';\nexport type ButtonGroupCssVariables = {\n group: '--button-border-width';\n};\n\nexport interface ButtonGroupProps extends BoxProps, StylesApiProps<ButtonGroupFactory> {\n /** `Button` components /\n children?: React.ReactNode;\n\n /* Orientation of the group @default horizontal /\n orientation?: 'horizontal' \| 'vertical';\n\n /* `border-width` of the child `Button` components. Numbers are converted to rem. @default 1 */\n borderWidth?: number \| string;\n}\n\nexport type ButtonGroupFactory = Factory<{\n props: ButtonGroupProps;\n ref: HTMLDivElement;\n stylesNames: ButtonGroupStylesNames;\n vars: ButtonGroupCssVariables;\n}>;\n\nconst defaultProps = {\n orientation: 'horizontal',\n} satisfies Partial<ButtonGroupProps>;\n\nconst varsResolver = createVarsResolver<ButtonGroupFactory>((_, { borderWidth }) => ({\n group: { '--button-border-width': rem(borderWidth) },\n}));\n\nexport const ButtonGroup = factory<ButtonGroupFactory>((_props) => {\n const props = useProps('ButtonGroup', defaultProps, _props);\n const {\n className,\n style,\n classNames,\n styles,\n unstyled,\n orientation,\n vars,\n borderWidth,\n mod,\n attributes,\n ...others\n } = useProps('ButtonGroup', defaultProps, _props);\n\n const getStyles = useStyles<ButtonGroupFactory>({\n name: 'ButtonGroup',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n rootSelector: 'group',\n });\n\n return (\n <Box\n {...getStyles('group')}\n mod={[{ 'data-orientation': orientation }, mod]}\n role=\"group\"\n {...others}\n />\n );\n});\n\nButtonGroup.classes = classes;\nButtonGroup.varsResolver = varsResolver;\nButtonGroup.displayName = '@mantine/core/ButtonGroup';\n"],"mappings":";;;;;;;;;;AAoCA,MAAM,eAAe,EACnB,aAAa,aACf;AAEA,MAAM,eAAe,oBAAwC,GAAG,EAAE,mBAAmB,EACnF,OAAO,EAAE,yBAAyB,IAAI,WAAW,EAAE,EACrD,EAAE;AAEF,MAAa,cAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,cAAc,MAAM;CAC1D,MAAM,EACJ,WACA,OACA,YACA,QACA,UACA,aACA,MACA,aACA,KACA,YACA,GAAG,WACD,SAAS,eAAe,cAAc,MAAM;CAiBhD,OACE,oBAAC,KAAD;EACE,GAjBc,UAA8B;GAC9C,MAAM;GACN;GACA,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA,cAAc;EAChB,CAIgB,~~EAAE~~,OAAO;EACrB,KAAK,CAAC,EAAE,oBAAoB,YAAY,GAAG,GAAG;EAC9C,MAAK;EACL,GAAI;CACL,CAAA;AAEL,CAAC;AAED,YAAY,UAAUA;AACtB,YAAY,eAAe;AAC3B,YAAY,cAAc"}
1	+ {"version":3,"file":"ButtonGroup.mjs","names":["classes"],"sources":["../../../../src/components/Button/ButtonGroup/ButtonGroup.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n factory,\n Factory,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../../core';\nimport classes from '../Button.module.css';\n\nexport type ButtonGroupStylesNames = 'group';\nexport type ButtonGroupCssVariables = {\n group: '--button-border-width';\n};\n\nexport interface ButtonGroupProps extends BoxProps, StylesApiProps<ButtonGroupFactory> {\n /** `Button` components /\n children?: React.ReactNode;\n\n /* Orientation of the group @default horizontal /\n orientation?: 'horizontal' \| 'vertical';\n\n /* `border-width` of the child `Button` components. Numbers are converted to rem. @default 1 */\n borderWidth?: number \| string;\n}\n\nexport type ButtonGroupFactory = Factory<{\n props: ButtonGroupProps;\n ref: HTMLDivElement;\n stylesNames: ButtonGroupStylesNames;\n vars: ButtonGroupCssVariables;\n}>;\n\nconst defaultProps = {\n orientation: 'horizontal',\n} satisfies Partial<ButtonGroupProps>;\n\nconst varsResolver = createVarsResolver<ButtonGroupFactory>((_, { borderWidth }) => ({\n group: { '--button-border-width': rem(borderWidth) },\n}));\n\nexport const ButtonGroup = factory<ButtonGroupFactory>((_props) => {\n const props = useProps('ButtonGroup', defaultProps, _props);\n const {\n className,\n style,\n classNames,\n styles,\n unstyled,\n orientation,\n vars,\n borderWidth,\n mod,\n attributes,\n ...others\n } = useProps('ButtonGroup', defaultProps, _props);\n\n const getStyles = useStyles<ButtonGroupFactory>({\n name: 'ButtonGroup',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n rootSelector: 'group',\n });\n\n return (\n <Box\n {...getStyles('group')}\n mod={[{ 'data-orientation': orientation }, mod]}\n role=\"group\"\n {...others}\n />\n );\n});\n\nButtonGroup.classes = classes;\nButtonGroup.varsResolver = varsResolver;\nButtonGroup.displayName = '@mantine/core/ButtonGroup';\n"],"mappings":";;;;;;;;;;AAoCA,MAAM,eAAe,EACnB,aAAa,aACf;AAEA,MAAM,eAAe,oBAAwC,GAAG,EAAE,mBAAmB,EACnF,OAAO,EAAE,yBAAyB,IAAI,WAAW,EAAE,EACrD,EAAE;AAEF,MAAa,cAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,cAAc,MAAM;CAC1D,MAAM,EACJ,WACA,OACA,YACA,QACA,UACA,aACA,MACA,aACA,KACA,YACA,GAAG,WACD,SAAS,eAAe,cAAc,MAAM;CAiBhD,OACE,oBAAC,KAAD;EACE,GAjBc,UAA8B;GAC9C,MAAM;GACN;GACA,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA,cAAc;EAChB,CAIgB,CAAC,CAAC,OAAO;EACrB,KAAK,CAAC,EAAE,oBAAoB,YAAY,GAAG,GAAG;EAC9C,MAAK;EACL,GAAI;CACL,CAAA;AAEL,CAAC;AAED,YAAY,UAAUA;AACtB,YAAY,eAAe;AAC3B,YAAY,cAAc"}

package/esm/components/Button/ButtonGroupSection/ButtonGroupSection.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ButtonGroupSection.mjs","names":["classes"],"sources":["../../../../src/components/Button/ButtonGroupSection/ButtonGroupSection.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getFontSize,\n getRadius,\n getSize,\n MantineGradient,\n MantineRadius,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../../core';\nimport type { ButtonSize, ButtonVariant } from '../Button';\nimport classes from '../Button.module.css';\n\nexport type ButtonGroupSectionStylesNames = 'groupSection';\nexport type ButtonGroupSectionCssVariables = {\n groupSection:\n \| '--section-radius'\n \| '--section-bg'\n \| '--section-color'\n \| '--section-bd'\n \| '--section-height'\n \| '--section-padding-x'\n \| '--section-fz';\n};\n\nexport interface ButtonGroupSectionProps\n extends BoxProps, StylesApiProps<ButtonGroupSectionFactory>, ElementProps<'div'> {\n /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius /\n radius?: MantineRadius;\n\n /* Gradient configuration used when `variant=\"gradient\"` @default theme.defaultGradient /\n gradient?: MantineGradient;\n\n /* If set, adjusts text color based on background color for `filled` variant /\n autoContrast?: boolean;\n\n /* Controls section `height`, `font-size` and horizontal `padding` @default 'sm' */\n size?: ButtonSize;\n}\n\nexport type ButtonGroupSectionFactory = Factory<{\n props: ButtonGroupSectionProps;\n ref: HTMLDivElement;\n stylesNames: ButtonGroupSectionStylesNames;\n vars: ButtonGroupSectionCssVariables;\n variant: ButtonVariant;\n}>;\n\nconst varsResolver = createVarsResolver<ButtonGroupSectionFactory>(\n (theme, { radius, color, gradient, variant, autoContrast, size }) => {\n const colors = theme.variantColorResolver({\n color: color \|\| theme.primaryColor,\n theme,\n gradient,\n variant: variant \|\| 'filled',\n autoContrast,\n });\n\n return {\n groupSection: {\n '--section-height': getSize(size, 'section-height'),\n '--section-padding-x': getSize(size, 'section-padding-x'),\n '--section-fz': size?.includes('compact')\n ? getFontSize(size.replace('compact-', ''))\n : getFontSize(size),\n '--section-radius': radius === undefined ? undefined : getRadius(radius),\n '--section-bg': color \|\| variant ? colors.background : undefined,\n '--section-color': colors.color,\n '--section-bd': color \|\| variant ? colors.border : undefined,\n },\n };\n }\n);\n\nexport const ButtonGroupSection = factory<ButtonGroupSectionFactory>((_props) => {\n const props = useProps('ButtonGroupSection', null, _props);\n const {\n className,\n style,\n classNames,\n styles,\n unstyled,\n vars,\n gradient,\n radius,\n autoContrast,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<ButtonGroupSectionFactory>({\n name: 'ButtonGroupSection',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n rootSelector: 'groupSection',\n });\n\n return <Box {...getStyles('groupSection')} {...others} />;\n});\n\nButtonGroupSection.classes = classes;\nButtonGroupSection.varsResolver = varsResolver;\nButtonGroupSection.displayName = '@mantine/core/ButtonGroupSection';\n"],"mappings":";;;;;;;;;;AAsDA,MAAM,eAAe,oBAClB,OAAO,EAAE,QAAQ,OAAO,UAAU,SAAS,cAAc,WAAW;CACnE,MAAM,SAAS,MAAM,qBAAqB;EACxC,OAAO,SAAS,MAAM;EACtB;EACA;EACA,SAAS,WAAW;EACpB;CACF,CAAC;CAED,OAAO,EACL,cAAc;EACZ,oBAAoB,QAAQ,MAAM,gBAAgB;EAClD,uBAAuB,QAAQ,MAAM,mBAAmB;EACxD,gBAAgB,MAAM,SAAS,SAAS,IACpC,YAAY,KAAK,QAAQ,YAAY,EAAE,CAAC,IACxC,YAAY,IAAI;EACpB,oBAAoB,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,MAAM;EACvE,gBAAgB,SAAS,UAAU,OAAO,aAAa,KAAA;EACvD,mBAAmB,OAAO;EAC1B,gBAAgB,SAAS,UAAU,OAAO,SAAS,KAAA;CACrD,EACF;AACF,CACF;AAEA,MAAa,qBAAqB,SAAoC,WAAW;CAC/E,MAAM,QAAQ,SAAS,sBAAsB,MAAM,MAAM;CACzD,MAAM,EACJ,WACA,OACA,YACA,QACA,UACA,MACA,UACA,QACA,cACA,YACA,GAAG,WACD;CAiBJ,OAAO,oBAAC,KAAD;EAAK,GAfM,UAAqC;GACrD,MAAM;GACN;GACA,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA,cAAc;EAChB,CAEwB,~~EAAE~~,cAAc;EAAG,GAAI;CAAS,CAAA;AAC1D,CAAC;AAED,mBAAmB,UAAUA;AAC7B,mBAAmB,eAAe;AAClC,mBAAmB,cAAc"}
1	+ {"version":3,"file":"ButtonGroupSection.mjs","names":["classes"],"sources":["../../../../src/components/Button/ButtonGroupSection/ButtonGroupSection.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getFontSize,\n getRadius,\n getSize,\n MantineGradient,\n MantineRadius,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../../core';\nimport type { ButtonSize, ButtonVariant } from '../Button';\nimport classes from '../Button.module.css';\n\nexport type ButtonGroupSectionStylesNames = 'groupSection';\nexport type ButtonGroupSectionCssVariables = {\n groupSection:\n \| '--section-radius'\n \| '--section-bg'\n \| '--section-color'\n \| '--section-bd'\n \| '--section-height'\n \| '--section-padding-x'\n \| '--section-fz';\n};\n\nexport interface ButtonGroupSectionProps\n extends BoxProps, StylesApiProps<ButtonGroupSectionFactory>, ElementProps<'div'> {\n /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius /\n radius?: MantineRadius;\n\n /* Gradient configuration used when `variant=\"gradient\"` @default theme.defaultGradient /\n gradient?: MantineGradient;\n\n /* If set, adjusts text color based on background color for `filled` variant /\n autoContrast?: boolean;\n\n /* Controls section `height`, `font-size` and horizontal `padding` @default 'sm' */\n size?: ButtonSize;\n}\n\nexport type ButtonGroupSectionFactory = Factory<{\n props: ButtonGroupSectionProps;\n ref: HTMLDivElement;\n stylesNames: ButtonGroupSectionStylesNames;\n vars: ButtonGroupSectionCssVariables;\n variant: ButtonVariant;\n}>;\n\nconst varsResolver = createVarsResolver<ButtonGroupSectionFactory>(\n (theme, { radius, color, gradient, variant, autoContrast, size }) => {\n const colors = theme.variantColorResolver({\n color: color \|\| theme.primaryColor,\n theme,\n gradient,\n variant: variant \|\| 'filled',\n autoContrast,\n });\n\n return {\n groupSection: {\n '--section-height': getSize(size, 'section-height'),\n '--section-padding-x': getSize(size, 'section-padding-x'),\n '--section-fz': size?.includes('compact')\n ? getFontSize(size.replace('compact-', ''))\n : getFontSize(size),\n '--section-radius': radius === undefined ? undefined : getRadius(radius),\n '--section-bg': color \|\| variant ? colors.background : undefined,\n '--section-color': colors.color,\n '--section-bd': color \|\| variant ? colors.border : undefined,\n },\n };\n }\n);\n\nexport const ButtonGroupSection = factory<ButtonGroupSectionFactory>((_props) => {\n const props = useProps('ButtonGroupSection', null, _props);\n const {\n className,\n style,\n classNames,\n styles,\n unstyled,\n vars,\n gradient,\n radius,\n autoContrast,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<ButtonGroupSectionFactory>({\n name: 'ButtonGroupSection',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n rootSelector: 'groupSection',\n });\n\n return <Box {...getStyles('groupSection')} {...others} />;\n});\n\nButtonGroupSection.classes = classes;\nButtonGroupSection.varsResolver = varsResolver;\nButtonGroupSection.displayName = '@mantine/core/ButtonGroupSection';\n"],"mappings":";;;;;;;;;;AAsDA,MAAM,eAAe,oBAClB,OAAO,EAAE,QAAQ,OAAO,UAAU,SAAS,cAAc,WAAW;CACnE,MAAM,SAAS,MAAM,qBAAqB;EACxC,OAAO,SAAS,MAAM;EACtB;EACA;EACA,SAAS,WAAW;EACpB;CACF,CAAC;CAED,OAAO,EACL,cAAc;EACZ,oBAAoB,QAAQ,MAAM,gBAAgB;EAClD,uBAAuB,QAAQ,MAAM,mBAAmB;EACxD,gBAAgB,MAAM,SAAS,SAAS,IACpC,YAAY,KAAK,QAAQ,YAAY,EAAE,CAAC,IACxC,YAAY,IAAI;EACpB,oBAAoB,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,MAAM;EACvE,gBAAgB,SAAS,UAAU,OAAO,aAAa,KAAA;EACvD,mBAAmB,OAAO;EAC1B,gBAAgB,SAAS,UAAU,OAAO,SAAS,KAAA;CACrD,EACF;AACF,CACF;AAEA,MAAa,qBAAqB,SAAoC,WAAW;CAC/E,MAAM,QAAQ,SAAS,sBAAsB,MAAM,MAAM;CACzD,MAAM,EACJ,WACA,OACA,YACA,QACA,UACA,MACA,UACA,QACA,cACA,YACA,GAAG,WACD;CAiBJ,OAAO,oBAAC,KAAD;EAAK,GAfM,UAAqC;GACrD,MAAM;GACN;GACA,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA,cAAc;EAChB,CAEwB,CAAC,CAAC,cAAc;EAAG,GAAI;CAAS,CAAA;AAC1D,CAAC;AAED,mBAAmB,UAAUA;AAC7B,mBAAmB,eAAe;AAClC,mBAAmB,cAAc"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Checkbox.mjs","names":["useId","classes"],"sources":["../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import { use, useEffect, useRef } from 'react';\nimport { useId, useMergedRef } from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n DataAttributes,\n ElementProps,\n extractStyleProps,\n factory,\n Factory,\n getAutoContrastValue,\n getContrastColor,\n getRadius,\n getSize,\n getThemeColor,\n MantineColor,\n MantineRadius,\n MantineSize,\n parseThemeColor,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { InlineInput, InlineInputClasses, InlineInputStylesNames } from '../../utils/InlineInput';\nimport {\n CheckboxCard,\n type CheckboxCardProps,\n type CheckboxCardStylesNames,\n type CheckboxCardCssVariables,\n type CheckboxCardFactory,\n} from './CheckboxCard/CheckboxCard';\nimport {\n CheckboxGroup,\n CheckboxGroupContext,\n type CheckboxGroupProps,\n type CheckboxGroupStylesNames,\n type CheckboxGroupFactory,\n} from './CheckboxGroup/CheckboxGroup';\nimport {\n CheckboxIndicator,\n type CheckboxIndicatorProps,\n type CheckboxIndicatorStylesNames,\n type CheckboxIndicatorCssVariables,\n type CheckboxIndicatorFactory,\n type CheckboxIndicatorVariant,\n} from './CheckboxIndicator/CheckboxIndicator';\nimport { CheckboxIcon } from './CheckIcon';\nimport classes from './Checkbox.module.css';\nexport type CheckboxVariant = 'filled' \| 'outline';\nexport type CheckboxStylesNames = 'icon' \| 'inner' \| 'input' \| InlineInputStylesNames;\nexport type CheckboxCssVariables = {\n root: '--checkbox-size' \| '--checkbox-radius' \| '--checkbox-color' \| '--checkbox-icon-color';\n};\n\nexport type CheckboxIconComponent = React.FC<{\n indeterminate: boolean \| undefined;\n className: string;\n}>;\n\nexport interface CheckboxProps\n extends BoxProps, StylesApiProps<CheckboxFactory>, ElementProps<'input', 'size' \| 'children'> {\n /** Unique input id /\n id?: string;\n\n /* `label` associated with the checkbox /\n label?: React.ReactNode;\n\n /* Key of `theme.colors` or any valid CSS color to set input background color in checked state @default theme.primaryColor /\n color?: MantineColor;\n\n /* Controls size of the component @default 'sm' /\n size?: MantineSize \| (string & {});\n\n /* Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius /\n radius?: MantineRadius;\n\n /* Props passed down to the root element /\n wrapperProps?: React.ComponentProps<'div'> & DataAttributes;\n\n /* Position of the label relative to the input @default 'right' /\n labelPosition?: 'left' \| 'right';\n\n /* Description below the label /\n description?: React.ReactNode;\n\n /* Error message below the label /\n error?: React.ReactNode;\n\n /* Indeterminate state of the checkbox. If set, `checked` prop is dismissed. /\n indeterminate?: boolean;\n\n /* Icon for checked or indeterminate state /\n icon?: CheckboxIconComponent;\n\n /* Root element ref /\n rootRef?: React.Ref<HTMLDivElement>;\n\n /* Key of `theme.colors` or any valid CSS color to set icon color. By default, depends on `theme.autoContrast`. /\n iconColor?: MantineColor;\n\n /* If set, adjusts icon color based on background color for `filled` variant /\n autoContrast?: boolean;\n\n /* If set, applies error styles to the checkbox when `error` prop is set @default true */\n withErrorStyles?: boolean;\n}\n\nexport type CheckboxFactory = Factory<{\n props: CheckboxProps;\n ref: HTMLInputElement;\n stylesNames: CheckboxStylesNames;\n vars: CheckboxCssVariables;\n variant: CheckboxVariant;\n staticComponents: {\n Group: typeof CheckboxGroup;\n Indicator: typeof CheckboxIndicator;\n Card: typeof CheckboxCard;\n };\n}>;\n\nconst defaultProps = {\n labelPosition: 'right',\n icon: CheckboxIcon,\n withErrorStyles: true,\n variant: 'filled',\n radius: 'sm',\n} satisfies Partial<CheckboxProps>;\n\nconst varsResolver = createVarsResolver<CheckboxFactory>(\n (theme, { radius, color, size, iconColor, variant, autoContrast }) => {\n const parsedColor = parseThemeColor({ color: color \|\| theme.primaryColor, theme });\n const outlineColor =\n parsedColor.isThemeColor && parsedColor.shade === undefined\n ? `var(--mantine-color-${parsedColor.color}-outline)`\n : parsedColor.color;\n\n return {\n root: {\n '--checkbox-size': getSize(size, 'checkbox-size'),\n '--checkbox-radius': radius === undefined ? undefined : getRadius(radius),\n '--checkbox-color': variant === 'outline' ? outlineColor : getThemeColor(color, theme),\n '--checkbox-icon-color': iconColor\n ? getThemeColor(iconColor, theme)\n : getAutoContrastValue(autoContrast, theme)\n ? getContrastColor({ color, theme, autoContrast })\n : undefined,\n },\n };\n }\n);\n\nexport const Checkbox = factory<CheckboxFactory>((_props) => {\n const props = useProps('Checkbox', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n color,\n label,\n id,\n size,\n radius,\n wrapperProps,\n checked,\n labelPosition,\n description,\n error,\n disabled,\n variant,\n indeterminate,\n icon: Icon,\n rootRef,\n iconColor,\n onChange,\n autoContrast,\n mod,\n attributes,\n readOnly,\n onClick,\n withErrorStyles,\n ref,\n ...others\n } = props;\n\n const inputRef = useRef<HTMLInputElement>(null);\n const ctx = use(CheckboxGroupContext);\n const _size = size \|\| ctx?.size;\n\n const getStyles = useStyles<CheckboxFactory>({\n name: 'Checkbox',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const { styleProps, rest } = extractStyleProps(others);\n const uuid = useId(id);\n const descriptionId = description ? `${uuid}-description` : undefined;\n const errorId = error && typeof error !== 'boolean' ? `${uuid}-error` : undefined;\n const describedBy =\n [descriptionId, errorId, rest['aria-describedby']].filter(Boolean).join(' ') \|\| undefined;\n\n const withContextProps = {\n checked: ctx?.value.includes(rest.value as string) ?? checked,\n onChange: (event: React.ChangeEvent<HTMLInputElement>) => {\n if (readOnly) {\n return;\n }\n\n ctx?.onChange(event);\n onChange?.(event);\n },\n };\n\n const isDisabledByGroup = ctx?.isDisabled?.(rest.value as string) ?? false;\n const finalDisabled = disabled \|\| isDisabledByGroup;\n\n useEffect(() => {\n if (inputRef.current) {\n inputRef.current.indeterminate = indeterminate \|\| false;\n\n if (indeterminate) {\n inputRef.current.setAttribute('data-indeterminate', 'true');\n } else {\n inputRef.current.removeAttribute('data-indeterminate');\n }\n }\n }, [indeterminate]);\n\n return (\n <InlineInput\n {...getStyles('root')}\n __staticSelector=\"Checkbox\"\n __stylesApiProps={props}\n id={uuid}\n size={_size}\n labelPosition={labelPosition}\n label={label}\n description={description}\n error={error}\n disabled={finalDisabled}\n classNames={classNames}\n styles={styles}\n unstyled={unstyled}\n data-checked={withContextProps.checked \|\| checked \|\| undefined}\n variant={variant}\n ref={rootRef}\n mod={mod}\n attributes={attributes}\n inert={rest.inert}\n {...styleProps}\n {...wrapperProps}\n >\n <Box {...getStyles('inner')} mod={{ 'data-label-position': labelPosition }}>\n <Box\n component=\"input\"\n id={uuid}\n ref={useMergedRef(inputRef, ref)}\n mod={{ error: !!error, 'with-error-styles': withErrorStyles }}\n {...getStyles('input', { focusable: true, variant })}\n {...rest}\n {...withContextProps}\n aria-describedby={describedBy}\n disabled={finalDisabled}\n inert={rest.inert}\n type=\"checkbox\"\n onClick={(event) => {\n if (readOnly && withContextProps.checked === undefined) {\n event.preventDefault();\n }\n\n onClick?.(event);\n }}\n />\n\n <Icon indeterminate={indeterminate} {...getStyles('icon')} />\n </Box>\n </InlineInput>\n );\n});\n\nCheckbox.classes = { ...classes, ...InlineInputClasses };\nCheckbox.varsResolver = varsResolver;\nCheckbox.displayName = '@mantine/core/Checkbox';\nCheckbox.Group = CheckboxGroup;\nCheckbox.Indicator = CheckboxIndicator;\nCheckbox.Card = CheckboxCard;\n\nexport namespace Checkbox {\n export type Props = CheckboxProps;\n export type StylesNames = CheckboxStylesNames;\n export type CssVariables = CheckboxCssVariables;\n export type Factory = CheckboxFactory;\n export type Variant = CheckboxVariant;\n export type IconComponent = CheckboxIconComponent;\n\n export namespace Group {\n export type Props = CheckboxGroupProps;\n export type StylesNames = CheckboxGroupStylesNames;\n export type Factory = CheckboxGroupFactory;\n }\n\n export namespace Indicator {\n export type Props = CheckboxIndicatorProps;\n export type StylesNames = CheckboxIndicatorStylesNames;\n export type CssVariables = CheckboxIndicatorCssVariables;\n export type Factory = CheckboxIndicatorFactory;\n export type Variant = CheckboxIndicatorVariant;\n }\n\n export namespace Card {\n export type Props = CheckboxCardProps;\n export type StylesNames = CheckboxCardStylesNames;\n export type CssVariables = CheckboxCardCssVariables;\n export type Factory = CheckboxCardFactory;\n }\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"Checkbox.mjs","names":["useId","classes"],"sources":["../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import { use, useEffect, useRef } from 'react';\nimport { useId, useMergedRef } from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n DataAttributes,\n ElementProps,\n extractStyleProps,\n factory,\n Factory,\n getAutoContrastValue,\n getContrastColor,\n getRadius,\n getSize,\n getThemeColor,\n MantineColor,\n MantineRadius,\n MantineSize,\n parseThemeColor,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { InlineInput, InlineInputClasses, InlineInputStylesNames } from '../../utils/InlineInput';\nimport {\n CheckboxCard,\n type CheckboxCardProps,\n type CheckboxCardStylesNames,\n type CheckboxCardCssVariables,\n type CheckboxCardFactory,\n} from './CheckboxCard/CheckboxCard';\nimport {\n CheckboxGroup,\n CheckboxGroupContext,\n type CheckboxGroupProps,\n type CheckboxGroupStylesNames,\n type CheckboxGroupFactory,\n} from './CheckboxGroup/CheckboxGroup';\nimport {\n CheckboxIndicator,\n type CheckboxIndicatorProps,\n type CheckboxIndicatorStylesNames,\n type CheckboxIndicatorCssVariables,\n type CheckboxIndicatorFactory,\n type CheckboxIndicatorVariant,\n} from './CheckboxIndicator/CheckboxIndicator';\nimport { CheckboxIcon } from './CheckIcon';\nimport classes from './Checkbox.module.css';\nexport type CheckboxVariant = 'filled' \| 'outline';\nexport type CheckboxStylesNames = 'icon' \| 'inner' \| 'input' \| InlineInputStylesNames;\nexport type CheckboxCssVariables = {\n root: '--checkbox-size' \| '--checkbox-radius' \| '--checkbox-color' \| '--checkbox-icon-color';\n};\n\nexport type CheckboxIconComponent = React.FC<{\n indeterminate: boolean \| undefined;\n className: string;\n}>;\n\nexport interface CheckboxProps\n extends BoxProps, StylesApiProps<CheckboxFactory>, ElementProps<'input', 'size' \| 'children'> {\n /** Unique input id /\n id?: string;\n\n /* `label` associated with the checkbox /\n label?: React.ReactNode;\n\n /* Key of `theme.colors` or any valid CSS color to set input background color in checked state @default theme.primaryColor /\n color?: MantineColor;\n\n /* Controls size of the component @default 'sm' /\n size?: MantineSize \| (string & {});\n\n /* Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius /\n radius?: MantineRadius;\n\n /* Props passed down to the root element /\n wrapperProps?: React.ComponentProps<'div'> & DataAttributes;\n\n /* Position of the label relative to the input @default 'right' /\n labelPosition?: 'left' \| 'right';\n\n /* Description below the label /\n description?: React.ReactNode;\n\n /* Error message below the label /\n error?: React.ReactNode;\n\n /* Indeterminate state of the checkbox. If set, `checked` prop is dismissed. /\n indeterminate?: boolean;\n\n /* Icon for checked or indeterminate state /\n icon?: CheckboxIconComponent;\n\n /* Root element ref /\n rootRef?: React.Ref<HTMLDivElement>;\n\n /* Key of `theme.colors` or any valid CSS color to set icon color. By default, depends on `theme.autoContrast`. /\n iconColor?: MantineColor;\n\n /* If set, adjusts icon color based on background color for `filled` variant /\n autoContrast?: boolean;\n\n /* If set, applies error styles to the checkbox when `error` prop is set @default true */\n withErrorStyles?: boolean;\n}\n\nexport type CheckboxFactory = Factory<{\n props: CheckboxProps;\n ref: HTMLInputElement;\n stylesNames: CheckboxStylesNames;\n vars: CheckboxCssVariables;\n variant: CheckboxVariant;\n staticComponents: {\n Group: typeof CheckboxGroup;\n Indicator: typeof CheckboxIndicator;\n Card: typeof CheckboxCard;\n };\n}>;\n\nconst defaultProps = {\n labelPosition: 'right',\n icon: CheckboxIcon,\n withErrorStyles: true,\n variant: 'filled',\n radius: 'sm',\n} satisfies Partial<CheckboxProps>;\n\nconst varsResolver = createVarsResolver<CheckboxFactory>(\n (theme, { radius, color, size, iconColor, variant, autoContrast }) => {\n const parsedColor = parseThemeColor({ color: color \|\| theme.primaryColor, theme });\n const outlineColor =\n parsedColor.isThemeColor && parsedColor.shade === undefined\n ? `var(--mantine-color-${parsedColor.color}-outline)`\n : parsedColor.color;\n\n return {\n root: {\n '--checkbox-size': getSize(size, 'checkbox-size'),\n '--checkbox-radius': radius === undefined ? undefined : getRadius(radius),\n '--checkbox-color': variant === 'outline' ? outlineColor : getThemeColor(color, theme),\n '--checkbox-icon-color': iconColor\n ? getThemeColor(iconColor, theme)\n : getAutoContrastValue(autoContrast, theme)\n ? getContrastColor({ color, theme, autoContrast })\n : undefined,\n },\n };\n }\n);\n\nexport const Checkbox = factory<CheckboxFactory>((_props) => {\n const props = useProps('Checkbox', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n color,\n label,\n id,\n size,\n radius,\n wrapperProps,\n checked,\n labelPosition,\n description,\n error,\n disabled,\n variant,\n indeterminate,\n icon: Icon,\n rootRef,\n iconColor,\n onChange,\n autoContrast,\n mod,\n attributes,\n readOnly,\n onClick,\n withErrorStyles,\n ref,\n ...others\n } = props;\n\n const inputRef = useRef<HTMLInputElement>(null);\n const ctx = use(CheckboxGroupContext);\n const _size = size \|\| ctx?.size;\n\n const getStyles = useStyles<CheckboxFactory>({\n name: 'Checkbox',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const { styleProps, rest } = extractStyleProps(others);\n const uuid = useId(id);\n const descriptionId = description ? `${uuid}-description` : undefined;\n const errorId = error && typeof error !== 'boolean' ? `${uuid}-error` : undefined;\n const describedBy =\n [descriptionId, errorId, rest['aria-describedby']].filter(Boolean).join(' ') \|\| undefined;\n\n const withContextProps = {\n checked: ctx?.value.includes(rest.value as string) ?? checked,\n onChange: (event: React.ChangeEvent<HTMLInputElement>) => {\n if (readOnly) {\n return;\n }\n\n ctx?.onChange(event);\n onChange?.(event);\n },\n };\n\n const isDisabledByGroup = ctx?.isDisabled?.(rest.value as string) ?? false;\n const finalDisabled = disabled \|\| isDisabledByGroup;\n\n useEffect(() => {\n if (inputRef.current) {\n inputRef.current.indeterminate = indeterminate \|\| false;\n\n if (indeterminate) {\n inputRef.current.setAttribute('data-indeterminate', 'true');\n } else {\n inputRef.current.removeAttribute('data-indeterminate');\n }\n }\n }, [indeterminate]);\n\n return (\n <InlineInput\n {...getStyles('root')}\n __staticSelector=\"Checkbox\"\n __stylesApiProps={props}\n id={uuid}\n size={_size}\n labelPosition={labelPosition}\n label={label}\n description={description}\n error={error}\n disabled={finalDisabled}\n classNames={classNames}\n styles={styles}\n unstyled={unstyled}\n data-checked={withContextProps.checked \|\| checked \|\| undefined}\n variant={variant}\n ref={rootRef}\n mod={mod}\n attributes={attributes}\n inert={rest.inert}\n {...styleProps}\n {...wrapperProps}\n >\n <Box {...getStyles('inner')} mod={{ 'data-label-position': labelPosition }}>\n <Box\n component=\"input\"\n id={uuid}\n ref={useMergedRef(inputRef, ref)}\n mod={{ error: !!error, 'with-error-styles': withErrorStyles }}\n {...getStyles('input', { focusable: true, variant })}\n {...rest}\n {...withContextProps}\n aria-describedby={describedBy}\n disabled={finalDisabled}\n inert={rest.inert}\n type=\"checkbox\"\n onClick={(event) => {\n if (readOnly && withContextProps.checked === undefined) {\n event.preventDefault();\n }\n\n onClick?.(event);\n }}\n />\n\n <Icon indeterminate={indeterminate} {...getStyles('icon')} />\n </Box>\n </InlineInput>\n );\n});\n\nCheckbox.classes = { ...classes, ...InlineInputClasses };\nCheckbox.varsResolver = varsResolver;\nCheckbox.displayName = '@mantine/core/Checkbox';\nCheckbox.Group = CheckboxGroup;\nCheckbox.Indicator = CheckboxIndicator;\nCheckbox.Card = CheckboxCard;\n\nexport namespace Checkbox {\n export type Props = CheckboxProps;\n export type StylesNames = CheckboxStylesNames;\n export type CssVariables = CheckboxCssVariables;\n export type Factory = CheckboxFactory;\n export type Variant = CheckboxVariant;\n export type IconComponent = CheckboxIconComponent;\n\n export namespace Group {\n export type Props = CheckboxGroupProps;\n export type StylesNames = CheckboxGroupStylesNames;\n export type Factory = CheckboxGroupFactory;\n }\n\n export namespace Indicator {\n export type Props = CheckboxIndicatorProps;\n export type StylesNames = CheckboxIndicatorStylesNames;\n export type CssVariables = CheckboxIndicatorCssVariables;\n export type Factory = CheckboxIndicatorFactory;\n export type Variant = CheckboxIndicatorVariant;\n }\n\n export namespace Card {\n export type Props = CheckboxCardProps;\n export type StylesNames = CheckboxCardStylesNames;\n export type CssVariables = CheckboxCardCssVariables;\n export type Factory = CheckboxCardFactory;\n }\n}\n"],"mappings":"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"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Collapse.mjs","names":[],"sources":["../../../src/components/Collapse/Collapse.tsx"],"sourcesContent":["import { Activity } from 'react';\nimport { useCollapse, useHorizontalCollapse, useReducedMotion } from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n Factory,\n factory,\n getStyleObject,\n useMantineEnv,\n useMantineTheme,\n useProps,\n} from '../../core';\n\nexport interface CollapseProps extends BoxProps, Omit<React.ComponentProps<'div'>, keyof BoxProps> {\n /** Collapse orientation @default 'vertical' /\n orientation?: 'vertical' \| 'horizontal';\n\n /* Expanded state /\n expanded: boolean;\n\n /* Called when the transition ends /\n onTransitionEnd?: () => void;\n\n /* Called when transition starts /\n onTransitionStart?: () => void;\n\n /* Transition duration in ms @default 200 /\n transitionDuration?: number;\n\n /* Transition timing function @default ease /\n transitionTimingFunction?: string;\n\n /* Determines whether the opacity is animated @default true /\n animateOpacity?: boolean;\n\n /* If set, the element is kept in the DOM when collapsed. When `true`, React 19 `Activity` is used to preserve state while collapsed. When `false`, the element is unmounted after the exit animation. @default true */\n keepMounted?: boolean;\n}\n\nexport type CollapseFactory = Factory<{\n props: CollapseProps;\n ref: HTMLDivElement;\n}>;\n\nconst defaultProps = {\n transitionDuration: 200,\n transitionTimingFunction: 'ease',\n animateOpacity: true,\n orientation: 'vertical',\n keepMounted: true,\n} satisfies Partial<CollapseProps>;\n\nexport const Collapse = factory<CollapseFactory>((props) => {\n const {\n children,\n expanded,\n transitionDuration,\n transitionTimingFunction,\n style,\n onTransitionEnd,\n onTransitionStart,\n animateOpacity,\n keepMounted,\n ref,\n orientation,\n ...others\n } = useProps('Collapse', defaultProps, props);\n\n const env = useMantineEnv();\n const theme = useMantineTheme();\n const shouldReduceMotion = useReducedMotion();\n const reduceMotion = theme.respectReducedMotion ? shouldReduceMotion : false;\n const duration = reduceMotion ? 0 : transitionDuration;\n const hook = orientation === 'horizontal' ? useHorizontalCollapse : useCollapse;\n\n const collapse = hook({\n expanded,\n transitionDuration: duration,\n transitionTimingFunction,\n onTransitionEnd,\n onTransitionStart,\n keepMounted: false,\n });\n\n if (duration === 0) {\n if (keepMounted === true && env !== 'test') {\n return (\n <Activity mode={expanded ? 'visible' : 'hidden'}>\n <Box {...others}>{children}</Box>\n </Activity>\n );\n }\n return expanded ? <Box {...others}>{children}</Box> : null;\n }\n\n const isExited = collapse.state === 'exited';\n\n let content: React.ReactNode;\n if (keepMounted === false) {\n content = isExited ? null : children;\n } else if (keepMounted === true) {\n content = <Activity mode={isExited ? 'hidden' : 'visible'}>{children}</Activity>;\n } else {\n content = children;\n }\n\n return (\n <Box\n {...others}\n {...collapse.getCollapseProps({\n style: {\n opacity: expanded \|\| !animateOpacity ? 1 : 0,\n transition: animateOpacity ? `opacity ${duration}ms ${transitionTimingFunction}` : 'none',\n ...getStyleObject(style, theme),\n },\n ref,\n })}\n >\n {content}\n </Box>\n );\n});\n\nCollapse.displayName = '@mantine/core/Collapse';\n\nexport namespace Collapse {\n export type Props = CollapseProps;\n export type Factory = CollapseFactory;\n}\n"],"mappings":";;;;;;;;;;;AA4CA,MAAM,eAAe;CACnB,oBAAoB;CACpB,0BAA0B;CAC1B,gBAAgB;CAChB,aAAa;CACb,aAAa;AACf;AAEA,MAAa,WAAW,SAA0B,UAAU;CAC1D,MAAM,EACJ,UACA,UACA,oBACA,0BACA,OACA,iBACA,mBACA,gBACA,aACA,KACA,aACA,GAAG,WACD,SAAS,YAAY,cAAc,KAAK;CAE5C,MAAM,MAAM,cAAc;CAC1B,MAAM,QAAQ,gBAAgB;CAC9B,MAAM,qBAAqB,iBAAiB;CAE5C,MAAM,YADe,MAAM,uBAAuB,qBAAqB,SACvC,IAAI;CAGpC,MAAM,YAFO,gBAAgB,eAAe,wBAAwB,~~aAE9C~~;EACpB;EACA,oBAAoB;EACpB;EACA;EACA;EACA,aAAa;CACf,CAAC;CAED,IAAI,aAAa,GAAG;EAClB,IAAI,gBAAgB,QAAQ,QAAQ,QAClC,OACE,oBAAC,UAAD;GAAU,MAAM,WAAW,YAAY;aACrC,oBAAC,KAAD;IAAK,GAAI;IAAS;GAAc,CAAA;EACxB,CAAA;EAGd,OAAO,WAAW,oBAAC,KAAD;GAAK,GAAI;GAAS;EAAc,CAAA,IAAI;CACxD;CAEA,MAAM,WAAW,SAAS,UAAU;CAEpC,IAAI;CACJ,IAAI,gBAAgB,OAClB,UAAU,WAAW,OAAO;MACvB,IAAI,gBAAgB,MACzB,UAAU,oBAAC,UAAD;EAAU,MAAM,WAAW,WAAW;EAAY;CAAmB,CAAA;MAE/E,UAAU;CAGZ,OACE,oBAAC,KAAD;EACE,GAAI;EACJ,GAAI,SAAS,iBAAiB;GAC5B,OAAO;IACL,SAAS,YAAY,CAAC,iBAAiB,IAAI;IAC3C,YAAY,iBAAiB,WAAW,SAAS,KAAK,6BAA6B;IACnF,GAAG,eAAe,OAAO,KAAK;GAChC;GACA;EACF,CAAC;YAEA;CACE,CAAA;AAET,CAAC;AAED,SAAS,cAAc"}
1	+ {"version":3,"file":"Collapse.mjs","names":[],"sources":["../../../src/components/Collapse/Collapse.tsx"],"sourcesContent":["import { Activity } from 'react';\nimport { useCollapse, useHorizontalCollapse, useReducedMotion } from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n Factory,\n factory,\n getStyleObject,\n useMantineEnv,\n useMantineTheme,\n useProps,\n} from '../../core';\n\nexport interface CollapseProps extends BoxProps, Omit<React.ComponentProps<'div'>, keyof BoxProps> {\n /** Collapse orientation @default 'vertical' /\n orientation?: 'vertical' \| 'horizontal';\n\n /* Expanded state /\n expanded: boolean;\n\n /* Called when the transition ends /\n onTransitionEnd?: () => void;\n\n /* Called when transition starts /\n onTransitionStart?: () => void;\n\n /* Transition duration in ms @default 200 /\n transitionDuration?: number;\n\n /* Transition timing function @default ease /\n transitionTimingFunction?: string;\n\n /* Determines whether the opacity is animated @default true /\n animateOpacity?: boolean;\n\n /* If set, the element is kept in the DOM when collapsed. When `true`, React 19 `Activity` is used to preserve state while collapsed. When `false`, the element is unmounted after the exit animation. @default true */\n keepMounted?: boolean;\n}\n\nexport type CollapseFactory = Factory<{\n props: CollapseProps;\n ref: HTMLDivElement;\n}>;\n\nconst defaultProps = {\n transitionDuration: 200,\n transitionTimingFunction: 'ease',\n animateOpacity: true,\n orientation: 'vertical',\n keepMounted: true,\n} satisfies Partial<CollapseProps>;\n\nexport const Collapse = factory<CollapseFactory>((props) => {\n const {\n children,\n expanded,\n transitionDuration,\n transitionTimingFunction,\n style,\n onTransitionEnd,\n onTransitionStart,\n animateOpacity,\n keepMounted,\n ref,\n orientation,\n ...others\n } = useProps('Collapse', defaultProps, props);\n\n const env = useMantineEnv();\n const theme = useMantineTheme();\n const shouldReduceMotion = useReducedMotion();\n const reduceMotion = theme.respectReducedMotion ? shouldReduceMotion : false;\n const duration = reduceMotion ? 0 : transitionDuration;\n const hook = orientation === 'horizontal' ? useHorizontalCollapse : useCollapse;\n\n const collapse = hook({\n expanded,\n transitionDuration: duration,\n transitionTimingFunction,\n onTransitionEnd,\n onTransitionStart,\n keepMounted: false,\n });\n\n if (duration === 0) {\n if (keepMounted === true && env !== 'test') {\n return (\n <Activity mode={expanded ? 'visible' : 'hidden'}>\n <Box {...others}>{children}</Box>\n </Activity>\n );\n }\n return expanded ? <Box {...others}>{children}</Box> : null;\n }\n\n const isExited = collapse.state === 'exited';\n\n let content: React.ReactNode;\n if (keepMounted === false) {\n content = isExited ? null : children;\n } else if (keepMounted === true) {\n content = <Activity mode={isExited ? 'hidden' : 'visible'}>{children}</Activity>;\n } else {\n content = children;\n }\n\n return (\n <Box\n {...others}\n {...collapse.getCollapseProps({\n style: {\n opacity: expanded \|\| !animateOpacity ? 1 : 0,\n transition: animateOpacity ? `opacity ${duration}ms ${transitionTimingFunction}` : 'none',\n ...getStyleObject(style, theme),\n },\n ref,\n })}\n >\n {content}\n </Box>\n );\n});\n\nCollapse.displayName = '@mantine/core/Collapse';\n\nexport namespace Collapse {\n export type Props = CollapseProps;\n export type Factory = CollapseFactory;\n}\n"],"mappings":";;;;;;;;;;;AA4CA,MAAM,eAAe;CACnB,oBAAoB;CACpB,0BAA0B;CAC1B,gBAAgB;CAChB,aAAa;CACb,aAAa;AACf;AAEA,MAAa,WAAW,SAA0B,UAAU;CAC1D,MAAM,EACJ,UACA,UACA,oBACA,0BACA,OACA,iBACA,mBACA,gBACA,aACA,KACA,aACA,GAAG,WACD,SAAS,YAAY,cAAc,KAAK;CAE5C,MAAM,MAAM,cAAc;CAC1B,MAAM,QAAQ,gBAAgB;CAC9B,MAAM,qBAAqB,iBAAiB;CAE5C,MAAM,YADe,MAAM,uBAAuB,qBAAqB,SACvC,IAAI;CAGpC,MAAM,YAFO,gBAAgB,eAAe,wBAAwB,YAAA,CAE9C;EACpB;EACA,oBAAoB;EACpB;EACA;EACA;EACA,aAAa;CACf,CAAC;CAED,IAAI,aAAa,GAAG;EAClB,IAAI,gBAAgB,QAAQ,QAAQ,QAClC,OACE,oBAAC,UAAD;GAAU,MAAM,WAAW,YAAY;aACrC,oBAAC,KAAD;IAAK,GAAI;IAAS;GAAc,CAAA;EACxB,CAAA;EAGd,OAAO,WAAW,oBAAC,KAAD;GAAK,GAAI;GAAS;EAAc,CAAA,IAAI;CACxD;CAEA,MAAM,WAAW,SAAS,UAAU;CAEpC,IAAI;CACJ,IAAI,gBAAgB,OAClB,UAAU,WAAW,OAAO;MACvB,IAAI,gBAAgB,MACzB,UAAU,oBAAC,UAAD;EAAU,MAAM,WAAW,WAAW;EAAY;CAAmB,CAAA;MAE/E,UAAU;CAGZ,OACE,oBAAC,KAAD;EACE,GAAI;EACJ,GAAI,SAAS,iBAAiB;GAC5B,OAAO;IACL,SAAS,YAAY,CAAC,iBAAiB,IAAI;IAC3C,YAAY,iBAAiB,WAAW,SAAS,KAAK,6BAA6B;IACnF,GAAG,eAAe,OAAO,KAAK;GAChC;GACA;EACF,CAAC;YAEA;CACE,CAAA;AAET,CAAC;AAED,SAAS,cAAc"}

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

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

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ColorSlider.mjs","names":["classes"],"sources":["../../../../src/components/ColorPicker/ColorSlider/ColorSlider.tsx"],"sourcesContent":["import { use, useRef, useState } from 'react';\nimport {\n clampUseMovePosition,\n useDidUpdate,\n useMergedRef,\n useMove,\n UseMovePosition,\n} from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n ElementProps,\n factory,\n Factory,\n MantineSize,\n rem,\n StylesApiProps,\n useMantineTheme,\n useProps,\n useStyles,\n} from '../../../core';\nimport { ColorPickerContext } from '../ColorPicker.context';\nimport { Thumb } from '../Thumb/Thumb';\nimport classes from '../ColorPicker.module.css';\n\nexport type ColorSliderStylesNames = 'slider' \| 'sliderOverlay' \| 'thumb';\n\nexport interface __ColorSliderProps extends ElementProps<'div', 'onChange'> {\n /** Controlled component value /\n value: number;\n\n /* Called when value changes /\n onChange?: (value: number) => void;\n\n /* Called when user stops dragging the slider or uses keyboard to change value /\n onChangeEnd?: (value: number) => void;\n\n /* Called when user starts dragging the slider /\n onScrubStart?: () => void;\n\n /* Called when user stops dragging the slider /\n onScrubEnd?: () => void;\n\n /* Slider size @default 'md' /\n size?: MantineSize \| (string & {});\n\n /* If set, slider thumb can be focused @default true /\n focusable?: boolean;\n}\n\nexport interface ColorSliderProps\n extends\n BoxProps,\n StylesApiProps<ColorSliderFactory>,\n __ColorSliderProps,\n ElementProps<'div', 'onChange'> {\n __staticSelector?: string;\n maxValue: number;\n overlays: React.CSSProperties[];\n round: boolean;\n thumbColor?: string;\n}\n\nexport type ColorSliderOptions = Omit<\n ColorSliderProps,\n 'maxValue' \| 'overlays' \| 'round' \| 'thumbColor'\n>;\n\nexport type ColorSliderFactory = Factory<{\n props: ColorSliderProps;\n ref: HTMLDivElement;\n stylesNames: ColorSliderStylesNames;\n}>;\n\nexport const ColorSlider = factory<ColorSliderFactory>((_props) => {\n const props = useProps('ColorSlider', null, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n onChange,\n onChangeEnd,\n maxValue,\n round,\n size = 'md',\n focusable = true,\n value,\n overlays,\n thumbColor = 'transparent',\n onScrubStart,\n onScrubEnd,\n __staticSelector = 'ColorPicker',\n attributes,\n ref,\n ...others\n } = props;\n\n const _getStyles = useStyles<ColorSliderFactory>({\n name: __staticSelector,\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n rootSelector: 'slider',\n });\n\n const ctxGetStyles = use(ColorPickerContext)?.getStyles;\n const getStyles = ctxGetStyles \|\| _getStyles;\n\n const theme = useMantineTheme();\n const [position, setPosition] = useState({ y: 0, x: value / maxValue });\n const positionRef = useRef(position);\n const getChangeValue = (val: number) => (round ? Math.round(val maxValue) : val * maxValue);\n const { ref: sliderRef } = useMove(\n ({ x, y }) => {\n positionRef.current = { x, y };\n onChange?.(getChangeValue(x));\n },\n {\n onScrubEnd: () => {\n const { x } = positionRef.current;\n onChangeEnd?.(getChangeValue(x));\n onScrubEnd?.();\n },\n onScrubStart,\n }\n );\n\n useDidUpdate(() => {\n setPosition({ y: 0, x: value / maxValue });\n }, [value]);\n\n const handleArrow = (event: React.KeyboardEvent<HTMLDivElement>, pos: UseMovePosition) => {\n event.preventDefault();\n const _position = clampUseMovePosition(pos);\n onChange?.(getChangeValue(_position.x));\n onChangeEnd?.(getChangeValue(_position.x));\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n switch (event.key) {\n case 'ArrowRight': {\n handleArrow(event, { x: position.x + 0.05, y: position.y });\n break;\n }\n\n case 'ArrowLeft': {\n handleArrow(event, { x: position.x - 0.05, y: position.y });\n break;\n }\n }\n };\n\n const layers = overlays.map((overlay, index) => (\n <div {...getStyles('sliderOverlay')} style={overlay} key={index} />\n ));\n\n return (\n <Box\n {...others}\n ref={useMergedRef(sliderRef, ref)}\n {...getStyles('slider')}\n size={size}\n role=\"slider\"\n aria-valuenow={value}\n aria-valuemax={maxValue}\n aria-valuemin={0}\n tabIndex={focusable ? 0 : -1}\n onKeyDown={handleKeyDown}\n data-focus-ring={theme.focusRing}\n __vars={{\n '--cp-thumb-size': `var(--cp-thumb-size-${size})`,\n }}\n >\n {layers}\n\n <Thumb\n position={position}\n {...getStyles('thumb', { style: { top: rem(1), background: thumbColor } })}\n />\n </Box>\n );\n});\n\nColorSlider.displayName = '@mantine/core/ColorSlider';\nColorSlider.classes = classes;\n"],"mappings":";;;;;;;;;;;;;;AA0EA,MAAa,cAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,MAAM,MAAM;CAClD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,aACA,UACA,OACA,OAAO,MACP,YAAY,MACZ,OACA,UACA,aAAa,eACb,cACA,YACA,mBAAmB,eACnB,YACA,KACA,GAAG,WACD;CAEJ,MAAM,aAAa,UAA8B;EAC/C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;CAChB,CAAC;CAGD,MAAM,YADe,IAAI,kBAAkB,~~GAAG~~,aACZ;CAElC,MAAM,QAAQ,gBAAgB;CAC9B,MAAM,CAAC,UAAU,eAAe,SAAS;EAAE,GAAG;EAAG,GAAG,QAAQ;CAAS,CAAC;CACtE,MAAM,cAAc,OAAO,QAAQ;CACnC,MAAM,kBAAkB,QAAiB,QAAQ,KAAK,MAAM,MAAM,QAAQ,IAAI,MAAM;CACpF,MAAM,EAAE,KAAK,cAAc,SACxB,EAAE,GAAG,QAAQ;EACZ,YAAY,UAAU;GAAE;GAAG;EAAE;EAC7B,WAAW,eAAe,CAAC,CAAC;CAC9B,GACA;EACE,kBAAkB;GAChB,MAAM,EAAE,MAAM,YAAY;GAC1B,cAAc,eAAe,CAAC,CAAC;GAC/B,aAAa;EACf;EACA;CACF,CACF;CAEA,mBAAmB;EACjB,YAAY;GAAE,GAAG;GAAG,GAAG,QAAQ;EAAS,CAAC;CAC3C,GAAG,CAAC,KAAK,CAAC;CAEV,MAAM,eAAe,OAA4C,QAAyB;EACxF,MAAM,eAAe;EACrB,MAAM,YAAY,qBAAqB,GAAG;EAC1C,WAAW,eAAe,UAAU,CAAC,CAAC;EACtC,cAAc,eAAe,UAAU,CAAC,CAAC;CAC3C;CAEA,MAAM,iBAAiB,UAA+C;EACpE,QAAQ,MAAM,KAAd;GACE,KAAK;IACH,YAAY,OAAO;KAAE,GAAG,SAAS,IAAI;KAAM,GAAG,SAAS;IAAE,CAAC;IAC1D;GAGF,KAAK;IACH,YAAY,OAAO;KAAE,GAAG,SAAS,IAAI;KAAM,GAAG,SAAS;IAAE,CAAC;IAC1D;EAEJ;CACF;CAEA,MAAM,SAAS,SAAS,KAAK,SAAS,UACpC,8BAAC,OAAD;EAAK,GAAI,UAAU,eAAe;EAAG,OAAO;EAAS,KAAK;CAAQ,CAAA,CACnE;CAED,OACE,qBAAC,KAAD;EACE,GAAI;EACJ,KAAK,aAAa,WAAW,GAAG;EAChC,GAAI,UAAU,QAAQ;EAChB;EACN,MAAK;EACL,iBAAe;EACf,iBAAe;EACf,iBAAe;EACf,UAAU,YAAY,IAAI;EAC1B,WAAW;EACX,mBAAiB,MAAM;EACvB,QAAQ,EACN,mBAAmB,uBAAuB,KAAK,GACjD;YAdF,CAgBG,QAED,oBAAC,OAAD;GACY;GACV,GAAI,UAAU,SAAS,EAAE,OAAO;IAAE,KAAK,IAAI,CAAC;IAAG,YAAY;GAAW,EAAE,CAAC;EAC1E,CAAA,CACE;;AAET,CAAC;AAED,YAAY,cAAc;AAC1B,YAAY,UAAUA"}
1	+ {"version":3,"file":"ColorSlider.mjs","names":["classes"],"sources":["../../../../src/components/ColorPicker/ColorSlider/ColorSlider.tsx"],"sourcesContent":["import { use, useRef, useState } from 'react';\nimport {\n clampUseMovePosition,\n useDidUpdate,\n useMergedRef,\n useMove,\n UseMovePosition,\n} from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n ElementProps,\n factory,\n Factory,\n MantineSize,\n rem,\n StylesApiProps,\n useMantineTheme,\n useProps,\n useStyles,\n} from '../../../core';\nimport { ColorPickerContext } from '../ColorPicker.context';\nimport { Thumb } from '../Thumb/Thumb';\nimport classes from '../ColorPicker.module.css';\n\nexport type ColorSliderStylesNames = 'slider' \| 'sliderOverlay' \| 'thumb';\n\nexport interface __ColorSliderProps extends ElementProps<'div', 'onChange'> {\n /** Controlled component value /\n value: number;\n\n /* Called when value changes /\n onChange?: (value: number) => void;\n\n /* Called when user stops dragging the slider or uses keyboard to change value /\n onChangeEnd?: (value: number) => void;\n\n /* Called when user starts dragging the slider /\n onScrubStart?: () => void;\n\n /* Called when user stops dragging the slider /\n onScrubEnd?: () => void;\n\n /* Slider size @default 'md' /\n size?: MantineSize \| (string & {});\n\n /* If set, slider thumb can be focused @default true /\n focusable?: boolean;\n}\n\nexport interface ColorSliderProps\n extends\n BoxProps,\n StylesApiProps<ColorSliderFactory>,\n __ColorSliderProps,\n ElementProps<'div', 'onChange'> {\n __staticSelector?: string;\n maxValue: number;\n overlays: React.CSSProperties[];\n round: boolean;\n thumbColor?: string;\n}\n\nexport type ColorSliderOptions = Omit<\n ColorSliderProps,\n 'maxValue' \| 'overlays' \| 'round' \| 'thumbColor'\n>;\n\nexport type ColorSliderFactory = Factory<{\n props: ColorSliderProps;\n ref: HTMLDivElement;\n stylesNames: ColorSliderStylesNames;\n}>;\n\nexport const ColorSlider = factory<ColorSliderFactory>((_props) => {\n const props = useProps('ColorSlider', null, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n onChange,\n onChangeEnd,\n maxValue,\n round,\n size = 'md',\n focusable = true,\n value,\n overlays,\n thumbColor = 'transparent',\n onScrubStart,\n onScrubEnd,\n __staticSelector = 'ColorPicker',\n attributes,\n ref,\n ...others\n } = props;\n\n const _getStyles = useStyles<ColorSliderFactory>({\n name: __staticSelector,\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n rootSelector: 'slider',\n });\n\n const ctxGetStyles = use(ColorPickerContext)?.getStyles;\n const getStyles = ctxGetStyles \|\| _getStyles;\n\n const theme = useMantineTheme();\n const [position, setPosition] = useState({ y: 0, x: value / maxValue });\n const positionRef = useRef(position);\n const getChangeValue = (val: number) => (round ? Math.round(val maxValue) : val * maxValue);\n const { ref: sliderRef } = useMove(\n ({ x, y }) => {\n positionRef.current = { x, y };\n onChange?.(getChangeValue(x));\n },\n {\n onScrubEnd: () => {\n const { x } = positionRef.current;\n onChangeEnd?.(getChangeValue(x));\n onScrubEnd?.();\n },\n onScrubStart,\n }\n );\n\n useDidUpdate(() => {\n setPosition({ y: 0, x: value / maxValue });\n }, [value]);\n\n const handleArrow = (event: React.KeyboardEvent<HTMLDivElement>, pos: UseMovePosition) => {\n event.preventDefault();\n const _position = clampUseMovePosition(pos);\n onChange?.(getChangeValue(_position.x));\n onChangeEnd?.(getChangeValue(_position.x));\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n switch (event.key) {\n case 'ArrowRight': {\n handleArrow(event, { x: position.x + 0.05, y: position.y });\n break;\n }\n\n case 'ArrowLeft': {\n handleArrow(event, { x: position.x - 0.05, y: position.y });\n break;\n }\n }\n };\n\n const layers = overlays.map((overlay, index) => (\n <div {...getStyles('sliderOverlay')} style={overlay} key={index} />\n ));\n\n return (\n <Box\n {...others}\n ref={useMergedRef(sliderRef, ref)}\n {...getStyles('slider')}\n size={size}\n role=\"slider\"\n aria-valuenow={value}\n aria-valuemax={maxValue}\n aria-valuemin={0}\n tabIndex={focusable ? 0 : -1}\n onKeyDown={handleKeyDown}\n data-focus-ring={theme.focusRing}\n __vars={{\n '--cp-thumb-size': `var(--cp-thumb-size-${size})`,\n }}\n >\n {layers}\n\n <Thumb\n position={position}\n {...getStyles('thumb', { style: { top: rem(1), background: thumbColor } })}\n />\n </Box>\n );\n});\n\nColorSlider.displayName = '@mantine/core/ColorSlider';\nColorSlider.classes = classes;\n"],"mappings":";;;;;;;;;;;;;;AA0EA,MAAa,cAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,MAAM,MAAM;CAClD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,aACA,UACA,OACA,OAAO,MACP,YAAY,MACZ,OACA,UACA,aAAa,eACb,cACA,YACA,mBAAmB,eACnB,YACA,KACA,GAAG,WACD;CAEJ,MAAM,aAAa,UAA8B;EAC/C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;CAChB,CAAC;CAGD,MAAM,YADe,IAAI,kBAAkB,CAAC,EAAE,aACZ;CAElC,MAAM,QAAQ,gBAAgB;CAC9B,MAAM,CAAC,UAAU,eAAe,SAAS;EAAE,GAAG;EAAG,GAAG,QAAQ;CAAS,CAAC;CACtE,MAAM,cAAc,OAAO,QAAQ;CACnC,MAAM,kBAAkB,QAAiB,QAAQ,KAAK,MAAM,MAAM,QAAQ,IAAI,MAAM;CACpF,MAAM,EAAE,KAAK,cAAc,SACxB,EAAE,GAAG,QAAQ;EACZ,YAAY,UAAU;GAAE;GAAG;EAAE;EAC7B,WAAW,eAAe,CAAC,CAAC;CAC9B,GACA;EACE,kBAAkB;GAChB,MAAM,EAAE,MAAM,YAAY;GAC1B,cAAc,eAAe,CAAC,CAAC;GAC/B,aAAa;EACf;EACA;CACF,CACF;CAEA,mBAAmB;EACjB,YAAY;GAAE,GAAG;GAAG,GAAG,QAAQ;EAAS,CAAC;CAC3C,GAAG,CAAC,KAAK,CAAC;CAEV,MAAM,eAAe,OAA4C,QAAyB;EACxF,MAAM,eAAe;EACrB,MAAM,YAAY,qBAAqB,GAAG;EAC1C,WAAW,eAAe,UAAU,CAAC,CAAC;EACtC,cAAc,eAAe,UAAU,CAAC,CAAC;CAC3C;CAEA,MAAM,iBAAiB,UAA+C;EACpE,QAAQ,MAAM,KAAd;GACE,KAAK;IACH,YAAY,OAAO;KAAE,GAAG,SAAS,IAAI;KAAM,GAAG,SAAS;IAAE,CAAC;IAC1D;GAGF,KAAK;IACH,YAAY,OAAO;KAAE,GAAG,SAAS,IAAI;KAAM,GAAG,SAAS;IAAE,CAAC;IAC1D;EAEJ;CACF;CAEA,MAAM,SAAS,SAAS,KAAK,SAAS,UACpC,8BAAC,OAAD;EAAK,GAAI,UAAU,eAAe;EAAG,OAAO;EAAS,KAAK;CAAQ,CAAA,CACnE;CAED,OACE,qBAAC,KAAD;EACE,GAAI;EACJ,KAAK,aAAa,WAAW,GAAG;EAChC,GAAI,UAAU,QAAQ;EAChB;EACN,MAAK;EACL,iBAAe;EACf,iBAAe;EACf,iBAAe;EACf,UAAU,YAAY,IAAI;EAC1B,WAAW;EACX,mBAAiB,MAAM;EACvB,QAAQ,EACN,mBAAmB,uBAAuB,KAAK,GACjD;YAdF,CAgBG,QAED,oBAAC,OAAD;GACY;GACV,GAAI,UAAU,SAAS,EAAE,OAAO;IAAE,KAAK,IAAI,CAAC;IAAG,YAAY;GAAW,EAAE,CAAC;EAC1E,CAAA,CACE;;AAET,CAAC;AAED,YAAY,cAAc;AAC1B,YAAY,UAAUA"}

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

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

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

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

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

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

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ComboboxFooter.mjs","names":["classes"],"sources":["../../../../src/components/Combobox/ComboboxFooter/ComboboxFooter.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n CompoundStylesApiProps,\n ElementProps,\n factory,\n Factory,\n useProps,\n} from '../../../core';\nimport { useComboboxContext } from '../Combobox.context';\nimport classes from '../Combobox.module.css';\n\nexport type ComboboxFooterStylesNames = 'footer';\n\nexport interface ComboboxFooterProps\n extends BoxProps, CompoundStylesApiProps<ComboboxFooterFactory>, ElementProps<'div'> {}\n\nexport type ComboboxFooterFactory = Factory<{\n props: ComboboxFooterProps;\n ref: HTMLDivElement;\n stylesNames: ComboboxFooterStylesNames;\n compound: true;\n}>;\n\nexport const ComboboxFooter = factory<ComboboxFooterFactory>((props) => {\n const { classNames, className, style, styles, vars, ...others } = useProps(\n 'ComboboxFooter',\n null,\n props\n );\n\n const ctx = useComboboxContext();\n\n return (\n <Box\n {...ctx.getStyles('footer', { className, classNames, style, styles })}\n {...others}\n onMouseDown={(event) => {\n event.preventDefault();\n }}\n />\n );\n});\n\nComboboxFooter.classes = classes;\nComboboxFooter.displayName = '@mantine/core/ComboboxFooter';\n"],"mappings":";;;;;;;;AAwBA,MAAa,iBAAiB,SAAgC,UAAU;CACtE,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,GAAG,WAAW,SAChE,kBACA,MACA,KACF;CAIA,OACE,oBAAC,KAAD;EACE,GAJQ,mBAIF,~~EAAE~~,UAAU,UAAU;GAAE;GAAW;GAAY;GAAO;EAAO,CAAC;EACpE,GAAI;EACJ,cAAc,UAAU;GACtB,MAAM,eAAe;EACvB;CACD,CAAA;AAEL,CAAC;AAED,eAAe,UAAUA;AACzB,eAAe,cAAc"}
1	+ {"version":3,"file":"ComboboxFooter.mjs","names":["classes"],"sources":["../../../../src/components/Combobox/ComboboxFooter/ComboboxFooter.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n CompoundStylesApiProps,\n ElementProps,\n factory,\n Factory,\n useProps,\n} from '../../../core';\nimport { useComboboxContext } from '../Combobox.context';\nimport classes from '../Combobox.module.css';\n\nexport type ComboboxFooterStylesNames = 'footer';\n\nexport interface ComboboxFooterProps\n extends BoxProps, CompoundStylesApiProps<ComboboxFooterFactory>, ElementProps<'div'> {}\n\nexport type ComboboxFooterFactory = Factory<{\n props: ComboboxFooterProps;\n ref: HTMLDivElement;\n stylesNames: ComboboxFooterStylesNames;\n compound: true;\n}>;\n\nexport const ComboboxFooter = factory<ComboboxFooterFactory>((props) => {\n const { classNames, className, style, styles, vars, ...others } = useProps(\n 'ComboboxFooter',\n null,\n props\n );\n\n const ctx = useComboboxContext();\n\n return (\n <Box\n {...ctx.getStyles('footer', { className, classNames, style, styles })}\n {...others}\n onMouseDown={(event) => {\n event.preventDefault();\n }}\n />\n );\n});\n\nComboboxFooter.classes = classes;\nComboboxFooter.displayName = '@mantine/core/ComboboxFooter';\n"],"mappings":";;;;;;;;AAwBA,MAAa,iBAAiB,SAAgC,UAAU;CACtE,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,GAAG,WAAW,SAChE,kBACA,MACA,KACF;CAIA,OACE,oBAAC,KAAD;EACE,GAJQ,mBAIF,CAAC,CAAC,UAAU,UAAU;GAAE;GAAW;GAAY;GAAO;EAAO,CAAC;EACpE,GAAI;EACJ,cAAc,UAAU;GACtB,MAAM,eAAe;EACvB;CACD,CAAA;AAEL,CAAC;AAED,eAAe,UAAUA;AACzB,eAAe,cAAc"}

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

@@ -11,9 +11,10 @@ const ComboboxGroup = factory((props) => {
 	const { classNames, className, style, styles, vars, children, label, id, ...others } = useProps("ComboboxGroup", null, props);
 	const ctx = useComboboxContext();
 	const _id = useId(id);
+	const hasLabel = label !== void 0 && label !== null && label !== false && label !== "";
 	return /* @__PURE__ */ jsxs(Box, {
 		role: "group",
-		"aria-labelledby": label ? _id : void 0,
+		"aria-labelledby": hasLabel ? _id : void 0,
 		...ctx.getStyles("group", {
 			className,
 			classNames,
@@ -21,7 +22,7 @@ const ComboboxGroup = factory((props) => {
 			styles
 		}),
 		...others,
-		children: [label && /* @__PURE__ */ jsx("div", {
+		children: [hasLabel && /* @__PURE__ */ jsx("div", {
 			id: _id,
 			...ctx.getStyles("groupLabel", {
 				classNames,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ComboboxGroup.mjs","names":["classes"],"sources":["../../../../src/components/Combobox/ComboboxGroup/ComboboxGroup.tsx"],"sourcesContent":["import { useId } from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n CompoundStylesApiProps,\n ElementProps,\n factory,\n Factory,\n useProps,\n} from '../../../core';\nimport { useComboboxContext } from '../Combobox.context';\nimport classes from '../Combobox.module.css';\n\nexport type ComboboxGroupStylesNames = 'group' \| 'groupLabel';\n\nexport interface ComboboxGroupProps\n extends BoxProps, CompoundStylesApiProps<ComboboxGroupFactory>, ElementProps<'div'> {\n /** Group label */\n label?: React.ReactNode;\n}\n\nexport type ComboboxGroupFactory = Factory<{\n props: ComboboxGroupProps;\n ref: HTMLDivElement;\n stylesNames: ComboboxGroupStylesNames;\n compound: true;\n}>;\n\nexport const ComboboxGroup = factory<ComboboxGroupFactory>((props) => {\n const { classNames, className, style, styles, vars, children, label, id, ...others } = useProps(\n 'ComboboxGroup',\n null,\n props\n );\n\n const ctx = useComboboxContext();\n const _id = useId(id);\n\n return (\n <Box\n role=\"group\"\n aria-labelledby={~~label~~ ? _id : undefined}\n {...ctx.getStyles('group', { className, classNames, style, styles })}\n {...others}\n >\n {~~label~~ && (\n <div id={_id} {...ctx.getStyles('groupLabel', { classNames, styles })}>\n {label}\n </div>\n )}\n {children}\n </Box>\n );\n});\n\nComboboxGroup.classes = classes;\nComboboxGroup.displayName = '@mantine/core/ComboboxGroup';\n"],"mappings":";;;;;;;;;AA4BA,MAAa,gBAAgB,SAA+B,UAAU;CACpE,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,UAAU,OAAO,IAAI,GAAG,WAAW,SACrF,iBACA,MACA,KACF;CAEA,MAAM,MAAM,mBAAmB;CAC/B,MAAM,MAAM,MAAM,EAAE;CAEpB,OACE,qBAAC,KAAD;EACE,MAAK;EACL,mBAAiB,~~QAAQ~~,MAAM,KAAA;~~EAC/B~~,GAAI,IAAI,UAAU,SAAS;GAAE;GAAW;GAAY;GAAO;EAAO,CAAC;EACnE,GAAI;YAJN,CAMG,~~SACC~~,oBAAC,OAAD;GAAK,IAAI;GAAK,GAAI,IAAI,UAAU,cAAc;IAAE;IAAY;GAAO,CAAC;aACjE;EACE,CAAA,GAEN,QACE;;AAET,CAAC;AAED,cAAc,UAAUA;AACxB,cAAc,cAAc"}
1	+ {"version":3,"file":"ComboboxGroup.mjs","names":["classes"],"sources":["../../../../src/components/Combobox/ComboboxGroup/ComboboxGroup.tsx"],"sourcesContent":["import { useId } from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n CompoundStylesApiProps,\n ElementProps,\n factory,\n Factory,\n useProps,\n} from '../../../core';\nimport { useComboboxContext } from '../Combobox.context';\nimport classes from '../Combobox.module.css';\n\nexport type ComboboxGroupStylesNames = 'group' \| 'groupLabel';\n\nexport interface ComboboxGroupProps\n extends BoxProps, CompoundStylesApiProps<ComboboxGroupFactory>, ElementProps<'div'> {\n /** Group label */\n label?: React.ReactNode;\n}\n\nexport type ComboboxGroupFactory = Factory<{\n props: ComboboxGroupProps;\n ref: HTMLDivElement;\n stylesNames: ComboboxGroupStylesNames;\n compound: true;\n}>;\n\nexport const ComboboxGroup = factory<ComboboxGroupFactory>((props) => {\n const { classNames, className, style, styles, vars, children, label, id, ...others } = useProps(\n 'ComboboxGroup',\n null,\n props\n );\n\n const ctx = useComboboxContext();\n const _id = useId(id);\n\n const hasLabel = label !== undefined && label !== null && label !== false && label !== '';\n\n return (\n <Box\n role=\"group\"\n aria-labelledby={hasLabel ? _id : undefined}\n {...ctx.getStyles('group', { className, classNames, style, styles })}\n {...others}\n >\n {hasLabel && (\n <div id={_id} {...ctx.getStyles('groupLabel', { classNames, styles })}>\n {label}\n </div>\n )}\n {children}\n </Box>\n );\n});\n\nComboboxGroup.classes = classes;\nComboboxGroup.displayName = '@mantine/core/ComboboxGroup';\n"],"mappings":";;;;;;;;;AA4BA,MAAa,gBAAgB,SAA+B,UAAU;CACpE,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,UAAU,OAAO,IAAI,GAAG,WAAW,SACrF,iBACA,MACA,KACF;CAEA,MAAM,MAAM,mBAAmB;CAC/B,MAAM,MAAM,MAAM,EAAE;CAEpB,MAAM,WAAW,UAAU,KAAA,KAAa,UAAU,QAAQ,UAAU,SAAS,UAAU;CAEvF,OACE,qBAAC,KAAD;EACE,MAAK;EACL,mBAAiB,WAAW,MAAM,KAAA;EAClC,GAAI,IAAI,UAAU,SAAS;GAAE;GAAW;GAAY;GAAO;EAAO,CAAC;EACnE,GAAI;YAJN,CAMG,YACC,oBAAC,OAAD;GAAK,IAAI;GAAK,GAAI,IAAI,UAAU,cAAc;IAAE;IAAY;GAAO,CAAC;aACjE;EACE,CAAA,GAEN,QACE;;AAET,CAAC;AAED,cAAc,UAAUA;AACxB,cAAc,cAAc"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ComboboxHeader.mjs","names":["classes"],"sources":["../../../../src/components/Combobox/ComboboxHeader/ComboboxHeader.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n CompoundStylesApiProps,\n ElementProps,\n factory,\n Factory,\n useProps,\n} from '../../../core';\nimport { useComboboxContext } from '../Combobox.context';\nimport classes from '../Combobox.module.css';\n\nexport type ComboboxHeaderStylesNames = 'header';\n\nexport interface ComboboxHeaderProps\n extends BoxProps, CompoundStylesApiProps<ComboboxHeaderFactory>, ElementProps<'div'> {}\n\nexport type ComboboxHeaderFactory = Factory<{\n props: ComboboxHeaderProps;\n ref: HTMLDivElement;\n stylesNames: ComboboxHeaderStylesNames;\n compound: true;\n}>;\n\nexport const ComboboxHeader = factory<ComboboxHeaderFactory>((props) => {\n const { classNames, className, style, styles, vars, ...others } = useProps(\n 'ComboboxHeader',\n null,\n props\n );\n\n const ctx = useComboboxContext();\n\n return (\n <Box\n {...ctx.getStyles('header', { className, classNames, style, styles })}\n {...others}\n onMouseDown={(event) => {\n event.preventDefault();\n }}\n />\n );\n});\n\nComboboxHeader.classes = classes;\nComboboxHeader.displayName = '@mantine/core/ComboboxHeader';\n"],"mappings":";;;;;;;;AAwBA,MAAa,iBAAiB,SAAgC,UAAU;CACtE,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,GAAG,WAAW,SAChE,kBACA,MACA,KACF;CAIA,OACE,oBAAC,KAAD;EACE,GAJQ,mBAIF,~~EAAE~~,UAAU,UAAU;GAAE;GAAW;GAAY;GAAO;EAAO,CAAC;EACpE,GAAI;EACJ,cAAc,UAAU;GACtB,MAAM,eAAe;EACvB;CACD,CAAA;AAEL,CAAC;AAED,eAAe,UAAUA;AACzB,eAAe,cAAc"}
1	+ {"version":3,"file":"ComboboxHeader.mjs","names":["classes"],"sources":["../../../../src/components/Combobox/ComboboxHeader/ComboboxHeader.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n CompoundStylesApiProps,\n ElementProps,\n factory,\n Factory,\n useProps,\n} from '../../../core';\nimport { useComboboxContext } from '../Combobox.context';\nimport classes from '../Combobox.module.css';\n\nexport type ComboboxHeaderStylesNames = 'header';\n\nexport interface ComboboxHeaderProps\n extends BoxProps, CompoundStylesApiProps<ComboboxHeaderFactory>, ElementProps<'div'> {}\n\nexport type ComboboxHeaderFactory = Factory<{\n props: ComboboxHeaderProps;\n ref: HTMLDivElement;\n stylesNames: ComboboxHeaderStylesNames;\n compound: true;\n}>;\n\nexport const ComboboxHeader = factory<ComboboxHeaderFactory>((props) => {\n const { classNames, className, style, styles, vars, ...others } = useProps(\n 'ComboboxHeader',\n null,\n props\n );\n\n const ctx = useComboboxContext();\n\n return (\n <Box\n {...ctx.getStyles('header', { className, classNames, style, styles })}\n {...others}\n onMouseDown={(event) => {\n event.preventDefault();\n }}\n />\n );\n});\n\nComboboxHeader.classes = classes;\nComboboxHeader.displayName = '@mantine/core/ComboboxHeader';\n"],"mappings":";;;;;;;;AAwBA,MAAa,iBAAiB,SAAgC,UAAU;CACtE,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,GAAG,WAAW,SAChE,kBACA,MACA,KACF;CAIA,OACE,oBAAC,KAAD;EACE,GAJQ,mBAIF,CAAC,CAAC,UAAU,UAAU;GAAE;GAAW;GAAY;GAAO;EAAO,CAAC;EACpE,GAAI;EACJ,cAAc,UAAU;GACtB,MAAM,eAAe;EACvB;CACD,CAAA;AAEL,CAAC;AAED,eAAe,UAAUA;AACzB,eAAe,cAAc"}

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

@@ -60,7 +60,7 @@ function OptionsDropdown({ data, hidden, hiddenWhenEmpty, filter, search, limit,
 		limit: limit ?? Infinity
 	}) : data;
 	const isEmpty = isEmptyComboboxData(filteredData);
-	const options = filteredData.map((item) => /* @__PURE__ */ jsx(Option, {
+	const options = filteredData.map((item, index) => /* @__PURE__ */ jsx(Option, {
 		data: item,
 		withCheckIcon,
 		withAlignedLabels,
@@ -68,7 +68,7 @@ function OptionsDropdown({ data, hidden, hiddenWhenEmpty, filter, search, limit,
 		checkIconPosition,
 		unstyled,
 		renderOption
-	}, isOptionsGroup(item) ? item.group : `${item.value}`));
+	}, isOptionsGroup(item) ? `group-${typeof item.group === "string" ? item.group : index}` : `${item.value}`));
 	return /* @__PURE__ */ jsx(Combobox.Dropdown, {
 		hidden: hidden || hiddenWhenEmpty && isEmpty,
 		"data-composed": true,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"OptionsDropdown.mjs","names":["classes"],"sources":["../../../../src/components/Combobox/OptionsDropdown/OptionsDropdown.tsx"],"sourcesContent":["import cx from 'clsx';\nimport { Primitive } from '../../../core';\nimport { CheckIcon } from '../../Checkbox';\nimport { ScrollArea, ScrollAreaProps } from '../../ScrollArea/ScrollArea';\nimport { Combobox } from '../Combobox';\nimport { useComboboxContext } from '../Combobox.context';\nimport { ComboboxItem, ComboboxLikeRenderOptionInput, ComboboxParsedItem } from '../Combobox.types';\nimport { defaultOptionsFilter, FilterOptionsInput } from './default-options-filter';\nimport { isEmptyComboboxData } from './is-empty-combobox-data';\nimport { isOptionsGroup } from './is-options-group';\nimport { validateOptions } from './validate-options';\nimport classes from '../Combobox.module.css';\n\nexport type OptionsFilter<Value extends Primitive = string> = (\n input: FilterOptionsInput<Value>\n) => ComboboxParsedItem<Value>[];\n\nexport interface OptionsGroup {\n group: ~~string~~;\n items: ComboboxItem<Primitive>[];\n}\n\nexport type OptionsData = (ComboboxItem<Primitive> \| OptionsGroup)[];\n\ninterface OptionProps {\n data: ComboboxItem<Primitive> \| OptionsGroup;\n withCheckIcon?: boolean;\n withAlignedLabels?: boolean;\n value?: Primitive \| Primitive[] \| null;\n checkIconPosition?: 'left' \| 'right';\n unstyled: boolean \| undefined;\n renderOption?: (input: ComboboxLikeRenderOptionInput<any>) => React.ReactNode;\n}\n\nfunction isValueChecked(value: Primitive \| Primitive[] \| undefined \| null, optionValue: Primitive) {\n return Array.isArray(value) ? value.includes(optionValue) : value === optionValue;\n}\n\nfunction Option({\n data,\n withCheckIcon,\n withAlignedLabels,\n value,\n checkIconPosition,\n unstyled,\n renderOption,\n}: OptionProps) {\n if (!isOptionsGroup(data)) {\n const checked = isValueChecked(value, data.value);\n const check =\n withCheckIcon &&\n (checked ? (\n <CheckIcon className={classes.optionsDropdownCheckIcon} />\n ) : withAlignedLabels ? (\n <div className={classes.optionsDropdownCheckPlaceholder} />\n ) : null);\n\n const defaultContent = (\n <>\n {checkIconPosition === 'left' && check}\n <span>{data.label}</span>\n {checkIconPosition === 'right' && check}\n </>\n );\n\n return (\n <Combobox.Option\n value={data.value}\n disabled={data.disabled}\n className={cx({ [classes.optionsDropdownOption]: !unstyled })}\n data-reverse={checkIconPosition === 'right' \|\| undefined}\n data-checked={checked \|\| undefined}\n aria-selected={checked}\n active={checked}\n >\n {typeof renderOption === 'function'\n ? renderOption({ option: data, checked })\n : defaultContent}\n </Combobox.Option>\n );\n }\n\n const options = data.items.map((item) => (\n <Option\n data={item}\n value={value}\n key={`${item.value}`}\n unstyled={unstyled}\n withCheckIcon={withCheckIcon}\n withAlignedLabels={withAlignedLabels}\n checkIconPosition={checkIconPosition}\n renderOption={renderOption}\n />\n ));\n\n return <Combobox.Group label={data.group}>{options}</Combobox.Group>;\n}\n\nexport interface OptionsDropdownProps {\n data: OptionsData;\n filter: OptionsFilter<Primitive> \| undefined;\n search: string \| undefined;\n limit: number \| undefined;\n withScrollArea: boolean \| undefined;\n maxDropdownHeight: number \| string \| undefined;\n /** Overrides `floatingHeight` from the `Combobox` context, used by `Combobox`-based components */\n floatingHeight?: 'viewport';\n hidden?: boolean;\n hiddenWhenEmpty?: boolean;\n filterOptions?: boolean;\n withCheckIcon?: boolean;\n withAlignedLabels?: boolean;\n value?: Primitive \| Primitive[] \| null;\n checkIconPosition?: 'left' \| 'right';\n nothingFoundMessage?: React.ReactNode;\n unstyled: boolean \| undefined;\n labelId: string \| undefined;\n 'aria-label': string \| undefined;\n renderOption?: (input: ComboboxLikeRenderOptionInput<any>) => React.ReactNode;\n scrollAreaProps: ScrollAreaProps \| undefined;\n}\n\nexport function OptionsDropdown({\n data,\n hidden,\n hiddenWhenEmpty,\n filter,\n search,\n limit,\n maxDropdownHeight,\n floatingHeight,\n withScrollArea = true,\n filterOptions = true,\n withCheckIcon = false,\n withAlignedLabels = false,\n value,\n checkIconPosition,\n nothingFoundMessage,\n unstyled,\n labelId,\n renderOption,\n scrollAreaProps,\n 'aria-label': ariaLabel,\n}: OptionsDropdownProps) {\n const ctx = useComboboxContext();\n validateOptions(data);\n\n const shouldFilter = typeof search === 'string';\n const filteredData = shouldFilter\n ? (filter \|\| defaultOptionsFilter)({\n options: data,\n search: filterOptions ? search : '',\n limit: limit ?? Infinity,\n })\n : data;\n const isEmpty = isEmptyComboboxData(filteredData);\n\n const options = filteredData.map((item) => (\n <Option\n data={item}\n key={isOptionsGroup(item) ? item.group : `${item.value}`}\n withCheckIcon={withCheckIcon}\n withAlignedLabels={withAlignedLabels}\n value={value}\n checkIconPosition={checkIconPosition}\n unstyled={unstyled}\n renderOption={renderOption}\n />\n ));\n\n return (\n <Combobox.Dropdown hidden={hidden \|\| (hiddenWhenEmpty && isEmpty)} data-composed>\n <Combobox.Options labelledBy={labelId} aria-label={ariaLabel}>\n {withScrollArea ? (\n <ScrollArea.Autosize\n mah={\n (floatingHeight ?? ctx.floatingHeight) === 'viewport'\n ? 'var(--combobox-floating-options-max-height)'\n : (maxDropdownHeight ?? 220)\n }\n type=\"scroll\"\n scrollbarSize=\"var(--combobox-padding)\"\n offsetScrollbars=\"y\"\n {...scrollAreaProps}\n >\n {options}\n </ScrollArea.Autosize>\n ) : (\n options\n )}\n {isEmpty && nothingFoundMessage && <Combobox.Empty>{nothingFoundMessage}</Combobox.Empty>}\n </Combobox.Options>\n </Combobox.Dropdown>\n );\n}\n"],"mappings":";;;;;;;;;;;;;AAkCA,SAAS,eAAe,OAAmD,aAAwB;CACjG,OAAO,MAAM,QAAQ,KAAK,IAAI,MAAM,SAAS,WAAW,IAAI,UAAU;AACxE;AAEA,SAAS,OAAO,EACd,MACA,eACA,mBACA,OACA,mBACA,UACA,gBACc;CACd,IAAI,CAAC,eAAe,IAAI,GAAG;EACzB,MAAM,UAAU,eAAe,OAAO,KAAK,KAAK;EAChD,MAAM,QACJ,kBACC,UACC,oBAAC,WAAD,EAAW,WAAWA,wBAAQ,yBAA2B,CAAA,IACvD,oBACF,oBAAC,OAAD,EAAK,WAAWA,wBAAQ,gCAAkC,CAAA,IACxD;EAEN,MAAM,iBACJ,qBAAA,UAAA,EAAA,UAAA;GACG,sBAAsB,UAAU;GACjC,oBAAC,QAAD,EAAA,UAAO,KAAK,MAAY,CAAA;GACvB,sBAAsB,WAAW;EAClC,EAAA,CAAA;EAGJ,OACE,oBAAC,SAAS,QAAV;GACE,OAAO,KAAK;GACZ,UAAU,KAAK;GACf,WAAW,GAAG,GAAGA,wBAAQ,wBAAwB,CAAC,SAAS,CAAC;GAC5D,gBAAc,sBAAsB,WAAW,KAAA;GAC/C,gBAAc,WAAW,KAAA;GACzB,iBAAe;GACf,QAAQ;aAEP,OAAO,iBAAiB,aACrB,aAAa;IAAE,QAAQ;IAAM;GAAQ,CAAC,IACtC;EACW,CAAA;CAErB;CAEA,MAAM,UAAU,KAAK,MAAM,KAAK,SAC9B,oBAAC,QAAD;EACE,MAAM;EACC;EAEG;EACK;EACI;EACA;EACL;CACf,GANM,GAAG,KAAK,OAMd,CACF;CAED,OAAO,oBAAC,SAAS,OAAV;EAAgB,OAAO,KAAK;YAAQ;CAAwB,CAAA;AACrE;AA0BA,SAAgB,gBAAgB,EAC9B,MACA,QACA,iBACA,QACA,QACA,OACA,mBACA,gBACA,iBAAiB,MACjB,gBAAgB,MAChB,gBAAgB,OAChB,oBAAoB,OACpB,OACA,mBACA,qBACA,UACA,SACA,cACA,iBACA,cAAc,aACS;CACvB,MAAM,MAAM,mBAAmB;CAC/B,gBAAgB,IAAI;CAGpB,MAAM,eADe,OAAO,WAAW,YAElC,UAAU,~~sBAAsB~~;EAC/B,SAAS;EACT,QAAQ,gBAAgB,SAAS;EACjC,OAAO,SAAS;CAClB,CAAC,IACD;CACJ,MAAM,UAAU,oBAAoB,YAAY;CAEhD,MAAM,UAAU,aAAa,KAAK,~~SAChC~~,oBAAC,QAAD;EACE,MAAM;~~EAES~~;EACI;EACZ;EACY;EACT;EACI;CACf,~~GAPM~~,eAAe,IAAI,~~IAAI~~,KAAK,QAAQ,GAAG,KAAK,~~OAOlD~~,CACF;CAED,OACE,oBAAC,SAAS,UAAV;EAAmB,QAAQ,UAAW,mBAAmB;EAAU,iBAAA;YACjE,qBAAC,SAAS,SAAV;GAAkB,YAAY;GAAS,cAAY;aAAnD,CACG,iBACC,oBAAC,WAAW,UAAZ;IACE,MACG,kBAAkB,IAAI,oBAAoB,aACvC,gDACC,qBAAqB;IAE5B,MAAK;IACL,eAAc;IACd,kBAAiB;IACjB,GAAI;cAEH;GACkB,CAAA,IAErB,SAED,WAAW,uBAAuB,oBAAC,SAAS,OAAV,EAAA,UAAiB,oBAAoC,CAAA,CACxE;;CACD,CAAA;AAEvB"}
1	+ {"version":3,"file":"OptionsDropdown.mjs","names":["classes"],"sources":["../../../../src/components/Combobox/OptionsDropdown/OptionsDropdown.tsx"],"sourcesContent":["import cx from 'clsx';\nimport { Primitive } from '../../../core';\nimport { CheckIcon } from '../../Checkbox';\nimport { ScrollArea, ScrollAreaProps } from '../../ScrollArea/ScrollArea';\nimport { Combobox } from '../Combobox';\nimport { useComboboxContext } from '../Combobox.context';\nimport { ComboboxItem, ComboboxLikeRenderOptionInput, ComboboxParsedItem } from '../Combobox.types';\nimport { defaultOptionsFilter, FilterOptionsInput } from './default-options-filter';\nimport { isEmptyComboboxData } from './is-empty-combobox-data';\nimport { isOptionsGroup } from './is-options-group';\nimport { validateOptions } from './validate-options';\nimport classes from '../Combobox.module.css';\n\nexport type OptionsFilter<Value extends Primitive = string> = (\n input: FilterOptionsInput<Value>\n) => ComboboxParsedItem<Value>[];\n\nexport interface OptionsGroup {\n group: React.ReactNode;\n items: ComboboxItem<Primitive>[];\n}\n\nexport type OptionsData = (ComboboxItem<Primitive> \| OptionsGroup)[];\n\ninterface OptionProps {\n data: ComboboxItem<Primitive> \| OptionsGroup;\n withCheckIcon?: boolean;\n withAlignedLabels?: boolean;\n value?: Primitive \| Primitive[] \| null;\n checkIconPosition?: 'left' \| 'right';\n unstyled: boolean \| undefined;\n renderOption?: (input: ComboboxLikeRenderOptionInput<any>) => React.ReactNode;\n}\n\nfunction isValueChecked(value: Primitive \| Primitive[] \| undefined \| null, optionValue: Primitive) {\n return Array.isArray(value) ? value.includes(optionValue) : value === optionValue;\n}\n\nfunction Option({\n data,\n withCheckIcon,\n withAlignedLabels,\n value,\n checkIconPosition,\n unstyled,\n renderOption,\n}: OptionProps) {\n if (!isOptionsGroup(data)) {\n const checked = isValueChecked(value, data.value);\n const check =\n withCheckIcon &&\n (checked ? (\n <CheckIcon className={classes.optionsDropdownCheckIcon} />\n ) : withAlignedLabels ? (\n <div className={classes.optionsDropdownCheckPlaceholder} />\n ) : null);\n\n const defaultContent = (\n <>\n {checkIconPosition === 'left' && check}\n <span>{data.label}</span>\n {checkIconPosition === 'right' && check}\n </>\n );\n\n return (\n <Combobox.Option\n value={data.value}\n disabled={data.disabled}\n className={cx({ [classes.optionsDropdownOption]: !unstyled })}\n data-reverse={checkIconPosition === 'right' \|\| undefined}\n data-checked={checked \|\| undefined}\n aria-selected={checked}\n active={checked}\n >\n {typeof renderOption === 'function'\n ? renderOption({ option: data, checked })\n : defaultContent}\n </Combobox.Option>\n );\n }\n\n const options = data.items.map((item) => (\n <Option\n data={item}\n value={value}\n key={`${item.value}`}\n unstyled={unstyled}\n withCheckIcon={withCheckIcon}\n withAlignedLabels={withAlignedLabels}\n checkIconPosition={checkIconPosition}\n renderOption={renderOption}\n />\n ));\n\n return <Combobox.Group label={data.group}>{options}</Combobox.Group>;\n}\n\nexport interface OptionsDropdownProps {\n data: OptionsData;\n filter: OptionsFilter<Primitive> \| undefined;\n search: string \| undefined;\n limit: number \| undefined;\n withScrollArea: boolean \| undefined;\n maxDropdownHeight: number \| string \| undefined;\n /** Overrides `floatingHeight` from the `Combobox` context, used by `Combobox`-based components */\n floatingHeight?: 'viewport';\n hidden?: boolean;\n hiddenWhenEmpty?: boolean;\n filterOptions?: boolean;\n withCheckIcon?: boolean;\n withAlignedLabels?: boolean;\n value?: Primitive \| Primitive[] \| null;\n checkIconPosition?: 'left' \| 'right';\n nothingFoundMessage?: React.ReactNode;\n unstyled: boolean \| undefined;\n labelId: string \| undefined;\n 'aria-label': string \| undefined;\n renderOption?: (input: ComboboxLikeRenderOptionInput<any>) => React.ReactNode;\n scrollAreaProps: ScrollAreaProps \| undefined;\n}\n\nexport function OptionsDropdown({\n data,\n hidden,\n hiddenWhenEmpty,\n filter,\n search,\n limit,\n maxDropdownHeight,\n floatingHeight,\n withScrollArea = true,\n filterOptions = true,\n withCheckIcon = false,\n withAlignedLabels = false,\n value,\n checkIconPosition,\n nothingFoundMessage,\n unstyled,\n labelId,\n renderOption,\n scrollAreaProps,\n 'aria-label': ariaLabel,\n}: OptionsDropdownProps) {\n const ctx = useComboboxContext();\n validateOptions(data);\n\n const shouldFilter = typeof search === 'string';\n const filteredData = shouldFilter\n ? (filter \|\| defaultOptionsFilter)({\n options: data,\n search: filterOptions ? search : '',\n limit: limit ?? Infinity,\n })\n : data;\n const isEmpty = isEmptyComboboxData(filteredData);\n\n const options = filteredData.map((item, index) => (\n <Option\n data={item}\n key={\n isOptionsGroup(item)\n ? `group-${typeof item.group === 'string' ? item.group : index}`\n : `${item.value}`\n }\n withCheckIcon={withCheckIcon}\n withAlignedLabels={withAlignedLabels}\n value={value}\n checkIconPosition={checkIconPosition}\n unstyled={unstyled}\n renderOption={renderOption}\n />\n ));\n\n return (\n <Combobox.Dropdown hidden={hidden \|\| (hiddenWhenEmpty && isEmpty)} data-composed>\n <Combobox.Options labelledBy={labelId} aria-label={ariaLabel}>\n {withScrollArea ? (\n <ScrollArea.Autosize\n mah={\n (floatingHeight ?? ctx.floatingHeight) === 'viewport'\n ? 'var(--combobox-floating-options-max-height)'\n : (maxDropdownHeight ?? 220)\n }\n type=\"scroll\"\n scrollbarSize=\"var(--combobox-padding)\"\n offsetScrollbars=\"y\"\n {...scrollAreaProps}\n >\n {options}\n </ScrollArea.Autosize>\n ) : (\n options\n )}\n {isEmpty && nothingFoundMessage && <Combobox.Empty>{nothingFoundMessage}</Combobox.Empty>}\n </Combobox.Options>\n </Combobox.Dropdown>\n );\n}\n"],"mappings":";;;;;;;;;;;;;AAkCA,SAAS,eAAe,OAAmD,aAAwB;CACjG,OAAO,MAAM,QAAQ,KAAK,IAAI,MAAM,SAAS,WAAW,IAAI,UAAU;AACxE;AAEA,SAAS,OAAO,EACd,MACA,eACA,mBACA,OACA,mBACA,UACA,gBACc;CACd,IAAI,CAAC,eAAe,IAAI,GAAG;EACzB,MAAM,UAAU,eAAe,OAAO,KAAK,KAAK;EAChD,MAAM,QACJ,kBACC,UACC,oBAAC,WAAD,EAAW,WAAWA,wBAAQ,yBAA2B,CAAA,IACvD,oBACF,oBAAC,OAAD,EAAK,WAAWA,wBAAQ,gCAAkC,CAAA,IACxD;EAEN,MAAM,iBACJ,qBAAA,UAAA,EAAA,UAAA;GACG,sBAAsB,UAAU;GACjC,oBAAC,QAAD,EAAA,UAAO,KAAK,MAAY,CAAA;GACvB,sBAAsB,WAAW;EAClC,EAAA,CAAA;EAGJ,OACE,oBAAC,SAAS,QAAV;GACE,OAAO,KAAK;GACZ,UAAU,KAAK;GACf,WAAW,GAAG,GAAGA,wBAAQ,wBAAwB,CAAC,SAAS,CAAC;GAC5D,gBAAc,sBAAsB,WAAW,KAAA;GAC/C,gBAAc,WAAW,KAAA;GACzB,iBAAe;GACf,QAAQ;aAEP,OAAO,iBAAiB,aACrB,aAAa;IAAE,QAAQ;IAAM;GAAQ,CAAC,IACtC;EACW,CAAA;CAErB;CAEA,MAAM,UAAU,KAAK,MAAM,KAAK,SAC9B,oBAAC,QAAD;EACE,MAAM;EACC;EAEG;EACK;EACI;EACA;EACL;CACf,GANM,GAAG,KAAK,OAMd,CACF;CAED,OAAO,oBAAC,SAAS,OAAV;EAAgB,OAAO,KAAK;YAAQ;CAAwB,CAAA;AACrE;AA0BA,SAAgB,gBAAgB,EAC9B,MACA,QACA,iBACA,QACA,QACA,OACA,mBACA,gBACA,iBAAiB,MACjB,gBAAgB,MAChB,gBAAgB,OAChB,oBAAoB,OACpB,OACA,mBACA,qBACA,UACA,SACA,cACA,iBACA,cAAc,aACS;CACvB,MAAM,MAAM,mBAAmB;CAC/B,gBAAgB,IAAI;CAGpB,MAAM,eADe,OAAO,WAAW,YAElC,UAAU,qBAAA,CAAsB;EAC/B,SAAS;EACT,QAAQ,gBAAgB,SAAS;EACjC,OAAO,SAAS;CAClB,CAAC,IACD;CACJ,MAAM,UAAU,oBAAoB,YAAY;CAEhD,MAAM,UAAU,aAAa,KAAK,MAAM,UACtC,oBAAC,QAAD;EACE,MAAM;EAMS;EACI;EACZ;EACY;EACT;EACI;CACf,GAVG,eAAe,IAAI,IACf,SAAS,OAAO,KAAK,UAAU,WAAW,KAAK,QAAQ,UACvD,GAAG,KAAK,OAQf,CACF;CAED,OACE,oBAAC,SAAS,UAAV;EAAmB,QAAQ,UAAW,mBAAmB;EAAU,iBAAA;YACjE,qBAAC,SAAS,SAAV;GAAkB,YAAY;GAAS,cAAY;aAAnD,CACG,iBACC,oBAAC,WAAW,UAAZ;IACE,MACG,kBAAkB,IAAI,oBAAoB,aACvC,gDACC,qBAAqB;IAE5B,MAAK;IACL,eAAc;IACd,kBAAiB;IACjB,GAAI;cAEH;GACkB,CAAA,IAErB,SAED,WAAW,uBAAuB,oBAAC,SAAS,OAAV,EAAA,UAAiB,oBAAoC,CAAA,CACxE;;CACD,CAAA;AAEvB"}

package/esm/components/Combobox/OptionsDropdown/default-options-filter.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"default-options-filter.mjs","names":[],"sources":["../../../../src/components/Combobox/OptionsDropdown/default-options-filter.ts"],"sourcesContent":["import { Primitive } from '../../../core';\nimport { ComboboxItem, ComboboxParsedItem } from '../Combobox.types';\nimport { isOptionsGroup } from './is-options-group';\n\nexport interface FilterOptionsInput<Value extends Primitive = Primitive> {\n options: ComboboxParsedItem<Value>[];\n search: string;\n limit: number;\n}\n\nexport function defaultOptionsFilter({\n options,\n search,\n limit,\n}: FilterOptionsInput): ComboboxParsedItem<Primitive>[] {\n const parsedSearch = search.trim().toLowerCase();\n const result: ComboboxParsedItem<Primitive>[] = [];\n\n for (let i = 0; i < options.length; i += 1) {\n const item = options[i];\n\n if (result.length === limit) {\n return result;\n }\n\n if (isOptionsGroup(item)) {\n result.push({\n group: item.group,\n items: defaultOptionsFilter({\n options: item.items,\n search,\n limit: limit - result.length,\n }) as ComboboxItem[],\n });\n }\n\n if (!isOptionsGroup(item)) {\n if (item.label.toLowerCase().includes(parsedSearch)) {\n result.push(item);\n }\n }\n }\n\n return result;\n}\n"],"mappings":";;;AAUA,SAAgB,qBAAqB,EACnC,SACA,QACA,SACsD;CACtD,MAAM,eAAe,OAAO,KAAK,~~EAAE~~,YAAY;CAC/C,MAAM,SAA0C,CAAC;CAEjD,KAAK,IAAI,IAAI,GAAG,IAAI,QAAQ,QAAQ,KAAK,GAAG;EAC1C,MAAM,OAAO,QAAQ;EAErB,IAAI,OAAO,WAAW,OACpB,OAAO;EAGT,IAAI,eAAe,IAAI,GACrB,OAAO,KAAK;GACV,OAAO,KAAK;GACZ,OAAO,qBAAqB;IAC1B,SAAS,KAAK;IACd;IACA,OAAO,QAAQ,OAAO;GACxB,CAAC;EACH,CAAC;EAGH,IAAI,CAAC,eAAe,IAAI;OAClB,KAAK,MAAM,YAAY,~~EAAE~~,SAAS,YAAY,GAChD,OAAO,KAAK,IAAI;EAAA;CAGtB;CAEA,OAAO;AACT"}
1	+ {"version":3,"file":"default-options-filter.mjs","names":[],"sources":["../../../../src/components/Combobox/OptionsDropdown/default-options-filter.ts"],"sourcesContent":["import { Primitive } from '../../../core';\nimport { ComboboxItem, ComboboxParsedItem } from '../Combobox.types';\nimport { isOptionsGroup } from './is-options-group';\n\nexport interface FilterOptionsInput<Value extends Primitive = Primitive> {\n options: ComboboxParsedItem<Value>[];\n search: string;\n limit: number;\n}\n\nexport function defaultOptionsFilter({\n options,\n search,\n limit,\n}: FilterOptionsInput): ComboboxParsedItem<Primitive>[] {\n const parsedSearch = search.trim().toLowerCase();\n const result: ComboboxParsedItem<Primitive>[] = [];\n\n for (let i = 0; i < options.length; i += 1) {\n const item = options[i];\n\n if (result.length === limit) {\n return result;\n }\n\n if (isOptionsGroup(item)) {\n result.push({\n group: item.group,\n items: defaultOptionsFilter({\n options: item.items,\n search,\n limit: limit - result.length,\n }) as ComboboxItem[],\n });\n }\n\n if (!isOptionsGroup(item)) {\n if (item.label.toLowerCase().includes(parsedSearch)) {\n result.push(item);\n }\n }\n }\n\n return result;\n}\n"],"mappings":";;;AAUA,SAAgB,qBAAqB,EACnC,SACA,QACA,SACsD;CACtD,MAAM,eAAe,OAAO,KAAK,CAAC,CAAC,YAAY;CAC/C,MAAM,SAA0C,CAAC;CAEjD,KAAK,IAAI,IAAI,GAAG,IAAI,QAAQ,QAAQ,KAAK,GAAG;EAC1C,MAAM,OAAO,QAAQ;EAErB,IAAI,OAAO,WAAW,OACpB,OAAO;EAGT,IAAI,eAAe,IAAI,GACrB,OAAO,KAAK;GACV,OAAO,KAAK;GACZ,OAAO,qBAAqB;IAC1B,SAAS,KAAK;IACd;IACA,OAAO,QAAQ,OAAO;GACxB,CAAC;EACH,CAAC;EAGH,IAAI,CAAC,eAAe,IAAI;OAClB,KAAK,MAAM,YAAY,CAAC,CAAC,SAAS,YAAY,GAChD,OAAO,KAAK,IAAI;EAAA;CAGtB;CAEA,OAAO;AACT"}

package/esm/components/Combobox/use-combobox/get-index/get-index.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"get-index.mjs","names":[],"sources":["../../../../../src/components/Combobox/use-combobox/get-index/get-index.ts"],"sourcesContent":["export function getPreviousIndex(\n currentIndex: number,\n elements: NodeListOf<HTMLDivElement> \| HTMLDivElement[],\n loop: boolean\n) {\n for (let i = currentIndex - 1; i >= 0; i -= 1) {\n if (!elements[i].hasAttribute('data-combobox-disabled')) {\n return i;\n }\n }\n\n if (loop) {\n for (let i = elements.length - 1; i > -1; i -= 1) {\n if (!elements[i].hasAttribute('data-combobox-disabled')) {\n return i;\n }\n }\n }\n\n return currentIndex;\n}\n\nexport function getNextIndex(\n currentIndex: number,\n elements: NodeListOf<HTMLDivElement> \| HTMLDivElement[],\n loop: boolean\n) {\n for (let i = currentIndex + 1; i < elements.length; i += 1) {\n if (!elements[i].hasAttribute('data-combobox-disabled')) {\n return i;\n }\n }\n\n if (loop) {\n for (let i = 0; i < elements.length; i += 1) {\n if (!elements[i].hasAttribute('data-combobox-disabled')) {\n return i;\n }\n }\n }\n\n return currentIndex;\n}\n\nexport function getFirstIndex(elements: NodeListOf<HTMLDivElement> \| HTMLDivElement[]) {\n for (let i = 0; i < elements.length; i += 1) {\n if (!elements[i].hasAttribute('data-combobox-disabled')) {\n return i;\n }\n }\n\n return -1;\n}\n"],"mappings":";;AAAA,SAAgB,iBACd,cACA,UACA,MACA;CACA,KAAK,IAAI,IAAI,eAAe,GAAG,KAAK,GAAG,KAAK,GAC1C,IAAI,CAAC,SAAS,~~GAAG~~,aAAa,wBAAwB,GACpD,OAAO;CAIX,IAAI;OACG,IAAI,IAAI,SAAS,SAAS,GAAG,IAAI,IAAI,KAAK,GAC7C,IAAI,CAAC,SAAS,~~GAAG~~,aAAa,wBAAwB,GACpD,OAAO;CAAA;CAKb,OAAO;AACT;AAEA,SAAgB,aACd,cACA,UACA,MACA;CACA,KAAK,IAAI,IAAI,eAAe,GAAG,IAAI,SAAS,QAAQ,KAAK,GACvD,IAAI,CAAC,SAAS,~~GAAG~~,aAAa,wBAAwB,GACpD,OAAO;CAIX,IAAI;OACG,IAAI,IAAI,GAAG,IAAI,SAAS,QAAQ,KAAK,GACxC,IAAI,CAAC,SAAS,~~GAAG~~,aAAa,wBAAwB,GACpD,OAAO;CAAA;CAKb,OAAO;AACT;AAEA,SAAgB,cAAc,UAAyD;CACrF,KAAK,IAAI,IAAI,GAAG,IAAI,SAAS,QAAQ,KAAK,GACxC,IAAI,CAAC,SAAS,~~GAAG~~,aAAa,wBAAwB,GACpD,OAAO;CAIX,OAAO;AACT"}
1	+ {"version":3,"file":"get-index.mjs","names":[],"sources":["../../../../../src/components/Combobox/use-combobox/get-index/get-index.ts"],"sourcesContent":["export function getPreviousIndex(\n currentIndex: number,\n elements: NodeListOf<HTMLDivElement> \| HTMLDivElement[],\n loop: boolean\n) {\n for (let i = currentIndex - 1; i >= 0; i -= 1) {\n if (!elements[i].hasAttribute('data-combobox-disabled')) {\n return i;\n }\n }\n\n if (loop) {\n for (let i = elements.length - 1; i > -1; i -= 1) {\n if (!elements[i].hasAttribute('data-combobox-disabled')) {\n return i;\n }\n }\n }\n\n return currentIndex;\n}\n\nexport function getNextIndex(\n currentIndex: number,\n elements: NodeListOf<HTMLDivElement> \| HTMLDivElement[],\n loop: boolean\n) {\n for (let i = currentIndex + 1; i < elements.length; i += 1) {\n if (!elements[i].hasAttribute('data-combobox-disabled')) {\n return i;\n }\n }\n\n if (loop) {\n for (let i = 0; i < elements.length; i += 1) {\n if (!elements[i].hasAttribute('data-combobox-disabled')) {\n return i;\n }\n }\n }\n\n return currentIndex;\n}\n\nexport function getFirstIndex(elements: NodeListOf<HTMLDivElement> \| HTMLDivElement[]) {\n for (let i = 0; i < elements.length; i += 1) {\n if (!elements[i].hasAttribute('data-combobox-disabled')) {\n return i;\n }\n }\n\n return -1;\n}\n"],"mappings":";;AAAA,SAAgB,iBACd,cACA,UACA,MACA;CACA,KAAK,IAAI,IAAI,eAAe,GAAG,KAAK,GAAG,KAAK,GAC1C,IAAI,CAAC,SAAS,EAAE,CAAC,aAAa,wBAAwB,GACpD,OAAO;CAIX,IAAI;OACG,IAAI,IAAI,SAAS,SAAS,GAAG,IAAI,IAAI,KAAK,GAC7C,IAAI,CAAC,SAAS,EAAE,CAAC,aAAa,wBAAwB,GACpD,OAAO;CAAA;CAKb,OAAO;AACT;AAEA,SAAgB,aACd,cACA,UACA,MACA;CACA,KAAK,IAAI,IAAI,eAAe,GAAG,IAAI,SAAS,QAAQ,KAAK,GACvD,IAAI,CAAC,SAAS,EAAE,CAAC,aAAa,wBAAwB,GACpD,OAAO;CAIX,IAAI;OACG,IAAI,IAAI,GAAG,IAAI,SAAS,QAAQ,KAAK,GACxC,IAAI,CAAC,SAAS,EAAE,CAAC,aAAa,wBAAwB,GACpD,OAAO;CAAA;CAKb,OAAO;AACT;AAEA,SAAgB,cAAc,UAAyD;CACrF,KAAK,IAAI,IAAI,GAAG,IAAI,SAAS,QAAQ,KAAK,GACxC,IAAI,CAAC,SAAS,EAAE,CAAC,aAAa,wBAAwB,GACpD,OAAO;CAIX,OAAO;AACT"}