@mantine/core 9.0.2 → 9.1.1

package/cjs/index.cjs

@@ -72,6 +72,7 @@ const require_get_global_class_names = require("./core/styles-api/use-styles/get
 const require_use_styles = require("./core/styles-api/use-styles/use-styles.cjs");
 const require_styles_to_string = require("./core/InlineStyles/styles-to-string/styles-to-string.cjs");
 const require_InlineStyles = require("./core/InlineStyles/InlineStyles.cjs");
+const require_hash_styles = require("./core/InlineStyles/hash-styles.cjs");
 const require_extract_style_props = require("./core/Box/style-props/extract-style-props/extract-style-props.cjs");
 const require_style_props_data = require("./core/Box/style-props/style-props-data.cjs");
 const require_parse_style_props = require("./core/Box/style-props/parse-style-props/parse-style-props.cjs");
@@ -243,6 +244,7 @@ const require_ListItem = require("./components/List/ListItem/ListItem.cjs");
 const require_List = require("./components/List/List.cjs");
 const require_LoadingOverlay = require("./components/LoadingOverlay/LoadingOverlay.cjs");
 const require_Marquee = require("./components/Marquee/Marquee.cjs");
+const require_MaskInput = require("./components/MaskInput/MaskInput.cjs");
 const require_Menu_context = require("./components/Menu/Menu.context.cjs");
 const require_MenuDivider = require("./components/Menu/MenuDivider/MenuDivider.cjs");
 const require_MenuDropdown = require("./components/Menu/MenuDropdown/MenuDropdown.cjs");
@@ -336,6 +338,11 @@ const require_Timeline = require("./components/Timeline/Timeline.cjs");
 const require_Title = require("./components/Title/Title.cjs");
 const require_use_tree = require("./components/Tree/use-tree.cjs");
 const require_Tree = require("./components/Tree/Tree.cjs");
+const require_merge_async_children = require("./components/Tree/merge-async-children/merge-async-children.cjs");
+const require_move_tree_node = require("./components/Tree/move-tree-node/move-tree-node.cjs");
+const require_filter_tree_data = require("./components/Tree/filter-tree-data/filter-tree-data.cjs");
+const require_flatten_tree_data = require("./components/Tree/flatten-tree-data/flatten-tree-data.cjs");
+const require_FlatTreeNode = require("./components/Tree/FlatTreeNode.cjs");
 const require_Typography = require("./components/Typography/Typography.cjs");
 let react_remove_scroll = require("react-remove-scroll");
 exports.Accordion = require_Accordion.Accordion;
@@ -430,6 +437,7 @@ exports.FOCUS_CLASS_NAMES = require_get_global_class_names.FOCUS_CLASS_NAMES;
 exports.Fieldset = require_Fieldset.Fieldset;
 exports.FileButton = require_FileButton.FileButton;
 exports.FileInput = require_FileInput.FileInput;
+exports.FlatTreeNode = require_FlatTreeNode.FlatTreeNode;
 exports.Flex = require_Flex.Flex;
 exports.FloatingArrow = require_FloatingArrow.FloatingArrow;
 exports.FloatingIndicator = require_FloatingIndicator.FloatingIndicator;
@@ -473,6 +481,7 @@ exports.MantineThemeContext = require_MantineThemeProvider.MantineThemeContext;
 exports.MantineThemeProvider = require_MantineThemeProvider.MantineThemeProvider;
 exports.Mark = require_Mark.Mark;
 exports.Marquee = require_Marquee.Marquee;
+exports.MaskInput = require_MaskInput.MaskInput;
 exports.Menu = require_Menu.Menu;
 exports.MenuDivider = require_MenuDivider.MenuDivider;
 exports.MenuDropdown = require_MenuDropdown.MenuDropdown;
@@ -620,15 +629,18 @@ exports.deepMerge = require_deep_merge.deepMerge;
 exports.defaultCssVariablesResolver = require_default_css_variables_resolver.defaultCssVariablesResolver;
 exports.defaultLoaders = require_Loader.defaultLoaders;
 exports.defaultOptionsFilter = require_default_options_filter.defaultOptionsFilter;
+exports.defaultTreeNodeFilter = require_filter_tree_data.defaultTreeNodeFilter;
 exports.defaultVariantColorsResolver = require_default_variant_colors_resolver.defaultVariantColorsResolver;
 exports.em = require_rem.em;
 exports.extractStyleProps = require_extract_style_props.extractStyleProps;
 exports.factory = require_factory.factory;
 exports.filterProps = require_filter_props.filterProps;
+exports.filterTreeData = require_filter_tree_data.filterTreeData;
 exports.findClosestNumber = require_find_closest_number.findClosestNumber;
 exports.findElementAncestor = require_find_element_ancestor.findElementAncestor;
 exports.findElementBySelector = require_find_element_in_shadow_dom.findElementBySelector;
 exports.findElementsBySelector = require_find_element_in_shadow_dom.findElementsBySelector;
+exports.flattenTreeData = require_flatten_tree_data.flattenTreeData;
 exports.genericFactory = require_factory.genericFactory;
 exports.getAutoContrastValue = require_get_auto_contrast_value.getAutoContrastValue;
 exports.getBaseValue = require_get_base_value.getBaseValue;
@@ -659,6 +671,7 @@ exports.getStyleObject = require_get_style_object.getStyleObject;
 exports.getThemeColor = require_get_theme_color.getThemeColor;
 exports.getTransitionProps = require_get_transition_props.getTransitionProps;
 exports.getTreeExpandedState = require_use_tree.getTreeExpandedState;
+exports.hashStyleProps = require_hash_styles.hashStyleProps;
 exports.isColorValid = require_parsers.isColorValid;
 exports.isElement = require_is_element.isElement;
 exports.isLightColor = require_luminance.isLightColor;
@@ -673,8 +686,10 @@ exports.localStorageColorSchemeManager = require_local_storage_manager.localStor
 exports.luminance = require_luminance.luminance;
 exports.mantineHtmlProps = require_mantine_html_props.mantineHtmlProps;
 exports.memoize = require_memoize.memoize;
+exports.mergeAsyncChildren = require_merge_async_children.mergeAsyncChildren;
 exports.mergeMantineTheme = require_merge_mantine_theme.mergeMantineTheme;
 exports.mergeThemeOverrides = require_merge_theme_overrides.mergeThemeOverrides;
+exports.moveTreeNode = require_move_tree_node.moveTreeNode;
 exports.noop = require_noop.noop;
 exports.parseColor = require_parsers.parseColor;
 exports.parseStyleProps = require_parse_style_props.parseStyleProps;
@@ -708,6 +723,7 @@ exports.useMantineClassNamesPrefix = require_Mantine_context.useMantineClassName
 exports.useMantineColorScheme = require_use_mantine_color_scheme.useMantineColorScheme;
 exports.useMantineContext = require_Mantine_context.useMantineContext;
 exports.useMantineCssVariablesResolver = require_Mantine_context.useMantineCssVariablesResolver;
+exports.useMantineDeduplicateInlineStyles = require_Mantine_context.useMantineDeduplicateInlineStyles;
 exports.useMantineEnv = require_Mantine_context.useMantineEnv;
 exports.useMantineIsHeadless = require_Mantine_context.useMantineIsHeadless;
 exports.useMantineStyleNonce = require_Mantine_context.useMantineStyleNonce;

package/esm/components/Blockquote/Blockquote.mjs

@@ -19,13 +19,12 @@ const varsResolver = createVarsResolver((theme, { color, iconSize, radius }) =>
 		theme,
 		colorScheme: "dark"
 	});
