@mantine/core 9.3.1 → 9.4.0

package/esm/components/Tabs/Tabs.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.mjs","names":["classes"],"sources":["../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["import { useId, useUncontrolled } from '@mantine/hooks';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getAutoContrastValue,\n  getContrastColor,\n  getRadius,\n  getSafeId,\n  getThemeColor,\n  MantineColor,\n  MantineRadius,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { TabsProvider, type TabsContextValue } from './Tabs.context';\nimport { TabsList, TabsListStylesNames, type TabsListProps } from './TabsList/TabsList';\nimport { TabsPanel, TabsPanelStylesNames, type TabsPanelProps } from './TabsPanel/TabsPanel';\nimport { TabsTab, TabsTabStylesNames, type TabsTabProps } from './TabsTab/TabsTab';\nimport classes from './Tabs.module.css';\nexport type TabsStylesNames =\n  | 'root'\n  | TabsListStylesNames\n  | TabsPanelStylesNames\n  | TabsTabStylesNames;\n\nexport type TabsVariant = 'default' | 'outline' | 'pills';\nexport type TabsCssVariables = {\n  root: '--tabs-color' | '--tabs-radius';\n};\n\nexport interface TabsProps\n  extends\n    BoxProps,\n    StylesApiProps<TabsFactory>,\n    ElementProps<'div', 'defaultValue' | 'value' | 'onChange'> {\n  /** Uncontrolled component default value */\n  defaultValue?: string | null;\n\n  /** Controlled component value */\n  value?: string | null;\n\n  /** Called when value changes */\n  onChange?: (value: string | null) => void;\n\n  /** Tabs orientation @default 'horizontal' */\n  orientation?: 'vertical' | 'horizontal';\n\n  /** `Tabs.List` placement relative to `Tabs.Panel`, applicable only when `orientation=\"vertical\"` @default 'left' */\n  placement?: 'left' | 'right';\n\n  /** Base id, used to generate ids to connect labels with controls, generated randomly by default */\n  id?: string;\n\n  /** If set, arrow key presses loop though items (first to last and last to first) @default true */\n  loop?: boolean;\n\n  /** If set, tab is activated with arrow key press @default true */\n  activateTabWithKeyboard?: boolean;\n\n  /** If set, tab can be deactivated @default false */\n  allowTabDeactivation?: boolean;\n\n  /** Tabs content */\n  children?: React.ReactNode;\n\n  /** Changes colors of `Tabs.Tab` components when variant is `pills` or `default`, does nothing for other variants */\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  /** Determines whether tabs should have inverted styles @default false */\n  inverted?: boolean;\n\n  /** If set to `false`, `Tabs.Panel` content will be unmounted when the associated tab is not active @default true */\n  keepMounted?: boolean;\n\n  /** Controls how inactive tabs content is hidden when `keepMounted` is `true`, `'activity'` – hidden with `Activity` component, `'display-none'` – hidden with `display: none` styles @default 'activity' */\n  keepMountedMode?: 'activity' | 'display-none';\n\n  /** If set, adjusts text color based on background color for `pills` variant */\n  autoContrast?: boolean;\n}\n\nexport type TabsFactory = Factory<{\n  props: TabsProps;\n  ref: HTMLDivElement;\n  variant: TabsVariant;\n  stylesNames: TabsStylesNames;\n  vars: TabsCssVariables;\n  staticComponents: {\n    Tab: typeof TabsTab;\n    Panel: typeof TabsPanel;\n    List: typeof TabsList;\n  };\n}>;\n\nconst VALUE_ERROR =\n  'Tabs.Tab or Tabs.Panel component was rendered with invalid value or without value';\n\nconst defaultProps = {\n  keepMounted: true,\n  keepMountedMode: 'activity',\n  orientation: 'horizontal',\n  loop: true,\n  activateTabWithKeyboard: true,\n  variant: 'default',\n  placement: 'left',\n} satisfies Partial<TabsProps>;\n\nconst varsResolver = createVarsResolver<TabsFactory>((theme, { radius, color, autoContrast }) => ({\n  root: {\n    '--tabs-radius': getRadius(radius),\n    '--tabs-color': getThemeColor(color, theme),\n    '--tabs-text-color': getAutoContrastValue(autoContrast, theme)\n      ? getContrastColor({ color, theme, autoContrast })\n      : undefined,\n  },\n}));\n\nexport const Tabs = factory<TabsFactory>((_props) => {\n  const props = useProps('Tabs', defaultProps, _props);\n  const {\n    defaultValue,\n    value,\n    onChange,\n    orientation,\n    children,\n    loop,\n    id,\n    activateTabWithKeyboard,\n    allowTabDeactivation,\n    variant,\n    color,\n    radius,\n    inverted,\n    placement,\n    keepMounted,\n    keepMountedMode,\n    classNames,\n    styles,\n    unstyled,\n    className,\n    style,\n    vars,\n    autoContrast,\n    mod,\n    attributes,\n    ...others\n  } = props;\n\n  const uid = useId(id);\n\n  const [currentTab, setCurrentTab] = useUncontrolled({\n    value,\n    defaultValue,\n    finalValue: null,\n    onChange,\n  });\n\n  const getStyles = useStyles<TabsFactory>({\n    name: 'Tabs',\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  return (\n    <TabsProvider\n      value={{\n        placement,\n        value: currentTab,\n        orientation,\n        id: uid,\n        loop,\n        activateTabWithKeyboard,\n        getTabId: getSafeId(`${uid}-tab`, VALUE_ERROR),\n        getPanelId: getSafeId(`${uid}-panel`, VALUE_ERROR),\n        onChange: setCurrentTab,\n        allowTabDeactivation,\n        variant,\n        color,\n        radius,\n        inverted,\n        keepMounted,\n        keepMountedMode,\n        unstyled,\n        getStyles,\n      }}\n    >\n      <Box\n        id={uid}\n        variant={variant}\n        mod={[\n          {\n            orientation,\n            inverted: orientation === 'horizontal' && inverted,\n            placement: orientation === 'vertical' && placement,\n          },\n          mod,\n        ]}\n        {...getStyles('root')}\n        {...others}\n      >\n        {children}\n      </Box>\n    </TabsProvider>\n  );\n});\n\nTabs.classes = classes;\nTabs.varsResolver = varsResolver;\nTabs.displayName = '@mantine/core/Tabs';\nTabs.Tab = TabsTab;\nTabs.Panel = TabsPanel;\nTabs.List = TabsList;\n\nexport namespace Tabs {\n  export type Props = TabsProps;\n  export type StylesNames = TabsStylesNames;\n  export type CssVariables = TabsCssVariables;\n  export type Factory = TabsFactory;\n  export type Variant = TabsVariant;\n  export type ContextValue = TabsContextValue;\n\n  export namespace Tab {\n    export type Props = TabsTabProps;\n    export type StylesNames = TabsTabStylesNames;\n  }\n\n  export namespace Panel {\n    export type Props = TabsPanelProps;\n    export type StylesNames = TabsPanelStylesNames;\n  }\n\n  export namespace List {\n    export type Props = TabsListProps;\n    export type StylesNames = TabsListStylesNames;\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAsGA,MAAM,cACJ;AAEF,MAAM,eAAe;CACnB,aAAa;CACb,iBAAiB;CACjB,aAAa;CACb,MAAM;CACN,yBAAyB;CACzB,SAAS;CACT,WAAW;AACb;AAEA,MAAM,eAAe,oBAAiC,OAAO,EAAE,QAAQ,OAAO,oBAAoB,EAChG,MAAM;CACJ,iBAAiB,UAAU,MAAM;CACjC,gBAAgB,cAAc,OAAO,KAAK;CAC1C,qBAAqB,qBAAqB,cAAc,KAAK,IACzD,iBAAiB;EAAE;EAAO;EAAO;CAAa,CAAC,IAC/C,KAAA;AACN,EACF,EAAE;AAEF,MAAa,OAAO,SAAsB,WAAW;CACnD,MAAM,QAAQ,SAAS,QAAQ,cAAc,MAAM;CACnD,MAAM,EACJ,cACA,OACA,UACA,aACA,UACA,MACA,IACA,yBACA,sBACA,SACA,OACA,QACA,UACA,WACA,aACA,iBACA,YACA,QACA,UACA,WACA,OACA,MACA,cACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,MAAM,MAAM,EAAE;CAEpB,MAAM,CAAC,YAAY,iBAAiB,gBAAgB;EAClD;EACA;EACA,YAAY;EACZ;CACF,CAAC;CAED,MAAM,YAAY,UAAuB;EACvC,MAAM;EACN;EACA,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,OACE,oBAAC,cAAD;EACE,OAAO;GACL;GACA,OAAO;GACP;GACA,IAAI;GACJ;GACA;GACA,UAAU,UAAU,GAAG,IAAI,OAAO,WAAW;GAC7C,YAAY,UAAU,GAAG,IAAI,SAAS,WAAW;GACjD,UAAU;GACV;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF;YAEA,oBAAC,KAAD;GACE,IAAI;GACK;GACT,KAAK,CACH;IACE;IACA,UAAU,gBAAgB,gBAAgB;IAC1C,WAAW,gBAAgB,cAAc;GAC3C,GACA,GACF;GACA,GAAI,UAAU,MAAM;GACpB,GAAI;GAEH;EACE,CAAA;CACO,CAAA;AAElB,CAAC;AAED,KAAK,UAAUA;AACf,KAAK,eAAe;AACpB,KAAK,cAAc;AACnB,KAAK,MAAM;AACX,KAAK,QAAQ;AACb,KAAK,OAAO"}
+{"version":3,"file":"Tabs.mjs","names":["useId","classes"],"sources":["../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["import { useCallback, useRef } from 'react';\nimport { useForceUpdate, useId, useUncontrolled } from '@mantine/hooks';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getAutoContrastValue,\n  getContrastColor,\n  getRadius,\n  getSafeId,\n  getThemeColor,\n  MantineColor,\n  MantineRadius,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { TabsProvider, type TabsContextValue } from './Tabs.context';\nimport { TabsList, TabsListStylesNames, type TabsListProps } from './TabsList/TabsList';\nimport { TabsPanel, TabsPanelStylesNames, type TabsPanelProps } from './TabsPanel/TabsPanel';\nimport { TabsTab, TabsTabStylesNames, type TabsTabProps } from './TabsTab/TabsTab';\nimport classes from './Tabs.module.css';\nexport type TabsStylesNames =\n  | 'root'\n  | TabsListStylesNames\n  | TabsPanelStylesNames\n  | TabsTabStylesNames;\n\nexport type TabsVariant = 'default' | 'outline' | 'pills';\nexport type TabsCssVariables = {\n  root: '--tabs-color' | '--tabs-radius';\n};\n\nexport interface TabsProps\n  extends\n    BoxProps,\n    StylesApiProps<TabsFactory>,\n    ElementProps<'div', 'defaultValue' | 'value' | 'onChange'> {\n  /** Uncontrolled component default value */\n  defaultValue?: string | null;\n\n  /** Controlled component value */\n  value?: string | null;\n\n  /** Called when value changes */\n  onChange?: (value: string | null) => void;\n\n  /** Tabs orientation @default 'horizontal' */\n  orientation?: 'vertical' | 'horizontal';\n\n  /** `Tabs.List` placement relative to `Tabs.Panel`, applicable only when `orientation=\"vertical\"` @default 'left' */\n  placement?: 'left' | 'right';\n\n  /** Base id, used to generate ids to connect labels with controls, generated randomly by default */\n  id?: string;\n\n  /** If set, arrow key presses loop though items (first to last and last to first) @default true */\n  loop?: boolean;\n\n  /** If set, tab is activated with arrow key press @default true */\n  activateTabWithKeyboard?: boolean;\n\n  /** If set, tab can be deactivated @default false */\n  allowTabDeactivation?: boolean;\n\n  /** Tabs content */\n  children?: React.ReactNode;\n\n  /** Changes colors of `Tabs.Tab` components when variant is `pills` or `default`, does nothing for other variants */\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  /** Determines whether tabs should have inverted styles @default false */\n  inverted?: boolean;\n\n  /** If set to `false`, `Tabs.Panel` content will be unmounted when the associated tab is not active @default true */\n  keepMounted?: boolean;\n\n  /** Controls how inactive tabs content is hidden when `keepMounted` is `true`, `'activity'` – hidden with `Activity` component, `'display-none'` – hidden with `display: none` styles @default 'activity' */\n  keepMountedMode?: 'activity' | 'display-none';\n\n  /** If set, adjusts text color based on background color for `pills` variant */\n  autoContrast?: boolean;\n}\n\nexport type TabsFactory = Factory<{\n  props: TabsProps;\n  ref: HTMLDivElement;\n  variant: TabsVariant;\n  stylesNames: TabsStylesNames;\n  vars: TabsCssVariables;\n  staticComponents: {\n    Tab: typeof TabsTab;\n    Panel: typeof TabsPanel;\n    List: typeof TabsList;\n  };\n}>;\n\nconst VALUE_ERROR =\n  'Tabs.Tab or Tabs.Panel component was rendered with invalid value or without value';\n\nconst defaultProps = {\n  keepMounted: true,\n  keepMountedMode: 'activity',\n  orientation: 'horizontal',\n  loop: true,\n  activateTabWithKeyboard: true,\n  variant: 'default',\n  placement: 'left',\n} satisfies Partial<TabsProps>;\n\nconst varsResolver = createVarsResolver<TabsFactory>((theme, { radius, color, autoContrast }) => ({\n  root: {\n    '--tabs-radius': getRadius(radius),\n    '--tabs-color': getThemeColor(color, theme),\n    '--tabs-text-color': getAutoContrastValue(autoContrast, theme)\n      ? getContrastColor({ color, theme, autoContrast })\n      : undefined,\n  },\n}));\n\nexport const Tabs = factory<TabsFactory>((_props) => {\n  const props = useProps('Tabs', defaultProps, _props);\n  const {\n    defaultValue,\n    value,\n    onChange,\n    orientation,\n    children,\n    loop,\n    id,\n    activateTabWithKeyboard,\n    allowTabDeactivation,\n    variant,\n    color,\n    radius,\n    inverted,\n    placement,\n    keepMounted,\n    keepMountedMode,\n    classNames,\n    styles,\n    unstyled,\n    className,\n    style,\n    vars,\n    autoContrast,\n    mod,\n    attributes,\n    ...others\n  } = props;\n\n  const uid = useId(id);\n  const mountedPanels = useRef(new Set<string>());\n  const forceUpdate = useForceUpdate();\n\n  const setMountedPanel = useCallback((panelValue: string, mounted: boolean) => {\n    const panels = mountedPanels.current;\n    if (mounted && !panels.has(panelValue)) {\n      panels.add(panelValue);\n      forceUpdate();\n    } else if (!mounted && panels.has(panelValue)) {\n      panels.delete(panelValue);\n      forceUpdate();\n    }\n  }, []);\n\n  const [currentTab, setCurrentTab] = useUncontrolled({\n    value,\n    defaultValue,\n    finalValue: null,\n    onChange,\n  });\n\n  const getStyles = useStyles<TabsFactory>({\n    name: 'Tabs',\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  return (\n    <TabsProvider\n      value={{\n        placement,\n        value: currentTab,\n        orientation,\n        id: uid,\n        loop,\n        activateTabWithKeyboard,\n        getTabId: getSafeId(`${uid}-tab`, VALUE_ERROR),\n        getPanelId: getSafeId(`${uid}-panel`, VALUE_ERROR),\n        onChange: setCurrentTab,\n        allowTabDeactivation,\n        variant,\n        color,\n        radius,\n        inverted,\n        keepMounted,\n        keepMountedMode,\n        unstyled,\n        getStyles,\n        mountedPanels,\n        setMountedPanel,\n      }}\n    >\n      <Box\n        id={uid}\n        variant={variant}\n        mod={[\n          {\n            orientation,\n            inverted: orientation === 'horizontal' && inverted,\n            placement: orientation === 'vertical' && placement,\n          },\n          mod,\n        ]}\n        {...getStyles('root')}\n        {...others}\n      >\n        {children}\n      </Box>\n    </TabsProvider>\n  );\n});\n\nTabs.classes = classes;\nTabs.varsResolver = varsResolver;\nTabs.displayName = '@mantine/core/Tabs';\nTabs.Tab = TabsTab;\nTabs.Panel = TabsPanel;\nTabs.List = TabsList;\n\nexport namespace Tabs {\n  export type Props = TabsProps;\n  export type StylesNames = TabsStylesNames;\n  export type CssVariables = TabsCssVariables;\n  export type Factory = TabsFactory;\n  export type Variant = TabsVariant;\n  export type ContextValue = TabsContextValue;\n\n  export namespace Tab {\n    export type Props = TabsTabProps;\n    export type StylesNames = TabsTabStylesNames;\n  }\n\n  export namespace Panel {\n    export type Props = TabsPanelProps;\n    export type StylesNames = TabsPanelStylesNames;\n  }\n\n  export namespace List {\n    export type Props = TabsListProps;\n    export type StylesNames = TabsListStylesNames;\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAuGA,MAAM,cACJ;AAEF,MAAM,eAAe;CACnB,aAAa;CACb,iBAAiB;CACjB,aAAa;CACb,MAAM;CACN,yBAAyB;CACzB,SAAS;CACT,WAAW;AACb;AAEA,MAAM,eAAe,oBAAiC,OAAO,EAAE,QAAQ,OAAO,oBAAoB,EAChG,MAAM;CACJ,iBAAiB,UAAU,MAAM;CACjC,gBAAgB,cAAc,OAAO,KAAK;CAC1C,qBAAqB,qBAAqB,cAAc,KAAK,IACzD,iBAAiB;EAAE;EAAO;EAAO;CAAa,CAAC,IAC/C,KAAA;AACN,EACF,EAAE;AAEF,MAAa,OAAO,SAAsB,WAAW;CACnD,MAAM,QAAQ,SAAS,QAAQ,cAAc,MAAM;CACnD,MAAM,EACJ,cACA,OACA,UACA,aACA,UACA,MACA,IACA,yBACA,sBACA,SACA,OACA,QACA,UACA,WACA,aACA,iBACA,YACA,QACA,UACA,WACA,OACA,MACA,cACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,MAAMA,QAAM,EAAE;CACpB,MAAM,gBAAgB,uBAAO,IAAI,IAAY,CAAC;CAC9C,MAAM,cAAc,eAAe;CAEnC,MAAM,kBAAkB,aAAa,YAAoB,YAAqB;EAC5E,MAAM,SAAS,cAAc;EAC7B,IAAI,WAAW,CAAC,OAAO,IAAI,UAAU,GAAG;GACtC,OAAO,IAAI,UAAU;GACrB,YAAY;EACd,OAAO,IAAI,CAAC,WAAW,OAAO,IAAI,UAAU,GAAG;GAC7C,OAAO,OAAO,UAAU;GACxB,YAAY;EACd;CACF,GAAG,CAAC,CAAC;CAEL,MAAM,CAAC,YAAY,iBAAiB,gBAAgB;EAClD;EACA;EACA,YAAY;EACZ;CACF,CAAC;CAED,MAAM,YAAY,UAAuB;EACvC,MAAM;EACN;EACA,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,OACE,oBAAC,cAAD;EACE,OAAO;GACL;GACA,OAAO;GACP;GACA,IAAI;GACJ;GACA;GACA,UAAU,UAAU,GAAG,IAAI,OAAO,WAAW;GAC7C,YAAY,UAAU,GAAG,IAAI,SAAS,WAAW;GACjD,UAAU;GACV;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF;YAEA,oBAAC,KAAD;GACE,IAAI;GACK;GACT,KAAK,CACH;IACE;IACA,UAAU,gBAAgB,gBAAgB;IAC1C,WAAW,gBAAgB,cAAc;GAC3C,GACA,GACF;GACA,GAAI,UAAU,MAAM;GACpB,GAAI;GAEH;EACE,CAAA;CACO,CAAA;AAElB,CAAC;AAED,KAAK,UAAUC;AACf,KAAK,eAAe;AACpB,KAAK,cAAc;AACnB,KAAK,MAAM;AACX,KAAK,QAAQ;AACb,KAAK,OAAO"}

package/esm/components/Tabs/TabsPanel/TabsPanel.mjs

@@ -5,7 +5,7 @@ import { factory } from "../../../core/factory/factory.mjs";
 import { Box } from "../../../core/Box/Box.mjs";
 import { useTabsContext } from "../Tabs.context.mjs";
 import Tabs_module_default from "../Tabs.module.mjs";
-import { Activity } from "react";
+import { Activity, useEffect } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region packages/@mantine/core/src/components/Tabs/TabsPanel/TabsPanel.tsx
 const TabsPanel = factory((_props) => {
@@ -13,6 +13,12 @@ const TabsPanel = factory((_props) => {
 	const { children, className, value, classNames, styles, style, mod, keepMounted, ...others } = props;
 	const env = useMantineEnv();
 	const ctx = useTabsContext();
+	useEffect(() => {
+		ctx.setMountedPanel(value, true);
+		return () => {
+			ctx.setMountedPanel(value, false);
+		};
+	}, [value]);
 	const active = ctx.value === value;
 	const shouldKeepMounted = ctx.keepMounted || keepMounted;
 	const useActivity = ctx.keepMountedMode !== "display-none";

package/esm/components/Tabs/TabsPanel/TabsPanel.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"TabsPanel.mjs","names":["classes"],"sources":["../../../../src/components/Tabs/TabsPanel/TabsPanel.tsx"],"sourcesContent":["import { Activity } from 'react';\nimport {\n  Box,\n  BoxProps,\n  CompoundStylesApiProps,\n  ElementProps,\n  factory,\n  Factory,\n  useMantineEnv,\n  useProps,\n} from '../../../core';\nimport { useTabsContext } from '../Tabs.context';\nimport classes from '../Tabs.module.css';\n\nexport type TabsPanelStylesNames = 'panel';\n\nexport interface TabsPanelProps\n  extends BoxProps, CompoundStylesApiProps<TabsPanelFactory>, ElementProps<'div'> {\n  /** Panel content */\n  children: React.ReactNode;\n\n  /** If set, the content is kept mounted, even if `keepMounted` is set `false` in the parent `Tabs` component */\n  keepMounted?: boolean;\n\n  /** Value of associated control */\n  value: string;\n}\n\nexport type TabsPanelFactory = Factory<{\n  props: TabsPanelProps;\n  ref: HTMLDivElement;\n  stylesNames: TabsPanelStylesNames;\n  compound: true;\n}>;\n\nexport const TabsPanel = factory<TabsPanelFactory>((_props) => {\n  const props = useProps('TabsPanel', null, _props);\n  const { children, className, value, classNames, styles, style, mod, keepMounted, ...others } =\n    props;\n\n  const env = useMantineEnv();\n  const ctx = useTabsContext();\n\n  const active = ctx.value === value;\n  const shouldKeepMounted = ctx.keepMounted || keepMounted;\n  const useActivity = ctx.keepMountedMode !== 'display-none';\n  const content =\n    shouldKeepMounted && useActivity && env !== 'test' ? (\n      <Activity mode={active ? 'visible' : 'hidden'}>{children}</Activity>\n    ) : shouldKeepMounted ? (\n      children\n    ) : active ? (\n      children\n    ) : null;\n\n  return (\n    <Box\n      {...ctx.getStyles('panel', {\n        className,\n        classNames,\n        styles,\n        style: [style, !active ? { display: 'none' } : undefined],\n        props,\n      })}\n      mod={[{ orientation: ctx.orientation }, mod]}\n      role=\"tabpanel\"\n      id={ctx.getPanelId(value)}\n      aria-labelledby={ctx.getTabId(value)}\n      {...others}\n    >\n      {content}\n    </Box>\n  );\n});\n\nTabsPanel.classes = classes;\nTabsPanel.displayName = '@mantine/core/TabsPanel';\n"],"mappings":";;;;;;;;;;AAmCA,MAAa,YAAY,SAA2B,WAAW;CAC7D,MAAM,QAAQ,SAAS,aAAa,MAAM,MAAM;CAChD,MAAM,EAAE,UAAU,WAAW,OAAO,YAAY,QAAQ,OAAO,KAAK,aAAa,GAAG,WAClF;CAEF,MAAM,MAAM,cAAc;CAC1B,MAAM,MAAM,eAAe;CAE3B,MAAM,SAAS,IAAI,UAAU;CAC7B,MAAM,oBAAoB,IAAI,eAAe;CAC7C,MAAM,cAAc,IAAI,oBAAoB;CAC5C,MAAM,UACJ,qBAAqB,eAAe,QAAQ,SAC1C,oBAAC,UAAD;EAAU,MAAM,SAAS,YAAY;EAAW;CAAmB,CAAA,IACjE,oBACF,WACE,SACF,WACE;CAEN,OACE,oBAAC,KAAD;EACE,GAAI,IAAI,UAAU,SAAS;GACzB;GACA;GACA;GACA,OAAO,CAAC,OAAO,CAAC,SAAS,EAAE,SAAS,OAAO,IAAI,KAAA,CAAS;GACxD;EACF,CAAC;EACD,KAAK,CAAC,EAAE,aAAa,IAAI,YAAY,GAAG,GAAG;EAC3C,MAAK;EACL,IAAI,IAAI,WAAW,KAAK;EACxB,mBAAiB,IAAI,SAAS,KAAK;EACnC,GAAI;YAEH;CACE,CAAA;AAET,CAAC;AAED,UAAU,UAAUA;AACpB,UAAU,cAAc"}
+{"version":3,"file":"TabsPanel.mjs","names":["classes"],"sources":["../../../../src/components/Tabs/TabsPanel/TabsPanel.tsx"],"sourcesContent":["import { Activity, useEffect } from 'react';\nimport {\n  Box,\n  BoxProps,\n  CompoundStylesApiProps,\n  ElementProps,\n  factory,\n  Factory,\n  useMantineEnv,\n  useProps,\n} from '../../../core';\nimport { useTabsContext } from '../Tabs.context';\nimport classes from '../Tabs.module.css';\n\nexport type TabsPanelStylesNames = 'panel';\n\nexport interface TabsPanelProps\n  extends BoxProps, CompoundStylesApiProps<TabsPanelFactory>, ElementProps<'div'> {\n  /** Panel content */\n  children: React.ReactNode;\n\n  /** If set, the content is kept mounted, even if `keepMounted` is set `false` in the parent `Tabs` component */\n  keepMounted?: boolean;\n\n  /** Value of associated control */\n  value: string;\n}\n\nexport type TabsPanelFactory = Factory<{\n  props: TabsPanelProps;\n  ref: HTMLDivElement;\n  stylesNames: TabsPanelStylesNames;\n  compound: true;\n}>;\n\nexport const TabsPanel = factory<TabsPanelFactory>((_props) => {\n  const props = useProps('TabsPanel', null, _props);\n  const { children, className, value, classNames, styles, style, mod, keepMounted, ...others } =\n    props;\n\n  const env = useMantineEnv();\n  const ctx = useTabsContext();\n\n  useEffect(() => {\n    ctx.setMountedPanel(value, true);\n    return () => {\n      ctx.setMountedPanel(value, false);\n    };\n  }, [value]);\n\n  const active = ctx.value === value;\n  const shouldKeepMounted = ctx.keepMounted || keepMounted;\n  const useActivity = ctx.keepMountedMode !== 'display-none';\n  const content =\n    shouldKeepMounted && useActivity && env !== 'test' ? (\n      <Activity mode={active ? 'visible' : 'hidden'}>{children}</Activity>\n    ) : shouldKeepMounted ? (\n      children\n    ) : active ? (\n      children\n    ) : null;\n\n  return (\n    <Box\n      {...ctx.getStyles('panel', {\n        className,\n        classNames,\n        styles,\n        style: [style, !active ? { display: 'none' } : undefined],\n        props,\n      })}\n      mod={[{ orientation: ctx.orientation }, mod]}\n      role=\"tabpanel\"\n      id={ctx.getPanelId(value)}\n      aria-labelledby={ctx.getTabId(value)}\n      {...others}\n    >\n      {content}\n    </Box>\n  );\n});\n\nTabsPanel.classes = classes;\nTabsPanel.displayName = '@mantine/core/TabsPanel';\n"],"mappings":";;;;;;;;;;AAmCA,MAAa,YAAY,SAA2B,WAAW;CAC7D,MAAM,QAAQ,SAAS,aAAa,MAAM,MAAM;CAChD,MAAM,EAAE,UAAU,WAAW,OAAO,YAAY,QAAQ,OAAO,KAAK,aAAa,GAAG,WAClF;CAEF,MAAM,MAAM,cAAc;CAC1B,MAAM,MAAM,eAAe;CAE3B,gBAAgB;EACd,IAAI,gBAAgB,OAAO,IAAI;EAC/B,aAAa;GACX,IAAI,gBAAgB,OAAO,KAAK;EAClC;CACF,GAAG,CAAC,KAAK,CAAC;CAEV,MAAM,SAAS,IAAI,UAAU;CAC7B,MAAM,oBAAoB,IAAI,eAAe;CAC7C,MAAM,cAAc,IAAI,oBAAoB;CAC5C,MAAM,UACJ,qBAAqB,eAAe,QAAQ,SAC1C,oBAAC,UAAD;EAAU,MAAM,SAAS,YAAY;EAAW;CAAmB,CAAA,IACjE,oBACF,WACE,SACF,WACE;CAEN,OACE,oBAAC,KAAD;EACE,GAAI,IAAI,UAAU,SAAS;GACzB;GACA;GACA;GACA,OAAO,CAAC,OAAO,CAAC,SAAS,EAAE,SAAS,OAAO,IAAI,KAAA,CAAS;GACxD;EACF,CAAC;EACD,KAAK,CAAC,EAAE,aAAa,IAAI,YAAY,GAAG,GAAG;EAC3C,MAAK;EACL,IAAI,IAAI,WAAW,KAAK;EACxB,mBAAiB,IAAI,SAAS,KAAK;EACnC,GAAI;YAEH;CACE,CAAA;AAET,CAAC;AAED,UAAU,UAAUA;AACpB,UAAU,cAAc"}

package/esm/components/Tabs/TabsTab/TabsTab.mjs

@@ -47,7 +47,7 @@ const TabsTab = factory((_props) => {
 		id: ctx.getTabId(value),
 		"aria-selected": active,
 		tabIndex: tabIndex !== void 0 ? tabIndex : active || ctx.value === null ? 0 : -1,
-		"aria-controls": ctx.getPanelId(value),
+		"aria-controls": ctx.mountedPanels.current.has(value) ? ctx.getPanelId(value) : void 0,
 		onClick: activateTab,
 		__vars: { "--tabs-color": color ? getThemeColor(color, theme) : void 0 },
 		onKeyDown: createScopedKeydownHandler({

package/esm/components/Tabs/TabsTab/TabsTab.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"TabsTab.mjs","names":["classes"],"sources":["../../../../src/components/Tabs/TabsTab/TabsTab.tsx"],"sourcesContent":["import {\n  CompoundStylesApiProps,\n  createScopedKeydownHandler,\n  ElementProps,\n  factory,\n  Factory,\n  getThemeColor,\n  MantineColor,\n  useDirection,\n  useMantineTheme,\n  useProps,\n} from '../../../core';\nimport { UnstyledButton, UnstyledButtonProps } from '../../UnstyledButton';\nimport { useTabsContext } from '../Tabs.context';\nimport classes from '../Tabs.module.css';\n\nexport type TabsTabStylesNames = 'tab' | 'tabSection' | 'tabLabel';\n\nexport interface TabsTabProps\n  extends\n    Omit<UnstyledButtonProps, 'classNames' | 'styles' | 'vars'>,\n    CompoundStylesApiProps<TabsTabFactory>,\n    ElementProps<'button'> {\n  /** Value of associated panel */\n  value: string;\n\n  /** Tab label */\n  children?: React.ReactNode;\n\n  /** Content displayed on the right side of the label */\n  rightSection?: React.ReactNode;\n\n  /** Content displayed on the left side of the label */\n  leftSection?: React.ReactNode;\n\n  /** Key of `theme.colors` or any valid CSS color, controls tab color based on `variant` */\n  color?: MantineColor;\n}\n\nexport type TabsTabFactory = Factory<{\n  props: TabsTabProps;\n  ref: HTMLButtonElement;\n  stylesNames: TabsTabStylesNames;\n  compound: true;\n}>;\n\nexport const TabsTab = factory<TabsTabFactory>((_props) => {\n  const props = useProps('TabsTab', null, _props);\n  const {\n    className,\n    children,\n    rightSection,\n    leftSection,\n    value,\n    onClick,\n    onKeyDown,\n    disabled,\n    color,\n    style,\n    classNames,\n    styles,\n    vars,\n    mod,\n    tabIndex,\n    ...others\n  } = props;\n\n  const theme = useMantineTheme();\n  const { dir } = useDirection();\n  const ctx = useTabsContext();\n  const active = value === ctx.value;\n  const activateTab = (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n    ctx.onChange(ctx.allowTabDeactivation ? (value === ctx.value ? null : value) : value);\n    onClick?.(event);\n  };\n\n  const stylesApiProps = { classNames, styles, props };\n\n  return (\n    <UnstyledButton\n      {...ctx.getStyles('tab', { className, style, variant: ctx.variant, ...stylesApiProps })}\n      disabled={disabled}\n      unstyled={ctx.unstyled}\n      variant={ctx.variant}\n      mod={[\n        {\n          active,\n          disabled,\n          orientation: ctx.orientation,\n          inverted: ctx.inverted,\n          placement: ctx.orientation === 'vertical' && ctx.placement,\n        },\n        mod,\n      ]}\n      role=\"tab\"\n      id={ctx.getTabId(value)}\n      aria-selected={active}\n      tabIndex={tabIndex !== undefined ? tabIndex : active || ctx.value === null ? 0 : -1}\n      aria-controls={ctx.getPanelId(value)}\n      onClick={activateTab}\n      __vars={{ '--tabs-color': color ? getThemeColor(color, theme) : undefined }}\n      onKeyDown={createScopedKeydownHandler({\n        siblingSelector: '[role=\"tab\"]',\n        parentSelector: '[role=\"tablist\"]',\n        activateOnFocus: ctx.activateTabWithKeyboard,\n        loop: ctx.loop,\n        orientation: ctx.orientation || 'horizontal',\n        dir,\n        onKeyDown,\n      })}\n      {...others}\n    >\n      {leftSection && (\n        <span {...ctx.getStyles('tabSection', stylesApiProps)} data-position=\"left\">\n          {leftSection}\n        </span>\n      )}\n      {children && <span {...ctx.getStyles('tabLabel', stylesApiProps)}>{children}</span>}\n      {rightSection && (\n        <span {...ctx.getStyles('tabSection', stylesApiProps)} data-position=\"right\">\n          {rightSection}\n        </span>\n      )}\n    </UnstyledButton>\n  );\n});\n\nTabsTab.classes = classes;\nTabsTab.displayName = '@mantine/core/TabsTab';\n"],"mappings":";;;;;;;;;;;;AA8CA,MAAa,UAAU,SAAyB,WAAW;CACzD,MAAM,QAAQ,SAAS,WAAW,MAAM,MAAM;CAC9C,MAAM,EACJ,WACA,UACA,cACA,aACA,OACA,SACA,WACA,UACA,OACA,OACA,YACA,QACA,MACA,KACA,UACA,GAAG,WACD;CAEJ,MAAM,QAAQ,gBAAgB;CAC9B,MAAM,EAAE,QAAQ,aAAa;CAC7B,MAAM,MAAM,eAAe;CAC3B,MAAM,SAAS,UAAU,IAAI;CAC7B,MAAM,eAAe,UAA2D;EAC9E,IAAI,SAAS,IAAI,uBAAwB,UAAU,IAAI,QAAQ,OAAO,QAAS,KAAK;EACpF,UAAU,KAAK;CACjB;CAEA,MAAM,iBAAiB;EAAE;EAAY;EAAQ;CAAM;CAEnD,OACE,qBAAC,gBAAD;EACE,GAAI,IAAI,UAAU,OAAO;GAAE;GAAW;GAAO,SAAS,IAAI;GAAS,GAAG;EAAe,CAAC;EAC5E;EACV,UAAU,IAAI;EACd,SAAS,IAAI;EACb,KAAK,CACH;GACE;GACA;GACA,aAAa,IAAI;GACjB,UAAU,IAAI;GACd,WAAW,IAAI,gBAAgB,cAAc,IAAI;EACnD,GACA,GACF;EACA,MAAK;EACL,IAAI,IAAI,SAAS,KAAK;EACtB,iBAAe;EACf,UAAU,aAAa,KAAA,IAAY,WAAW,UAAU,IAAI,UAAU,OAAO,IAAI;EACjF,iBAAe,IAAI,WAAW,KAAK;EACnC,SAAS;EACT,QAAQ,EAAE,gBAAgB,QAAQ,cAAc,OAAO,KAAK,IAAI,KAAA,EAAU;EAC1E,WAAW,2BAA2B;GACpC,iBAAiB;GACjB,gBAAgB;GAChB,iBAAiB,IAAI;GACrB,MAAM,IAAI;GACV,aAAa,IAAI,eAAe;GAChC;GACA;EACF,CAAC;EACD,GAAI;YA/BN;GAiCG,eACC,oBAAC,QAAD;IAAM,GAAI,IAAI,UAAU,cAAc,cAAc;IAAG,iBAAc;cAClE;GACG,CAAA;GAEP,YAAY,oBAAC,QAAD;IAAM,GAAI,IAAI,UAAU,YAAY,cAAc;IAAI;GAAe,CAAA;GACjF,gBACC,oBAAC,QAAD;IAAM,GAAI,IAAI,UAAU,cAAc,cAAc;IAAG,iBAAc;cAClE;GACG,CAAA;EAEM;;AAEpB,CAAC;AAED,QAAQ,UAAUA;AAClB,QAAQ,cAAc"}
+{"version":3,"file":"TabsTab.mjs","names":["classes"],"sources":["../../../../src/components/Tabs/TabsTab/TabsTab.tsx"],"sourcesContent":["import {\n  CompoundStylesApiProps,\n  createScopedKeydownHandler,\n  ElementProps,\n  factory,\n  Factory,\n  getThemeColor,\n  MantineColor,\n  useDirection,\n  useMantineTheme,\n  useProps,\n} from '../../../core';\nimport { UnstyledButton, UnstyledButtonProps } from '../../UnstyledButton';\nimport { useTabsContext } from '../Tabs.context';\nimport classes from '../Tabs.module.css';\n\nexport type TabsTabStylesNames = 'tab' | 'tabSection' | 'tabLabel';\n\nexport interface TabsTabProps\n  extends\n    Omit<UnstyledButtonProps, 'classNames' | 'styles' | 'vars'>,\n    CompoundStylesApiProps<TabsTabFactory>,\n    ElementProps<'button'> {\n  /** Value of associated panel */\n  value: string;\n\n  /** Tab label */\n  children?: React.ReactNode;\n\n  /** Content displayed on the right side of the label */\n  rightSection?: React.ReactNode;\n\n  /** Content displayed on the left side of the label */\n  leftSection?: React.ReactNode;\n\n  /** Key of `theme.colors` or any valid CSS color, controls tab color based on `variant` */\n  color?: MantineColor;\n}\n\nexport type TabsTabFactory = Factory<{\n  props: TabsTabProps;\n  ref: HTMLButtonElement;\n  stylesNames: TabsTabStylesNames;\n  compound: true;\n}>;\n\nexport const TabsTab = factory<TabsTabFactory>((_props) => {\n  const props = useProps('TabsTab', null, _props);\n  const {\n    className,\n    children,\n    rightSection,\n    leftSection,\n    value,\n    onClick,\n    onKeyDown,\n    disabled,\n    color,\n    style,\n    classNames,\n    styles,\n    vars,\n    mod,\n    tabIndex,\n    ...others\n  } = props;\n\n  const theme = useMantineTheme();\n  const { dir } = useDirection();\n  const ctx = useTabsContext();\n  const active = value === ctx.value;\n  const activateTab = (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n    ctx.onChange(ctx.allowTabDeactivation ? (value === ctx.value ? null : value) : value);\n    onClick?.(event);\n  };\n\n  const stylesApiProps = { classNames, styles, props };\n\n  return (\n    <UnstyledButton\n      {...ctx.getStyles('tab', { className, style, variant: ctx.variant, ...stylesApiProps })}\n      disabled={disabled}\n      unstyled={ctx.unstyled}\n      variant={ctx.variant}\n      mod={[\n        {\n          active,\n          disabled,\n          orientation: ctx.orientation,\n          inverted: ctx.inverted,\n          placement: ctx.orientation === 'vertical' && ctx.placement,\n        },\n        mod,\n      ]}\n      role=\"tab\"\n      id={ctx.getTabId(value)}\n      aria-selected={active}\n      tabIndex={tabIndex !== undefined ? tabIndex : active || ctx.value === null ? 0 : -1}\n      aria-controls={ctx.mountedPanels.current.has(value) ? ctx.getPanelId(value) : undefined}\n      onClick={activateTab}\n      __vars={{ '--tabs-color': color ? getThemeColor(color, theme) : undefined }}\n      onKeyDown={createScopedKeydownHandler({\n        siblingSelector: '[role=\"tab\"]',\n        parentSelector: '[role=\"tablist\"]',\n        activateOnFocus: ctx.activateTabWithKeyboard,\n        loop: ctx.loop,\n        orientation: ctx.orientation || 'horizontal',\n        dir,\n        onKeyDown,\n      })}\n      {...others}\n    >\n      {leftSection && (\n        <span {...ctx.getStyles('tabSection', stylesApiProps)} data-position=\"left\">\n          {leftSection}\n        </span>\n      )}\n      {children && <span {...ctx.getStyles('tabLabel', stylesApiProps)}>{children}</span>}\n      {rightSection && (\n        <span {...ctx.getStyles('tabSection', stylesApiProps)} data-position=\"right\">\n          {rightSection}\n        </span>\n      )}\n    </UnstyledButton>\n  );\n});\n\nTabsTab.classes = classes;\nTabsTab.displayName = '@mantine/core/TabsTab';\n"],"mappings":";;;;;;;;;;;;AA8CA,MAAa,UAAU,SAAyB,WAAW;CACzD,MAAM,QAAQ,SAAS,WAAW,MAAM,MAAM;CAC9C,MAAM,EACJ,WACA,UACA,cACA,aACA,OACA,SACA,WACA,UACA,OACA,OACA,YACA,QACA,MACA,KACA,UACA,GAAG,WACD;CAEJ,MAAM,QAAQ,gBAAgB;CAC9B,MAAM,EAAE,QAAQ,aAAa;CAC7B,MAAM,MAAM,eAAe;CAC3B,MAAM,SAAS,UAAU,IAAI;CAC7B,MAAM,eAAe,UAA2D;EAC9E,IAAI,SAAS,IAAI,uBAAwB,UAAU,IAAI,QAAQ,OAAO,QAAS,KAAK;EACpF,UAAU,KAAK;CACjB;CAEA,MAAM,iBAAiB;EAAE;EAAY;EAAQ;CAAM;CAEnD,OACE,qBAAC,gBAAD;EACE,GAAI,IAAI,UAAU,OAAO;GAAE;GAAW;GAAO,SAAS,IAAI;GAAS,GAAG;EAAe,CAAC;EAC5E;EACV,UAAU,IAAI;EACd,SAAS,IAAI;EACb,KAAK,CACH;GACE;GACA;GACA,aAAa,IAAI;GACjB,UAAU,IAAI;GACd,WAAW,IAAI,gBAAgB,cAAc,IAAI;EACnD,GACA,GACF;EACA,MAAK;EACL,IAAI,IAAI,SAAS,KAAK;EACtB,iBAAe;EACf,UAAU,aAAa,KAAA,IAAY,WAAW,UAAU,IAAI,UAAU,OAAO,IAAI;EACjF,iBAAe,IAAI,cAAc,QAAQ,IAAI,KAAK,IAAI,IAAI,WAAW,KAAK,IAAI,KAAA;EAC9E,SAAS;EACT,QAAQ,EAAE,gBAAgB,QAAQ,cAAc,OAAO,KAAK,IAAI,KAAA,EAAU;EAC1E,WAAW,2BAA2B;GACpC,iBAAiB;GACjB,gBAAgB;GAChB,iBAAiB,IAAI;GACrB,MAAM,IAAI;GACV,aAAa,IAAI,eAAe;GAChC;GACA;EACF,CAAC;EACD,GAAI;YA/BN;GAiCG,eACC,oBAAC,QAAD;IAAM,GAAI,IAAI,UAAU,cAAc,cAAc;IAAG,iBAAc;cAClE;GACG,CAAA;GAEP,YAAY,oBAAC,QAAD;IAAM,GAAI,IAAI,UAAU,YAAY,cAAc;IAAI;GAAe,CAAA;GACjF,gBACC,oBAAC,QAAD;IAAM,GAAI,IAAI,UAAU,cAAc,cAAc;IAAG,iBAAc;cAClE;GACG,CAAA;EAEM;;AAEpB,CAAC;AAED,QAAQ,UAAUA;AAClB,QAAQ,cAAc"}

package/esm/components/TagsInput/TagsInput.mjs

@@ -33,7 +33,7 @@ const TagsInput = factory((_props) => {
 		"InputWrapper",
 		"TagsInput"
 	], defaultProps, _props);
-	const { classNames, className, style, styles, unstyled, vars, size, value, defaultValue, onChange, onKeyDown, maxTags, allowDuplicates, onDuplicate, variant, data, dropdownOpened, defaultDropdownOpened, onDropdownOpen, onDropdownClose, selectFirstOptionOnChange, selectFirstOptionOnDropdownOpen, onOptionSubmit, comboboxProps, filter, limit, withScrollArea, maxDropdownHeight, floatingHeight, searchValue, defaultSearchValue, onSearchChange, readOnly, disabled, splitChars, onFocus, onBlur, onPaste, radius, rightSection, rightSectionWidth, rightSectionPointerEvents, rightSectionProps, leftSection, leftSectionWidth, leftSectionPointerEvents, leftSectionProps, inputContainer, inputWrapperOrder, withAsterisk, required, labelProps, descriptionProps, errorProps, wrapperProps, description, label, error, withErrorStyles, name, form, id, clearable, clearSectionMode, clearButtonProps, hiddenInputProps, hiddenInputValuesDivider, mod, renderOption, renderPill, onRemove, onClear, onMaxTags, scrollAreaProps, acceptValueOnBlur, isDuplicate, openOnFocus, attributes, ref, loading, loadingPosition, withPillsReorder, ...others } = props;
+	const { classNames, className, style, styles, unstyled, vars, size, value, defaultValue, onChange, onKeyDown, maxTags, allowDuplicates, onDuplicate, variant, data, dropdownOpened, defaultDropdownOpened, onDropdownOpen, onDropdownClose, selectFirstOptionOnChange, selectFirstOptionOnDropdownOpen, onOptionSubmit, comboboxProps, filter, limit, withScrollArea, maxDropdownHeight, floatingHeight, searchValue, defaultSearchValue, onSearchChange, readOnly, disabled, splitChars, onFocus, onBlur, onPaste, radius, rightSection, rightSectionWidth, rightSectionPointerEvents, rightSectionProps, leftSection, leftSectionWidth, leftSectionPointerEvents, leftSectionProps, inputContainer, inputWrapperOrder, withAsterisk, required, labelProps, descriptionProps, errorProps, successProps, wrapperProps, description, label, error, success, withErrorStyles, withSuccessStyles, name, form, id, clearable, clearSectionMode, clearButtonProps, hiddenInputProps, hiddenInputValuesDivider, mod, renderOption, renderPill, onRemove, onClear, onMaxTags, scrollAreaProps, acceptValueOnBlur, isDuplicate, openOnFocus, attributes, ref, loading, loadingPosition, withPillsReorder, ...others } = props;
 	const _id = useId$1(id);
 	const parsedData = getParsedComboboxData(data);
 	const optionsLockup = getOptionsLockup(parsedData);
@@ -244,11 +244,14 @@ const TagsInput = factory((_props) => {
 			labelProps,
 			descriptionProps,
 			errorProps,
+			successProps,
 			wrapperProps,
 			description,
 			label,
 			error,
+			success,
 			withErrorStyles,
+			withSuccessStyles,
 			__stylesApiProps: {
 				...props,
 				multiline: true

package/esm/components/TagsInput/TagsInput.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"TagsInput.mjs","names":["useId"],"sources":["../../../src/components/TagsInput/TagsInput.tsx"],"sourcesContent":["import { Fragment, useEffect, useRef } from 'react';\nimport { useId, useMergedRef, useUncontrolled } from '@mantine/hooks';\nimport {\n  BoxProps,\n  ElementProps,\n  extractStyleProps,\n  factory,\n  Factory,\n  Primitive,\n  StylesApiProps,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '../../core';\nimport {\n  Combobox,\n  ComboboxGenericData,\n  ComboboxGenericItem,\n  ComboboxLikeProps,\n  ComboboxLikeRenderOptionInput,\n  ComboboxLikeStylesNames,\n  ComboboxRenderPillInput,\n  getOptionsLockup,\n  getParsedComboboxData,\n  OptionsDropdown,\n  OptionsFilter,\n  useCombobox,\n  usePillsReorder,\n} from '../Combobox';\nimport {\n  __BaseInputProps,\n  __InputStylesNames,\n  ClearSectionMode,\n  InputClearButtonProps,\n} from '../Input';\nimport { InputBase } from '../InputBase';\nimport { Pill } from '../Pill';\nimport { PillsInput } from '../PillsInput';\nimport { ScrollAreaProps } from '../ScrollArea';\nimport { filterPickedTags } from './filter-picked-tags';\nimport { getSplittedTags } from './get-splitted-tags';\n\nexport type TagsInputStylesNames =\n  | __InputStylesNames\n  | ComboboxLikeStylesNames\n  | 'pill'\n  | 'pillsList'\n  | 'inputField';\n\nexport interface TagsInputProps\n  extends\n    BoxProps,\n    __BaseInputProps,\n    Omit<ComboboxLikeProps, 'data'>,\n    StylesApiProps<TagsInputFactory>,\n    ElementProps<'input', 'size' | 'value' | 'defaultValue' | 'onChange'> {\n  /** Data displayed in the dropdown. Values must be unique. */\n  data?: ComboboxGenericData;\n\n  /** Controlled component value */\n  value?: string[];\n\n  /** Uncontrolled component default value */\n  defaultValue?: string[];\n\n  /** Called when value changes */\n  onChange?: (value: string[]) => void;\n\n  /** Called when tag is removed */\n  onRemove?: (value: string) => void;\n\n  /** Called when the clear button is clicked */\n  onClear?: () => void;\n\n  /** Controlled search value */\n  searchValue?: string;\n\n  /** Default search value */\n  defaultSearchValue?: string;\n\n  /** Called when search changes */\n  onSearchChange?: (value: string) => void;\n\n  /** Maximum number of tags @default Infinity */\n  maxTags?: number;\n\n  /** Called when user tries to add more tags than maxTags */\n  onMaxTags?: (value: string) => void;\n\n  /** If set, duplicate tags are allowed @default false */\n  allowDuplicates?: boolean;\n\n  /** Called when user tries to submit a duplicated tag */\n  onDuplicate?: (value: string) => void;\n\n  /** Characters that should trigger tags split, `[',']` by default */\n  splitChars?: string[];\n\n  /** If set, the clear button is displayed in the right section when the component has value @default false */\n  clearable?: boolean;\n\n  /** Determines how the clear button and rightSection are rendered @default 'both' */\n  clearSectionMode?: ClearSectionMode;\n\n  /** Props passed down to the clear button */\n  clearButtonProps?: InputClearButtonProps;\n\n  /** Props passed down to the hidden input */\n  hiddenInputProps?: Omit<React.ComponentProps<'input'>, 'value'>;\n\n  /** Divider used to separate values in the hidden input `value` attribute @default ',' */\n  hiddenInputValuesDivider?: string;\n\n  /** A function to render content of the option, replaces the default content of the option */\n  renderOption?: (input: ComboboxLikeRenderOptionInput<ComboboxGenericItem>) => React.ReactNode;\n\n  /** A function to render content of the pill, replaces the default content of the pill */\n  renderPill?: (props: ComboboxRenderPillInput) => React.ReactNode;\n\n  /** Props passed down to the underlying `ScrollArea` component in the dropdown */\n  scrollAreaProps?: ScrollAreaProps;\n\n  /** If set, the value typed in by the user but not submitted is accepted when the input is blurred @default true */\n  acceptValueOnBlur?: boolean;\n\n  /** Custom function to determine if a tag is duplicate. Accepts tag value and array of current values. By default, checks if the tag exists case-insensitively. */\n  isDuplicate?: (value: string, currentValues: string[]) => boolean;\n\n  /** If set, the dropdown opens when the input receives focus @default true */\n  openOnFocus?: boolean;\n\n  /** If set, tags can be reordered by dragging pills. Disabled when `disabled` or `readOnly` is set. @default false */\n  withPillsReorder?: boolean;\n}\n\nexport type TagsInputFactory = Factory<{\n  props: TagsInputProps;\n  ref: HTMLInputElement;\n  stylesNames: TagsInputStylesNames;\n}>;\n\nconst defaultProps = {\n  maxTags: Infinity,\n  acceptValueOnBlur: true,\n  splitChars: [','],\n  hiddenInputValuesDivider: ',',\n  openOnFocus: true,\n  size: 'sm',\n} satisfies Partial<TagsInputProps>;\n\nexport const TagsInput = factory<TagsInputFactory>((_props) => {\n  const props = useProps(['Input', 'InputWrapper', 'TagsInput'], defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    size,\n    value,\n    defaultValue,\n    onChange,\n    onKeyDown,\n    maxTags,\n    allowDuplicates,\n    onDuplicate,\n    variant,\n    data,\n    dropdownOpened,\n    defaultDropdownOpened,\n    onDropdownOpen,\n    onDropdownClose,\n    selectFirstOptionOnChange,\n    selectFirstOptionOnDropdownOpen,\n    onOptionSubmit,\n    comboboxProps,\n    filter,\n    limit,\n    withScrollArea,\n    maxDropdownHeight,\n    floatingHeight,\n    searchValue,\n    defaultSearchValue,\n    onSearchChange,\n    readOnly,\n    disabled,\n    splitChars,\n    onFocus,\n    onBlur,\n    onPaste,\n    radius,\n    rightSection,\n    rightSectionWidth,\n    rightSectionPointerEvents,\n    rightSectionProps,\n    leftSection,\n    leftSectionWidth,\n    leftSectionPointerEvents,\n    leftSectionProps,\n    inputContainer,\n    inputWrapperOrder,\n    withAsterisk,\n    required,\n    labelProps,\n    descriptionProps,\n    errorProps,\n    wrapperProps,\n    description,\n    label,\n    error,\n    withErrorStyles,\n    name,\n    form,\n    id,\n    clearable,\n    clearSectionMode,\n    clearButtonProps,\n    hiddenInputProps,\n    hiddenInputValuesDivider,\n    mod,\n    renderOption,\n    renderPill,\n    onRemove,\n    onClear,\n    onMaxTags,\n    scrollAreaProps,\n    acceptValueOnBlur,\n    isDuplicate,\n    openOnFocus,\n    attributes,\n    ref,\n    loading,\n    loadingPosition,\n    withPillsReorder,\n    ...others\n  } = props;\n\n  const _id = useId(id);\n  const parsedData = getParsedComboboxData(data);\n  const optionsLockup = getOptionsLockup(parsedData);\n  const inputRef = useRef<HTMLInputElement>(null);\n  const _ref = useMergedRef(inputRef, ref);\n\n  const combobox = useCombobox({\n    opened: dropdownOpened,\n    defaultOpened: defaultDropdownOpened,\n    onDropdownOpen: () => {\n      onDropdownOpen?.();\n      if (selectFirstOptionOnDropdownOpen) {\n        combobox.selectFirstOption();\n      }\n    },\n    onDropdownClose: () => {\n      onDropdownClose?.();\n      combobox.resetSelectedOption();\n    },\n  });\n\n  const {\n    styleProps,\n    rest: { type, autoComplete, ...rest },\n  } = extractStyleProps(others);\n\n  const [_value, setValue] = useUncontrolled({\n    value,\n    defaultValue,\n    finalValue: [],\n    onChange,\n  });\n\n  const { getPillProps, getListProps, handleInputKeyDown } = usePillsReorder({\n    value: _value,\n    onChange: setValue,\n    enabled: withPillsReorder && !disabled && !readOnly,\n  });\n\n  const [_searchValue, setSearchValue] = useUncontrolled({\n    value: searchValue,\n    defaultValue: defaultSearchValue,\n    finalValue: '',\n    onChange: onSearchChange,\n  });\n\n  const handleSearchChange = (value: string) => {\n    setSearchValue(value);\n    combobox.resetSelectedOption();\n  };\n\n  const getStyles = useStyles<TagsInputFactory>({\n    name: 'TagsInput',\n    classes: {} as any,\n    props: props as any,\n    classNames,\n    styles,\n    unstyled,\n  });\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<TagsInputFactory>({\n    props,\n    styles,\n    classNames,\n  });\n\n  const handleValueSelect = (val: string) => {\n    const isDuplicated = isDuplicate\n      ? isDuplicate(val, _value)\n      : _value.some((tag) => tag.toLowerCase() === val.toLowerCase());\n\n    if (isDuplicated) {\n      onDuplicate?.(val);\n      if (!allowDuplicates) {\n        handleSearchChange('');\n        return;\n      }\n    }\n\n    if (_value.length >= maxTags) {\n      onMaxTags?.(val);\n      return;\n    }\n\n    onOptionSubmit?.(val);\n    handleSearchChange('');\n    if (val.length > 0) {\n      setValue([..._value, val]);\n    }\n  };\n\n  const handleInputKeydown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n    onKeyDown?.(event);\n\n    if (event.defaultPrevented || event.isPropagationStopped()) {\n      return;\n    }\n\n    const inputValue = _searchValue.trim();\n    const { length } = inputValue;\n\n    if (splitChars.includes(event.key) && length > 0) {\n      setValue(\n        getSplittedTags({\n          splitChars,\n          allowDuplicates,\n          maxTags,\n          value: _searchValue,\n          currentTags: _value,\n          isDuplicate,\n          onDuplicate,\n        })\n      );\n      handleSearchChange('');\n      event.preventDefault();\n    }\n\n    if (event.key === 'Enter' && length > 0 && !event.nativeEvent.isComposing) {\n      event.preventDefault();\n\n      const hasActiveSelection = !!document.querySelector<HTMLDivElement>(\n        `#${combobox.listId} [data-combobox-option][data-combobox-selected]`\n      );\n\n      if (hasActiveSelection) {\n        return;\n      }\n\n      handleValueSelect(inputValue);\n    }\n\n    if (\n      event.key === 'Backspace' &&\n      length === 0 &&\n      _value.length > 0 &&\n      !event.nativeEvent.isComposing &&\n      !readOnly\n    ) {\n      onRemove?.(_value[_value.length - 1]);\n      setValue(_value.slice(0, _value.length - 1));\n    }\n\n    handleInputKeyDown(event);\n  };\n\n  const handlePaste = (event: React.ClipboardEvent<HTMLInputElement>) => {\n    onPaste?.(event);\n    event.preventDefault();\n\n    if (event.clipboardData) {\n      const pastedText = event.clipboardData.getData('text/plain');\n      setValue(\n        getSplittedTags({\n          splitChars,\n          allowDuplicates,\n          maxTags,\n          value: `${_searchValue}${pastedText}`,\n          currentTags: _value,\n          isDuplicate,\n          onDuplicate,\n        })\n      );\n      handleSearchChange('');\n    }\n  };\n\n  const values = _value.map((item, index) => {\n    const onRemoveItem = () => {\n      const next_value = _value.slice();\n      next_value.splice(index, 1);\n      setValue(next_value);\n      onRemove?.(item);\n    };\n\n    const reorderProps = getPillProps(index);\n\n    if (renderPill) {\n      return (\n        <Fragment key={`${item}-${index}`}>\n          {renderPill({\n            option: optionsLockup[item] || { value: item, label: item, disabled: false },\n            value: item,\n            onRemove: onRemoveItem,\n            disabled: disabled || readOnly,\n            reorderProps,\n          })}\n        </Fragment>\n      );\n    }\n\n    return (\n      <Pill\n        key={`${item}-${index}`}\n        withRemoveButton={!readOnly}\n        onRemove={onRemoveItem}\n        unstyled={unstyled}\n        disabled={disabled}\n        attributes={attributes}\n        {...getStyles('pill')}\n        {...reorderProps}\n      >\n        {item}\n      </Pill>\n    );\n  });\n\n  useEffect(() => {\n    if (selectFirstOptionOnChange) {\n      combobox.selectFirstOption();\n    }\n  }, [selectFirstOptionOnChange, _value, _searchValue]);\n\n  const clearButton = (\n    <Combobox.ClearButton\n      {...clearButtonProps}\n      onClear={() => {\n        setValue([]);\n        handleSearchChange('');\n        inputRef.current?.focus();\n        combobox.openDropdown();\n        onClear?.();\n      }}\n    />\n  );\n\n  return (\n    <>\n      <Combobox\n        store={combobox}\n        classNames={resolvedClassNames}\n        styles={resolvedStyles}\n        unstyled={unstyled}\n        size={size}\n        readOnly={readOnly}\n        __staticSelector=\"TagsInput\"\n        attributes={attributes}\n        floatingHeight={floatingHeight}\n        onOptionSubmit={(val) => {\n          onOptionSubmit?.(val);\n          handleSearchChange('');\n\n          if (_value.length >= maxTags) {\n            onMaxTags?.(val);\n          } else {\n            setValue([..._value, optionsLockup[val].value]);\n          }\n\n          combobox.resetSelectedOption();\n        }}\n        {...comboboxProps}\n      >\n        <Combobox.DropdownTarget>\n          <PillsInput\n            {...styleProps}\n            __staticSelector=\"TagsInput\"\n            classNames={resolvedClassNames}\n            styles={resolvedStyles}\n            unstyled={unstyled}\n            size={size}\n            className={className}\n            style={style}\n            variant={variant}\n            disabled={disabled}\n            radius={radius}\n            rightSection={rightSection}\n            __clearSection={clearButton}\n            __clearable={clearable && _value.length > 0 && !disabled && !readOnly}\n            __clearSectionMode={clearSectionMode}\n            rightSectionWidth={rightSectionWidth}\n            rightSectionPointerEvents={rightSectionPointerEvents}\n            rightSectionProps={rightSectionProps}\n            leftSection={leftSection}\n            leftSectionWidth={leftSectionWidth}\n            leftSectionPointerEvents={leftSectionPointerEvents}\n            leftSectionProps={leftSectionProps}\n            loading={loading}\n            loadingPosition={loadingPosition}\n            inputContainer={inputContainer}\n            inputWrapperOrder={inputWrapperOrder}\n            withAsterisk={withAsterisk}\n            required={required}\n            labelProps={labelProps}\n            descriptionProps={descriptionProps}\n            errorProps={errorProps}\n            wrapperProps={wrapperProps}\n            description={description}\n            label={label}\n            error={error}\n            withErrorStyles={withErrorStyles}\n            __stylesApiProps={{ ...props, multiline: true }}\n            id={_id}\n            mod={mod}\n            attributes={attributes}\n          >\n            <Pill.Group\n              disabled={disabled}\n              unstyled={unstyled}\n              {...getStyles('pillsList')}\n              {...getListProps()}\n            >\n              {values}\n              <Combobox.EventsTarget autoComplete={autoComplete} withExpandedAttribute>\n                <PillsInput.Field\n                  {...rest}\n                  ref={_ref}\n                  {...getStyles('inputField')}\n                  unstyled={unstyled}\n                  onKeyDown={handleInputKeydown}\n                  onFocus={(event) => {\n                    onFocus?.(event);\n                    openOnFocus && combobox.openDropdown();\n                  }}\n                  onBlur={(event) => {\n                    onBlur?.(event);\n                    acceptValueOnBlur && handleValueSelect(_searchValue);\n                    combobox.closeDropdown();\n                  }}\n                  onPaste={handlePaste}\n                  value={_searchValue}\n                  onChange={(event) => handleSearchChange(event.currentTarget.value)}\n                  required={required && _value.length === 0}\n                  disabled={disabled}\n                  readOnly={readOnly}\n                  id={_id}\n                />\n              </Combobox.EventsTarget>\n            </Pill.Group>\n          </PillsInput>\n        </Combobox.DropdownTarget>\n\n        <OptionsDropdown\n          data={filterPickedTags({ data: parsedData, value: _value })}\n          hidden={readOnly || disabled}\n          filter={filter as OptionsFilter<Primitive> | undefined}\n          search={_searchValue}\n          limit={limit}\n          hiddenWhenEmpty\n          withScrollArea={withScrollArea}\n          maxDropdownHeight={maxDropdownHeight}\n          unstyled={unstyled}\n          labelId={label ? `${_id}-label` : undefined}\n          aria-label={label ? undefined : others['aria-label']}\n          renderOption={renderOption}\n          scrollAreaProps={scrollAreaProps}\n        />\n      </Combobox>\n      <Combobox.HiddenInput\n        name={name}\n        form={form}\n        value={_value}\n        valuesDivider={hiddenInputValuesDivider}\n        disabled={disabled}\n        {...hiddenInputProps}\n      />\n    </>\n  );\n});\n\nTagsInput.classes = { ...InputBase.classes, ...Combobox.classes };\nTagsInput.displayName = '@mantine/core/TagsInput';\n\nexport namespace TagsInput {\n  export type Props = TagsInputProps;\n  export type StylesNames = TagsInputStylesNames;\n  export type Factory = TagsInputFactory;\n}\n"],"mappings":"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"}
+{"version":3,"file":"TagsInput.mjs","names":["useId"],"sources":["../../../src/components/TagsInput/TagsInput.tsx"],"sourcesContent":["import { Fragment, useEffect, useRef } from 'react';\nimport { useId, useMergedRef, useUncontrolled } from '@mantine/hooks';\nimport {\n  BoxProps,\n  ElementProps,\n  extractStyleProps,\n  factory,\n  Factory,\n  Primitive,\n  StylesApiProps,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '../../core';\nimport {\n  Combobox,\n  ComboboxGenericData,\n  ComboboxGenericItem,\n  ComboboxLikeProps,\n  ComboboxLikeRenderOptionInput,\n  ComboboxLikeStylesNames,\n  ComboboxRenderPillInput,\n  getOptionsLockup,\n  getParsedComboboxData,\n  OptionsDropdown,\n  OptionsFilter,\n  useCombobox,\n  usePillsReorder,\n} from '../Combobox';\nimport {\n  __BaseInputProps,\n  __InputStylesNames,\n  ClearSectionMode,\n  InputClearButtonProps,\n} from '../Input';\nimport { InputBase } from '../InputBase';\nimport { Pill } from '../Pill';\nimport { PillsInput } from '../PillsInput';\nimport { ScrollAreaProps } from '../ScrollArea';\nimport { filterPickedTags } from './filter-picked-tags';\nimport { getSplittedTags } from './get-splitted-tags';\n\nexport type TagsInputStylesNames =\n  | __InputStylesNames\n  | ComboboxLikeStylesNames\n  | 'pill'\n  | 'pillsList'\n  | 'inputField';\n\nexport interface TagsInputProps\n  extends\n    BoxProps,\n    __BaseInputProps,\n    Omit<ComboboxLikeProps, 'data'>,\n    StylesApiProps<TagsInputFactory>,\n    ElementProps<'input', 'size' | 'value' | 'defaultValue' | 'onChange'> {\n  /** Data displayed in the dropdown. Values must be unique. */\n  data?: ComboboxGenericData;\n\n  /** Controlled component value */\n  value?: string[];\n\n  /** Uncontrolled component default value */\n  defaultValue?: string[];\n\n  /** Called when value changes */\n  onChange?: (value: string[]) => void;\n\n  /** Called when tag is removed */\n  onRemove?: (value: string) => void;\n\n  /** Called when the clear button is clicked */\n  onClear?: () => void;\n\n  /** Controlled search value */\n  searchValue?: string;\n\n  /** Default search value */\n  defaultSearchValue?: string;\n\n  /** Called when search changes */\n  onSearchChange?: (value: string) => void;\n\n  /** Maximum number of tags @default Infinity */\n  maxTags?: number;\n\n  /** Called when user tries to add more tags than maxTags */\n  onMaxTags?: (value: string) => void;\n\n  /** If set, duplicate tags are allowed @default false */\n  allowDuplicates?: boolean;\n\n  /** Called when user tries to submit a duplicated tag */\n  onDuplicate?: (value: string) => void;\n\n  /** Characters that should trigger tags split, `[',']` by default */\n  splitChars?: string[];\n\n  /** If set, the clear button is displayed in the right section when the component has value @default false */\n  clearable?: boolean;\n\n  /** Determines how the clear button and rightSection are rendered @default 'both' */\n  clearSectionMode?: ClearSectionMode;\n\n  /** Props passed down to the clear button */\n  clearButtonProps?: InputClearButtonProps;\n\n  /** Props passed down to the hidden input */\n  hiddenInputProps?: Omit<React.ComponentProps<'input'>, 'value'>;\n\n  /** Divider used to separate values in the hidden input `value` attribute @default ',' */\n  hiddenInputValuesDivider?: string;\n\n  /** A function to render content of the option, replaces the default content of the option */\n  renderOption?: (input: ComboboxLikeRenderOptionInput<ComboboxGenericItem>) => React.ReactNode;\n\n  /** A function to render content of the pill, replaces the default content of the pill */\n  renderPill?: (props: ComboboxRenderPillInput) => React.ReactNode;\n\n  /** Props passed down to the underlying `ScrollArea` component in the dropdown */\n  scrollAreaProps?: ScrollAreaProps;\n\n  /** If set, the value typed in by the user but not submitted is accepted when the input is blurred @default true */\n  acceptValueOnBlur?: boolean;\n\n  /** Custom function to determine if a tag is duplicate. Accepts tag value and array of current values. By default, checks if the tag exists case-insensitively. */\n  isDuplicate?: (value: string, currentValues: string[]) => boolean;\n\n  /** If set, the dropdown opens when the input receives focus @default true */\n  openOnFocus?: boolean;\n\n  /** If set, tags can be reordered by dragging pills. Disabled when `disabled` or `readOnly` is set. @default false */\n  withPillsReorder?: boolean;\n}\n\nexport type TagsInputFactory = Factory<{\n  props: TagsInputProps;\n  ref: HTMLInputElement;\n  stylesNames: TagsInputStylesNames;\n}>;\n\nconst defaultProps = {\n  maxTags: Infinity,\n  acceptValueOnBlur: true,\n  splitChars: [','],\n  hiddenInputValuesDivider: ',',\n  openOnFocus: true,\n  size: 'sm',\n} satisfies Partial<TagsInputProps>;\n\nexport const TagsInput = factory<TagsInputFactory>((_props) => {\n  const props = useProps(['Input', 'InputWrapper', 'TagsInput'], defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    size,\n    value,\n    defaultValue,\n    onChange,\n    onKeyDown,\n    maxTags,\n    allowDuplicates,\n    onDuplicate,\n    variant,\n    data,\n    dropdownOpened,\n    defaultDropdownOpened,\n    onDropdownOpen,\n    onDropdownClose,\n    selectFirstOptionOnChange,\n    selectFirstOptionOnDropdownOpen,\n    onOptionSubmit,\n    comboboxProps,\n    filter,\n    limit,\n    withScrollArea,\n    maxDropdownHeight,\n    floatingHeight,\n    searchValue,\n    defaultSearchValue,\n    onSearchChange,\n    readOnly,\n    disabled,\n    splitChars,\n    onFocus,\n    onBlur,\n    onPaste,\n    radius,\n    rightSection,\n    rightSectionWidth,\n    rightSectionPointerEvents,\n    rightSectionProps,\n    leftSection,\n    leftSectionWidth,\n    leftSectionPointerEvents,\n    leftSectionProps,\n    inputContainer,\n    inputWrapperOrder,\n    withAsterisk,\n    required,\n    labelProps,\n    descriptionProps,\n    errorProps,\n    successProps,\n    wrapperProps,\n    description,\n    label,\n    error,\n    success,\n    withErrorStyles,\n    withSuccessStyles,\n    name,\n    form,\n    id,\n    clearable,\n    clearSectionMode,\n    clearButtonProps,\n    hiddenInputProps,\n    hiddenInputValuesDivider,\n    mod,\n    renderOption,\n    renderPill,\n    onRemove,\n    onClear,\n    onMaxTags,\n    scrollAreaProps,\n    acceptValueOnBlur,\n    isDuplicate,\n    openOnFocus,\n    attributes,\n    ref,\n    loading,\n    loadingPosition,\n    withPillsReorder,\n    ...others\n  } = props;\n\n  const _id = useId(id);\n  const parsedData = getParsedComboboxData(data);\n  const optionsLockup = getOptionsLockup(parsedData);\n  const inputRef = useRef<HTMLInputElement>(null);\n  const _ref = useMergedRef(inputRef, ref);\n\n  const combobox = useCombobox({\n    opened: dropdownOpened,\n    defaultOpened: defaultDropdownOpened,\n    onDropdownOpen: () => {\n      onDropdownOpen?.();\n      if (selectFirstOptionOnDropdownOpen) {\n        combobox.selectFirstOption();\n      }\n    },\n    onDropdownClose: () => {\n      onDropdownClose?.();\n      combobox.resetSelectedOption();\n    },\n  });\n\n  const {\n    styleProps,\n    rest: { type, autoComplete, ...rest },\n  } = extractStyleProps(others);\n\n  const [_value, setValue] = useUncontrolled({\n    value,\n    defaultValue,\n    finalValue: [],\n    onChange,\n  });\n\n  const { getPillProps, getListProps, handleInputKeyDown } = usePillsReorder({\n    value: _value,\n    onChange: setValue,\n    enabled: withPillsReorder && !disabled && !readOnly,\n  });\n\n  const [_searchValue, setSearchValue] = useUncontrolled({\n    value: searchValue,\n    defaultValue: defaultSearchValue,\n    finalValue: '',\n    onChange: onSearchChange,\n  });\n\n  const handleSearchChange = (value: string) => {\n    setSearchValue(value);\n    combobox.resetSelectedOption();\n  };\n\n  const getStyles = useStyles<TagsInputFactory>({\n    name: 'TagsInput',\n    classes: {} as any,\n    props: props as any,\n    classNames,\n    styles,\n    unstyled,\n  });\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<TagsInputFactory>({\n    props,\n    styles,\n    classNames,\n  });\n\n  const handleValueSelect = (val: string) => {\n    const isDuplicated = isDuplicate\n      ? isDuplicate(val, _value)\n      : _value.some((tag) => tag.toLowerCase() === val.toLowerCase());\n\n    if (isDuplicated) {\n      onDuplicate?.(val);\n      if (!allowDuplicates) {\n        handleSearchChange('');\n        return;\n      }\n    }\n\n    if (_value.length >= maxTags) {\n      onMaxTags?.(val);\n      return;\n    }\n\n    onOptionSubmit?.(val);\n    handleSearchChange('');\n    if (val.length > 0) {\n      setValue([..._value, val]);\n    }\n  };\n\n  const handleInputKeydown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n    onKeyDown?.(event);\n\n    if (event.defaultPrevented || event.isPropagationStopped()) {\n      return;\n    }\n\n    const inputValue = _searchValue.trim();\n    const { length } = inputValue;\n\n    if (splitChars.includes(event.key) && length > 0) {\n      setValue(\n        getSplittedTags({\n          splitChars,\n          allowDuplicates,\n          maxTags,\n          value: _searchValue,\n          currentTags: _value,\n          isDuplicate,\n          onDuplicate,\n        })\n      );\n      handleSearchChange('');\n      event.preventDefault();\n    }\n\n    if (event.key === 'Enter' && length > 0 && !event.nativeEvent.isComposing) {\n      event.preventDefault();\n\n      const hasActiveSelection = !!document.querySelector<HTMLDivElement>(\n        `#${combobox.listId} [data-combobox-option][data-combobox-selected]`\n      );\n\n      if (hasActiveSelection) {\n        return;\n      }\n\n      handleValueSelect(inputValue);\n    }\n\n    if (\n      event.key === 'Backspace' &&\n      length === 0 &&\n      _value.length > 0 &&\n      !event.nativeEvent.isComposing &&\n      !readOnly\n    ) {\n      onRemove?.(_value[_value.length - 1]);\n      setValue(_value.slice(0, _value.length - 1));\n    }\n\n    handleInputKeyDown(event);\n  };\n\n  const handlePaste = (event: React.ClipboardEvent<HTMLInputElement>) => {\n    onPaste?.(event);\n    event.preventDefault();\n\n    if (event.clipboardData) {\n      const pastedText = event.clipboardData.getData('text/plain');\n      setValue(\n        getSplittedTags({\n          splitChars,\n          allowDuplicates,\n          maxTags,\n          value: `${_searchValue}${pastedText}`,\n          currentTags: _value,\n          isDuplicate,\n          onDuplicate,\n        })\n      );\n      handleSearchChange('');\n    }\n  };\n\n  const values = _value.map((item, index) => {\n    const onRemoveItem = () => {\n      const next_value = _value.slice();\n      next_value.splice(index, 1);\n      setValue(next_value);\n      onRemove?.(item);\n    };\n\n    const reorderProps = getPillProps(index);\n\n    if (renderPill) {\n      return (\n        <Fragment key={`${item}-${index}`}>\n          {renderPill({\n            option: optionsLockup[item] || { value: item, label: item, disabled: false },\n            value: item,\n            onRemove: onRemoveItem,\n            disabled: disabled || readOnly,\n            reorderProps,\n          })}\n        </Fragment>\n      );\n    }\n\n    return (\n      <Pill\n        key={`${item}-${index}`}\n        withRemoveButton={!readOnly}\n        onRemove={onRemoveItem}\n        unstyled={unstyled}\n        disabled={disabled}\n        attributes={attributes}\n        {...getStyles('pill')}\n        {...reorderProps}\n      >\n        {item}\n      </Pill>\n    );\n  });\n\n  useEffect(() => {\n    if (selectFirstOptionOnChange) {\n      combobox.selectFirstOption();\n    }\n  }, [selectFirstOptionOnChange, _value, _searchValue]);\n\n  const clearButton = (\n    <Combobox.ClearButton\n      {...clearButtonProps}\n      onClear={() => {\n        setValue([]);\n        handleSearchChange('');\n        inputRef.current?.focus();\n        combobox.openDropdown();\n        onClear?.();\n      }}\n    />\n  );\n\n  return (\n    <>\n      <Combobox\n        store={combobox}\n        classNames={resolvedClassNames}\n        styles={resolvedStyles}\n        unstyled={unstyled}\n        size={size}\n        readOnly={readOnly}\n        __staticSelector=\"TagsInput\"\n        attributes={attributes}\n        floatingHeight={floatingHeight}\n        onOptionSubmit={(val) => {\n          onOptionSubmit?.(val);\n          handleSearchChange('');\n\n          if (_value.length >= maxTags) {\n            onMaxTags?.(val);\n          } else {\n            setValue([..._value, optionsLockup[val].value]);\n          }\n\n          combobox.resetSelectedOption();\n        }}\n        {...comboboxProps}\n      >\n        <Combobox.DropdownTarget>\n          <PillsInput\n            {...styleProps}\n            __staticSelector=\"TagsInput\"\n            classNames={resolvedClassNames}\n            styles={resolvedStyles}\n            unstyled={unstyled}\n            size={size}\n            className={className}\n            style={style}\n            variant={variant}\n            disabled={disabled}\n            radius={radius}\n            rightSection={rightSection}\n            __clearSection={clearButton}\n            __clearable={clearable && _value.length > 0 && !disabled && !readOnly}\n            __clearSectionMode={clearSectionMode}\n            rightSectionWidth={rightSectionWidth}\n            rightSectionPointerEvents={rightSectionPointerEvents}\n            rightSectionProps={rightSectionProps}\n            leftSection={leftSection}\n            leftSectionWidth={leftSectionWidth}\n            leftSectionPointerEvents={leftSectionPointerEvents}\n            leftSectionProps={leftSectionProps}\n            loading={loading}\n            loadingPosition={loadingPosition}\n            inputContainer={inputContainer}\n            inputWrapperOrder={inputWrapperOrder}\n            withAsterisk={withAsterisk}\n            required={required}\n            labelProps={labelProps}\n            descriptionProps={descriptionProps}\n            errorProps={errorProps}\n            successProps={successProps}\n            wrapperProps={wrapperProps}\n            description={description}\n            label={label}\n            error={error}\n            success={success}\n            withErrorStyles={withErrorStyles}\n            withSuccessStyles={withSuccessStyles}\n            __stylesApiProps={{ ...props, multiline: true }}\n            id={_id}\n            mod={mod}\n            attributes={attributes}\n          >\n            <Pill.Group\n              disabled={disabled}\n              unstyled={unstyled}\n              {...getStyles('pillsList')}\n              {...getListProps()}\n            >\n              {values}\n              <Combobox.EventsTarget autoComplete={autoComplete} withExpandedAttribute>\n                <PillsInput.Field\n                  {...rest}\n                  ref={_ref}\n                  {...getStyles('inputField')}\n                  unstyled={unstyled}\n                  onKeyDown={handleInputKeydown}\n                  onFocus={(event) => {\n                    onFocus?.(event);\n                    openOnFocus && combobox.openDropdown();\n                  }}\n                  onBlur={(event) => {\n                    onBlur?.(event);\n                    acceptValueOnBlur && handleValueSelect(_searchValue);\n                    combobox.closeDropdown();\n                  }}\n                  onPaste={handlePaste}\n                  value={_searchValue}\n                  onChange={(event) => handleSearchChange(event.currentTarget.value)}\n                  required={required && _value.length === 0}\n                  disabled={disabled}\n                  readOnly={readOnly}\n                  id={_id}\n                />\n              </Combobox.EventsTarget>\n            </Pill.Group>\n          </PillsInput>\n        </Combobox.DropdownTarget>\n\n        <OptionsDropdown\n          data={filterPickedTags({ data: parsedData, value: _value })}\n          hidden={readOnly || disabled}\n          filter={filter as OptionsFilter<Primitive> | undefined}\n          search={_searchValue}\n          limit={limit}\n          hiddenWhenEmpty\n          withScrollArea={withScrollArea}\n          maxDropdownHeight={maxDropdownHeight}\n          unstyled={unstyled}\n          labelId={label ? `${_id}-label` : undefined}\n          aria-label={label ? undefined : others['aria-label']}\n          renderOption={renderOption}\n          scrollAreaProps={scrollAreaProps}\n        />\n      </Combobox>\n      <Combobox.HiddenInput\n        name={name}\n        form={form}\n        value={_value}\n        valuesDivider={hiddenInputValuesDivider}\n        disabled={disabled}\n        {...hiddenInputProps}\n      />\n    </>\n  );\n});\n\nTagsInput.classes = { ...InputBase.classes, ...Combobox.classes };\nTagsInput.displayName = '@mantine/core/TagsInput';\n\nexport namespace TagsInput {\n  export type Props = TagsInputProps;\n  export type StylesNames = TagsInputStylesNames;\n  export type Factory = TagsInputFactory;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AA6IA,MAAM,eAAe;CACnB,SAAS;CACT,mBAAmB;CACnB,YAAY,CAAC,GAAG;CAChB,0BAA0B;CAC1B,aAAa;CACb,MAAM;AACR;AAEA,MAAa,YAAY,SAA2B,WAAW;CAC7D,MAAM,QAAQ,SAAS;EAAC;EAAS;EAAgB;CAAW,GAAG,cAAc,MAAM;CACnF,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,MACA,OACA,cACA,UACA,WACA,SACA,iBACA,aACA,SACA,MACA,gBACA,uBACA,gBACA,iBACA,2BACA,iCACA,gBACA,eACA,QACA,OACA,gBACA,mBACA,gBACA,aACA,oBACA,gBACA,UACA,UACA,YACA,SACA,QACA,SACA,QACA,cACA,mBACA,2BACA,mBACA,aACA,kBACA,0BACA,kBACA,gBACA,mBACA,cACA,UACA,YACA,kBACA,YACA,cACA,cACA,aACA,OACA,OACA,SACA,iBACA,mBACA,MACA,MACA,IACA,WACA,kBACA,kBACA,kBACA,0BACA,KACA,cACA,YACA,UACA,SACA,WACA,iBACA,mBACA,aACA,aACA,YACA,KACA,SACA,iBACA,kBACA,GAAG,WACD;CAEJ,MAAM,MAAMA,QAAM,EAAE;CACpB,MAAM,aAAa,sBAAsB,IAAI;CAC7C,MAAM,gBAAgB,iBAAiB,UAAU;CACjD,MAAM,WAAW,OAAyB,IAAI;CAC9C,MAAM,OAAO,aAAa,UAAU,GAAG;CAEvC,MAAM,WAAW,YAAY;EAC3B,QAAQ;EACR,eAAe;EACf,sBAAsB;GACpB,iBAAiB;GACjB,IAAI,iCACF,SAAS,kBAAkB;EAE/B;EACA,uBAAuB;GACrB,kBAAkB;GAClB,SAAS,oBAAoB;EAC/B;CACF,CAAC;CAED,MAAM,EACJ,YACA,MAAM,EAAE,MAAM,cAAc,GAAG,WAC7B,kBAAkB,MAAM;CAE5B,MAAM,CAAC,QAAQ,YAAY,gBAAgB;EACzC;EACA;EACA,YAAY,CAAC;EACb;CACF,CAAC;CAED,MAAM,EAAE,cAAc,cAAc,uBAAuB,gBAAgB;EACzE,OAAO;EACP,UAAU;EACV,SAAS,oBAA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"}

package/esm/components/TagsInput/filter-picked-tags.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"filter-picked-tags.mjs","names":[],"sources":["../../../src/components/TagsInput/filter-picked-tags.ts"],"sourcesContent":["import { ComboboxParsedItem, isOptionsGroup } from '../Combobox';\n\ninterface FilterPickedTagsInput {\n  data: ComboboxParsedItem[];\n  value: string[];\n}\n\nexport function filterPickedTags({ data, value }: FilterPickedTagsInput) {\n  const normalizedValue = value.map((item) => item.trim().toLowerCase());\n\n  const filtered = data.reduce<ComboboxParsedItem[]>((acc, item) => {\n    if (isOptionsGroup(item)) {\n      acc.push({\n        group: item.group,\n        items: item.items.filter(\n          (option) => normalizedValue.indexOf(option.label.toLowerCase().trim()) === -1\n        ),\n      });\n    } else if (normalizedValue.indexOf(item.label.toLowerCase().trim()) === -1) {\n      acc.push(item);\n    }\n\n    return acc;\n  }, []);\n\n  return filtered;\n}\n"],"mappings":";;;AAOA,SAAgB,iBAAiB,EAAE,MAAM,SAAgC;CACvE,MAAM,kBAAkB,MAAM,KAAK,SAAS,KAAK,KAAK,EAAE,YAAY,CAAC;CAiBrE,OAfiB,KAAK,QAA8B,KAAK,SAAS;EAChE,IAAI,eAAe,IAAI,GACrB,IAAI,KAAK;GACP,OAAO,KAAK;GACZ,OAAO,KAAK,MAAM,QACf,WAAW,gBAAgB,QAAQ,OAAO,MAAM,YAAY,EAAE,KAAK,CAAC,MAAM,EAC7E;EACF,CAAC;OACI,IAAI,gBAAgB,QAAQ,KAAK,MAAM,YAAY,EAAE,KAAK,CAAC,MAAM,IACtE,IAAI,KAAK,IAAI;EAGf,OAAO;CACT,GAAG,CAAC,CAEU;AAChB"}
+{"version":3,"file":"filter-picked-tags.mjs","names":[],"sources":["../../../src/components/TagsInput/filter-picked-tags.ts"],"sourcesContent":["import { ComboboxParsedItem, isOptionsGroup } from '../Combobox';\n\ninterface FilterPickedTagsInput {\n  data: ComboboxParsedItem[];\n  value: string[];\n}\n\nexport function filterPickedTags({ data, value }: FilterPickedTagsInput) {\n  const normalizedValue = value.map((item) => item.trim().toLowerCase());\n\n  const filtered = data.reduce<ComboboxParsedItem[]>((acc, item) => {\n    if (isOptionsGroup(item)) {\n      acc.push({\n        group: item.group,\n        items: item.items.filter(\n          (option) => normalizedValue.indexOf(option.label.toLowerCase().trim()) === -1\n        ),\n      });\n    } else if (normalizedValue.indexOf(item.label.toLowerCase().trim()) === -1) {\n      acc.push(item);\n    }\n\n    return acc;\n  }, []);\n\n  return filtered;\n}\n"],"mappings":";;;AAOA,SAAgB,iBAAiB,EAAE,MAAM,SAAgC;CACvE,MAAM,kBAAkB,MAAM,KAAK,SAAS,KAAK,KAAK,CAAC,CAAC,YAAY,CAAC;CAiBrE,OAfiB,KAAK,QAA8B,KAAK,SAAS;EAChE,IAAI,eAAe,IAAI,GACrB,IAAI,KAAK;GACP,OAAO,KAAK;GACZ,OAAO,KAAK,MAAM,QACf,WAAW,gBAAgB,QAAQ,OAAO,MAAM,YAAY,CAAC,CAAC,KAAK,CAAC,MAAM,EAC7E;EACF,CAAC;OACI,IAAI,gBAAgB,QAAQ,KAAK,MAAM,YAAY,CAAC,CAAC,KAAK,CAAC,MAAM,IACtE,IAAI,KAAK,IAAI;EAGf,OAAO;CACT,GAAG,CAAC,CAEU;AAChB"}

package/esm/components/TagsInput/get-splitted-tags.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"get-splitted-tags.mjs","names":[],"sources":["../../../src/components/TagsInput/get-splitted-tags.ts"],"sourcesContent":["function splitTags(splitChars: string[] | undefined, value: string) {\n  if (!splitChars) {\n    return [value];\n  }\n\n  return value\n    .split(new RegExp(`[${splitChars.join('')}]`))\n    .map((tag) => tag.trim())\n    .filter((tag) => tag !== '');\n}\n\ninterface GetSplittedTagsInput {\n  splitChars: string[] | undefined;\n  allowDuplicates: boolean | undefined;\n  maxTags: number | undefined;\n  value: string;\n  currentTags: string[];\n  isDuplicate?: (value: string, currentValues: string[]) => boolean;\n  onDuplicate?: (value: string) => void;\n}\n\nexport function getSplittedTags({\n  splitChars,\n  allowDuplicates,\n  maxTags,\n  value,\n  currentTags,\n  isDuplicate,\n  onDuplicate,\n}: GetSplittedTagsInput) {\n  const splitted = splitTags(splitChars, value);\n  const merged: string[] = [];\n\n  if (allowDuplicates) {\n    merged.push(...currentTags, ...splitted);\n  } else {\n    merged.push(...currentTags);\n    for (const tag of splitted) {\n      const checkDuplicate = isDuplicate\n        ? (val: string) => isDuplicate(val, merged)\n        : (val: string) => merged.some((t) => t.toLowerCase() === val.toLowerCase());\n\n      if (checkDuplicate(tag)) {\n        onDuplicate?.(tag);\n      } else {\n        merged.push(tag);\n      }\n    }\n  }\n\n  return maxTags ? merged.slice(0, maxTags) : merged;\n}\n"],"mappings":";;AAAA,SAAS,UAAU,YAAkC,OAAe;CAClE,IAAI,CAAC,YACH,OAAO,CAAC,KAAK;CAGf,OAAO,MACJ,MAAM,IAAI,OAAO,IAAI,WAAW,KAAK,EAAE,EAAE,EAAE,CAAC,EAC5C,KAAK,QAAQ,IAAI,KAAK,CAAC,EACvB,QAAQ,QAAQ,QAAQ,EAAE;AAC/B;AAYA,SAAgB,gBAAgB,EAC9B,YACA,iBACA,SACA,OACA,aACA,aACA,eACuB;CACvB,MAAM,WAAW,UAAU,YAAY,KAAK;CAC5C,MAAM,SAAmB,CAAC;CAE1B,IAAI,iBACF,OAAO,KAAK,GAAG,aAAa,GAAG,QAAQ;MAClC;EACL,OAAO,KAAK,GAAG,WAAW;EAC1B,KAAK,MAAM,OAAO,UAKhB,KAJuB,eAClB,QAAgB,YAAY,KAAK,MAAM,KACvC,QAAgB,OAAO,MAAM,MAAM,EAAE,YAAY,MAAM,IAAI,YAAY,CAAC,GAE1D,GAAG,GACpB,cAAc,GAAG;OAEjB,OAAO,KAAK,GAAG;CAGrB;CAEA,OAAO,UAAU,OAAO,MAAM,GAAG,OAAO,IAAI;AAC9C"}
+{"version":3,"file":"get-splitted-tags.mjs","names":[],"sources":["../../../src/components/TagsInput/get-splitted-tags.ts"],"sourcesContent":["function splitTags(splitChars: string[] | undefined, value: string) {\n  if (!splitChars) {\n    return [value];\n  }\n\n  return value\n    .split(new RegExp(`[${splitChars.join('')}]`))\n    .map((tag) => tag.trim())\n    .filter((tag) => tag !== '');\n}\n\ninterface GetSplittedTagsInput {\n  splitChars: string[] | undefined;\n  allowDuplicates: boolean | undefined;\n  maxTags: number | undefined;\n  value: string;\n  currentTags: string[];\n  isDuplicate?: (value: string, currentValues: string[]) => boolean;\n  onDuplicate?: (value: string) => void;\n}\n\nexport function getSplittedTags({\n  splitChars,\n  allowDuplicates,\n  maxTags,\n  value,\n  currentTags,\n  isDuplicate,\n  onDuplicate,\n}: GetSplittedTagsInput) {\n  const splitted = splitTags(splitChars, value);\n  const merged: string[] = [];\n\n  if (allowDuplicates) {\n    merged.push(...currentTags, ...splitted);\n  } else {\n    merged.push(...currentTags);\n    for (const tag of splitted) {\n      const checkDuplicate = isDuplicate\n        ? (val: string) => isDuplicate(val, merged)\n        : (val: string) => merged.some((t) => t.toLowerCase() === val.toLowerCase());\n\n      if (checkDuplicate(tag)) {\n        onDuplicate?.(tag);\n      } else {\n        merged.push(tag);\n      }\n    }\n  }\n\n  return maxTags ? merged.slice(0, maxTags) : merged;\n}\n"],"mappings":";;AAAA,SAAS,UAAU,YAAkC,OAAe;CAClE,IAAI,CAAC,YACH,OAAO,CAAC,KAAK;CAGf,OAAO,MACJ,MAAM,IAAI,OAAO,IAAI,WAAW,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC,CAC7C,KAAK,QAAQ,IAAI,KAAK,CAAC,CAAC,CACxB,QAAQ,QAAQ,QAAQ,EAAE;AAC/B;AAYA,SAAgB,gBAAgB,EAC9B,YACA,iBACA,SACA,OACA,aACA,aACA,eACuB;CACvB,MAAM,WAAW,UAAU,YAAY,KAAK;CAC5C,MAAM,SAAmB,CAAC;CAE1B,IAAI,iBACF,OAAO,KAAK,GAAG,aAAa,GAAG,QAAQ;MAClC;EACL,OAAO,KAAK,GAAG,WAAW;EAC1B,KAAK,MAAM,OAAO,UAKhB,KAJuB,eAClB,QAAgB,YAAY,KAAK,MAAM,KACvC,QAAgB,OAAO,MAAM,MAAM,EAAE,YAAY,MAAM,IAAI,YAAY,CAAC,EAAA,CAE1D,GAAG,GACpB,cAAc,GAAG;OAEjB,OAAO,KAAK,GAAG;CAGrB;CAEA,OAAO,UAAU,OAAO,MAAM,GAAG,OAAO,IAAI;AAC9C"}

package/esm/components/Text/Text.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Text.mjs","names":["classes"],"sources":["../../../src/components/Text/Text.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  getFontSize,\n  getGradient,\n  getLineHeight,\n  MantineFontSize,\n  MantineGradient,\n  MantineLineHeight,\n  polymorphicFactory,\n  PolymorphicFactory,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport classes from './Text.module.css';\n\ntype TextTruncate = 'end' | 'start' | boolean;\n\nfunction getTextTruncate(truncate: TextTruncate | undefined) {\n  if (truncate === 'start') {\n    return 'start';\n  }\n\n  if (truncate === 'end' || truncate) {\n    return 'end';\n  }\n\n  return undefined;\n}\n\nexport type TextStylesNames = 'root';\nexport type TextVariant = 'text' | 'gradient';\nexport type TextCssVariables = {\n  root: '--text-gradient' | '--text-line-clamp' | '--text-fz' | '--text-lh' | '--text-text-wrap';\n};\n\nexport interface TextProps extends BoxProps, StylesApiProps<TextFactory> {\n  __staticSelector?: string;\n\n  /** Controls `font-size` and `line-height` @default 'md' */\n  size?: MantineFontSize | MantineLineHeight;\n\n  /** Number of lines after which Text will be truncated */\n  lineClamp?: number;\n\n  /** Side on which Text must be truncated, if `true`, text is truncated from the start */\n  truncate?: TextTruncate;\n\n  /** Sets `line-height` to 1 for centering @default false */\n  inline?: boolean;\n\n  /** Determines whether font properties should be inherited from the parent @default false */\n  inherit?: boolean;\n\n  /** Gradient configuration, ignored when `variant` is not `gradient` @default theme.defaultGradient */\n  gradient?: MantineGradient;\n\n  /** Shorthand for `component=\"span\"` */\n  span?: boolean;\n\n  /** Controls `text-wrap` CSS property */\n  textWrap?: 'wrap' | 'nowrap' | 'balance' | 'pretty' | 'stable';\n}\n\nexport type TextFactory = PolymorphicFactory<{\n  props: TextProps;\n  defaultComponent: 'p';\n  defaultRef: HTMLParagraphElement;\n  stylesNames: TextStylesNames;\n  vars: TextCssVariables;\n  variant: TextVariant;\n}>;\n\nconst defaultProps = {\n  inherit: false,\n} satisfies Partial<TextProps>;\n\nconst varsResolver = createVarsResolver<TextFactory>(\n  // Will be removed in 9.0\n\n  (theme, { variant, lineClamp, gradient, size, textWrap }) => ({\n    root: {\n      '--text-fz': getFontSize(size),\n      '--text-lh': getLineHeight(size),\n      '--text-gradient': variant === 'gradient' ? getGradient(gradient, theme) : undefined,\n      '--text-line-clamp': typeof lineClamp === 'number' ? lineClamp.toString() : undefined,\n      '--text-text-wrap': textWrap,\n    },\n  })\n);\n\nexport const Text = polymorphicFactory<TextFactory>((_props) => {\n  const props = useProps('Text', defaultProps, _props);\n  const {\n    lineClamp,\n    truncate,\n    inline,\n    inherit,\n    gradient,\n    span,\n    textWrap,\n    __staticSelector,\n    vars,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    variant,\n    mod,\n    size,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<TextFactory>({\n    name: ['Text', __staticSelector],\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  return (\n    <Box\n      {...getStyles('root', { focusable: true })}\n      component={span ? 'span' : 'p'}\n      variant={variant}\n      mod={[\n        {\n          'data-truncate': getTextTruncate(truncate),\n          'data-line-clamp': typeof lineClamp === 'number',\n          'data-inline': inline,\n          'data-inherit': inherit,\n        },\n        mod,\n      ]}\n      size={size}\n      {...others}\n    />\n  );\n});\n\nText.classes = classes;\nText.varsResolver = varsResolver;\nText.displayName = '@mantine/core/Text';\n\nexport namespace Text {\n  export type Props = TextProps;\n  export type StylesNames = TextStylesNames;\n  export type CssVariables = TextCssVariables;\n  export type Factory = TextFactory;\n  export type Variant = TextVariant;\n}\n"],"mappings":";;;;;;;;;;;AAoBA,SAAS,gBAAgB,UAAoC;CAC3D,IAAI,aAAa,SACf,OAAO;CAGT,IAAI,aAAa,SAAS,UACxB,OAAO;AAIX;AA6CA,MAAM,eAAe,EACnB,SAAS,MACX;AAEA,MAAM,eAAe,oBAGlB,OAAO,EAAE,SAAS,WAAW,UAAU,MAAM,gBAAgB,EAC5D,MAAM;CACJ,aAAa,YAAY,IAAI;CAC7B,aAAa,cAAc,IAAI;CAC/B,mBAAmB,YAAY,aAAa,YAAY,UAAU,KAAK,IAAI,KAAA;CAC3E,qBAAqB,OAAO,cAAc,WAAW,UAAU,SAAS,IAAI,KAAA;CAC5E,oBAAoB;AACtB,EACF,EACF;AAEA,MAAa,OAAO,oBAAiC,WAAW;CAC9D,MAAM,QAAQ,SAAS,QAAQ,cAAc,MAAM;CACnD,MAAM,EACJ,WACA,UACA,QACA,SACA,UACA,MACA,UACA,kBACA,MACA,WACA,OACA,YACA,QACA,UACA,SACA,KACA,MACA,YACA,GAAG,WACD;CAgBJ,OACE,oBAAC,KAAD;EACE,GAhBc,UAAuB;GACvC,MAAM,CAAC,QAAQ,gBAAgB;GAC/B;GACA,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,CAIgB,EAAE,QAAQ,EAAE,WAAW,KAAK,CAAC;EACzC,WAAW,OAAO,SAAS;EAClB;EACT,KAAK,CACH;GACE,iBAAiB,gBAAgB,QAAQ;GACzC,mBAAmB,OAAO,cAAc;GACxC,eAAe;GACf,gBAAgB;EAClB,GACA,GACF;EACM;EACN,GAAI;CACL,CAAA;AAEL,CAAC;AAED,KAAK,UAAUA;AACf,KAAK,eAAe;AACpB,KAAK,cAAc"}
+{"version":3,"file":"Text.mjs","names":["classes"],"sources":["../../../src/components/Text/Text.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  getFontSize,\n  getGradient,\n  getLineHeight,\n  MantineFontSize,\n  MantineGradient,\n  MantineLineHeight,\n  polymorphicFactory,\n  PolymorphicFactory,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport classes from './Text.module.css';\n\ntype TextTruncate = 'end' | 'start' | boolean;\n\nfunction getTextTruncate(truncate: TextTruncate | undefined) {\n  if (truncate === 'start') {\n    return 'start';\n  }\n\n  if (truncate === 'end' || truncate) {\n    return 'end';\n  }\n\n  return undefined;\n}\n\nexport type TextStylesNames = 'root';\nexport type TextVariant = 'text' | 'gradient';\nexport type TextCssVariables = {\n  root: '--text-gradient' | '--text-line-clamp' | '--text-fz' | '--text-lh' | '--text-text-wrap';\n};\n\nexport interface TextProps extends BoxProps, StylesApiProps<TextFactory> {\n  __staticSelector?: string;\n\n  /** Controls `font-size` and `line-height` @default 'md' */\n  size?: MantineFontSize | MantineLineHeight;\n\n  /** Number of lines after which Text will be truncated */\n  lineClamp?: number;\n\n  /** Side on which Text must be truncated, if `true`, text is truncated from the start */\n  truncate?: TextTruncate;\n\n  /** Sets `line-height` to 1 for centering @default false */\n  inline?: boolean;\n\n  /** Determines whether font properties should be inherited from the parent @default false */\n  inherit?: boolean;\n\n  /** Gradient configuration, ignored when `variant` is not `gradient` @default theme.defaultGradient */\n  gradient?: MantineGradient;\n\n  /** Shorthand for `component=\"span\"` */\n  span?: boolean;\n\n  /** Controls `text-wrap` CSS property */\n  textWrap?: 'wrap' | 'nowrap' | 'balance' | 'pretty' | 'stable';\n}\n\nexport type TextFactory = PolymorphicFactory<{\n  props: TextProps;\n  defaultComponent: 'p';\n  defaultRef: HTMLParagraphElement;\n  stylesNames: TextStylesNames;\n  vars: TextCssVariables;\n  variant: TextVariant;\n}>;\n\nconst defaultProps = {\n  inherit: false,\n} satisfies Partial<TextProps>;\n\nconst varsResolver = createVarsResolver<TextFactory>(\n  // Will be removed in 9.0\n\n  (theme, { variant, lineClamp, gradient, size, textWrap }) => ({\n    root: {\n      '--text-fz': getFontSize(size),\n      '--text-lh': getLineHeight(size),\n      '--text-gradient': variant === 'gradient' ? getGradient(gradient, theme) : undefined,\n      '--text-line-clamp': typeof lineClamp === 'number' ? lineClamp.toString() : undefined,\n      '--text-text-wrap': textWrap,\n    },\n  })\n);\n\nexport const Text = polymorphicFactory<TextFactory>((_props) => {\n  const props = useProps('Text', defaultProps, _props);\n  const {\n    lineClamp,\n    truncate,\n    inline,\n    inherit,\n    gradient,\n    span,\n    textWrap,\n    __staticSelector,\n    vars,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    variant,\n    mod,\n    size,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<TextFactory>({\n    name: ['Text', __staticSelector],\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  return (\n    <Box\n      {...getStyles('root', { focusable: true })}\n      component={span ? 'span' : 'p'}\n      variant={variant}\n      mod={[\n        {\n          'data-truncate': getTextTruncate(truncate),\n          'data-line-clamp': typeof lineClamp === 'number',\n          'data-inline': inline,\n          'data-inherit': inherit,\n        },\n        mod,\n      ]}\n      size={size}\n      {...others}\n    />\n  );\n});\n\nText.classes = classes;\nText.varsResolver = varsResolver;\nText.displayName = '@mantine/core/Text';\n\nexport namespace Text {\n  export type Props = TextProps;\n  export type StylesNames = TextStylesNames;\n  export type CssVariables = TextCssVariables;\n  export type Factory = TextFactory;\n  export type Variant = TextVariant;\n}\n"],"mappings":";;;;;;;;;;;AAoBA,SAAS,gBAAgB,UAAoC;CAC3D,IAAI,aAAa,SACf,OAAO;CAGT,IAAI,aAAa,SAAS,UACxB,OAAO;AAIX;AA6CA,MAAM,eAAe,EACnB,SAAS,MACX;AAEA,MAAM,eAAe,oBAGlB,OAAO,EAAE,SAAS,WAAW,UAAU,MAAM,gBAAgB,EAC5D,MAAM;CACJ,aAAa,YAAY,IAAI;CAC7B,aAAa,cAAc,IAAI;CAC/B,mBAAmB,YAAY,aAAa,YAAY,UAAU,KAAK,IAAI,KAAA;CAC3E,qBAAqB,OAAO,cAAc,WAAW,UAAU,SAAS,IAAI,KAAA;CAC5E,oBAAoB;AACtB,EACF,EACF;AAEA,MAAa,OAAO,oBAAiC,WAAW;CAC9D,MAAM,QAAQ,SAAS,QAAQ,cAAc,MAAM;CACnD,MAAM,EACJ,WACA,UACA,QACA,SACA,UACA,MACA,UACA,kBACA,MACA,WACA,OACA,YACA,QACA,UACA,SACA,KACA,MACA,YACA,GAAG,WACD;CAgBJ,OACE,oBAAC,KAAD;EACE,GAhBc,UAAuB;GACvC,MAAM,CAAC,QAAQ,gBAAgB;GAC/B;GACA,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,CAIgB,CAAC,CAAC,QAAQ,EAAE,WAAW,KAAK,CAAC;EACzC,WAAW,OAAO,SAAS;EAClB;EACT,KAAK,CACH;GACE,iBAAiB,gBAAgB,QAAQ;GACzC,mBAAmB,OAAO,cAAc;GACxC,eAAe;GACf,gBAAgB;EAClB,GACA,GACF;EACM;EACN,GAAI;CACL,CAAA;AAEL,CAAC;AAED,KAAK,UAAUA;AACf,KAAK,eAAe;AACpB,KAAK,cAAc"}

package/esm/components/Text/Text.module.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Text.module.mjs","names":[],"sources":["../../../src/components/Text/Text.module.css"],"sourcesContent":[".root {\n  -webkit-tap-highlight-color: transparent;\n  text-decoration: none;\n  font-size: var(--text-fz, var(--mantine-font-size-md));\n  line-height: var(--text-lh, var(--mantine-line-height-md));\n  font-weight: var(--mantine-font-weight-regular);\n  text-wrap: var(--text-text-wrap, var(--mantine-text-wrap, wrap));\n  margin: 0;\n  padding: 0;\n\n  &:where([data-truncate]) {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  &:where([data-truncate='start']) {\n    direction: rtl;\n    text-align: end;\n\n    @mixin where-rtl {\n      direction: ltr;\n      text-align: start;\n    }\n  }\n\n  &:where([data-variant='gradient']) {\n    background-image: var(--text-gradient);\n    background-clip: text;\n    -webkit-background-clip: text;\n    -webkit-text-fill-color: transparent;\n  }\n\n  &:where([data-line-clamp]) {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    display: -webkit-box;\n    -webkit-line-clamp: var(--text-line-clamp);\n    -webkit-box-orient: vertical;\n  }\n\n  &:where([data-inherit]) {\n    line-height: inherit;\n    font-weight: inherit;\n    font-size: inherit;\n  }\n\n  &:where([data-inline]) {\n    line-height: 1;\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"Text.module.mjs","names":[],"sources":["../../../src/components/Text/Text.module.css"],"sourcesContent":[".root {\n  -webkit-tap-highlight-color: transparent;\n  text-decoration: none;\n  font-size: var(--text-fz, var(--mantine-font-size-md));\n  line-height: var(--text-lh, var(--mantine-line-height-md));\n  font-weight: var(--mantine-font-weight-regular);\n  text-wrap: var(--text-text-wrap, var(--mantine-text-wrap));\n  margin: 0;\n  padding: 0;\n\n  &:where([data-truncate]) {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  &:where([data-truncate='start']) {\n    direction: rtl;\n    text-align: end;\n\n    @mixin where-rtl {\n      direction: ltr;\n      text-align: start;\n    }\n  }\n\n  &:where([data-variant='gradient']) {\n    background-image: var(--text-gradient);\n    background-clip: text;\n    -webkit-background-clip: text;\n    -webkit-text-fill-color: transparent;\n  }\n\n  &:where([data-line-clamp]) {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    display: -webkit-box;\n    -webkit-line-clamp: var(--text-line-clamp);\n    -webkit-box-orient: vertical;\n  }\n\n  &:where([data-inherit]) {\n    line-height: inherit;\n    font-weight: inherit;\n    font-size: inherit;\n  }\n\n  &:where([data-inline]) {\n    line-height: 1;\n  }\n}\n"],"mappings":""}

package/esm/components/Textarea/Autosize.mjs

@@ -92,6 +92,7 @@ function TextareaAutosize({ maxRows, minRows, onChange, ref: userRef, ...props }
 	const libRef = useRef(null);
 	const ref = useMergedRef(libRef, userRef);
 	const heightRef = useRef(0);
+	const widthRef = useRef(0);
 	const resizeTextarea = () => {
 		const node = libRef.current;
 		if (!node) return;
@@ -113,6 +114,19 @@ function TextareaAutosize({ maxRows, minRows, onChange, ref: userRef, ...props }
 		window.addEventListener("resize", handleResize);
 		return () => window.removeEventListener("resize", handleResize);
 	}, []);
+	useEffect(() => {
+		const node = libRef.current;
+		if (!node || typeof ResizeObserver === "undefined") return;
+		widthRef.current = node.offsetWidth;
+		const observer = new ResizeObserver(() => {
+			if (libRef.current && libRef.current.offsetWidth !== widthRef.current) {
+				widthRef.current = libRef.current.offsetWidth;
+				resizeTextarea();
+			}
+		});
+		observer.observe(node);
+		return () => observer.disconnect();
+	}, []);
 	useEffect(() => {
 		const handleFontsLoaded = () => resizeTextarea();
 		document.fonts.addEventListener("loadingdone", handleFontsLoaded);

package/esm/components/Textarea/Autosize.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Autosize.mjs","names":[],"sources":["../../../src/components/Textarea/Autosize.tsx"],"sourcesContent":["import React, { useEffect, useLayoutEffect, useRef } from 'react';\nimport { useMergedRef } from '@mantine/hooks';\n\ntype TextareaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement>;\n\nexport interface TextareaAutosizeProps extends Omit<TextareaProps, 'style'> {\n  ref?: React.Ref<HTMLTextAreaElement>;\n  maxRows?: number;\n  minRows?: number;\n  style?: Omit<NonNullable<TextareaProps['style']>, 'maxHeight' | 'minHeight'> & {\n    height?: number;\n  };\n}\n\nconst SIZING_STYLE_KEYS = [\n  'borderBottomWidth',\n  'borderLeftWidth',\n  'borderRightWidth',\n  'borderTopWidth',\n  'boxSizing',\n  'fontFamily',\n  'fontSize',\n  'fontStyle',\n  'fontWeight',\n  'letterSpacing',\n  'lineHeight',\n  'paddingBottom',\n  'paddingLeft',\n  'paddingRight',\n  'paddingTop',\n  'tabSize',\n  'textIndent',\n  'textRendering',\n  'textTransform',\n  'width',\n  'wordBreak',\n  'wordSpacing',\n  'scrollbarGutter',\n] as const;\n\ntype SizingStyleKey = (typeof SIZING_STYLE_KEYS)[number];\n\ninterface SizingData {\n  sizingStyle: Pick<CSSStyleDeclaration, Extract<SizingStyleKey, keyof CSSStyleDeclaration>>;\n  paddingSize: number;\n  borderSize: number;\n}\n\nconst HIDDEN_TEXTAREA_STYLE: Record<string, string> = {\n  'min-height': '0',\n  'max-height': 'none',\n  height: '0',\n  visibility: 'hidden',\n  overflow: 'hidden',\n  position: 'absolute',\n  'z-index': '-1000',\n  top: '0',\n  right: '0',\n  display: 'block',\n};\n\nfunction forceHiddenStyles(node: HTMLElement) {\n  Object.keys(HIDDEN_TEXTAREA_STYLE).forEach((key) => {\n    node.style.setProperty(key, HIDDEN_TEXTAREA_STYLE[key], 'important');\n  });\n}\n\nfunction getSizingData(node: HTMLElement): SizingData | null {\n  const style = window.getComputedStyle(node);\n\n  if (style === null) {\n    return null;\n  }\n\n  const sizingStyle = {} as SizingData['sizingStyle'];\n  for (const key of SIZING_STYLE_KEYS) {\n    (sizingStyle as any)[key] = style[key as keyof CSSStyleDeclaration];\n  }\n\n  if ((sizingStyle as any).boxSizing === '') {\n    return null;\n  }\n\n  const paddingSize = parseFloat(sizingStyle.paddingBottom!) + parseFloat(sizingStyle.paddingTop!);\n\n  const borderSize =\n    parseFloat(sizingStyle.borderBottomWidth!) + parseFloat(sizingStyle.borderTopWidth!);\n\n  return { sizingStyle, paddingSize, borderSize };\n}\n\nlet hiddenTextarea: HTMLTextAreaElement | null = null;\n\nfunction calculateNodeHeight(\n  sizingData: SizingData,\n  value: string,\n  minRows = 1,\n  maxRows = Infinity\n): [number, number] {\n  if (!hiddenTextarea) {\n    hiddenTextarea = document.createElement('textarea');\n    hiddenTextarea.setAttribute('tabindex', '-1');\n    hiddenTextarea.setAttribute('aria-hidden', 'true');\n    hiddenTextarea.setAttribute('aria-label', 'autosize measurement');\n    forceHiddenStyles(hiddenTextarea);\n  }\n\n  if (hiddenTextarea.parentNode === null) {\n    document.body.appendChild(hiddenTextarea);\n  }\n\n  const { paddingSize, borderSize, sizingStyle } = sizingData;\n  const { boxSizing } = sizingStyle;\n\n  Object.keys(sizingStyle).forEach((key) => {\n    (hiddenTextarea!.style as any)[key] = (sizingStyle as any)[key];\n  });\n\n  forceHiddenStyles(hiddenTextarea);\n\n  hiddenTextarea.value = value;\n  let height =\n    boxSizing === 'border-box'\n      ? hiddenTextarea.scrollHeight + borderSize\n      : hiddenTextarea.scrollHeight - paddingSize;\n\n  // Double set and calc due to Firefox bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1795904\n  hiddenTextarea.value = value;\n  height =\n    boxSizing === 'border-box'\n      ? hiddenTextarea.scrollHeight + borderSize\n      : hiddenTextarea.scrollHeight - paddingSize;\n\n  hiddenTextarea.value = 'x';\n  const rowHeight = hiddenTextarea.scrollHeight - paddingSize;\n\n  let minHeight = rowHeight * minRows;\n  if (boxSizing === 'border-box') {\n    minHeight = minHeight + paddingSize + borderSize;\n  }\n  height = Math.max(minHeight, height);\n\n  let maxHeight = rowHeight * maxRows;\n  if (boxSizing === 'border-box') {\n    maxHeight = maxHeight + paddingSize + borderSize;\n  }\n  height = Math.min(maxHeight, height);\n\n  return [height, rowHeight];\n}\n\nexport function TextareaAutosize({\n  maxRows,\n  minRows,\n  onChange,\n  ref: userRef,\n  ...props\n}: TextareaAutosizeProps) {\n  const isControlled = props.value !== undefined;\n  const libRef = useRef<HTMLTextAreaElement | null>(null);\n  const ref = useMergedRef(libRef, userRef);\n  const heightRef = useRef(0);\n\n  const resizeTextarea = () => {\n    const node = libRef.current;\n\n    if (!node) {\n      return;\n    }\n\n    const nodeSizingData = getSizingData(node);\n\n    if (!nodeSizingData) {\n      return;\n    }\n\n    const [height] = calculateNodeHeight(\n      nodeSizingData,\n      node.value || node.placeholder || 'x',\n      minRows,\n      maxRows\n    );\n\n    if (heightRef.current !== height) {\n      heightRef.current = height;\n      node.style.setProperty('height', `${height}px`, 'important');\n    }\n  };\n\n  const handleChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n    if (!isControlled) {\n      resizeTextarea();\n    }\n    onChange?.(event);\n  };\n\n  useLayoutEffect(resizeTextarea);\n\n  useEffect(() => {\n    const handleResize = () => resizeTextarea();\n    window.addEventListener('resize', handleResize);\n    return () => window.removeEventListener('resize', handleResize);\n  }, []);\n\n  useEffect(() => {\n    const handleFontsLoaded = () => resizeTextarea();\n    document.fonts.addEventListener('loadingdone', handleFontsLoaded);\n    return () => document.fonts.removeEventListener('loadingdone', handleFontsLoaded);\n  }, []);\n\n  useEffect(() => {\n    const handleReset = (event: Event) => {\n      if (libRef.current?.form === event.target && !isControlled) {\n        const currentValue = libRef.current!.value;\n        requestAnimationFrame(() => {\n          if (libRef.current && currentValue !== libRef.current.value) {\n            resizeTextarea();\n          }\n        });\n      }\n    };\n    document.body.addEventListener('reset', handleReset);\n    return () => document.body.removeEventListener('reset', handleReset);\n  }, [isControlled]);\n\n  return <textarea {...props} onChange={handleChange} ref={ref} />;\n}\n"],"mappings":"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"}
+{"version":3,"file":"Autosize.mjs","names":[],"sources":["../../../src/components/Textarea/Autosize.tsx"],"sourcesContent":["import React, { useEffect, useLayoutEffect, useRef } from 'react';\nimport { useMergedRef } from '@mantine/hooks';\n\ntype TextareaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement>;\n\nexport interface TextareaAutosizeProps extends Omit<TextareaProps, 'style'> {\n  ref?: React.Ref<HTMLTextAreaElement>;\n  maxRows?: number;\n  minRows?: number;\n  style?: Omit<NonNullable<TextareaProps['style']>, 'maxHeight' | 'minHeight'> & {\n    height?: number;\n  };\n}\n\nconst SIZING_STYLE_KEYS = [\n  'borderBottomWidth',\n  'borderLeftWidth',\n  'borderRightWidth',\n  'borderTopWidth',\n  'boxSizing',\n  'fontFamily',\n  'fontSize',\n  'fontStyle',\n  'fontWeight',\n  'letterSpacing',\n  'lineHeight',\n  'paddingBottom',\n  'paddingLeft',\n  'paddingRight',\n  'paddingTop',\n  'tabSize',\n  'textIndent',\n  'textRendering',\n  'textTransform',\n  'width',\n  'wordBreak',\n  'wordSpacing',\n  'scrollbarGutter',\n] as const;\n\ntype SizingStyleKey = (typeof SIZING_STYLE_KEYS)[number];\n\ninterface SizingData {\n  sizingStyle: Pick<CSSStyleDeclaration, Extract<SizingStyleKey, keyof CSSStyleDeclaration>>;\n  paddingSize: number;\n  borderSize: number;\n}\n\nconst HIDDEN_TEXTAREA_STYLE: Record<string, string> = {\n  'min-height': '0',\n  'max-height': 'none',\n  height: '0',\n  visibility: 'hidden',\n  overflow: 'hidden',\n  position: 'absolute',\n  'z-index': '-1000',\n  top: '0',\n  right: '0',\n  display: 'block',\n};\n\nfunction forceHiddenStyles(node: HTMLElement) {\n  Object.keys(HIDDEN_TEXTAREA_STYLE).forEach((key) => {\n    node.style.setProperty(key, HIDDEN_TEXTAREA_STYLE[key], 'important');\n  });\n}\n\nfunction getSizingData(node: HTMLElement): SizingData | null {\n  const style = window.getComputedStyle(node);\n\n  if (style === null) {\n    return null;\n  }\n\n  const sizingStyle = {} as SizingData['sizingStyle'];\n  for (const key of SIZING_STYLE_KEYS) {\n    (sizingStyle as any)[key] = style[key as keyof CSSStyleDeclaration];\n  }\n\n  if ((sizingStyle as any).boxSizing === '') {\n    return null;\n  }\n\n  const paddingSize = parseFloat(sizingStyle.paddingBottom!) + parseFloat(sizingStyle.paddingTop!);\n\n  const borderSize =\n    parseFloat(sizingStyle.borderBottomWidth!) + parseFloat(sizingStyle.borderTopWidth!);\n\n  return { sizingStyle, paddingSize, borderSize };\n}\n\nlet hiddenTextarea: HTMLTextAreaElement | null = null;\n\nfunction calculateNodeHeight(\n  sizingData: SizingData,\n  value: string,\n  minRows = 1,\n  maxRows = Infinity\n): [number, number] {\n  if (!hiddenTextarea) {\n    hiddenTextarea = document.createElement('textarea');\n    hiddenTextarea.setAttribute('tabindex', '-1');\n    hiddenTextarea.setAttribute('aria-hidden', 'true');\n    hiddenTextarea.setAttribute('aria-label', 'autosize measurement');\n    forceHiddenStyles(hiddenTextarea);\n  }\n\n  if (hiddenTextarea.parentNode === null) {\n    document.body.appendChild(hiddenTextarea);\n  }\n\n  const { paddingSize, borderSize, sizingStyle } = sizingData;\n  const { boxSizing } = sizingStyle;\n\n  Object.keys(sizingStyle).forEach((key) => {\n    (hiddenTextarea!.style as any)[key] = (sizingStyle as any)[key];\n  });\n\n  forceHiddenStyles(hiddenTextarea);\n\n  hiddenTextarea.value = value;\n  let height =\n    boxSizing === 'border-box'\n      ? hiddenTextarea.scrollHeight + borderSize\n      : hiddenTextarea.scrollHeight - paddingSize;\n\n  // Double set and calc due to Firefox bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1795904\n  hiddenTextarea.value = value;\n  height =\n    boxSizing === 'border-box'\n      ? hiddenTextarea.scrollHeight + borderSize\n      : hiddenTextarea.scrollHeight - paddingSize;\n\n  hiddenTextarea.value = 'x';\n  const rowHeight = hiddenTextarea.scrollHeight - paddingSize;\n\n  let minHeight = rowHeight * minRows;\n  if (boxSizing === 'border-box') {\n    minHeight = minHeight + paddingSize + borderSize;\n  }\n  height = Math.max(minHeight, height);\n\n  let maxHeight = rowHeight * maxRows;\n  if (boxSizing === 'border-box') {\n    maxHeight = maxHeight + paddingSize + borderSize;\n  }\n  height = Math.min(maxHeight, height);\n\n  return [height, rowHeight];\n}\n\nexport function TextareaAutosize({\n  maxRows,\n  minRows,\n  onChange,\n  ref: userRef,\n  ...props\n}: TextareaAutosizeProps) {\n  const isControlled = props.value !== undefined;\n  const libRef = useRef<HTMLTextAreaElement | null>(null);\n  const ref = useMergedRef(libRef, userRef);\n  const heightRef = useRef(0);\n  const widthRef = useRef(0);\n\n  const resizeTextarea = () => {\n    const node = libRef.current;\n\n    if (!node) {\n      return;\n    }\n\n    const nodeSizingData = getSizingData(node);\n\n    if (!nodeSizingData) {\n      return;\n    }\n\n    const [height] = calculateNodeHeight(\n      nodeSizingData,\n      node.value || node.placeholder || 'x',\n      minRows,\n      maxRows\n    );\n\n    if (heightRef.current !== height) {\n      heightRef.current = height;\n      node.style.setProperty('height', `${height}px`, 'important');\n    }\n  };\n\n  const handleChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n    if (!isControlled) {\n      resizeTextarea();\n    }\n    onChange?.(event);\n  };\n\n  useLayoutEffect(resizeTextarea);\n\n  useEffect(() => {\n    const handleResize = () => resizeTextarea();\n    window.addEventListener('resize', handleResize);\n    return () => window.removeEventListener('resize', handleResize);\n  }, []);\n\n  useEffect(() => {\n    const node = libRef.current;\n\n    if (!node || typeof ResizeObserver === 'undefined') {\n      return undefined;\n    }\n\n    widthRef.current = node.offsetWidth;\n\n    const observer = new ResizeObserver(() => {\n      if (libRef.current && libRef.current.offsetWidth !== widthRef.current) {\n        widthRef.current = libRef.current.offsetWidth;\n        resizeTextarea();\n      }\n    });\n\n    observer.observe(node);\n    return () => observer.disconnect();\n  }, []);\n\n  useEffect(() => {\n    const handleFontsLoaded = () => resizeTextarea();\n    document.fonts.addEventListener('loadingdone', handleFontsLoaded);\n    return () => document.fonts.removeEventListener('loadingdone', handleFontsLoaded);\n  }, []);\n\n  useEffect(() => {\n    const handleReset = (event: Event) => {\n      if (libRef.current?.form === event.target && !isControlled) {\n        const currentValue = libRef.current!.value;\n        requestAnimationFrame(() => {\n          if (libRef.current && currentValue !== libRef.current.value) {\n            resizeTextarea();\n          }\n        });\n      }\n    };\n    document.body.addEventListener('reset', handleReset);\n    return () => document.body.removeEventListener('reset', handleReset);\n  }, [isControlled]);\n\n  return <textarea {...props} onChange={handleChange} ref={ref} />;\n}\n"],"mappings":"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"}

package/esm/components/ThemeIcon/ThemeIcon.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeIcon.mjs","names":["classes"],"sources":["../../../src/components/ThemeIcon/ThemeIcon.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getRadius,\n  getSize,\n  MantineColor,\n  MantineGradient,\n  MantineRadius,\n  MantineSize,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport classes from './ThemeIcon.module.css';\n\nexport type ThemeIconStylesNames = 'root';\nexport type ThemeIconVariant =\n  | 'filled'\n  | 'light'\n  | 'outline'\n  | 'transparent'\n  | 'white'\n  | 'default'\n  | 'gradient';\n\nexport type ThemeIconCssVariables = {\n  root: '--ti-radius' | '--ti-size' | '--ti-bg' | '--ti-color' | '--ti-bd';\n};\n\nexport interface ThemeIconProps\n  extends BoxProps, StylesApiProps<ThemeIconFactory>, ElementProps<'div'> {\n  /** Controls width and height of the button. Numbers are converted to rem. @default 'md' */\n  size?: MantineSize | (string & {}) | number;\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. Numbers are converted to rem. @default theme.defaultRadius */\n  radius?: MantineRadius;\n\n  /** Gradient data used when `variant=\"gradient\"` @default theme.defaultGradient */\n  gradient?: MantineGradient;\n\n  /** Icon displayed inside the component */\n  children?: React.ReactNode;\n\n  /** If set, adjusts text color based on background color for `filled` variant */\n  autoContrast?: boolean;\n}\n\nexport type ThemeIconFactory = Factory<{\n  props: ThemeIconProps;\n  ref: HTMLDivElement;\n  stylesNames: ThemeIconStylesNames;\n  vars: ThemeIconCssVariables;\n  variant: ThemeIconVariant;\n}>;\n\nconst varsResolver = createVarsResolver<ThemeIconFactory>(\n  (theme, { size, radius, variant, gradient, color, autoContrast }) => {\n    const colors = theme.variantColorResolver({\n      color: color || theme.primaryColor,\n      theme,\n      gradient,\n      variant: variant || 'filled',\n      autoContrast,\n    });\n\n    return {\n      root: {\n        '--ti-size': getSize(size, 'ti-size'),\n        '--ti-radius': radius === undefined ? undefined : getRadius(radius),\n        '--ti-bg': color || variant ? colors.background : undefined,\n        '--ti-color': color || variant ? colors.color : undefined,\n        '--ti-bd': color || variant ? colors.border : undefined,\n      },\n    };\n  }\n);\n\nexport const ThemeIcon = factory<ThemeIconFactory>((_props) => {\n  const props = useProps('ThemeIcon', null, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    autoContrast,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<ThemeIconFactory>({\n    name: 'ThemeIcon',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  return <Box {...getStyles('root')} {...others} />;\n});\n\nThemeIcon.classes = classes;\nThemeIcon.varsResolver = varsResolver;\nThemeIcon.displayName = '@mantine/core/ThemeIcon';\n\nexport namespace ThemeIcon {\n  export type Props = ThemeIconProps;\n  export type StylesNames = ThemeIconStylesNames;\n  export type Factory = ThemeIconFactory;\n  export type Variant = ThemeIconVariant;\n  export type CssVariables = ThemeIconCssVariables;\n}\n"],"mappings":";;;;;;;;;;AA8DA,MAAM,eAAe,oBAClB,OAAO,EAAE,MAAM,QAAQ,SAAS,UAAU,OAAO,mBAAmB;CACnE,MAAM,SAAS,MAAM,qBAAqB;EACxC,OAAO,SAAS,MAAM;EACtB;EACA;EACA,SAAS,WAAW;EACpB;CACF,CAAC;CAED,OAAO,EACL,MAAM;EACJ,aAAa,QAAQ,MAAM,SAAS;EACpC,eAAe,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,MAAM;EAClE,WAAW,SAAS,UAAU,OAAO,aAAa,KAAA;EAClD,cAAc,SAAS,UAAU,OAAO,QAAQ,KAAA;EAChD,WAAW,SAAS,UAAU,OAAO,SAAS,KAAA;CAChD,EACF;AACF,CACF;AAEA,MAAa,YAAY,SAA2B,WAAW;CAC7D,MAAM,QAAQ,SAAS,aAAa,MAAM,MAAM;CAChD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,cACA,YACA,GAAG,WACD;CAgBJ,OAAO,oBAAC,KAAD;EAAK,GAdM,UAA4B;GAC5C,MAAM;GACN,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,CAEwB,EAAE,MAAM;EAAG,GAAI;CAAS,CAAA;AAClD,CAAC;AAED,UAAU,UAAUA;AACpB,UAAU,eAAe;AACzB,UAAU,cAAc"}
+{"version":3,"file":"ThemeIcon.mjs","names":["classes"],"sources":["../../../src/components/ThemeIcon/ThemeIcon.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getRadius,\n  getSize,\n  MantineColor,\n  MantineGradient,\n  MantineRadius,\n  MantineSize,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport classes from './ThemeIcon.module.css';\n\nexport type ThemeIconStylesNames = 'root';\nexport type ThemeIconVariant =\n  | 'filled'\n  | 'light'\n  | 'outline'\n  | 'transparent'\n  | 'white'\n  | 'default'\n  | 'gradient';\n\nexport type ThemeIconCssVariables = {\n  root: '--ti-radius' | '--ti-size' | '--ti-bg' | '--ti-color' | '--ti-bd';\n};\n\nexport interface ThemeIconProps\n  extends BoxProps, StylesApiProps<ThemeIconFactory>, ElementProps<'div'> {\n  /** Controls width and height of the button. Numbers are converted to rem. @default 'md' */\n  size?: MantineSize | (string & {}) | number;\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. Numbers are converted to rem. @default theme.defaultRadius */\n  radius?: MantineRadius;\n\n  /** Gradient data used when `variant=\"gradient\"` @default theme.defaultGradient */\n  gradient?: MantineGradient;\n\n  /** Icon displayed inside the component */\n  children?: React.ReactNode;\n\n  /** If set, adjusts text color based on background color for `filled` variant */\n  autoContrast?: boolean;\n}\n\nexport type ThemeIconFactory = Factory<{\n  props: ThemeIconProps;\n  ref: HTMLDivElement;\n  stylesNames: ThemeIconStylesNames;\n  vars: ThemeIconCssVariables;\n  variant: ThemeIconVariant;\n}>;\n\nconst varsResolver = createVarsResolver<ThemeIconFactory>(\n  (theme, { size, radius, variant, gradient, color, autoContrast }) => {\n    const colors = theme.variantColorResolver({\n      color: color || theme.primaryColor,\n      theme,\n      gradient,\n      variant: variant || 'filled',\n      autoContrast,\n    });\n\n    return {\n      root: {\n        '--ti-size': getSize(size, 'ti-size'),\n        '--ti-radius': radius === undefined ? undefined : getRadius(radius),\n        '--ti-bg': color || variant ? colors.background : undefined,\n        '--ti-color': color || variant ? colors.color : undefined,\n        '--ti-bd': color || variant ? colors.border : undefined,\n      },\n    };\n  }\n);\n\nexport const ThemeIcon = factory<ThemeIconFactory>((_props) => {\n  const props = useProps('ThemeIcon', null, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    autoContrast,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<ThemeIconFactory>({\n    name: 'ThemeIcon',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  return <Box {...getStyles('root')} {...others} />;\n});\n\nThemeIcon.classes = classes;\nThemeIcon.varsResolver = varsResolver;\nThemeIcon.displayName = '@mantine/core/ThemeIcon';\n\nexport namespace ThemeIcon {\n  export type Props = ThemeIconProps;\n  export type StylesNames = ThemeIconStylesNames;\n  export type Factory = ThemeIconFactory;\n  export type Variant = ThemeIconVariant;\n  export type CssVariables = ThemeIconCssVariables;\n}\n"],"mappings":";;;;;;;;;;AA8DA,MAAM,eAAe,oBAClB,OAAO,EAAE,MAAM,QAAQ,SAAS,UAAU,OAAO,mBAAmB;CACnE,MAAM,SAAS,MAAM,qBAAqB;EACxC,OAAO,SAAS,MAAM;EACtB;EACA;EACA,SAAS,WAAW;EACpB;CACF,CAAC;CAED,OAAO,EACL,MAAM;EACJ,aAAa,QAAQ,MAAM,SAAS;EACpC,eAAe,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,MAAM;EAClE,WAAW,SAAS,UAAU,OAAO,aAAa,KAAA;EAClD,cAAc,SAAS,UAAU,OAAO,QAAQ,KAAA;EAChD,WAAW,SAAS,UAAU,OAAO,SAAS,KAAA;CAChD,EACF;AACF,CACF;AAEA,MAAa,YAAY,SAA2B,WAAW;CAC7D,MAAM,QAAQ,SAAS,aAAa,MAAM,MAAM;CAChD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,cACA,YACA,GAAG,WACD;CAgBJ,OAAO,oBAAC,KAAD;EAAK,GAdM,UAA4B;GAC5C,MAAM;GACN,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,CAEwB,CAAC,CAAC,MAAM;EAAG,GAAI;CAAS,CAAA;AAClD,CAAC;AAED,UAAU,UAAUA;AACpB,UAAU,eAAe;AACzB,UAAU,cAAc"}

package/esm/components/Title/Title.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Title.mjs","names":["classes"],"sources":["../../../src/components/Title/Title.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  MantineFontSize,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { getTitleSize } from './get-title-size';\nimport classes from './Title.module.css';\n\nexport type TitleOrder = 1 | 2 | 3 | 4 | 5 | 6;\nexport type TitleSize = `h${TitleOrder}` | React.CSSProperties['fontSize'] | MantineFontSize;\n\nexport type TitleStylesNames = 'root';\nexport type TitleCssVariables = {\n  root: '--title-fw' | '--title-lh' | '--title-fz' | '--title-line-clamp' | '--title-text-wrap';\n};\n\nexport interface TitleProps\n  extends BoxProps, StylesApiProps<TitleFactory>, ElementProps<'h1', 'color'> {\n  /** Heading order (1-6), controls `font-size` style if `size` prop is not set @default 1 */\n  order?: TitleOrder;\n\n  /** Changes title size, if not set, then size is controlled by `order` prop */\n  size?: TitleSize;\n\n  /** Number of lines after which heading will be truncated */\n  lineClamp?: number;\n\n  /** Heading `text-wrap` CSS property @default 'wrap' */\n  textWrap?: 'wrap' | 'nowrap' | 'balance' | 'pretty' | 'stable';\n}\n\nexport type TitleFactory = Factory<{\n  props: TitleProps;\n  ref: HTMLHeadingElement;\n  stylesNames: TitleStylesNames;\n  vars: TitleCssVariables;\n}>;\n\nconst defaultProps = {\n  order: 1,\n} satisfies Partial<TitleProps>;\n\nconst varsResolver = createVarsResolver<TitleFactory>((_, { order, size, lineClamp, textWrap }) => {\n  const sizeVariables = getTitleSize(order || 1, size);\n  return {\n    root: {\n      '--title-fw': sizeVariables.fontWeight,\n      '--title-lh': sizeVariables.lineHeight,\n      '--title-fz': sizeVariables.fontSize,\n      '--title-line-clamp': typeof lineClamp === 'number' ? lineClamp.toString() : undefined,\n      '--title-text-wrap': textWrap,\n    },\n  };\n});\n\nexport const Title = factory<TitleFactory>((_props) => {\n  const props = useProps('Title', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    order,\n    vars,\n    size,\n    variant,\n    lineClamp,\n    textWrap,\n    mod,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<TitleFactory>({\n    name: 'Title',\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  if (![1, 2, 3, 4, 5, 6].includes(order)) {\n    return null;\n  }\n\n  return (\n    <Box\n      {...getStyles('root')}\n      component={`h${order}`}\n      variant={variant}\n      mod={[{ order, 'data-line-clamp': typeof lineClamp === 'number' }, mod]}\n      size={size}\n      {...others}\n    />\n  );\n});\n\nTitle.classes = classes;\nTitle.varsResolver = varsResolver;\nTitle.displayName = '@mantine/core/Title';\n\nexport namespace Title {\n  export type Props = TitleProps;\n  export type Order = TitleOrder;\n  export type Size = TitleSize;\n  export type StylesNames = TitleStylesNames;\n  export type CssVariables = TitleCssVariables;\n  export type Factory = TitleFactory;\n}\n"],"mappings":";;;;;;;;;;AA6CA,MAAM,eAAe,EACnB,OAAO,EACT;AAEA,MAAM,eAAe,oBAAkC,GAAG,EAAE,OAAO,MAAM,WAAW,eAAe;CACjG,MAAM,gBAAgB,aAAa,SAAS,GAAG,IAAI;CACnD,OAAO,EACL,MAAM;EACJ,cAAc,cAAc;EAC5B,cAAc,cAAc;EAC5B,cAAc,cAAc;EAC5B,sBAAsB,OAAO,cAAc,WAAW,UAAU,SAAS,IAAI,KAAA;EAC7E,qBAAqB;CACvB,EACF;AACF,CAAC;AAED,MAAa,QAAQ,SAAuB,WAAW;CACrD,MAAM,QAAQ,SAAS,SAAS,cAAc,MAAM;CACpD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,OACA,MACA,MACA,SACA,WACA,UACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAAwB;EACxC,MAAM;EACN;EACA,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,IAAI,CAAC;EAAC;EAAG;EAAG;EAAG;EAAG;EAAG;CAAC,EAAE,SAAS,KAAK,GACpC,OAAO;CAGT,OACE,oBAAC,KAAD;EACE,GAAI,UAAU,MAAM;EACpB,WAAW,IAAI;EACN;EACT,KAAK,CAAC;GAAE;GAAO,mBAAmB,OAAO,cAAc;EAAS,GAAG,GAAG;EAChE;EACN,GAAI;CACL,CAAA;AAEL,CAAC;AAED,MAAM,UAAUA;AAChB,MAAM,eAAe;AACrB,MAAM,cAAc"}
+{"version":3,"file":"Title.mjs","names":["classes"],"sources":["../../../src/components/Title/Title.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  MantineFontSize,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { getTitleSize } from './get-title-size';\nimport classes from './Title.module.css';\n\nexport type TitleOrder = 1 | 2 | 3 | 4 | 5 | 6;\nexport type TitleSize = `h${TitleOrder}` | React.CSSProperties['fontSize'] | MantineFontSize;\n\nexport type TitleStylesNames = 'root';\nexport type TitleCssVariables = {\n  root: '--title-fw' | '--title-lh' | '--title-fz' | '--title-line-clamp' | '--title-text-wrap';\n};\n\nexport interface TitleProps\n  extends BoxProps, StylesApiProps<TitleFactory>, ElementProps<'h1', 'color'> {\n  /** Heading order (1-6), controls `font-size` style if `size` prop is not set @default 1 */\n  order?: TitleOrder;\n\n  /** Changes title size, if not set, then size is controlled by `order` prop */\n  size?: TitleSize;\n\n  /** Number of lines after which heading will be truncated */\n  lineClamp?: number;\n\n  /** Heading `text-wrap` CSS property @default 'wrap' */\n  textWrap?: 'wrap' | 'nowrap' | 'balance' | 'pretty' | 'stable';\n}\n\nexport type TitleFactory = Factory<{\n  props: TitleProps;\n  ref: HTMLHeadingElement;\n  stylesNames: TitleStylesNames;\n  vars: TitleCssVariables;\n}>;\n\nconst defaultProps = {\n  order: 1,\n} satisfies Partial<TitleProps>;\n\nconst varsResolver = createVarsResolver<TitleFactory>((_, { order, size, lineClamp, textWrap }) => {\n  const sizeVariables = getTitleSize(order || 1, size);\n  return {\n    root: {\n      '--title-fw': sizeVariables.fontWeight,\n      '--title-lh': sizeVariables.lineHeight,\n      '--title-fz': sizeVariables.fontSize,\n      '--title-line-clamp': typeof lineClamp === 'number' ? lineClamp.toString() : undefined,\n      '--title-text-wrap': textWrap,\n    },\n  };\n});\n\nexport const Title = factory<TitleFactory>((_props) => {\n  const props = useProps('Title', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    order,\n    vars,\n    size,\n    variant,\n    lineClamp,\n    textWrap,\n    mod,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<TitleFactory>({\n    name: 'Title',\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  if (![1, 2, 3, 4, 5, 6].includes(order)) {\n    return null;\n  }\n\n  return (\n    <Box\n      {...getStyles('root')}\n      component={`h${order}`}\n      variant={variant}\n      mod={[{ order, 'data-line-clamp': typeof lineClamp === 'number' }, mod]}\n      size={size}\n      {...others}\n    />\n  );\n});\n\nTitle.classes = classes;\nTitle.varsResolver = varsResolver;\nTitle.displayName = '@mantine/core/Title';\n\nexport namespace Title {\n  export type Props = TitleProps;\n  export type Order = TitleOrder;\n  export type Size = TitleSize;\n  export type StylesNames = TitleStylesNames;\n  export type CssVariables = TitleCssVariables;\n  export type Factory = TitleFactory;\n}\n"],"mappings":";;;;;;;;;;AA6CA,MAAM,eAAe,EACnB,OAAO,EACT;AAEA,MAAM,eAAe,oBAAkC,GAAG,EAAE,OAAO,MAAM,WAAW,eAAe;CACjG,MAAM,gBAAgB,aAAa,SAAS,GAAG,IAAI;CACnD,OAAO,EACL,MAAM;EACJ,cAAc,cAAc;EAC5B,cAAc,cAAc;EAC5B,cAAc,cAAc;EAC5B,sBAAsB,OAAO,cAAc,WAAW,UAAU,SAAS,IAAI,KAAA;EAC7E,qBAAqB;CACvB,EACF;AACF,CAAC;AAED,MAAa,QAAQ,SAAuB,WAAW;CACrD,MAAM,QAAQ,SAAS,SAAS,cAAc,MAAM;CACpD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,OACA,MACA,MACA,SACA,WACA,UACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAAwB;EACxC,MAAM;EACN;EACA,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,IAAI,CAAC;EAAC;EAAG;EAAG;EAAG;EAAG;EAAG;CAAC,CAAC,CAAC,SAAS,KAAK,GACpC,OAAO;CAGT,OACE,oBAAC,KAAD;EACE,GAAI,UAAU,MAAM;EACpB,WAAW,IAAI;EACN;EACT,KAAK,CAAC;GAAE;GAAO,mBAAmB,OAAO,cAAc;EAAS,GAAG,GAAG;EAChE;EACN,GAAI;CACL,CAAA;AAEL,CAAC;AAED,MAAM,UAAUA;AAChB,MAAM,eAAe;AACrB,MAAM,cAAc"}

package/esm/components/Tooltip/Tooltip.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.mjs","names":["classes"],"sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import { cloneElement, useEffect, useRef } from 'react';\nimport cx from 'clsx';\nimport { useMergedRef } from '@mantine/hooks';\nimport {\n  Box,\n  createVarsResolver,\n  factory,\n  Factory,\n  getDefaultZIndex,\n  getRadius,\n  getRefProp,\n  getSingleElementChild,\n  useDirection,\n  useProps,\n  useStyles,\n} from '../../core';\nimport {\n  ArrowPosition,\n  FloatingArrow,\n  FloatingAxesOffsets,\n  FloatingPosition,\n  FloatingStrategy,\n  getArrowMergeDropdownStyles,\n  getFloatingPosition,\n} from '../../utils/Floating';\nimport { OptionalPortal } from '../Portal';\nimport { getTransitionProps, Transition, TransitionOverride } from '../Transition';\nimport { TooltipBaseProps, TooltipCssVariables, TooltipStylesNames } from './Tooltip.types';\nimport { TooltipFloating, type TooltipFloatingProps } from './TooltipFloating/TooltipFloating';\nimport {\n  TooltipGroup,\n  type TooltipGroupProps,\n  type TooltipGroupContextValue,\n} from './TooltipGroup/TooltipGroup';\nimport { useTooltip } from './use-tooltip';\nimport classes from './Tooltip.module.css';\nexport interface TooltipProps extends TooltipBaseProps {\n  /** Called when tooltip position changes */\n  onPositionChange?: (position: FloatingPosition) => void;\n\n  /** Open delay in ms */\n  openDelay?: number;\n\n  /** Close delay in ms @default 0 */\n  closeDelay?: number;\n\n  /** Controlled opened state */\n  opened?: boolean;\n\n  /** Uncontrolled tooltip initial opened state */\n  defaultOpened?: boolean;\n\n  /** Space between target element and tooltip in px @default 5 */\n  offset?: number | FloatingAxesOffsets;\n\n  /** If set, the tooltip has an arrow @default false */\n  withArrow?: boolean;\n\n  /** Arrow size in px @default 4 */\n  arrowSize?: number;\n\n  /** Arrow offset in px @default 5 */\n  arrowOffset?: number;\n\n  /** Arrow `border-radius` in px @default 0 */\n  arrowRadius?: number;\n\n  /** Arrow position relative to the tooltip @default side */\n  arrowPosition?: ArrowPosition;\n\n  /** Props passed down to the `Transition` component that used to animate tooltip presence, use to configure duration and animation type @default { duration: 100, transition: 'fade' } */\n  transitionProps?: TransitionOverride;\n\n  /** Determines which events will be used to show tooltip @default { hover: true, focus: false, touch: false } */\n  events?: { hover: boolean; focus: boolean; touch: boolean };\n\n  /** Must be set if the tooltip target is an inline element */\n  inline?: boolean;\n\n  /** If set, the tooltip is not unmounted from the DOM when hidden, `display: none` styles are applied instead */\n  keepMounted?: boolean;\n\n  /** Changes floating ui [position strategy](https://floating-ui.com/docs/usefloating#strategy) @default 'absolute' */\n  floatingStrategy?: FloatingStrategy;\n\n  /** If set, adjusts text color based on background color for `filled` variant */\n  autoContrast?: boolean;\n\n  /** Selector, ref of an element or element itself that should be used for positioning */\n  target?: React.RefObject<HTMLElement | null> | HTMLElement | null | string;\n}\n\nexport type TooltipFactory = Factory<{\n  props: TooltipProps;\n  ref: HTMLDivElement;\n  stylesNames: TooltipStylesNames;\n  vars: TooltipCssVariables;\n  staticComponents: {\n    Floating: typeof TooltipFloating;\n    Group: typeof TooltipGroup;\n  };\n}>;\n\nconst defaultProps = {\n  position: 'top',\n  refProp: 'ref',\n  withinPortal: true,\n  arrowSize: 4,\n  arrowOffset: 5,\n  arrowRadius: 0,\n  arrowPosition: 'side',\n  offset: 5,\n  transitionProps: { duration: 100, transition: 'fade' },\n  events: { hover: true, focus: false, touch: false },\n  zIndex: getDefaultZIndex('popover'),\n  middlewares: { flip: true, shift: true, inline: false },\n} satisfies Partial<TooltipProps>;\n\nconst varsResolver = createVarsResolver<TooltipFactory>(\n  (theme, { radius, color, variant, autoContrast }) => {\n    const colors = theme.variantColorResolver({\n      theme,\n      color: color || theme.primaryColor,\n      autoContrast,\n      variant: variant || 'filled',\n    });\n\n    return {\n      tooltip: {\n        '--tooltip-radius': radius === undefined ? undefined : getRadius(radius),\n        '--tooltip-bg': color ? colors.background : undefined,\n        '--tooltip-color': color ? colors.color : undefined,\n      },\n    };\n  }\n);\n\nexport const Tooltip = factory<TooltipFactory>((_props) => {\n  const props = useProps('Tooltip', defaultProps, _props);\n  const {\n    children,\n    position,\n    refProp,\n    label,\n    openDelay,\n    closeDelay,\n    onPositionChange,\n    opened,\n    defaultOpened,\n    withinPortal,\n    radius,\n    color,\n    classNames,\n    styles,\n    unstyled,\n    style,\n    className,\n    withArrow,\n    arrowSize,\n    arrowOffset,\n    arrowRadius,\n    arrowPosition,\n    offset,\n    transitionProps,\n    multiline,\n    events,\n    zIndex,\n    disabled,\n    onClick,\n    onMouseEnter,\n    onMouseLeave,\n    inline,\n    variant,\n    keepMounted,\n    vars,\n    portalProps,\n    mod,\n    floatingStrategy,\n    middlewares,\n    autoContrast,\n    attributes,\n    target,\n    ref,\n    ...others\n  } = props;\n\n  const { dir } = useDirection();\n  const arrowRef = useRef<HTMLDivElement>(null);\n\n  const tooltip = useTooltip({\n    position: getFloatingPosition(dir, position),\n    closeDelay,\n    openDelay,\n    onPositionChange,\n    opened,\n    defaultOpened,\n    events,\n    arrowRef,\n    arrowOffset,\n    offset: typeof offset === 'number' ? offset + (withArrow ? arrowSize / 2 : 0) : offset,\n    inline,\n    strategy: floatingStrategy,\n    middlewares,\n  });\n\n  useEffect(() => {\n    const targetNode =\n      target instanceof HTMLElement\n        ? target\n        : typeof target === 'string'\n          ? document.querySelector(target)\n          : target?.current || null;\n\n    if (targetNode) {\n      tooltip.reference(targetNode);\n    }\n  }, [target, tooltip]);\n\n  const getStyles = useStyles<TooltipFactory>({\n    name: 'Tooltip',\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    rootSelector: 'tooltip',\n    vars,\n    varsResolver,\n  });\n\n  const child = getSingleElementChild(children);\n  if (!target && !child) {\n    throw new Error(\n      '[@mantine/core] Tooltip 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 tooltipStyles = getStyles('tooltip');\n  const mergeStyles =\n    arrowPosition === 'merge' && withArrow\n      ? getArrowMergeDropdownStyles({ position: tooltip.placement, dir })\n      : undefined;\n\n  if (target) {\n    const transition = getTransitionProps(transitionProps, { duration: 100, transition: 'fade' });\n    return (\n      <>\n        <OptionalPortal {...portalProps} withinPortal={withinPortal}>\n          <Transition\n            {...transition}\n            keepMounted={keepMounted}\n            mounted={!disabled && !!tooltip.opened}\n            duration={tooltip.isGroupPhase ? 10 : transition.duration}\n          >\n            {(transitionStyles) => (\n              <Box\n                {...others}\n                data-fixed={floatingStrategy === 'fixed' || undefined}\n                variant={variant}\n                mod={[{ multiline }, mod]}\n                {...tooltipStyles}\n                {...tooltip.getFloatingProps({\n                  ref: tooltip.floating,\n                  className: tooltipStyles.className,\n                  style: {\n                    ...tooltipStyles.style,\n                    ...transitionStyles,\n                    ...mergeStyles,\n                    zIndex: zIndex as React.CSSProperties['zIndex'],\n                    top: tooltip.y ?? 0,\n                    left: tooltip.x ?? 0,\n                  },\n                })}\n              >\n                {label}\n                <FloatingArrow\n                  ref={arrowRef}\n                  arrowX={tooltip.arrowX}\n                  arrowY={tooltip.arrowY}\n                  visible={withArrow}\n                  position={tooltip.placement}\n                  arrowSize={arrowSize!}\n                  arrowOffset={arrowOffset!}\n                  arrowRadius={arrowRadius!}\n                  arrowPosition={arrowPosition!}\n                  {...getStyles('arrow')}\n                />\n              </Box>\n            )}\n          </Transition>\n        </OptionalPortal>\n      </>\n    );\n  }\n\n  // fallback to children-based approach\n  const childProps = child!.props as any;\n  const targetRef = useMergedRef(tooltip.reference, getRefProp(child), ref);\n  const transition = getTransitionProps(transitionProps, { duration: 100, transition: 'fade' });\n\n  return (\n    <>\n      <OptionalPortal {...portalProps} withinPortal={withinPortal}>\n        <Transition\n          {...transition}\n          keepMounted={keepMounted}\n          mounted={!disabled && !!tooltip.opened}\n          duration={tooltip.isGroupPhase ? 10 : transition.duration}\n        >\n          {(transitionStyles) => (\n            <Box\n              {...others}\n              data-fixed={floatingStrategy === 'fixed' || undefined}\n              variant={variant}\n              mod={[{ multiline }, mod]}\n              {...tooltip.getFloatingProps({\n                ref: tooltip.floating,\n                className: getStyles('tooltip').className,\n                style: {\n                  ...getStyles('tooltip').style,\n                  ...transitionStyles,\n                  ...mergeStyles,\n                  zIndex: zIndex as React.CSSProperties['zIndex'],\n                  top: tooltip.y ?? 0,\n                  left: tooltip.x ?? 0,\n                },\n              })}\n            >\n              {label}\n              <FloatingArrow\n                ref={arrowRef}\n                arrowX={tooltip.arrowX}\n                arrowY={tooltip.arrowY}\n                visible={withArrow}\n                position={tooltip.placement}\n                arrowSize={arrowSize}\n                arrowOffset={arrowOffset}\n                arrowRadius={arrowRadius}\n                arrowPosition={arrowPosition}\n                {...getStyles('arrow')}\n              />\n            </Box>\n          )}\n        </Transition>\n      </OptionalPortal>\n\n      {cloneElement(\n        child!,\n        tooltip.getReferenceProps({\n          onClick,\n          onMouseEnter,\n          onMouseLeave,\n          onMouseMove: props.onMouseMove,\n          onPointerDown: props.onPointerDown,\n          onPointerEnter: props.onPointerEnter,\n          ...childProps,\n          className: cx(className, childProps.className),\n          [refProp]: targetRef,\n        })\n      )}\n    </>\n  );\n});\n\nTooltip.classes = classes;\nTooltip.varsResolver = varsResolver;\nTooltip.displayName = '@mantine/core/Tooltip';\nTooltip.Floating = TooltipFloating;\nTooltip.Group = TooltipGroup;\n\nexport namespace Tooltip {\n  export type Props = TooltipProps;\n  export type Factory = TooltipFactory;\n  export type CssVariables = TooltipCssVariables;\n  export type StylesNames = TooltipStylesNames;\n\n  export namespace Group {\n    export type Props = TooltipGroupProps;\n    export type ContextValue = TooltipGroupContextValue;\n  }\n\n  export namespace Floating {\n    export type Props = TooltipFloatingProps;\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"Tooltip.mjs","names":["classes"],"sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import { cloneElement, useEffect, useRef } from 'react';\nimport cx from 'clsx';\nimport { useMergedRef } from '@mantine/hooks';\nimport {\n  Box,\n  createVarsResolver,\n  factory,\n  Factory,\n  getDefaultZIndex,\n  getRadius,\n  getRefProp,\n  getSingleElementChild,\n  useDirection,\n  useProps,\n  useStyles,\n} from '../../core';\nimport {\n  ArrowPosition,\n  FloatingArrow,\n  FloatingAxesOffsets,\n  FloatingPosition,\n  FloatingStrategy,\n  getArrowMergeDropdownStyles,\n  getFloatingPosition,\n} from '../../utils/Floating';\nimport { OptionalPortal } from '../Portal';\nimport { getTransitionProps, Transition, TransitionOverride } from '../Transition';\nimport { TooltipBaseProps, TooltipCssVariables, TooltipStylesNames } from './Tooltip.types';\nimport { TooltipFloating, type TooltipFloatingProps } from './TooltipFloating/TooltipFloating';\nimport {\n  TooltipGroup,\n  type TooltipGroupProps,\n  type TooltipGroupContextValue,\n} from './TooltipGroup/TooltipGroup';\nimport { useTooltip } from './use-tooltip';\nimport classes from './Tooltip.module.css';\nexport interface TooltipProps extends TooltipBaseProps {\n  /** Called when tooltip position changes */\n  onPositionChange?: (position: FloatingPosition) => void;\n\n  /** Open delay in ms */\n  openDelay?: number;\n\n  /** Close delay in ms @default 0 */\n  closeDelay?: number;\n\n  /** Controlled opened state */\n  opened?: boolean;\n\n  /** Uncontrolled tooltip initial opened state */\n  defaultOpened?: boolean;\n\n  /** Space between target element and tooltip in px @default 5 */\n  offset?: number | FloatingAxesOffsets;\n\n  /** If set, the tooltip has an arrow @default false */\n  withArrow?: boolean;\n\n  /** Arrow size in px @default 4 */\n  arrowSize?: number;\n\n  /** Arrow offset in px @default 5 */\n  arrowOffset?: number;\n\n  /** Arrow `border-radius` in px @default 0 */\n  arrowRadius?: number;\n\n  /** Arrow position relative to the tooltip @default side */\n  arrowPosition?: ArrowPosition;\n\n  /** Props passed down to the `Transition` component that used to animate tooltip presence, use to configure duration and animation type @default { duration: 100, transition: 'fade' } */\n  transitionProps?: TransitionOverride;\n\n  /** Determines which events will be used to show tooltip @default { hover: true, focus: false, touch: false } */\n  events?: { hover: boolean; focus: boolean; touch: boolean };\n\n  /** Must be set if the tooltip target is an inline element */\n  inline?: boolean;\n\n  /** If set, the tooltip is not unmounted from the DOM when hidden, `display: none` styles are applied instead */\n  keepMounted?: boolean;\n\n  /** Changes floating ui [position strategy](https://floating-ui.com/docs/usefloating#strategy) @default 'absolute' */\n  floatingStrategy?: FloatingStrategy;\n\n  /** If set, adjusts text color based on background color for `filled` variant */\n  autoContrast?: boolean;\n\n  /** Selector, ref of an element or element itself that should be used for positioning */\n  target?: React.RefObject<HTMLElement | null> | HTMLElement | null | string;\n}\n\nexport type TooltipFactory = Factory<{\n  props: TooltipProps;\n  ref: HTMLDivElement;\n  stylesNames: TooltipStylesNames;\n  vars: TooltipCssVariables;\n  staticComponents: {\n    Floating: typeof TooltipFloating;\n    Group: typeof TooltipGroup;\n  };\n}>;\n\nconst defaultProps = {\n  position: 'top',\n  refProp: 'ref',\n  withinPortal: true,\n  arrowSize: 4,\n  arrowOffset: 5,\n  arrowRadius: 0,\n  arrowPosition: 'side',\n  offset: 5,\n  transitionProps: { duration: 100, transition: 'fade' },\n  events: { hover: true, focus: false, touch: false },\n  zIndex: getDefaultZIndex('popover'),\n  middlewares: { flip: true, shift: true, inline: false },\n} satisfies Partial<TooltipProps>;\n\nconst varsResolver = createVarsResolver<TooltipFactory>(\n  (theme, { radius, color, variant, autoContrast }) => {\n    const colors = theme.variantColorResolver({\n      theme,\n      color: color || theme.primaryColor,\n      autoContrast,\n      variant: variant || 'filled',\n    });\n\n    return {\n      tooltip: {\n        '--tooltip-radius': radius === undefined ? undefined : getRadius(radius),\n        '--tooltip-bg': color ? colors.background : undefined,\n        '--tooltip-color': color ? colors.color : undefined,\n      },\n    };\n  }\n);\n\nexport const Tooltip = factory<TooltipFactory>((_props) => {\n  const props = useProps('Tooltip', defaultProps, _props);\n  const {\n    children,\n    position,\n    refProp,\n    label,\n    openDelay,\n    closeDelay,\n    onPositionChange,\n    opened,\n    defaultOpened,\n    withinPortal,\n    radius,\n    color,\n    classNames,\n    styles,\n    unstyled,\n    style,\n    className,\n    withArrow,\n    arrowSize,\n    arrowOffset,\n    arrowRadius,\n    arrowPosition,\n    offset,\n    transitionProps,\n    multiline,\n    events,\n    zIndex,\n    disabled,\n    onClick,\n    onMouseEnter,\n    onMouseLeave,\n    inline,\n    variant,\n    keepMounted,\n    vars,\n    portalProps,\n    mod,\n    floatingStrategy,\n    middlewares,\n    autoContrast,\n    attributes,\n    target,\n    ref,\n    ...others\n  } = props;\n\n  const { dir } = useDirection();\n  const arrowRef = useRef<HTMLDivElement>(null);\n\n  const tooltip = useTooltip({\n    position: getFloatingPosition(dir, position),\n    closeDelay,\n    openDelay,\n    onPositionChange,\n    opened,\n    defaultOpened,\n    events,\n    arrowRef,\n    arrowOffset,\n    offset: typeof offset === 'number' ? offset + (withArrow ? arrowSize / 2 : 0) : offset,\n    inline,\n    strategy: floatingStrategy,\n    middlewares,\n  });\n\n  useEffect(() => {\n    const targetNode =\n      target instanceof HTMLElement\n        ? target\n        : typeof target === 'string'\n          ? document.querySelector(target)\n          : target?.current || null;\n\n    if (targetNode) {\n      tooltip.reference(targetNode);\n    }\n  }, [target, tooltip]);\n\n  const getStyles = useStyles<TooltipFactory>({\n    name: 'Tooltip',\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    rootSelector: 'tooltip',\n    vars,\n    varsResolver,\n  });\n\n  const child = getSingleElementChild(children);\n  if (!target && !child) {\n    throw new Error(\n      '[@mantine/core] Tooltip 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 tooltipStyles = getStyles('tooltip');\n  const mergeStyles =\n    arrowPosition === 'merge' && withArrow\n      ? getArrowMergeDropdownStyles({ position: tooltip.placement, dir })\n      : undefined;\n\n  if (target) {\n    const transition = getTransitionProps(transitionProps, { duration: 100, transition: 'fade' });\n    return (\n      <>\n        <OptionalPortal {...portalProps} withinPortal={withinPortal}>\n          <Transition\n            {...transition}\n            keepMounted={keepMounted}\n            mounted={!disabled && !!tooltip.opened}\n            duration={tooltip.isGroupPhase ? 10 : transition.duration}\n          >\n            {(transitionStyles) => (\n              <Box\n                {...others}\n                data-fixed={floatingStrategy === 'fixed' || undefined}\n                variant={variant}\n                mod={[{ multiline }, mod]}\n                {...tooltipStyles}\n                {...tooltip.getFloatingProps({\n                  ref: tooltip.floating,\n                  className: tooltipStyles.className,\n                  style: {\n                    ...tooltipStyles.style,\n                    ...transitionStyles,\n                    ...mergeStyles,\n                    zIndex: zIndex as React.CSSProperties['zIndex'],\n                    top: tooltip.y ?? 0,\n                    left: tooltip.x ?? 0,\n                  },\n                })}\n              >\n                {label}\n                <FloatingArrow\n                  ref={arrowRef}\n                  arrowX={tooltip.arrowX}\n                  arrowY={tooltip.arrowY}\n                  visible={withArrow}\n                  position={tooltip.placement}\n                  arrowSize={arrowSize!}\n                  arrowOffset={arrowOffset!}\n                  arrowRadius={arrowRadius!}\n                  arrowPosition={arrowPosition!}\n                  {...getStyles('arrow')}\n                />\n              </Box>\n            )}\n          </Transition>\n        </OptionalPortal>\n      </>\n    );\n  }\n\n  // fallback to children-based approach\n  const childProps = child!.props as any;\n  const targetRef = useMergedRef(tooltip.reference, getRefProp(child), ref);\n  const transition = getTransitionProps(transitionProps, { duration: 100, transition: 'fade' });\n\n  return (\n    <>\n      <OptionalPortal {...portalProps} withinPortal={withinPortal}>\n        <Transition\n          {...transition}\n          keepMounted={keepMounted}\n          mounted={!disabled && !!tooltip.opened}\n          duration={tooltip.isGroupPhase ? 10 : transition.duration}\n        >\n          {(transitionStyles) => (\n            <Box\n              {...others}\n              data-fixed={floatingStrategy === 'fixed' || undefined}\n              variant={variant}\n              mod={[{ multiline }, mod]}\n              {...tooltip.getFloatingProps({\n                ref: tooltip.floating,\n                className: getStyles('tooltip').className,\n                style: {\n                  ...getStyles('tooltip').style,\n                  ...transitionStyles,\n                  ...mergeStyles,\n                  zIndex: zIndex as React.CSSProperties['zIndex'],\n                  top: tooltip.y ?? 0,\n                  left: tooltip.x ?? 0,\n                },\n              })}\n            >\n              {label}\n              <FloatingArrow\n                ref={arrowRef}\n                arrowX={tooltip.arrowX}\n                arrowY={tooltip.arrowY}\n                visible={withArrow}\n                position={tooltip.placement}\n                arrowSize={arrowSize}\n                arrowOffset={arrowOffset}\n                arrowRadius={arrowRadius}\n                arrowPosition={arrowPosition}\n                {...getStyles('arrow')}\n              />\n            </Box>\n          )}\n        </Transition>\n      </OptionalPortal>\n\n      {cloneElement(\n        child!,\n        tooltip.getReferenceProps({\n          onClick,\n          onMouseEnter,\n          onMouseLeave,\n          onMouseMove: props.onMouseMove,\n          onPointerDown: props.onPointerDown,\n          onPointerEnter: props.onPointerEnter,\n          ...childProps,\n          className: cx(className, childProps.className),\n          [refProp]: targetRef,\n        })\n      )}\n    </>\n  );\n});\n\nTooltip.classes = classes;\nTooltip.varsResolver = varsResolver;\nTooltip.displayName = '@mantine/core/Tooltip';\nTooltip.Floating = TooltipFloating;\nTooltip.Group = TooltipGroup;\n\nexport namespace Tooltip {\n  export type Props = TooltipProps;\n  export type Factory = TooltipFactory;\n  export type CssVariables = TooltipCssVariables;\n  export type StylesNames = TooltipStylesNames;\n\n  export namespace Group {\n    export type Props = TooltipGroupProps;\n    export type ContextValue = TooltipGroupContextValue;\n  }\n\n  export namespace Floating {\n    export type Props = TooltipFloatingProps;\n  }\n}\n"],"mappings":"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"}

package/esm/components/Tooltip/use-tooltip.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-tooltip.mjs","names":["useId"],"sources":["../../../src/components/Tooltip/use-tooltip.ts"],"sourcesContent":["import { use, useCallback, useRef, useState } from 'react';\nimport {\n  arrow,\n  autoUpdate,\n  flip,\n  inline,\n  offset,\n  shift,\n  useDelayGroup,\n  useDismiss,\n  useFloating,\n  useFocus,\n  useHover,\n  useInteractions,\n  useRole,\n  type Middleware,\n} from '@floating-ui/react';\nimport { useId, useIsomorphicEffect } from '@mantine/hooks';\nimport { FloatingAxesOffsets, FloatingPosition, FloatingStrategy } from '../../utils/Floating';\nimport { type TooltipMiddlewares } from './Tooltip.types';\nimport { TooltipGroupContext } from './TooltipGroup/TooltipGroup';\n\ninterface UseTooltip {\n  position: FloatingPosition;\n  closeDelay?: number;\n  openDelay?: number;\n  onPositionChange?: (position: FloatingPosition) => void;\n  opened?: boolean;\n  defaultOpened?: boolean;\n  offset: number | FloatingAxesOffsets;\n  arrowRef?: React.RefObject<HTMLDivElement | null>;\n  arrowOffset?: number;\n  events?: { hover: boolean; focus: boolean; touch: boolean };\n  inline?: boolean;\n  strategy?: FloatingStrategy;\n  middlewares?: TooltipMiddlewares;\n}\n\nfunction getDefaultMiddlewares(middlewares: TooltipMiddlewares | undefined): TooltipMiddlewares {\n  if (middlewares === undefined) {\n    return { shift: true, flip: true };\n  }\n\n  const result = { ...middlewares };\n  if (middlewares.shift === undefined) {\n    result.shift = true;\n  }\n\n  if (middlewares.flip === undefined) {\n    result.flip = true;\n  }\n\n  return result;\n}\n\nfunction getTooltipMiddlewares(settings: UseTooltip) {\n  const middlewaresOptions = getDefaultMiddlewares(settings.middlewares);\n  const middlewares: Middleware[] = [offset(settings.offset)];\n\n  if (middlewaresOptions.shift) {\n    middlewares.push(\n      shift(\n        typeof middlewaresOptions.shift === 'boolean'\n          ? { padding: 8 }\n          : { padding: 8, ...middlewaresOptions.shift }\n      )\n    );\n  }\n\n  if (middlewaresOptions.flip) {\n    middlewares.push(\n      typeof middlewaresOptions.flip === 'boolean' ? flip() : flip(middlewaresOptions.flip)\n    );\n  }\n\n  middlewares.push(arrow({ element: settings.arrowRef!, padding: settings.arrowOffset }));\n\n  if (middlewaresOptions.inline) {\n    middlewares.push(\n      typeof middlewaresOptions.inline === 'boolean' ? inline() : inline(middlewaresOptions.inline)\n    );\n  } else if (settings.inline) {\n    middlewares.push(inline());\n  }\n\n  return middlewares;\n}\n\nexport function useTooltip(settings: UseTooltip) {\n  const [uncontrolledOpened, setUncontrolledOpened] = useState(settings.defaultOpened);\n  const controlled = typeof settings.opened === 'boolean';\n  const opened = controlled ? settings.opened : uncontrolledOpened;\n  const withinGroup = use(TooltipGroupContext).withinGroup;\n  const uid = useId();\n\n  const onChange = useCallback(\n    (_opened: boolean) => {\n      setUncontrolledOpened(_opened);\n\n      if (_opened) {\n        setCurrentId(uid);\n      }\n    },\n    [uid]\n  );\n\n  const {\n    x,\n    y,\n    context,\n    refs,\n    placement,\n    middlewareData: { arrow: { x: arrowX, y: arrowY } = {} },\n  } = useFloating({\n    strategy: settings.strategy,\n    placement: settings.position,\n    open: opened,\n    onOpenChange: onChange,\n    middleware: getTooltipMiddlewares(settings),\n    whileElementsMounted: autoUpdate,\n  });\n\n  const { delay: groupDelay, currentId, setCurrentId } = useDelayGroup(context, { id: uid });\n\n  const { getReferenceProps, getFloatingProps } = useInteractions([\n    useHover(context, {\n      enabled: settings.events?.hover,\n      delay: withinGroup ? groupDelay : { open: settings.openDelay, close: settings.closeDelay },\n      mouseOnly: !settings.events?.touch,\n    }),\n    useFocus(context, { enabled: settings.events?.focus, visibleOnly: true }),\n    useRole(context, { role: 'tooltip' }),\n    // Cannot be used with controlled tooltip, page jumps\n    useDismiss(context, { enabled: typeof settings.opened === 'undefined' }),\n  ]);\n\n  const previousPlacementRef = useRef(placement);\n  useIsomorphicEffect(() => {\n    if (previousPlacementRef.current !== placement) {\n      previousPlacementRef.current = placement;\n      settings.onPositionChange?.(placement);\n    }\n  }, [placement]);\n\n  const isGroupPhase = opened && currentId && currentId !== uid;\n\n  return {\n    x,\n    y,\n    arrowX,\n    arrowY,\n    reference: refs.setReference,\n    floating: refs.setFloating,\n    getFloatingProps,\n    getReferenceProps,\n    isGroupPhase,\n    opened,\n    placement,\n  };\n}\n"],"mappings":";;;;;;AAsCA,SAAS,sBAAsB,aAAiE;CAC9F,IAAI,gBAAgB,KAAA,GAClB,OAAO;EAAE,OAAO;EAAM,MAAM;CAAK;CAGnC,MAAM,SAAS,EAAE,GAAG,YAAY;CAChC,IAAI,YAAY,UAAU,KAAA,GACxB,OAAO,QAAQ;CAGjB,IAAI,YAAY,SAAS,KAAA,GACvB,OAAO,OAAO;CAGhB,OAAO;AACT;AAEA,SAAS,sBAAsB,UAAsB;CACnD,MAAM,qBAAqB,sBAAsB,SAAS,WAAW;CACrE,MAAM,cAA4B,CAAC,OAAO,SAAS,MAAM,CAAC;CAE1D,IAAI,mBAAmB,OACrB,YAAY,KACV,MACE,OAAO,mBAAmB,UAAU,YAChC,EAAE,SAAS,EAAE,IACb;EAAE,SAAS;EAAG,GAAG,mBAAmB;CAAM,CAChD,CACF;CAGF,IAAI,mBAAmB,MACrB,YAAY,KACV,OAAO,mBAAmB,SAAS,YAAY,KAAK,IAAI,KAAK,mBAAmB,IAAI,CACtF;CAGF,YAAY,KAAK,MAAM;EAAE,SAAS,SAAS;EAAW,SAAS,SAAS;CAAY,CAAC,CAAC;CAEtF,IAAI,mBAAmB,QACrB,YAAY,KACV,OAAO,mBAAmB,WAAW,YAAY,OAAO,IAAI,OAAO,mBAAmB,MAAM,CAC9F;MACK,IAAI,SAAS,QAClB,YAAY,KAAK,OAAO,CAAC;CAG3B,OAAO;AACT;AAEA,SAAgB,WAAW,UAAsB;CAC/C,MAAM,CAAC,oBAAoB,yBAAyB,SAAS,SAAS,aAAa;CAEnF,MAAM,SADa,OAAO,SAAS,WAAW,YAClB,SAAS,SAAS;CAC9C,MAAM,cAAc,IAAI,mBAAmB,EAAE;CAC7C,MAAM,MAAMA,QAAM;CAElB,MAAM,WAAW,aACd,YAAqB;EACpB,sBAAsB,OAAO;EAE7B,IAAI,SACF,aAAa,GAAG;CAEpB,GACA,CAAC,GAAG,CACN;CAEA,MAAM,EACJ,GACA,GACA,SACA,MACA,WACA,gBAAgB,EAAE,OAAO,EAAE,GAAG,QAAQ,GAAG,WAAW,CAAC,QACnD,YAAY;EACd,UAAU,SAAS;EACnB,WAAW,SAAS;EACpB,MAAM;EACN,cAAc;EACd,YAAY,sBAAsB,QAAQ;EAC1C,sBAAsB;CACxB,CAAC;CAED,MAAM,EAAE,OAAO,YAAY,WAAW,iBAAiB,cAAc,SAAS,EAAE,IAAI,IAAI,CAAC;CAEzF,MAAM,EAAE,mBAAmB,qBAAqB,gBAAgB;EAC9D,SAAS,SAAS;GAChB,SAAS,SAAS,QAAQ;GAC1B,OAAO,cAAc,aAAa;IAAE,MAAM,SAAS;IAAW,OAAO,SAAS;GAAW;GACzF,WAAW,CAAC,SAAS,QAAQ;EAC/B,CAAC;EACD,SAAS,SAAS;GAAE,SAAS,SAAS,QAAQ;GAAO,aAAa;EAAK,CAAC;EACxE,QAAQ,SAAS,EAAE,MAAM,UAAU,CAAC;EAEpC,WAAW,SAAS,EAAE,SAAS,OAAO,SAAS,WAAW,YAAY,CAAC;CACzE,CAAC;CAED,MAAM,uBAAuB,OAAO,SAAS;CAC7C,0BAA0B;EACxB,IAAI,qBAAqB,YAAY,WAAW;GAC9C,qBAAqB,UAAU;GAC/B,SAAS,mBAAmB,SAAS;EACvC;CACF,GAAG,CAAC,SAAS,CAAC;CAEd,MAAM,eAAe,UAAU,aAAa,cAAc;CAE1D,OAAO;EACL;EACA;EACA;EACA;EACA,WAAW,KAAK;EAChB,UAAU,KAAK;EACf;EACA;EACA;EACA;EACA;CACF;AACF"}
+{"version":3,"file":"use-tooltip.mjs","names":["useId"],"sources":["../../../src/components/Tooltip/use-tooltip.ts"],"sourcesContent":["import { use, useCallback, useRef, useState } from 'react';\nimport {\n  arrow,\n  autoUpdate,\n  flip,\n  inline,\n  offset,\n  shift,\n  useDelayGroup,\n  useDismiss,\n  useFloating,\n  useFocus,\n  useHover,\n  useInteractions,\n  useRole,\n  type Middleware,\n} from '@floating-ui/react';\nimport { useId, useIsomorphicEffect } from '@mantine/hooks';\nimport { FloatingAxesOffsets, FloatingPosition, FloatingStrategy } from '../../utils/Floating';\nimport { type TooltipMiddlewares } from './Tooltip.types';\nimport { TooltipGroupContext } from './TooltipGroup/TooltipGroup';\n\ninterface UseTooltip {\n  position: FloatingPosition;\n  closeDelay?: number;\n  openDelay?: number;\n  onPositionChange?: (position: FloatingPosition) => void;\n  opened?: boolean;\n  defaultOpened?: boolean;\n  offset: number | FloatingAxesOffsets;\n  arrowRef?: React.RefObject<HTMLDivElement | null>;\n  arrowOffset?: number;\n  events?: { hover: boolean; focus: boolean; touch: boolean };\n  inline?: boolean;\n  strategy?: FloatingStrategy;\n  middlewares?: TooltipMiddlewares;\n}\n\nfunction getDefaultMiddlewares(middlewares: TooltipMiddlewares | undefined): TooltipMiddlewares {\n  if (middlewares === undefined) {\n    return { shift: true, flip: true };\n  }\n\n  const result = { ...middlewares };\n  if (middlewares.shift === undefined) {\n    result.shift = true;\n  }\n\n  if (middlewares.flip === undefined) {\n    result.flip = true;\n  }\n\n  return result;\n}\n\nfunction getTooltipMiddlewares(settings: UseTooltip) {\n  const middlewaresOptions = getDefaultMiddlewares(settings.middlewares);\n  const middlewares: Middleware[] = [offset(settings.offset)];\n\n  if (middlewaresOptions.shift) {\n    middlewares.push(\n      shift(\n        typeof middlewaresOptions.shift === 'boolean'\n          ? { padding: 8 }\n          : { padding: 8, ...middlewaresOptions.shift }\n      )\n    );\n  }\n\n  if (middlewaresOptions.flip) {\n    middlewares.push(\n      typeof middlewaresOptions.flip === 'boolean' ? flip() : flip(middlewaresOptions.flip)\n    );\n  }\n\n  middlewares.push(arrow({ element: settings.arrowRef!, padding: settings.arrowOffset }));\n\n  if (middlewaresOptions.inline) {\n    middlewares.push(\n      typeof middlewaresOptions.inline === 'boolean' ? inline() : inline(middlewaresOptions.inline)\n    );\n  } else if (settings.inline) {\n    middlewares.push(inline());\n  }\n\n  return middlewares;\n}\n\nexport function useTooltip(settings: UseTooltip) {\n  const [uncontrolledOpened, setUncontrolledOpened] = useState(settings.defaultOpened);\n  const controlled = typeof settings.opened === 'boolean';\n  const opened = controlled ? settings.opened : uncontrolledOpened;\n  const withinGroup = use(TooltipGroupContext).withinGroup;\n  const uid = useId();\n\n  const onChange = useCallback(\n    (_opened: boolean) => {\n      setUncontrolledOpened(_opened);\n\n      if (_opened) {\n        setCurrentId(uid);\n      }\n    },\n    [uid]\n  );\n\n  const {\n    x,\n    y,\n    context,\n    refs,\n    placement,\n    middlewareData: { arrow: { x: arrowX, y: arrowY } = {} },\n  } = useFloating({\n    strategy: settings.strategy,\n    placement: settings.position,\n    open: opened,\n    onOpenChange: onChange,\n    middleware: getTooltipMiddlewares(settings),\n    whileElementsMounted: autoUpdate,\n  });\n\n  const { delay: groupDelay, currentId, setCurrentId } = useDelayGroup(context, { id: uid });\n\n  const { getReferenceProps, getFloatingProps } = useInteractions([\n    useHover(context, {\n      enabled: settings.events?.hover,\n      delay: withinGroup ? groupDelay : { open: settings.openDelay, close: settings.closeDelay },\n      mouseOnly: !settings.events?.touch,\n    }),\n    useFocus(context, { enabled: settings.events?.focus, visibleOnly: true }),\n    useRole(context, { role: 'tooltip' }),\n    // Cannot be used with controlled tooltip, page jumps\n    useDismiss(context, { enabled: typeof settings.opened === 'undefined' }),\n  ]);\n\n  const previousPlacementRef = useRef(placement);\n  useIsomorphicEffect(() => {\n    if (previousPlacementRef.current !== placement) {\n      previousPlacementRef.current = placement;\n      settings.onPositionChange?.(placement);\n    }\n  }, [placement]);\n\n  const isGroupPhase = opened && currentId && currentId !== uid;\n\n  return {\n    x,\n    y,\n    arrowX,\n    arrowY,\n    reference: refs.setReference,\n    floating: refs.setFloating,\n    getFloatingProps,\n    getReferenceProps,\n    isGroupPhase,\n    opened,\n    placement,\n  };\n}\n"],"mappings":";;;;;;AAsCA,SAAS,sBAAsB,aAAiE;CAC9F,IAAI,gBAAgB,KAAA,GAClB,OAAO;EAAE,OAAO;EAAM,MAAM;CAAK;CAGnC,MAAM,SAAS,EAAE,GAAG,YAAY;CAChC,IAAI,YAAY,UAAU,KAAA,GACxB,OAAO,QAAQ;CAGjB,IAAI,YAAY,SAAS,KAAA,GACvB,OAAO,OAAO;CAGhB,OAAO;AACT;AAEA,SAAS,sBAAsB,UAAsB;CACnD,MAAM,qBAAqB,sBAAsB,SAAS,WAAW;CACrE,MAAM,cAA4B,CAAC,OAAO,SAAS,MAAM,CAAC;CAE1D,IAAI,mBAAmB,OACrB,YAAY,KACV,MACE,OAAO,mBAAmB,UAAU,YAChC,EAAE,SAAS,EAAE,IACb;EAAE,SAAS;EAAG,GAAG,mBAAmB;CAAM,CAChD,CACF;CAGF,IAAI,mBAAmB,MACrB,YAAY,KACV,OAAO,mBAAmB,SAAS,YAAY,KAAK,IAAI,KAAK,mBAAmB,IAAI,CACtF;CAGF,YAAY,KAAK,MAAM;EAAE,SAAS,SAAS;EAAW,SAAS,SAAS;CAAY,CAAC,CAAC;CAEtF,IAAI,mBAAmB,QACrB,YAAY,KACV,OAAO,mBAAmB,WAAW,YAAY,OAAO,IAAI,OAAO,mBAAmB,MAAM,CAC9F;MACK,IAAI,SAAS,QAClB,YAAY,KAAK,OAAO,CAAC;CAG3B,OAAO;AACT;AAEA,SAAgB,WAAW,UAAsB;CAC/C,MAAM,CAAC,oBAAoB,yBAAyB,SAAS,SAAS,aAAa;CAEnF,MAAM,SADa,OAAO,SAAS,WAAW,YAClB,SAAS,SAAS;CAC9C,MAAM,cAAc,IAAI,mBAAmB,CAAC,CAAC;CAC7C,MAAM,MAAMA,QAAM;CAElB,MAAM,WAAW,aACd,YAAqB;EACpB,sBAAsB,OAAO;EAE7B,IAAI,SACF,aAAa,GAAG;CAEpB,GACA,CAAC,GAAG,CACN;CAEA,MAAM,EACJ,GACA,GACA,SACA,MACA,WACA,gBAAgB,EAAE,OAAO,EAAE,GAAG,QAAQ,GAAG,WAAW,CAAC,QACnD,YAAY;EACd,UAAU,SAAS;EACnB,WAAW,SAAS;EACpB,MAAM;EACN,cAAc;EACd,YAAY,sBAAsB,QAAQ;EAC1C,sBAAsB;CACxB,CAAC;CAED,MAAM,EAAE,OAAO,YAAY,WAAW,iBAAiB,cAAc,SAAS,EAAE,IAAI,IAAI,CAAC;CAEzF,MAAM,EAAE,mBAAmB,qBAAqB,gBAAgB;EAC9D,SAAS,SAAS;GAChB,SAAS,SAAS,QAAQ;GAC1B,OAAO,cAAc,aAAa;IAAE,MAAM,SAAS;IAAW,OAAO,SAAS;GAAW;GACzF,WAAW,CAAC,SAAS,QAAQ;EAC/B,CAAC;EACD,SAAS,SAAS;GAAE,SAAS,SAAS,QAAQ;GAAO,aAAa;EAAK,CAAC;EACxE,QAAQ,SAAS,EAAE,MAAM,UAAU,CAAC;EAEpC,WAAW,SAAS,EAAE,SAAS,OAAO,SAAS,WAAW,YAAY,CAAC;CACzE,CAAC;CAED,MAAM,uBAAuB,OAAO,SAAS;CAC7C,0BAA0B;EACxB,IAAI,qBAAqB,YAAY,WAAW;GAC9C,qBAAqB,UAAU;GAC/B,SAAS,mBAAmB,SAAS;EACvC;CACF,GAAG,CAAC,SAAS,CAAC;CAEd,MAAM,eAAe,UAAU,aAAa,cAAc;CAE1D,OAAO;EACL;EACA;EACA;EACA;EACA,WAAW,KAAK;EAChB,UAAU,KAAK;EACf;EACA;EACA;EACA;EACA;CACF;AACF"}