-	const lightParsed = parseThemeColor({
-		color: color || theme.primaryColor,
-		theme,
-		colorScheme: "light"
-	});
 	return { root: {
-		"--bq-bg-light": rgba(lightParsed.value, .07),
+		"--bq-bg-light": rgba(parseThemeColor({
+			color: color || theme.primaryColor,
+			theme,
+			colorScheme: "light"
+		}).value, .07),
 		"--bq-bg-dark": rgba(darkParsed.value, .06),
 		"--bq-bd": getThemeColor(color, theme),
 		"--bq-icon-size": rem(iconSize),

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

@@ -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: '--bq-bg-light' | '--bq-bg-dark' | '--bq-bd' | '--bq-icon-size' | '--bq-radius';\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\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>((theme, { color, iconSize, radius }) => {\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    },\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    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":";;;;;;;;;;;;;;AAkDA,MAAM,eAAe,EACnB,UAAU,IACX;AAED,MAAM,eAAe,oBAAuC,OAAO,EAAE,OAAO,UAAU,aAAa;CACjG,MAAM,aAAa,gBAAgB;EACjC,OAAO,SAAS,MAAM;EACtB;EACA,aAAa;EACd,CAAC;CAEF,MAAM,cAAc,gBAAgB;EAClC,OAAO,SAAS,MAAM;EACtB;EACA,aAAa;EACd,CAAC;AAEF,QAAO,EACL,MAAM;EACJ,iBAAiB,KAAK,YAAY,OAAO,IAAK;EAC9C,gBAAgB,KAAK,WAAW,OAAO,IAAK;EAC5C,WAAW,cAAc,OAAO,MAAM;EACtC,kBAAkB,IAAI,SAAS;EAC/B,eAAe,UAAU,OAAO;EACjC,EACF;EACD;AAEF,MAAa,aAAa,SAA4B,WAAW;CAC/D,MAAM,QAAQ,SAAS,cAAc,cAAc,OAAO;CAC1D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,MACA,UACA,MACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA6B;EAC7C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,QACE,qBAAC,KAAD;EAAK,WAAU;EAAa,GAAI,UAAU,OAAO;EAAE,GAAI;YAAvD;GACG,QAAQ,oBAAC,QAAD;IAAM,GAAI,UAAU,OAAO;cAAG;IAAY,CAAA;GAClD;GACA,QAAQ,oBAAC,QAAD;IAAM,GAAI,UAAU,OAAO;cAAG;IAAY,CAAA;GAC/C;;EAER;AAEF,WAAW,UAAUA;AACrB,WAAW,eAAe;AAC1B,WAAW,cAAc"}
+{"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: '--bq-bg-light' | '--bq-bg-dark' | '--bq-bd' | '--bq-icon-size' | '--bq-radius';\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\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>((theme, { color, iconSize, radius }) => {\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    },\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    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":";;;;;;;;;;;;;;AAkDA,MAAM,eAAe,EACnB,UAAU,IACX;AAED,MAAM,eAAe,oBAAuC,OAAO,EAAE,OAAO,UAAU,aAAa;CACjG,MAAM,aAAa,gBAAgB;EACjC,OAAO,SAAS,MAAM;EACtB;EACA,aAAa;EACd,CAAC;AAQF,QAAO,EACL,MAAM;EACJ,iBAAiB,KARD,gBAAgB;GAClC,OAAO,SAAS,MAAM;GACtB;GACA,aAAa;GACd,CAAC,CAIoC,OAAO,IAAK;EAC9C,gBAAgB,KAAK,WAAW,OAAO,IAAK;EAC5C,WAAW,cAAc,OAAO,MAAM;EACtC,kBAAkB,IAAI,SAAS;EAC/B,eAAe,UAAU,OAAO;EACjC,EACF;EACD;AAEF,MAAa,aAAa,SAA4B,WAAW;CAC/D,MAAM,QAAQ,SAAS,cAAc,cAAc,OAAO;CAC1D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,MACA,UACA,MACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA6B;EAC7C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,QACE,qBAAC,KAAD;EAAK,WAAU;EAAa,GAAI,UAAU,OAAO;EAAE,GAAI;YAAvD;GACG,QAAQ,oBAAC,QAAD;IAAM,GAAI,UAAU,OAAO;cAAG;IAAY,CAAA;GAClD;GACA,QAAQ,oBAAC,QAAD;IAAM,GAAI,UAAU,OAAO;cAAG;IAAY,CAAA;GAC/C;;EAER;AAEF,WAAW,UAAUA;AACrB,WAAW,eAAe;AAC1B,WAAW,cAAc"}

package/esm/components/Card/Card.mjs

@@ -31,7 +31,7 @@ const Card = polymorphicFactory((_props) => {
 	});
 	const _children = Children.toArray(children);
 	const content = _children.map((child, index) => {
-		if (typeof child === "object" && child && "type" in child && child.type === CardSection) return cloneElement(child, {
+		if (typeof child === "object" && child && "type" in child && (child.type === CardSection || child.type?.displayName === "@mantine/core/CardSection")) return cloneElement(child, {
 			"data-orientation": orientation,
 			"data-first-section": index === 0 || void 0,
 			"data-last-section": index === _children.length - 1 || void 0

package/esm/components/Card/Card.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Card.mjs","names":["classes"],"sources":["../../../src/components/Card/Card.tsx"],"sourcesContent":["import { Children, cloneElement } from 'react';\nimport {\n  BoxProps,\n  createVarsResolver,\n  getSpacing,\n  MantineRadius,\n  MantineShadow,\n  MantineSpacing,\n  polymorphicFactory,\n  PolymorphicFactory,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { Paper } from '../Paper';\nimport { CardProvider } from './Card.context';\nimport { CardSection, type CardSectionProps } from './CardSection/CardSection';\nimport classes from './Card.module.css';\nexport type CardStylesNames = 'root' | 'section';\nexport type CardCssVariables = {\n  root: '--card-padding';\n};\n\nexport interface CardProps extends BoxProps, StylesApiProps<CardFactory> {\n  /** Key of `theme.shadows` or any valid CSS value to set `box-shadow` */\n  shadow?: MantineShadow;\n\n  /** Key of `theme.radius` or any valid CSS value to set border-radius, numbers are converted to rem @default theme.defaultRadius */\n  radius?: MantineRadius;\n\n  /** Adds border to the card */\n  withBorder?: boolean;\n\n  /** Key of `theme.spacing` or any valid CSS value to set padding @default 'md' */\n  padding?: MantineSpacing;\n\n  /** Card content */\n  children?: React.ReactNode;\n\n  /** Card orientation @default 'vertical' */\n  orientation?: 'horizontal' | 'vertical';\n}\n\nexport type CardFactory = PolymorphicFactory<{\n  props: CardProps;\n  defaultRef: HTMLDivElement;\n  defaultComponent: 'div';\n  stylesNames: CardStylesNames;\n  vars: CardCssVariables;\n  staticComponents: {\n    Section: typeof CardSection;\n  };\n}>;\n\nconst varsResolver = createVarsResolver<CardFactory>((_, { padding }) => ({\n  root: {\n    '--card-padding': getSpacing(padding),\n  },\n}));\n\nconst defaultProps = {\n  orientation: 'vertical',\n} satisfies Partial<CardProps>;\n\nexport const Card = polymorphicFactory<CardFactory>((_props) => {\n  const props = useProps('Card', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    children,\n    padding,\n    attributes,\n    orientation,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<CardFactory>({\n    name: 'Card',\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const _children = Children.toArray(children);\n  const content = _children.map((child, index) => {\n    if (typeof child === 'object' && child && 'type' in child && child.type === CardSection) {\n      return cloneElement(child, {\n        'data-orientation': orientation,\n        'data-first-section': index === 0 || undefined,\n        'data-last-section': index === _children.length - 1 || undefined,\n      } as any);\n    }\n\n    return child;\n  });\n\n  return (\n    <CardProvider value={{ getStyles }}>\n      <Paper unstyled={unstyled} data-orientation={orientation} {...getStyles('root')} {...others}>\n        {content}\n      </Paper>\n    </CardProvider>\n  );\n});\n\nCard.classes = classes;\nCard.varsResolver = varsResolver;\nCard.displayName = '@mantine/core/Card';\nCard.Section = CardSection;\n\nexport namespace Card {\n  export type Props = CardProps;\n  export type StylesNames = CardStylesNames;\n  export type CssVariables = CardCssVariables;\n  export type Factory = CardFactory;\n  export type SectionProps = CardSectionProps;\n\n  export namespace Section {\n    export type Props = CardSectionProps;\n  }\n}\n"],"mappings":";;;;;;;;;;;;;AAsDA,MAAM,eAAe,oBAAiC,GAAG,EAAE,eAAe,EACxE,MAAM,EACJ,kBAAkB,WAAW,QAAQ,EACtC,EACF,EAAE;AAEH,MAAM,eAAe,EACnB,aAAa,YACd;AAED,MAAa,OAAO,oBAAiC,WAAW;CAC9D,MAAM,QAAQ,SAAS,QAAQ,cAAc,OAAO;CACpD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,SACA,YACA,aACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAAuB;EACvC,MAAM;EACN;EACA,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,YAAY,SAAS,QAAQ,SAAS;CAC5C,MAAM,UAAU,UAAU,KAAK,OAAO,UAAU;AAC9C,MAAI,OAAO,UAAU,YAAY,SAAS,UAAU,SAAS,MAAM,SAAS,YAC1E,QAAO,aAAa,OAAO;GACzB,oBAAoB;GACpB,sBAAsB,UAAU,KAAK,KAAA;GACrC,qBAAqB,UAAU,UAAU,SAAS,KAAK,KAAA;GACxD,CAAQ;AAGX,SAAO;GACP;AAEF,QACE,oBAAC,cAAD;EAAc,OAAO,EAAE,WAAW;YAChC,oBAAC,OAAD;GAAiB;GAAU,oBAAkB;GAAa,GAAI,UAAU,OAAO;GAAE,GAAI;aAClF;GACK,CAAA;EACK,CAAA;EAEjB;AAEF,KAAK,UAAUA;AACf,KAAK,eAAe;AACpB,KAAK,cAAc;AACnB,KAAK,UAAU"}
+{"version":3,"file":"Card.mjs","names":["classes"],"sources":["../../../src/components/Card/Card.tsx"],"sourcesContent":["import { Children, cloneElement } from 'react';\nimport {\n  BoxProps,\n  createVarsResolver,\n  getSpacing,\n  MantineRadius,\n  MantineShadow,\n  MantineSpacing,\n  polymorphicFactory,\n  PolymorphicFactory,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { Paper } from '../Paper';\nimport { CardProvider } from './Card.context';\nimport { CardSection, type CardSectionProps } from './CardSection/CardSection';\nimport classes from './Card.module.css';\nexport type CardStylesNames = 'root' | 'section';\nexport type CardCssVariables = {\n  root: '--card-padding';\n};\n\nexport interface CardProps extends BoxProps, StylesApiProps<CardFactory> {\n  /** Key of `theme.shadows` or any valid CSS value to set `box-shadow` */\n  shadow?: MantineShadow;\n\n  /** Key of `theme.radius` or any valid CSS value to set border-radius, numbers are converted to rem @default theme.defaultRadius */\n  radius?: MantineRadius;\n\n  /** Adds border to the card */\n  withBorder?: boolean;\n\n  /** Key of `theme.spacing` or any valid CSS value to set padding @default 'md' */\n  padding?: MantineSpacing;\n\n  /** Card content */\n  children?: React.ReactNode;\n\n  /** Card orientation @default 'vertical' */\n  orientation?: 'horizontal' | 'vertical';\n}\n\nexport type CardFactory = PolymorphicFactory<{\n  props: CardProps;\n  defaultRef: HTMLDivElement;\n  defaultComponent: 'div';\n  stylesNames: CardStylesNames;\n  vars: CardCssVariables;\n  staticComponents: {\n    Section: typeof CardSection;\n  };\n}>;\n\nconst varsResolver = createVarsResolver<CardFactory>((_, { padding }) => ({\n  root: {\n    '--card-padding': getSpacing(padding),\n  },\n}));\n\nconst defaultProps = {\n  orientation: 'vertical',\n} satisfies Partial<CardProps>;\n\nexport const Card = polymorphicFactory<CardFactory>((_props) => {\n  const props = useProps('Card', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    children,\n    padding,\n    attributes,\n    orientation,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<CardFactory>({\n    name: 'Card',\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const _children = Children.toArray(children);\n  const content = _children.map((child, index) => {\n    if (\n      typeof child === 'object' &&\n      child &&\n      'type' in child &&\n      (child.type === CardSection ||\n        (child.type as any)?.displayName === '@mantine/core/CardSection')\n    ) {\n      return cloneElement(child, {\n        'data-orientation': orientation,\n        'data-first-section': index === 0 || undefined,\n        'data-last-section': index === _children.length - 1 || undefined,\n      } as any);\n    }\n\n    return child;\n  });\n\n  return (\n    <CardProvider value={{ getStyles }}>\n      <Paper unstyled={unstyled} data-orientation={orientation} {...getStyles('root')} {...others}>\n        {content}\n      </Paper>\n    </CardProvider>\n  );\n});\n\nCard.classes = classes;\nCard.varsResolver = varsResolver;\nCard.displayName = '@mantine/core/Card';\nCard.Section = CardSection;\n\nexport namespace Card {\n  export type Props = CardProps;\n  export type StylesNames = CardStylesNames;\n  export type CssVariables = CardCssVariables;\n  export type Factory = CardFactory;\n  export type SectionProps = CardSectionProps;\n\n  export namespace Section {\n    export type Props = CardSectionProps;\n  }\n}\n"],"mappings":";;;;;;;;;;;;;AAsDA,MAAM,eAAe,oBAAiC,GAAG,EAAE,eAAe,EACxE,MAAM,EACJ,kBAAkB,WAAW,QAAQ,EACtC,EACF,EAAE;AAEH,MAAM,eAAe,EACnB,aAAa,YACd;AAED,MAAa,OAAO,oBAAiC,WAAW;CAC9D,MAAM,QAAQ,SAAS,QAAQ,cAAc,OAAO;CACpD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,SACA,YACA,aACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAAuB;EACvC,MAAM;EACN;EACA,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,YAAY,SAAS,QAAQ,SAAS;CAC5C,MAAM,UAAU,UAAU,KAAK,OAAO,UAAU;AAC9C,MACE,OAAO,UAAU,YACjB,SACA,UAAU,UACT,MAAM,SAAS,eACb,MAAM,MAAc,gBAAgB,6BAEvC,QAAO,aAAa,OAAO;GACzB,oBAAoB;GACpB,sBAAsB,UAAU,KAAK,KAAA;GACrC,qBAAqB,UAAU,UAAU,SAAS,KAAK,KAAA;GACxD,CAAQ;AAGX,SAAO;GACP;AAEF,QACE,oBAAC,cAAD;EAAc,OAAO,EAAE,WAAW;YAChC,oBAAC,OAAD;GAAiB;GAAU,oBAAkB;GAAa,GAAI,UAAU,OAAO;GAAE,GAAI;aAClF;GACK,CAAA;EACK,CAAA;EAEjB;AAEF,KAAK,UAAUA;AACf,KAAK,eAAe;AACpB,KAAK,cAAc;AACnB,KAAK,UAAU"}

package/esm/components/Combobox/ComboboxClearButton/ComboboxClearButton.mjs

@@ -2,7 +2,7 @@
 import { Input } from "../../Input/Input.mjs";
 import { jsx } from "react/jsx-runtime";
 //#region packages/@mantine/core/src/components/Combobox/ComboboxClearButton/ComboboxClearButton.tsx
-function ComboboxClearButton({ size, onMouseDown, onClick, onClear, ...others }) {
+function ComboboxClearButton({ onMouseDown, onClick, onClear, ...others }) {
 	return /* @__PURE__ */ jsx(Input.ClearButton, {
 		tabIndex: -1,
 		"aria-hidden": true,

package/esm/components/Combobox/ComboboxClearButton/ComboboxClearButton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxClearButton.mjs","names":[],"sources":["../../../../src/components/Combobox/ComboboxClearButton/ComboboxClearButton.tsx"],"sourcesContent":["import { ElementProps } from '../../../core';\nimport { Input, InputClearButtonProps } from '../../Input';\n\nexport interface ComboboxClearButtonProps extends InputClearButtonProps, ElementProps<'button'> {\n  onClear: () => void;\n}\n\nexport function ComboboxClearButton({\n  size,\n  onMouseDown,\n  onClick,\n  onClear,\n  ...others\n}: ComboboxClearButtonProps) {\n  return (\n    <Input.ClearButton\n      tabIndex={-1}\n      aria-hidden\n      {...others}\n      onMouseDown={(event) => {\n        event.preventDefault();\n        onMouseDown?.(event);\n      }}\n      onClick={(event) => {\n        onClear();\n        onClick?.(event);\n      }}\n    />\n  );\n}\n\nComboboxClearButton.displayName = '@mantine/core/ComboboxClearButton';\n"],"mappings":";;;;AAOA,SAAgB,oBAAoB,EAClC,MACA,aACA,SACA,SACA,GAAG,UACwB;AAC3B,QACE,oBAAC,MAAM,aAAP;EACE,UAAU;EACV,eAAA;EACA,GAAI;EACJ,cAAc,UAAU;AACtB,SAAM,gBAAgB;AACtB,iBAAc,MAAM;;EAEtB,UAAU,UAAU;AAClB,YAAS;AACT,aAAU,MAAM;;EAElB,CAAA;;AAIN,oBAAoB,cAAc"}
+{"version":3,"file":"ComboboxClearButton.mjs","names":[],"sources":["../../../../src/components/Combobox/ComboboxClearButton/ComboboxClearButton.tsx"],"sourcesContent":["import { ElementProps } from '../../../core';\nimport { Input, InputClearButtonProps } from '../../Input';\n\nexport interface ComboboxClearButtonProps extends InputClearButtonProps, ElementProps<'button'> {\n  onClear: () => void;\n}\n\nexport function ComboboxClearButton({\n  onMouseDown,\n  onClick,\n  onClear,\n  ...others\n}: ComboboxClearButtonProps) {\n  return (\n    <Input.ClearButton\n      tabIndex={-1}\n      aria-hidden\n      {...others}\n      onMouseDown={(event) => {\n        event.preventDefault();\n        onMouseDown?.(event);\n      }}\n      onClick={(event) => {\n        onClear();\n        onClick?.(event);\n      }}\n    />\n  );\n}\n\nComboboxClearButton.displayName = '@mantine/core/ComboboxClearButton';\n"],"mappings":";;;;AAOA,SAAgB,oBAAoB,EAClC,aACA,SACA,SACA,GAAG,UACwB;AAC3B,QACE,oBAAC,MAAM,aAAP;EACE,UAAU;EACV,eAAA;EACA,GAAI;EACJ,cAAc,UAAU;AACtB,SAAM,gBAAgB;AACtB,iBAAc,MAAM;;EAEtB,UAAU,UAAU;AAClB,YAAS;AACT,aAAU,MAAM;;EAElB,CAAA;;AAIN,oBAAoB,cAAc"}

package/esm/components/Combobox/ComboboxEventsTarget/ComboboxEventsTarget.mjs

@@ -28,6 +28,7 @@ const ComboboxEventsTarget = factory((props) => {
 			withKeyboardNavigation,
 			withExpandedAttribute,
 			onKeyDown: child.props.onKeyDown,
+			onClick: child.props.onClick,
 			autoComplete
 		}),
 		...others,

package/esm/components/Combobox/ComboboxEventsTarget/ComboboxEventsTarget.mjs.map

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

package/esm/components/Combobox/ComboboxSearch/ComboboxSearch.mjs

@@ -13,7 +13,7 @@ const defaultProps = {
 	withKeyboardNavigation: true
 };
 const ComboboxSearch = factory((_props) => {
-	const { classNames, styles, unstyled, vars, withAriaAttributes, onKeyDown, withKeyboardNavigation, size, ref, ...others } = useProps("ComboboxSearch", defaultProps, _props);
+	const { classNames, styles, unstyled, vars, withAriaAttributes, onKeyDown, onClick, withKeyboardNavigation, size, ref, ...others } = useProps("ComboboxSearch", defaultProps, _props);
 	const ctx = useComboboxContext();
 	const _styles = ctx.getStyles("search");
 	const targetProps = useComboboxTargetProps({
@@ -22,6 +22,7 @@ const ComboboxSearch = factory((_props) => {
 		withKeyboardNavigation,
 		withExpandedAttribute: false,
 		onKeyDown,
+		onClick,
 		autoComplete: "off"
 	});
 	return /* @__PURE__ */ jsx(Input, {

package/esm/components/Combobox/ComboboxSearch/ComboboxSearch.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxSearch.mjs","names":["classes"],"sources":["../../../../src/components/Combobox/ComboboxSearch/ComboboxSearch.tsx"],"sourcesContent":["import { useMergedRef } from '@mantine/hooks';\nimport { ElementProps, factory, Factory, useProps } from '../../../core';\nimport { Input, InputProps, InputStylesNames } from '../../Input/Input';\nimport { useComboboxContext } from '../Combobox.context';\nimport { useComboboxTargetProps } from '../use-combobox-target-props/use-combobox-target-props';\nimport classes from '../Combobox.module.css';\n\nexport type ComboboxSearchStylesNames = InputStylesNames;\n\nexport interface ComboboxSearchProps extends InputProps, ElementProps<'input', 'size'> {\n  /** if set, the search input has `aria-` attribute @default true */\n  withAriaAttributes?: boolean;\n\n  /** if set, the search input handles keyboard navigation @default true */\n  withKeyboardNavigation?: boolean;\n}\n\nexport type ComboboxSearchFactory = Factory<{\n  props: ComboboxSearchProps;\n  ref: HTMLInputElement;\n  stylesNames: ComboboxSearchStylesNames;\n}>;\n\nconst defaultProps = {\n  withAriaAttributes: true,\n  withKeyboardNavigation: true,\n} satisfies Partial<ComboboxSearchProps>;\n\nexport const ComboboxSearch = factory<ComboboxSearchFactory>((_props) => {\n  const props = useProps('ComboboxSearch', defaultProps, _props);\n  const {\n    classNames,\n    styles,\n    unstyled,\n    vars,\n    withAriaAttributes,\n    onKeyDown,\n    withKeyboardNavigation,\n    size,\n    ref,\n    ...others\n  } = props;\n\n  const ctx = useComboboxContext();\n  const _styles = ctx.getStyles('search');\n\n  const targetProps = useComboboxTargetProps({\n    targetType: 'input',\n    withAriaAttributes,\n    withKeyboardNavigation,\n    withExpandedAttribute: false,\n    onKeyDown,\n    autoComplete: 'off',\n  });\n\n  return (\n    <Input\n      ref={useMergedRef(ref, ctx.store.searchRef)}\n      classNames={[{ input: _styles.className }, classNames] as any}\n      styles={[{ input: _styles.style }, styles] as any}\n      size={size || ctx.size}\n      {...targetProps}\n      {...others}\n      __staticSelector=\"Combobox\"\n    />\n  );\n});\n\nComboboxSearch.classes = classes;\nComboboxSearch.displayName = '@mantine/core/ComboboxSearch';\n"],"mappings":";;;;;;;;;;AAuBA,MAAM,eAAe;CACnB,oBAAoB;CACpB,wBAAwB;CACzB;AAED,MAAa,iBAAiB,SAAgC,WAAW;CAEvE,MAAM,EACJ,YACA,QACA,UACA,MACA,oBACA,WACA,wBACA,MACA,KACA,GAAG,WAXS,SAAS,kBAAkB,cAAc,OAAO;CAc9D,MAAM,MAAM,oBAAoB;CAChC,MAAM,UAAU,IAAI,UAAU,SAAS;CAEvC,MAAM,cAAc,uBAAuB;EACzC,YAAY;EACZ;EACA;EACA,uBAAuB;EACvB;EACA,cAAc;EACf,CAAC;AAEF,QACE,oBAAC,OAAD;EACE,KAAK,aAAa,KAAK,IAAI,MAAM,UAAU;EAC3C,YAAY,CAAC,EAAE,OAAO,QAAQ,WAAW,EAAE,WAAW;EACtD,QAAQ,CAAC,EAAE,OAAO,QAAQ,OAAO,EAAE,OAAO;EAC1C,MAAM,QAAQ,IAAI;EAClB,GAAI;EACJ,GAAI;EACJ,kBAAiB;EACjB,CAAA;EAEJ;AAEF,eAAe,UAAUA;AACzB,eAAe,cAAc"}
+{"version":3,"file":"ComboboxSearch.mjs","names":["classes"],"sources":["../../../../src/components/Combobox/ComboboxSearch/ComboboxSearch.tsx"],"sourcesContent":["import { useMergedRef } from '@mantine/hooks';\nimport { ElementProps, factory, Factory, useProps } from '../../../core';\nimport { Input, InputProps, InputStylesNames } from '../../Input/Input';\nimport { useComboboxContext } from '../Combobox.context';\nimport { useComboboxTargetProps } from '../use-combobox-target-props/use-combobox-target-props';\nimport classes from '../Combobox.module.css';\n\nexport type ComboboxSearchStylesNames = InputStylesNames;\n\nexport interface ComboboxSearchProps extends InputProps, ElementProps<'input', 'size'> {\n  /** if set, the search input has `aria-` attribute @default true */\n  withAriaAttributes?: boolean;\n\n  /** if set, the search input handles keyboard navigation @default true */\n  withKeyboardNavigation?: boolean;\n}\n\nexport type ComboboxSearchFactory = Factory<{\n  props: ComboboxSearchProps;\n  ref: HTMLInputElement;\n  stylesNames: ComboboxSearchStylesNames;\n}>;\n\nconst defaultProps = {\n  withAriaAttributes: true,\n  withKeyboardNavigation: true,\n} satisfies Partial<ComboboxSearchProps>;\n\nexport const ComboboxSearch = factory<ComboboxSearchFactory>((_props) => {\n  const props = useProps('ComboboxSearch', defaultProps, _props);\n  const {\n    classNames,\n    styles,\n    unstyled,\n    vars,\n    withAriaAttributes,\n    onKeyDown,\n    onClick,\n    withKeyboardNavigation,\n    size,\n    ref,\n    ...others\n  } = props;\n\n  const ctx = useComboboxContext();\n  const _styles = ctx.getStyles('search');\n\n  const targetProps = useComboboxTargetProps({\n    targetType: 'input',\n    withAriaAttributes,\n    withKeyboardNavigation,\n    withExpandedAttribute: false,\n    onKeyDown,\n    onClick,\n    autoComplete: 'off',\n  });\n\n  return (\n    <Input\n      ref={useMergedRef(ref, ctx.store.searchRef)}\n      classNames={[{ input: _styles.className }, classNames] as any}\n      styles={[{ input: _styles.style }, styles] as any}\n      size={size || ctx.size}\n      {...targetProps}\n      {...others}\n      __staticSelector=\"Combobox\"\n    />\n  );\n});\n\nComboboxSearch.classes = classes;\nComboboxSearch.displayName = '@mantine/core/ComboboxSearch';\n"],"mappings":";;;;;;;;;;AAuBA,MAAM,eAAe;CACnB,oBAAoB;CACpB,wBAAwB;CACzB;AAED,MAAa,iBAAiB,SAAgC,WAAW;CAEvE,MAAM,EACJ,YACA,QACA,UACA,MACA,oBACA,WACA,SACA,wBACA,MACA,KACA,GAAG,WAZS,SAAS,kBAAkB,cAAc,OAAO;CAe9D,MAAM,MAAM,oBAAoB;CAChC,MAAM,UAAU,IAAI,UAAU,SAAS;CAEvC,MAAM,cAAc,uBAAuB;EACzC,YAAY;EACZ;EACA;EACA,uBAAuB;EACvB;EACA;EACA,cAAc;EACf,CAAC;AAEF,QACE,oBAAC,OAAD;EACE,KAAK,aAAa,KAAK,IAAI,MAAM,UAAU;EAC3C,YAAY,CAAC,EAAE,OAAO,QAAQ,WAAW,EAAE,WAAW;EACtD,QAAQ,CAAC,EAAE,OAAO,QAAQ,OAAO,EAAE,OAAO;EAC1C,MAAM,QAAQ,IAAI;EAClB,GAAI;EACJ,GAAI;EACJ,kBAAiB;EACjB,CAAA;EAEJ;AAEF,eAAe,UAAUA;AACzB,eAAe,cAAc"}

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

@@ -29,6 +29,7 @@ const ComboboxTarget = factory((props) => {
 			withKeyboardNavigation,
 			withExpandedAttribute,
 			onKeyDown: child.props.onKeyDown,
+			onClick: child.props.onClick,
 			autoComplete
 		}),
 		...others

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

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

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

@@ -2,7 +2,7 @@
 import { useComboboxContext } from "../Combobox.context.mjs";
 import { useState } from "react";
 //#region packages/@mantine/core/src/components/Combobox/use-combobox-target-props/use-combobox-target-props.ts
-function useComboboxTargetProps({ onKeyDown, withKeyboardNavigation, withAriaAttributes, withExpandedAttribute, targetType, autoComplete }) {
+function useComboboxTargetProps({ onKeyDown, onClick, withKeyboardNavigation, withAriaAttributes, withExpandedAttribute, targetType, autoComplete }) {
 	const ctx = useComboboxContext();
 	const [selectedOptionId, setSelectedOptionId] = useState(null);
 	const handleKeyDown = (event) => {
@@ -46,18 +46,24 @@ function useComboboxTargetProps({ onKeyDown, withKeyboardNavigation, withAriaAtt
 			}
 		}
 	};
+	const ariaAttributes = withAriaAttributes ? {
+		...withExpandedAttribute ? { role: "combobox" } : {},
+		"aria-haspopup": "listbox",
+		"aria-expanded": withExpandedAttribute ? !!(ctx.store.listId && ctx.store.dropdownOpened) : void 0,
+		"aria-controls": ctx.store.dropdownOpened && ctx.store.listId ? ctx.store.listId : void 0,
+		"aria-activedescendant": ctx.store.dropdownOpened ? selectedOptionId || void 0 : void 0,
+		autoComplete,
+		"data-expanded": ctx.store.dropdownOpened || void 0,
+		"data-mantine-stop-propagation": ctx.store.dropdownOpened || void 0
+	} : {};
+	const handleClick = (event) => {
+		if (targetType === "button") event.currentTarget.focus();
+		onClick?.(event);
+	};
 	return {
-		...withAriaAttributes ? {
-			...withExpandedAttribute ? { role: "combobox" } : {},
-			"aria-haspopup": "listbox",
-			"aria-expanded": withExpandedAttribute ? !!(ctx.store.listId && ctx.store.dropdownOpened) : void 0,
-			"aria-controls": ctx.store.dropdownOpened && ctx.store.listId ? ctx.store.listId : void 0,
-			"aria-activedescendant": ctx.store.dropdownOpened ? selectedOptionId || void 0 : void 0,
-			autoComplete,
-			"data-expanded": ctx.store.dropdownOpened || void 0,
-			"data-mantine-stop-propagation": ctx.store.dropdownOpened || void 0
-		} : {},
-		onKeyDown: handleKeyDown
+		...ariaAttributes,
+		onKeyDown: handleKeyDown,
+		onClick: handleClick
 	};
 }
 //#endregion

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

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

package/esm/components/Flex/Flex.mjs

@@ -1,9 +1,11 @@
 "use client";
 import { filterProps } from "../../core/utils/filter-props/filter-props.mjs";
+import { useMantineDeduplicateInlineStyles } from "../../core/MantineProvider/Mantine.context.mjs";
 import { useMantineTheme } from "../../core/MantineProvider/MantineThemeProvider/MantineThemeProvider.mjs";
 import { useProps } from "../../core/MantineProvider/use-props/use-props.mjs";
 import { useStyles } from "../../core/styles-api/use-styles/use-styles.mjs";
 import { InlineStyles } from "../../core/InlineStyles/InlineStyles.mjs";
+import { hashStyleProps } from "../../core/InlineStyles/hash-styles.mjs";
 import { parseStyleProps } from "../../core/Box/style-props/parse-style-props/parse-style-props.mjs";
 import { useRandomClassName } from "../../core/Box/use-random-classname/use-random-classname.mjs";
 import { polymorphicFactory } from "../../core/factory/polymorphic-factory.mjs";
@@ -28,7 +30,7 @@ const Flex = polymorphicFactory((_props) => {
 		vars
 	});
 	const theme = useMantineTheme();
-	const responsiveClassName = useRandomClassName();
+	const randomClassName = useRandomClassName();
 	const parsedStyleProps = parseStyleProps({
 		styleProps: {
 			gap,
@@ -42,10 +44,13 @@ const Flex = polymorphicFactory((_props) => {
 		theme,
 		data: FLEX_STYLE_PROPS_DATA
 	});
+	const deduplicateInlineStyles = useMantineDeduplicateInlineStyles();
+	const responsiveClassName = deduplicateInlineStyles && parsedStyleProps.hasResponsiveStyles ? hashStyleProps(parsedStyleProps.styles, parsedStyleProps.media) : randomClassName;
 	return /* @__PURE__ */ jsxs(Fragment, { children: [parsedStyleProps.hasResponsiveStyles && /* @__PURE__ */ jsx(InlineStyles, {
 		selector: `.${responsiveClassName}`,
 		styles: parsedStyleProps.styles,
-		media: parsedStyleProps.media
+		media: parsedStyleProps.media,
+		deduplicate: deduplicateInlineStyles
 	}), /* @__PURE__ */ jsx(Box, {
 		...getStyles("root", {
 			className: responsiveClassName,

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

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

package/esm/components/FloatingIndicator/FloatingIndicator.mjs

@@ -11,8 +11,7 @@ import { useMergedRef, useReducedMotion } from "@mantine/hooks";
 import { jsx } from "react/jsx-runtime";
 //#region packages/@mantine/core/src/components/FloatingIndicator/FloatingIndicator.tsx
 const varsResolver = createVarsResolver((theme, { transitionDuration }, { shouldReduceMotion }) => {
-	const duration = (theme.respectReducedMotion ? shouldReduceMotion : false) ? "0ms" : typeof transitionDuration === "number" ? `${transitionDuration}ms` : transitionDuration || "150ms";
-	return { root: { "--transition-duration": duration } };
+	return { root: { "--transition-duration": (theme.respectReducedMotion ? shouldReduceMotion : false) ? "0ms" : typeof transitionDuration === "number" ? `${transitionDuration}ms` : transitionDuration || "150ms" } };
 });
 const FloatingIndicator = factory((_props) => {
 	const props = useProps("FloatingIndicator", null, _props);

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

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

package/esm/components/Highlight/highlighter/highlighter.mjs

@@ -1,7 +1,7 @@
 "use client";
 //#region packages/@mantine/core/src/components/Highlight/highlighter/highlighter.ts
 function escapeRegex(value) {
-	return value.replace(/[-[\]{}()*+?.,\\^$|#]/g, "\\$&");
+	return value.replace(/[\\^$.*+?()[\]{}|]/g, "\\$&");
 }
 function highlighter(value, _highlight, options = {}) {
 	if (_highlight == null) return [{
@@ -14,8 +14,8 @@ function highlighter(value, _highlight, options = {}) {
 		highlighted: false
 	}];
 	const matcher = typeof highlight === "string" ? highlight.trim() : highlight.filter((part) => part.trim().length !== 0).map((part) => part.trim()).sort((a, b) => b.length - a.length).join("|");
-	const pattern = options.wholeWord ? `\\b(${matcher})\\b` : `(${matcher})`;
-	const re = new RegExp(pattern, "gi");
+	const pattern = options.wholeWord ? `(?<![\\p{L}\\p{N}_])(${matcher})(?![\\p{L}\\p{N}_])` : `(${matcher})`;
+	const re = new RegExp(pattern, options.wholeWord ? "giu" : "gi");
 	return value.split(re).map((part, index) => ({
 		chunk: part,
 		highlighted: index % 2 === 1

package/esm/components/Highlight/highlighter/highlighter.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"highlighter.mjs","names":[],"sources":["../../../../src/components/Highlight/highlighter/highlighter.ts"],"sourcesContent":["function escapeRegex(value: string) {\n  return value.replace(/[-[\\]{}()*+?.,\\\\^$|#]/g, '\\\\$&');\n}\n\nexport interface HighlightChunk {\n  chunk: string;\n  highlighted: boolean;\n  color?: string;\n}\n\nexport interface HighlighterOptions {\n  wholeWord?: boolean;\n}\n\nexport function highlighter(\n  value: string,\n  _highlight: string | string[],\n  options: HighlighterOptions = {}\n): HighlightChunk[] {\n  if (_highlight == null) {\n    return [{ chunk: value, highlighted: false }];\n  }\n\n  const highlight = Array.isArray(_highlight)\n    ? _highlight.map(escapeRegex)\n    : escapeRegex(_highlight);\n\n  const shouldHighlight = Array.isArray(highlight)\n    ? highlight.filter((part) => part.trim().length > 0).length > 0\n    : highlight.trim() !== '';\n\n  if (!shouldHighlight) {\n    return [{ chunk: value, highlighted: false }];\n  }\n\n  const matcher =\n    typeof highlight === 'string'\n      ? highlight.trim()\n      : highlight\n          .filter((part) => part.trim().length !== 0)\n          .map((part) => part.trim())\n          .sort((a, b) => b.length - a.length)\n          .join('|');\n\n  const pattern = options.wholeWord ? `\\\\b(${matcher})\\\\b` : `(${matcher})`;\n  const re = new RegExp(pattern, 'gi');\n  const chunks = value\n    .split(re)\n    .map((part, index) => ({ chunk: part, highlighted: index % 2 === 1 }))\n    .filter(({ chunk }) => chunk);\n\n  return chunks;\n}\n"],"mappings":";;AAAA,SAAS,YAAY,OAAe;AAClC,QAAO,MAAM,QAAQ,0BAA0B,OAAO;;AAaxD,SAAgB,YACd,OACA,YACA,UAA8B,EAAE,EACd;AAClB,KAAI,cAAc,KAChB,QAAO,CAAC;EAAE,OAAO;EAAO,aAAa;EAAO,CAAC;CAG/C,MAAM,YAAY,MAAM,QAAQ,WAAW,GACvC,WAAW,IAAI,YAAY,GAC3B,YAAY,WAAW;AAM3B,KAAI,EAJoB,MAAM,QAAQ,UAAU,GAC5C,UAAU,QAAQ,SAAS,KAAK,MAAM,CAAC,SAAS,EAAE,CAAC,SAAS,IAC5D,UAAU,MAAM,KAAK,IAGvB,QAAO,CAAC;EAAE,OAAO;EAAO,aAAa;EAAO,CAAC;CAG/C,MAAM,UACJ,OAAO,cAAc,WACjB,UAAU,MAAM,GAChB,UACG,QAAQ,SAAS,KAAK,MAAM,CAAC,WAAW,EAAE,CAC1C,KAAK,SAAS,KAAK,MAAM,CAAC,CAC1B,MAAM,GAAG,MAAM,EAAE,SAAS,EAAE,OAAO,CACnC,KAAK,IAAI;CAElB,MAAM,UAAU,QAAQ,YAAY,OAAO,QAAQ,QAAQ,IAAI,QAAQ;CACvE,MAAM,KAAK,IAAI,OAAO,SAAS,KAAK;AAMpC,QALe,MACZ,MAAM,GAAG,CACT,KAAK,MAAM,WAAW;EAAE,OAAO;EAAM,aAAa,QAAQ,MAAM;EAAG,EAAE,CACrE,QAAQ,EAAE,YAAY,MAAM"}
+{"version":3,"file":"highlighter.mjs","names":[],"sources":["../../../../src/components/Highlight/highlighter/highlighter.ts"],"sourcesContent":["function escapeRegex(value: string) {\n  return value.replace(/[\\\\^$.*+?()[\\]{}|]/g, '\\\\$&');\n}\n\nexport interface HighlightChunk {\n  chunk: string;\n  highlighted: boolean;\n  color?: string;\n}\n\nexport interface HighlighterOptions {\n  wholeWord?: boolean;\n}\n\nexport function highlighter(\n  value: string,\n  _highlight: string | string[],\n  options: HighlighterOptions = {}\n): HighlightChunk[] {\n  if (_highlight == null) {\n    return [{ chunk: value, highlighted: false }];\n  }\n\n  const highlight = Array.isArray(_highlight)\n    ? _highlight.map(escapeRegex)\n    : escapeRegex(_highlight);\n\n  const shouldHighlight = Array.isArray(highlight)\n    ? highlight.filter((part) => part.trim().length > 0).length > 0\n    : highlight.trim() !== '';\n\n  if (!shouldHighlight) {\n    return [{ chunk: value, highlighted: false }];\n  }\n\n  const matcher =\n    typeof highlight === 'string'\n      ? highlight.trim()\n      : highlight\n          .filter((part) => part.trim().length !== 0)\n          .map((part) => part.trim())\n          .sort((a, b) => b.length - a.length)\n          .join('|');\n\n  const pattern = options.wholeWord\n    ? `(?<![\\\\p{L}\\\\p{N}_])(${matcher})(?![\\\\p{L}\\\\p{N}_])`\n    : `(${matcher})`;\n  const re = new RegExp(pattern, options.wholeWord ? 'giu' : 'gi');\n  const chunks = value\n    .split(re)\n    .map((part, index) => ({ chunk: part, highlighted: index % 2 === 1 }))\n    .filter(({ chunk }) => chunk);\n\n  return chunks;\n}\n"],"mappings":";;AAAA,SAAS,YAAY,OAAe;AAClC,QAAO,MAAM,QAAQ,uBAAuB,OAAO;;AAarD,SAAgB,YACd,OACA,YACA,UAA8B,EAAE,EACd;AAClB,KAAI,cAAc,KAChB,QAAO,CAAC;EAAE,OAAO;EAAO,aAAa;EAAO,CAAC;CAG/C,MAAM,YAAY,MAAM,QAAQ,WAAW,GACvC,WAAW,IAAI,YAAY,GAC3B,YAAY,WAAW;AAM3B,KAAI,EAJoB,MAAM,QAAQ,UAAU,GAC5C,UAAU,QAAQ,SAAS,KAAK,MAAM,CAAC,SAAS,EAAE,CAAC,SAAS,IAC5D,UAAU,MAAM,KAAK,IAGvB,QAAO,CAAC;EAAE,OAAO;EAAO,aAAa;EAAO,CAAC;CAG/C,MAAM,UACJ,OAAO,cAAc,WACjB,UAAU,MAAM,GAChB,UACG,QAAQ,SAAS,KAAK,MAAM,CAAC,WAAW,EAAE,CAC1C,KAAK,SAAS,KAAK,MAAM,CAAC,CAC1B,MAAM,GAAG,MAAM,EAAE,SAAS,EAAE,OAAO,CACnC,KAAK,IAAI;CAElB,MAAM,UAAU,QAAQ,YACpB,wBAAwB,QAAQ,wBAChC,IAAI,QAAQ;CAChB,MAAM,KAAK,IAAI,OAAO,SAAS,QAAQ,YAAY,QAAQ,KAAK;AAMhE,QALe,MACZ,MAAM,GAAG,CACT,KAAK,MAAM,WAAW;EAAE,OAAO;EAAM,aAAa,QAAQ,MAAM;EAAG,EAAE,CACrE,QAAQ,EAAE,YAAY,MAAM"}

package/esm/components/MaskInput/MaskInput.mjs

@@ -0,0 +1,23 @@
+"use client";
+import { useProps } from "../../core/MantineProvider/use-props/use-props.mjs";
+import { factory } from "../../core/factory/factory.mjs";
+import { InputBase } from "../InputBase/InputBase.mjs";
+import { useMaskInputProps } from "./use-mask-input-props.mjs";
+import { jsx } from "react/jsx-runtime";
+//#region packages/@mantine/core/src/components/MaskInput/MaskInput.tsx
+const defaultProps = {};
+const MaskInput = factory((props) => {
+	const { maskRef, elementProps } = useMaskInputProps(useProps("MaskInput", defaultProps, props));
+	return /* @__PURE__ */ jsx(InputBase, {
+		component: "input",
+		ref: maskRef,
+		...elementProps,
+		__staticSelector: "MaskInput"
+	});
+});
+MaskInput.classes = InputBase.classes;
+MaskInput.displayName = "@mantine/core/MaskInput";
+//#endregion
+export { MaskInput };
+
+//# sourceMappingURL=MaskInput.mjs.map

package/esm/components/MaskInput/MaskInput.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MaskInput.mjs","names":[],"sources":["../../../src/components/MaskInput/MaskInput.tsx"],"sourcesContent":["import { BoxProps, ElementProps, factory, Factory, StylesApiProps, useProps } from '../../core';\nimport { __BaseInputProps, __InputStylesNames, InputVariant } from '../Input';\nimport { InputBase } from '../InputBase';\nimport { useMaskInputProps } from './use-mask-input-props';\n\nexport interface MaskInputProps\n  extends\n    BoxProps,\n    __BaseInputProps,\n    StylesApiProps<MaskInputFactory>,\n    ElementProps<'input', 'size'> {\n  /** Mask pattern string or array of string literals and RegExp objects */\n  mask: string | Array<string | RegExp>;\n\n  /** Override or extend the default token map */\n  tokens?: Record<string, RegExp>;\n\n  /** Called before masking on each keystroke, can return overrides for mask options */\n  modify?: (\n    value: string\n  ) => Partial<Pick<MaskInputProps, 'mask' | 'tokens' | 'slotChar' | 'separate'>> | undefined;\n\n  /** When true, raw and display values are decoupled */\n  separate?: boolean;\n\n  /** Character displayed in unfilled slots, `\"_\"` by default */\n  slotChar?: string | null;\n\n  /** Show mask pattern even when field is empty and unfocused */\n  alwaysShowMask?: boolean;\n\n  /** Show mask placeholder on focus, `true` by default */\n  showMaskOnFocus?: boolean;\n\n  /** Transform each character before validation and insertion */\n  transform?: (char: string) => string;\n\n  /** Clear value on blur when mask is incomplete, `false` by default */\n  autoClear?: boolean;\n\n  /** Called on every change with raw and masked values */\n  onChangeRaw?: (rawValue: string, maskedValue: string) => void;\n\n  /** Called when all required mask slots are filled */\n  onComplete?: (maskedValue: string, rawValue: string) => void;\n\n  /** Escape hatch for advanced cursor/value manipulation */\n  beforeMaskedStateChange?: (states: {\n    previousState: { value: string; selection: { start: number; end: number } | null };\n    currentState: { value: string; selection: { start: number; end: number } | null };\n    nextState: { value: string; selection: { start: number; end: number } | null };\n  }) => { value: string; selection: { start: number; end: number } | null };\n}\n\nexport type MaskInputFactory = Factory<{\n  props: MaskInputProps;\n  variant: InputVariant;\n  ref: HTMLInputElement;\n  stylesNames: __InputStylesNames;\n}>;\n\nconst defaultProps = {} satisfies Partial<MaskInputProps>;\n\nexport const MaskInput = factory<MaskInputFactory>((props) => {\n  const _props = useProps('MaskInput', defaultProps, props);\n  const { maskRef, elementProps } = useMaskInputProps(_props);\n\n  return (\n    <InputBase\n      component=\"input\"\n      ref={maskRef}\n      {...(elementProps as any)}\n      __staticSelector=\"MaskInput\"\n    />\n  );\n});\n\nMaskInput.classes = InputBase.classes;\nMaskInput.displayName = '@mantine/core/MaskInput';\n"],"mappings":";;;;;;;AA6DA,MAAM,eAAe,EAAE;AAEvB,MAAa,YAAY,SAA2B,UAAU;CAE5D,MAAM,EAAE,SAAS,iBAAiB,kBADnB,SAAS,aAAa,cAAc,MAAM,CACE;AAE3D,QACE,oBAAC,WAAD;EACE,WAAU;EACV,KAAK;EACL,GAAK;EACL,kBAAiB;EACjB,CAAA;EAEJ;AAEF,UAAU,UAAU,UAAU;AAC9B,UAAU,cAAc"}

package/esm/components/MaskInput/use-mask-input-props.mjs

@@ -0,0 +1,28 @@
+"use client";
+import { useMask, useMergedRef } from "@mantine/hooks";
+//#region packages/@mantine/core/src/components/MaskInput/use-mask-input-props.ts
+function useMaskInputProps(props) {
+	const { mask, tokens, modify, separate, slotChar, alwaysShowMask, showMaskOnFocus, transform, autoClear, onChangeRaw, onComplete, beforeMaskedStateChange, ref, ...elementProps } = props;
+	const { ref: maskCallbackRef } = useMask({
+		mask,
+		tokens,
+		modify,
+		separate,
+		slotChar,
+		alwaysShowMask,
+		showMaskOnFocus,
+		transform,
+		autoClear,
+		onChangeRaw,
+		onComplete,
+		beforeMaskedStateChange
+	});
+	return {
+		maskRef: useMergedRef(ref, maskCallbackRef),
+		elementProps
+	};
+}
+//#endregion
+export { useMaskInputProps };
+
+//# sourceMappingURL=use-mask-input-props.mjs.map

package/esm/components/MaskInput/use-mask-input-props.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-mask-input-props.mjs","names":[],"sources":["../../../src/components/MaskInput/use-mask-input-props.ts"],"sourcesContent":["import { useMask, useMergedRef } from '@mantine/hooks';\nimport type { MaskInputProps } from './MaskInput';\n\nexport function useMaskInputProps(props: MaskInputProps & { ref?: React.Ref<HTMLInputElement> }) {\n  const {\n    mask,\n    tokens,\n    modify,\n    separate,\n    slotChar,\n    alwaysShowMask,\n    showMaskOnFocus,\n    transform,\n    autoClear,\n    onChangeRaw,\n    onComplete,\n    beforeMaskedStateChange,\n    ref,\n    ...elementProps\n  } = props;\n\n  const { ref: maskCallbackRef } = useMask({\n    mask,\n    tokens,\n    modify,\n    separate,\n    slotChar,\n    alwaysShowMask,\n    showMaskOnFocus,\n    transform,\n    autoClear,\n    onChangeRaw,\n    onComplete,\n    beforeMaskedStateChange,\n  });\n\n  const maskRef = useMergedRef(ref, maskCallbackRef);\n\n  return { maskRef, elementProps };\n}\n"],"mappings":";;;AAGA,SAAgB,kBAAkB,OAA+D;CAC/F,MAAM,EACJ,MACA,QACA,QACA,UACA,UACA,gBACA,iBACA,WACA,WACA,aACA,YACA,yBACA,KACA,GAAG,iBACD;CAEJ,MAAM,EAAE,KAAK,oBAAoB,QAAQ;EACvC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAIF,QAAO;EAAE,SAFO,aAAa,KAAK,gBAAgB;EAEhC;EAAc"}