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

@mantine/core 9.3.1 → 9.4.0

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

Files changed (876) hide show

package/cjs/components/ThemeIcon/ThemeIcon.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ThemeIcon.cjs","names":["createVarsResolver","getSize","getRadius","factory","useProps","Box","useStyles","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,eAAeA,6BAAAA,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,aAAaC,iBAAAA,QAAQ,MAAM,SAAS;EACpC,eAAe,WAAW,KAAA,IAAY,KAAA,IAAYC,iBAAAA,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,YAAYC,gBAAAA,SAA2B,WAAW;CAC7D,MAAM,QAAQC,kBAAAA,SAAS,aAAa,MAAM,MAAM;CAChD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,cACA,YACA,GAAG,WACD;CAgBJ,OAAO,iBAAA,GAAA,kBAAA,~~KAACC~~,YAAAA,KAAD;EAAK,GAdMC,mBAAAA,UAA4B;GAC5C,MAAM;GACN,SAAA,yBAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,CAEwB,~~EAAE~~,MAAM;EAAG,GAAI;CAAS,CAAA;AAClD,CAAC;AAED,UAAU,UAAUC,yBAAAA;AACpB,UAAU,eAAe;AACzB,UAAU,cAAc"}
1	+ {"version":3,"file":"ThemeIcon.cjs","names":["createVarsResolver","getSize","getRadius","factory","useProps","Box","useStyles","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,eAAeA,6BAAAA,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,aAAaC,iBAAAA,QAAQ,MAAM,SAAS;EACpC,eAAe,WAAW,KAAA,IAAY,KAAA,IAAYC,iBAAAA,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,YAAYC,gBAAAA,SAA2B,WAAW;CAC7D,MAAM,QAAQC,kBAAAA,SAAS,aAAa,MAAM,MAAM;CAChD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,cACA,YACA,GAAG,WACD;CAgBJ,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAACC,YAAAA,KAAD;EAAK,GAdMC,mBAAAA,UAA4B;GAC5C,MAAM;GACN,SAAA,yBAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,CAEwB,CAAC,CAAC,MAAM;EAAG,GAAI;CAAS,CAAA;AAClD,CAAC;AAED,UAAU,UAAUC,yBAAAA;AACpB,UAAU,eAAe;AACzB,UAAU,cAAc"}

package/cjs/components/Timeline/Timeline.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Timeline.cjs","names":["createVarsResolver","rem","getRadius","getThemeColor","getAutoContrastValue","getContrastColor","factory","useProps","useStyles","Children","TimelineProvider","Box","classes","TimelineItem"],"sources":["../../../src/components/Timeline/Timeline.tsx"],"sourcesContent":["import { Children, cloneElement } from 'react';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getAutoContrastValue,\n getContrastColor,\n getRadius,\n getThemeColor,\n MantineColor,\n MantineRadius,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { TimelineProvider } from './Timeline.context';\nimport {\n TimelineItem,\n TimelineItemStylesNames,\n type TimelineItemProps,\n type TimelineItemFactory,\n} from './TimelineItem/TimelineItem';\nimport classes from './Timeline.module.css';\nexport type TimelineStylesNames = 'root' \| TimelineItemStylesNames;\nexport type TimelineCssVariables = {\n root: '--tl-line-width' \| '--tl-bullet-size' \| '--tl-color' \| '--tl-icon-color' \| '--tl-radius';\n};\n\nexport interface TimelineProps\n extends BoxProps, StylesApiProps<TimelineFactory>, ElementProps<'div'> {\n /** `Timeline.Item` components /\n children?: React.ReactNode;\n\n /* Index of the active element /\n active?: number;\n\n /* Key of `theme.colors` or any valid CSS color to control active item colors @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 'xl' /\n radius?: MantineRadius;\n\n /* Size of the bullet @default 20 /\n bulletSize?: number \| string;\n\n /* Position of content relative to the bullet @default 'left' /\n align?: 'right' \| 'left';\n\n /* Control width of the line /\n lineWidth?: number \| string;\n\n /* If set, the active items direction is reversed without reversing items order @default false /\n reverseActive?: boolean;\n\n /* If set, adjusts text color based on background color for `filled` variant */\n autoContrast?: boolean;\n}\n\nexport type TimelineFactory = Factory<{\n props: TimelineProps;\n ref: HTMLDivElement;\n stylesNames: TimelineStylesNames;\n vars: TimelineCssVariables;\n staticComponents: {\n Item: typeof TimelineItem;\n };\n}>;\n\nconst defaultProps = {\n active: -1,\n align: 'left',\n} satisfies Partial<TimelineProps>;\n\nconst varsResolver = createVarsResolver<TimelineFactory>(\n (theme, { bulletSize, lineWidth, radius, color, autoContrast }) => ({\n root: {\n '--tl-bullet-size': rem(bulletSize),\n '--tl-line-width': rem(lineWidth),\n '--tl-radius': radius === undefined ? undefined : getRadius(radius),\n '--tl-color': color ? getThemeColor(color, theme) : undefined,\n '--tl-icon-color': getAutoContrastValue(autoContrast, theme)\n ? getContrastColor({ color, theme, autoContrast })\n : undefined,\n },\n })\n);\n\nexport const Timeline = factory<TimelineFactory>((_props) => {\n const props = useProps('Timeline', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n active,\n color,\n radius,\n bulletSize,\n align,\n lineWidth,\n reverseActive,\n mod,\n autoContrast,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<TimelineFactory>({\n name: 'Timeline',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const _children = Children.toArray(children);\n const items = _children.map((item: any, index) =>\n cloneElement(item, {\n unstyled,\n __align: align,\n __active:\n item.props?.active \|\|\n (reverseActive ? active >= _children.length - index - 1 : active >= index),\n __lineActive:\n item.props?.lineActive \|\|\n (reverseActive ? active >= _children.length - index - 1 : active - 1 >= index),\n })\n );\n\n return (\n <TimelineProvider value={{ getStyles }}>\n <Box {...getStyles('root')} mod={[{ align }, mod]} {...others}>\n {items}\n </Box>\n </TimelineProvider>\n );\n});\n\nTimeline.classes = classes;\nTimeline.varsResolver = varsResolver;\nTimeline.displayName = '@mantine/core/Timeline';\nTimeline.Item = TimelineItem;\n\nexport namespace Timeline {\n export type Props = TimelineProps;\n export type StylesNames = TimelineStylesNames;\n export type CssVariables = TimelineCssVariables;\n export type Factory = TimelineFactory;\n\n export namespace Item {\n export type Props = TimelineItemProps;\n export type StylesNames = TimelineItemStylesNames;\n export type Factory = TimelineItemFactory;\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAwEA,MAAM,eAAe;CACnB,QAAQ;CACR,OAAO;AACT;AAEA,MAAM,eAAeA,6BAAAA,oBAClB,OAAO,EAAE,YAAY,WAAW,QAAQ,OAAO,oBAAoB,EAClE,MAAM;CACJ,oBAAoBC,YAAAA,IAAI,UAAU;CAClC,mBAAmBA,YAAAA,IAAI,SAAS;CAChC,eAAe,WAAW,KAAA,IAAY,KAAA,IAAYC,iBAAAA,UAAU,MAAM;CAClE,cAAc,QAAQC,wBAAAA,cAAc,OAAO,KAAK,IAAI,KAAA;CACpD,mBAAmBC,gCAAAA,qBAAqB,cAAc,KAAK,IACvDC,2BAAAA,iBAAiB;EAAE;EAAO;EAAO;CAAa,CAAC,IAC/C,KAAA;AACN,EACF,EACF;AAEA,MAAa,WAAWC,gBAAAA,SAA0B,WAAW;CAC3D,MAAM,QAAQC,kBAAAA,SAAS,YAAY,cAAc,MAAM;CACvD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,QACA,OACA,QACA,YACA,OACA,WACA,eACA,KACA,cACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAA2B;EAC3C,MAAM;EACN,SAAA,wBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,YAAYC,MAAAA,SAAS,QAAQ,QAAQ;CAC3C,MAAM,QAAQ,UAAU,KAAK,MAAW,WAAA,GAAA,MAAA,~~cACzB~~,MAAM;EACjB;EACA,SAAS;EACT,UACE,KAAK,OAAO,WACX,gBAAgB,UAAU,UAAU,SAAS,QAAQ,IAAI,UAAU;EACtE,cACE,KAAK,OAAO,eACX,gBAAgB,UAAU,UAAU,SAAS,QAAQ,IAAI,SAAS,KAAK;CAC5E,CAAC,CACH;CAEA,OACE,iBAAA,GAAA,kBAAA,~~KAACC~~,yBAAAA,kBAAD;EAAkB,OAAO,EAAE,UAAU;YACnC,iBAAA,GAAA,kBAAA,~~KAACC~~,YAAAA,KAAD;GAAK,GAAI,UAAU,MAAM;GAAG,KAAK,CAAC,EAAE,MAAM,GAAG,GAAG;GAAG,GAAI;aACpD;EACE,CAAA;CACW,CAAA;AAEtB,CAAC;AAED,SAAS,UAAUC,wBAAAA;AACnB,SAAS,eAAe;AACxB,SAAS,cAAc;AACvB,SAAS,OAAOC,qBAAAA"}
1	+ {"version":3,"file":"Timeline.cjs","names":["createVarsResolver","rem","getRadius","getThemeColor","getAutoContrastValue","getContrastColor","factory","useProps","useStyles","Children","TimelineProvider","Box","classes","TimelineItem"],"sources":["../../../src/components/Timeline/Timeline.tsx"],"sourcesContent":["import { Children, cloneElement } from 'react';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getAutoContrastValue,\n getContrastColor,\n getRadius,\n getThemeColor,\n MantineColor,\n MantineRadius,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { TimelineProvider } from './Timeline.context';\nimport {\n TimelineItem,\n TimelineItemStylesNames,\n type TimelineItemProps,\n type TimelineItemFactory,\n} from './TimelineItem/TimelineItem';\nimport classes from './Timeline.module.css';\nexport type TimelineStylesNames = 'root' \| TimelineItemStylesNames;\nexport type TimelineCssVariables = {\n root: '--tl-line-width' \| '--tl-bullet-size' \| '--tl-color' \| '--tl-icon-color' \| '--tl-radius';\n};\n\nexport interface TimelineProps\n extends BoxProps, StylesApiProps<TimelineFactory>, ElementProps<'div'> {\n /** `Timeline.Item` components /\n children?: React.ReactNode;\n\n /* Index of the active element /\n active?: number;\n\n /* Key of `theme.colors` or any valid CSS color to control active item colors @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 'xl' /\n radius?: MantineRadius;\n\n /* Size of the bullet @default 20 /\n bulletSize?: number \| string;\n\n /* Position of content relative to the bullet @default 'left' /\n align?: 'right' \| 'left';\n\n /* Control width of the line /\n lineWidth?: number \| string;\n\n /* If set, the active items direction is reversed without reversing items order @default false /\n reverseActive?: boolean;\n\n /* If set, adjusts text color based on background color for `filled` variant */\n autoContrast?: boolean;\n}\n\nexport type TimelineFactory = Factory<{\n props: TimelineProps;\n ref: HTMLDivElement;\n stylesNames: TimelineStylesNames;\n vars: TimelineCssVariables;\n staticComponents: {\n Item: typeof TimelineItem;\n };\n}>;\n\nconst defaultProps = {\n active: -1,\n align: 'left',\n} satisfies Partial<TimelineProps>;\n\nconst varsResolver = createVarsResolver<TimelineFactory>(\n (theme, { bulletSize, lineWidth, radius, color, autoContrast }) => ({\n root: {\n '--tl-bullet-size': rem(bulletSize),\n '--tl-line-width': rem(lineWidth),\n '--tl-radius': radius === undefined ? undefined : getRadius(radius),\n '--tl-color': color ? getThemeColor(color, theme) : undefined,\n '--tl-icon-color': getAutoContrastValue(autoContrast, theme)\n ? getContrastColor({ color, theme, autoContrast })\n : undefined,\n },\n })\n);\n\nexport const Timeline = factory<TimelineFactory>((_props) => {\n const props = useProps('Timeline', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n active,\n color,\n radius,\n bulletSize,\n align,\n lineWidth,\n reverseActive,\n mod,\n autoContrast,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<TimelineFactory>({\n name: 'Timeline',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const _children = Children.toArray(children);\n const items = _children.map((item: any, index) =>\n cloneElement(item, {\n unstyled,\n __align: align,\n __active:\n item.props?.active \|\|\n (reverseActive ? active >= _children.length - index - 1 : active >= index),\n __lineActive:\n item.props?.lineActive \|\|\n (reverseActive ? active >= _children.length - index - 1 : active - 1 >= index),\n })\n );\n\n return (\n <TimelineProvider value={{ getStyles }}>\n <Box {...getStyles('root')} mod={[{ align }, mod]} {...others}>\n {items}\n </Box>\n </TimelineProvider>\n );\n});\n\nTimeline.classes = classes;\nTimeline.varsResolver = varsResolver;\nTimeline.displayName = '@mantine/core/Timeline';\nTimeline.Item = TimelineItem;\n\nexport namespace Timeline {\n export type Props = TimelineProps;\n export type StylesNames = TimelineStylesNames;\n export type CssVariables = TimelineCssVariables;\n export type Factory = TimelineFactory;\n\n export namespace Item {\n export type Props = TimelineItemProps;\n export type StylesNames = TimelineItemStylesNames;\n export type Factory = TimelineItemFactory;\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAwEA,MAAM,eAAe;CACnB,QAAQ;CACR,OAAO;AACT;AAEA,MAAM,eAAeA,6BAAAA,oBAClB,OAAO,EAAE,YAAY,WAAW,QAAQ,OAAO,oBAAoB,EAClE,MAAM;CACJ,oBAAoBC,YAAAA,IAAI,UAAU;CAClC,mBAAmBA,YAAAA,IAAI,SAAS;CAChC,eAAe,WAAW,KAAA,IAAY,KAAA,IAAYC,iBAAAA,UAAU,MAAM;CAClE,cAAc,QAAQC,wBAAAA,cAAc,OAAO,KAAK,IAAI,KAAA;CACpD,mBAAmBC,gCAAAA,qBAAqB,cAAc,KAAK,IACvDC,2BAAAA,iBAAiB;EAAE;EAAO;EAAO;CAAa,CAAC,IAC/C,KAAA;AACN,EACF,EACF;AAEA,MAAa,WAAWC,gBAAAA,SAA0B,WAAW;CAC3D,MAAM,QAAQC,kBAAAA,SAAS,YAAY,cAAc,MAAM;CACvD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,QACA,OACA,QACA,YACA,OACA,WACA,eACA,KACA,cACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAA2B;EAC3C,MAAM;EACN,SAAA,wBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,YAAYC,MAAAA,SAAS,QAAQ,QAAQ;CAC3C,MAAM,QAAQ,UAAU,KAAK,MAAW,WAAA,GAAA,MAAA,aAAA,CACzB,MAAM;EACjB;EACA,SAAS;EACT,UACE,KAAK,OAAO,WACX,gBAAgB,UAAU,UAAU,SAAS,QAAQ,IAAI,UAAU;EACtE,cACE,KAAK,OAAO,eACX,gBAAgB,UAAU,UAAU,SAAS,QAAQ,IAAI,SAAS,KAAK;CAC5E,CAAC,CACH;CAEA,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,yBAAAA,kBAAD;EAAkB,OAAO,EAAE,UAAU;YACnC,iBAAA,GAAA,kBAAA,IAAA,CAACC,YAAAA,KAAD;GAAK,GAAI,UAAU,MAAM;GAAG,KAAK,CAAC,EAAE,MAAM,GAAG,GAAG;GAAG,GAAI;aACpD;EACE,CAAA;CACW,CAAA;AAEtB,CAAC;AAED,SAAS,UAAUC,wBAAAA;AACnB,SAAS,eAAe;AACxB,SAAS,cAAc;AACvB,SAAS,OAAOC,qBAAAA"}

package/cjs/components/Timeline/Timeline.context.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Timeline.context.cjs","names":["createSafeContext"],"sources":["../../../src/components/Timeline/Timeline.context.ts"],"sourcesContent":["import { createSafeContext, GetStylesApi } from '../../core';\nimport type { TimelineFactory } from './Timeline';\n\ninterface TimelineContextValue {\n getStyles: GetStylesApi<TimelineFactory>;\n}\n\nexport const [TimelineProvider, useTimelineContext] = createSafeContext<TimelineContextValue>(\n 'Timeline component was not found in tree'\n);\n"],"mappings":";;AAOA,MAAa,CAAC,kBAAkB,4FAAsBA,~~EAAAA~~,kBACpD,0CACF"}
1	+ {"version":3,"file":"Timeline.context.cjs","names":["createSafeContext"],"sources":["../../../src/components/Timeline/Timeline.context.ts"],"sourcesContent":["import { createSafeContext, GetStylesApi } from '../../core';\nimport type { TimelineFactory } from './Timeline';\n\ninterface TimelineContextValue {\n getStyles: GetStylesApi<TimelineFactory>;\n}\n\nexport const [TimelineProvider, useTimelineContext] = createSafeContext<TimelineContextValue>(\n 'Timeline component was not found in tree'\n);\n"],"mappings":";;AAOA,MAAa,CAAC,kBAAkB,4FAAsBA,CAAAA,CAAAA,kBACpD,0CACF"}

package/cjs/components/Timeline/TimelineItem/TimelineItem.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TimelineItem.cjs","names":["factory","useProps","useTimelineContext","useMantineTheme","Box","getRadius","getThemeColor","classes"],"sources":["../../../../src/components/Timeline/TimelineItem/TimelineItem.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n CompoundStylesApiProps,\n ElementProps,\n factory,\n Factory,\n getRadius,\n getThemeColor,\n MantineColor,\n MantineRadius,\n useMantineTheme,\n useProps,\n} from '../../../core';\nimport { useTimelineContext } from '../Timeline.context';\nimport classes from '../Timeline.module.css';\n\nexport type TimelineItemStylesNames =\n \| 'itemBody'\n \| 'itemContent'\n \| 'itemBullet'\n \| 'item'\n \| 'itemTitle';\n\nexport interface TimelineItemProps\n extends BoxProps, CompoundStylesApiProps<TimelineItemFactory>, ElementProps<'div', 'title'> {\n __active?: boolean;\n __lineActive?: boolean;\n __align?: 'right' \| 'left';\n\n /** Item title, displayed next to the bullet /\n title?: React.ReactNode;\n\n /* Content displayed below the title /\n children?: React.ReactNode;\n\n /* React node that should be rendered inside the bullet – icon, image, avatar, etc. By default, large white dot is displayed. /\n bullet?: React.ReactNode;\n\n /* Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem @default 'xl' /\n radius?: MantineRadius;\n\n /* Key of `theme.colors` or any valid CSS color to control active item colors @default theme.primaryColor /\n color?: MantineColor;\n\n /* Controls line border style @default 'solid' */\n lineVariant?: 'solid' \| 'dashed' \| 'dotted';\n}\n\nexport type TimelineItemFactory = Factory<{\n props: TimelineItemProps;\n ref: HTMLDivElement;\n stylesNames: TimelineItemStylesNames;\n compound: true;\n}>;\n\nexport const TimelineItem = factory<TimelineItemFactory>((_props) => {\n const props = useProps('TimelineItem', null, _props);\n const {\n classNames,\n className,\n style,\n styles,\n vars,\n __active,\n __align,\n __lineActive,\n __vars,\n bullet,\n radius,\n color,\n lineVariant,\n children,\n title,\n mod,\n ...others\n } = props;\n\n const ctx = useTimelineContext();\n const theme = useMantineTheme();\n\n const stylesApiProps = { classNames, styles };\n\n return (\n <Box\n {...ctx.getStyles('item', { ...stylesApiProps, className, style })}\n mod={[{ 'line-active': __lineActive, active: __active }, mod]}\n __vars={{\n '--tli-radius': radius !== undefined ? getRadius(radius) : undefined,\n '--tli-color': color ? getThemeColor(color, theme) : undefined,\n '--tli-border-style': lineVariant \|\| undefined,\n }}\n {...others}\n >\n <Box\n {...ctx.getStyles('itemBullet', stylesApiProps)}\n mod={{ 'with-child': !!bullet, align: __align, active: __active }}\n >\n {bullet}\n </Box>\n\n <div {...ctx.getStyles('itemBody', stylesApiProps)}>\n {title && <div {...ctx.getStyles('itemTitle', stylesApiProps)}>{title}</div>}\n <div {...ctx.getStyles('itemContent', stylesApiProps)}>{children}</div>\n </div>\n </Box>\n );\n});\n\nTimelineItem.classes = classes;\nTimelineItem.displayName = '@mantine/core/TimelineItem';\n"],"mappings":";;;;;;;;;;;AAwDA,MAAa,eAAeA,gBAAAA,SAA8B,WAAW;CAEnE,MAAM,EACJ,YACA,WACA,OACA,QACA,MACA,UACA,SACA,cACA,QACA,QACA,QACA,OACA,aACA,UACA,OACA,KACA,GAAG,WAlBSC,kBAAAA,SAAS,gBAAgB,MAAM,MAmBrC;CAER,MAAM,MAAMC,yBAAAA,mBAAmB;CAC/B,MAAM,QAAQC,6BAAAA,gBAAgB;CAE9B,MAAM,iBAAiB;EAAE;EAAY;CAAO;CAE5C,OACE,iBAAA,GAAA,kBAAA,~~MAACC~~,YAAAA,KAAD;EACE,GAAI,IAAI,UAAU,QAAQ;GAAE,GAAG;GAAgB;GAAW;EAAM,CAAC;EACjE,KAAK,CAAC;GAAE,eAAe;GAAc,QAAQ;EAAS,GAAG,GAAG;EAC5D,QAAQ;GACN,gBAAgB,WAAW,KAAA,IAAYC,iBAAAA,UAAU,MAAM,IAAI,KAAA;GAC3D,eAAe,QAAQC,wBAAAA,cAAc,OAAO,KAAK,IAAI,KAAA;GACrD,sBAAsB,eAAe,KAAA;EACvC;EACA,GAAI;YARN,CAUE,iBAAA,GAAA,kBAAA,~~KAACF~~,YAAAA,KAAD;GACE,GAAI,IAAI,UAAU,cAAc,cAAc;GAC9C,KAAK;IAAE,cAAc,CAAC,CAAC;IAAQ,OAAO;IAAS,QAAQ;GAAS;aAE/D;EACE,CAAA,GAEL,iBAAA,GAAA,kBAAA,~~MAAC~~,OAAD;GAAK,GAAI,IAAI,UAAU,YAAY,cAAc;aAAjD,CACG,SAAS,iBAAA,GAAA,kBAAA,~~KAAC~~,OAAD;IAAK,GAAI,IAAI,UAAU,aAAa,cAAc;cAAI;GAAW,CAAA,GAC3E,iBAAA,GAAA,kBAAA,~~KAAC~~,OAAD;IAAK,GAAI,IAAI,UAAU,eAAe,cAAc;IAAI;GAAc,CAAA,CACnE;IACF;;AAET,CAAC;AAED,aAAa,UAAUG,wBAAAA;AACvB,aAAa,cAAc"}
1	+ {"version":3,"file":"TimelineItem.cjs","names":["factory","useProps","useTimelineContext","useMantineTheme","Box","getRadius","getThemeColor","classes"],"sources":["../../../../src/components/Timeline/TimelineItem/TimelineItem.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n CompoundStylesApiProps,\n ElementProps,\n factory,\n Factory,\n getRadius,\n getThemeColor,\n MantineColor,\n MantineRadius,\n useMantineTheme,\n useProps,\n} from '../../../core';\nimport { useTimelineContext } from '../Timeline.context';\nimport classes from '../Timeline.module.css';\n\nexport type TimelineItemStylesNames =\n \| 'itemBody'\n \| 'itemContent'\n \| 'itemBullet'\n \| 'item'\n \| 'itemTitle';\n\nexport interface TimelineItemProps\n extends BoxProps, CompoundStylesApiProps<TimelineItemFactory>, ElementProps<'div', 'title'> {\n __active?: boolean;\n __lineActive?: boolean;\n __align?: 'right' \| 'left';\n\n /** Item title, displayed next to the bullet /\n title?: React.ReactNode;\n\n /* Content displayed below the title /\n children?: React.ReactNode;\n\n /* React node that should be rendered inside the bullet – icon, image, avatar, etc. By default, large white dot is displayed. /\n bullet?: React.ReactNode;\n\n /* Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem @default 'xl' /\n radius?: MantineRadius;\n\n /* Key of `theme.colors` or any valid CSS color to control active item colors @default theme.primaryColor /\n color?: MantineColor;\n\n /* Controls line border style @default 'solid' */\n lineVariant?: 'solid' \| 'dashed' \| 'dotted';\n}\n\nexport type TimelineItemFactory = Factory<{\n props: TimelineItemProps;\n ref: HTMLDivElement;\n stylesNames: TimelineItemStylesNames;\n compound: true;\n}>;\n\nexport const TimelineItem = factory<TimelineItemFactory>((_props) => {\n const props = useProps('TimelineItem', null, _props);\n const {\n classNames,\n className,\n style,\n styles,\n vars,\n __active,\n __align,\n __lineActive,\n __vars,\n bullet,\n radius,\n color,\n lineVariant,\n children,\n title,\n mod,\n ...others\n } = props;\n\n const ctx = useTimelineContext();\n const theme = useMantineTheme();\n\n const stylesApiProps = { classNames, styles };\n\n return (\n <Box\n {...ctx.getStyles('item', { ...stylesApiProps, className, style })}\n mod={[{ 'line-active': __lineActive, active: __active }, mod]}\n __vars={{\n '--tli-radius': radius !== undefined ? getRadius(radius) : undefined,\n '--tli-color': color ? getThemeColor(color, theme) : undefined,\n '--tli-border-style': lineVariant \|\| undefined,\n }}\n {...others}\n >\n <Box\n {...ctx.getStyles('itemBullet', stylesApiProps)}\n mod={{ 'with-child': !!bullet, align: __align, active: __active }}\n >\n {bullet}\n </Box>\n\n <div {...ctx.getStyles('itemBody', stylesApiProps)}>\n {title && <div {...ctx.getStyles('itemTitle', stylesApiProps)}>{title}</div>}\n <div {...ctx.getStyles('itemContent', stylesApiProps)}>{children}</div>\n </div>\n </Box>\n );\n});\n\nTimelineItem.classes = classes;\nTimelineItem.displayName = '@mantine/core/TimelineItem';\n"],"mappings":";;;;;;;;;;;AAwDA,MAAa,eAAeA,gBAAAA,SAA8B,WAAW;CAEnE,MAAM,EACJ,YACA,WACA,OACA,QACA,MACA,UACA,SACA,cACA,QACA,QACA,QACA,OACA,aACA,UACA,OACA,KACA,GAAG,WAlBSC,kBAAAA,SAAS,gBAAgB,MAAM,MAmBrC;CAER,MAAM,MAAMC,yBAAAA,mBAAmB;CAC/B,MAAM,QAAQC,6BAAAA,gBAAgB;CAE9B,MAAM,iBAAiB;EAAE;EAAY;CAAO;CAE5C,OACE,iBAAA,GAAA,kBAAA,KAAA,CAACC,YAAAA,KAAD;EACE,GAAI,IAAI,UAAU,QAAQ;GAAE,GAAG;GAAgB;GAAW;EAAM,CAAC;EACjE,KAAK,CAAC;GAAE,eAAe;GAAc,QAAQ;EAAS,GAAG,GAAG;EAC5D,QAAQ;GACN,gBAAgB,WAAW,KAAA,IAAYC,iBAAAA,UAAU,MAAM,IAAI,KAAA;GAC3D,eAAe,QAAQC,wBAAAA,cAAc,OAAO,KAAK,IAAI,KAAA;GACrD,sBAAsB,eAAe,KAAA;EACvC;EACA,GAAI;YARN,CAUE,iBAAA,GAAA,kBAAA,IAAA,CAACF,YAAAA,KAAD;GACE,GAAI,IAAI,UAAU,cAAc,cAAc;GAC9C,KAAK;IAAE,cAAc,CAAC,CAAC;IAAQ,OAAO;IAAS,QAAQ;GAAS;aAE/D;EACE,CAAA,GAEL,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;GAAK,GAAI,IAAI,UAAU,YAAY,cAAc;aAAjD,CACG,SAAS,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;IAAK,GAAI,IAAI,UAAU,aAAa,cAAc;cAAI;GAAW,CAAA,GAC3E,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;IAAK,GAAI,IAAI,UAAU,eAAe,cAAc;IAAI;GAAc,CAAA,CACnE;IACF;;AAET,CAAC;AAED,aAAa,UAAUG,wBAAAA;AACvB,aAAa,cAAc"}

package/cjs/components/Title/Title.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Title.cjs","names":["createVarsResolver","getTitleSize","factory","useProps","useStyles","Box","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,eAAeA,6BAAAA,oBAAkC,GAAG,EAAE,OAAO,MAAM,WAAW,eAAe;CACjG,MAAM,gBAAgBC,uBAAAA,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,QAAQC,gBAAAA,SAAuB,WAAW;CACrD,MAAM,QAAQC,kBAAAA,SAAS,SAAS,cAAc,MAAM;CACpD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,OACA,MACA,MACA,SACA,WACA,UACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAAwB;EACxC,MAAM;EACN;EACA,SAAA,qBAAA;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,iBAAA,GAAA,kBAAA,~~KAACC~~,YAAAA,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,UAAUC,qBAAAA;AAChB,MAAM,eAAe;AACrB,MAAM,cAAc"}
1	+ {"version":3,"file":"Title.cjs","names":["createVarsResolver","getTitleSize","factory","useProps","useStyles","Box","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,eAAeA,6BAAAA,oBAAkC,GAAG,EAAE,OAAO,MAAM,WAAW,eAAe;CACjG,MAAM,gBAAgBC,uBAAAA,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,QAAQC,gBAAAA,SAAuB,WAAW;CACrD,MAAM,QAAQC,kBAAAA,SAAS,SAAS,cAAc,MAAM;CACpD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,OACA,MACA,MACA,SACA,WACA,UACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAAwB;EACxC,MAAM;EACN;EACA,SAAA,qBAAA;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,iBAAA,GAAA,kBAAA,IAAA,CAACC,YAAAA,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,UAAUC,qBAAAA;AAChB,MAAM,eAAe;AACrB,MAAM,cAAc"}

package/cjs/components/Tooltip/Tooltip.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tooltip.cjs","names":["getDefaultZIndex","createVarsResolver","getRadius","factory","useProps","useDirection","useTooltip","getFloatingPosition","useStyles","getSingleElementChild","getArrowMergeDropdownStyles","getTransitionProps","OptionalPortal","Transition","Box","FloatingArrow","getRefProp","classes","TooltipFloating","TooltipGroup"],"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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"}
1	+ {"version":3,"file":"Tooltip.cjs","names":["getDefaultZIndex","createVarsResolver","getRadius","factory","useProps","useDirection","useTooltip","getFloatingPosition","useStyles","getSingleElementChild","getArrowMergeDropdownStyles","getTransitionProps","OptionalPortal","Transition","Box","FloatingArrow","getRefProp","classes","TooltipFloating","TooltipGroup"],"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/cjs/components/Tooltip/TooltipFloating/TooltipFloating.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TooltipFloating.cjs","names":["getDefaultZIndex","createVarsResolver","getRadius","getThemeColor","factory","useProps","useMantineTheme","useStyles","useFloatingTooltip","getSingleElementChild","getRefProp","OptionalPortal","Box","getStyleObject","classes"],"sources":["../../../../src/components/Tooltip/TooltipFloating/TooltipFloating.tsx"],"sourcesContent":["import { cloneElement } from 'react';\nimport { useMergedRef } from '@mantine/hooks';\nimport {\n Box,\n createVarsResolver,\n factory,\n Factory,\n getDefaultZIndex,\n getRadius,\n getRefProp,\n getSingleElementChild,\n getStyleObject,\n getThemeColor,\n useMantineTheme,\n useProps,\n useStyles,\n} from '../../../core';\nimport { OptionalPortal } from '../../Portal';\nimport { TooltipBaseProps, TooltipCssVariables, TooltipStylesNames } from '../Tooltip.types';\nimport { useFloatingTooltip } from './use-floating-tooltip';\nimport classes from '../Tooltip.module.css';\n\nexport interface TooltipFloatingProps extends TooltipBaseProps {\n /** Offset from mouse in px @default 10 /\n offset?: number;\n\n /* Uncontrolled tooltip initial opened state */\n defaultOpened?: boolean;\n}\n\nexport type TooltipFloatingFactory = Factory<{\n props: TooltipFloatingProps;\n ref: HTMLDivElement;\n stylesNames: TooltipStylesNames;\n vars: TooltipCssVariables;\n}>;\n\nconst defaultProps = {\n refProp: 'ref',\n withinPortal: true,\n offset: 10,\n position: 'right',\n zIndex: getDefaultZIndex('popover'),\n} satisfies Partial<TooltipFloatingProps>;\n\nconst varsResolver = createVarsResolver<TooltipFloatingFactory>((theme, { radius, color }) => ({\n tooltip: {\n '--tooltip-radius': radius === undefined ? undefined : getRadius(radius),\n '--tooltip-bg': color ? getThemeColor(color, theme) : undefined,\n '--tooltip-color': color ? 'var(--mantine-color-white)' : undefined,\n },\n}));\n\nexport const TooltipFloating = factory<TooltipFloatingFactory>((_props) => {\n const props = useProps('TooltipFloating', defaultProps, _props);\n const {\n children,\n refProp,\n withinPortal,\n style,\n className,\n classNames,\n styles,\n unstyled,\n radius,\n color,\n label,\n offset,\n position,\n multiline,\n zIndex,\n disabled,\n defaultOpened,\n variant,\n vars,\n portalProps,\n attributes,\n ref,\n ...others\n } = props;\n\n const theme = useMantineTheme();\n const getStyles = useStyles<TooltipFloatingFactory>({\n name: 'TooltipFloating',\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 { handleMouseMove, x, y, opened, boundaryRef, floating, setOpened } = useFloatingTooltip({\n offset,\n position,\n defaultOpened,\n });\n\n const child = getSingleElementChild(children);\n if (!child) {\n throw new Error(\n '[@mantine/core] Tooltip.Floating 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 targetRef = useMergedRef(boundaryRef, getRefProp(child), ref);\n const childProps = child.props as any;\n\n const onMouseEnter = (event: React.MouseEvent<unknown, MouseEvent>) => {\n childProps.onMouseEnter?.(event);\n handleMouseMove(event);\n setOpened(true);\n };\n\n const onMouseLeave = (event: React.MouseEvent<unknown, MouseEvent>) => {\n childProps.onMouseLeave?.(event);\n setOpened(false);\n };\n\n return (\n <>\n <OptionalPortal {...portalProps} withinPortal={withinPortal}>\n <Box\n {...others}\n {...getStyles('tooltip', {\n style: {\n ...getStyleObject(style, theme),\n zIndex: zIndex as React.CSSProperties['zIndex'],\n display: !disabled && opened ? 'block' : 'none',\n top: (y && Math.round(y)) ?? '',\n left: (x && Math.round(x)) ?? '',\n },\n })}\n variant={variant}\n ref={floating}\n mod={{ multiline }}\n >\n {label}\n </Box>\n </OptionalPortal>\n\n {cloneElement(child, {\n ...childProps,\n [refProp]: targetRef,\n onMouseEnter,\n onMouseLeave,\n })}\n </>\n );\n});\n\nTooltipFloating.classes = classes;\nTooltipFloating.varsResolver = varsResolver;\nTooltipFloating.displayName = '@mantine/core/TooltipFloating';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAqCA,MAAM,eAAe;CACnB,SAAS;CACT,cAAc;CACd,QAAQ;CACR,UAAU;CACV,QAAQA,4BAAAA,iBAAiB,SAAS;AACpC;AAEA,MAAM,eAAeC,6BAAAA,oBAA4C,OAAO,EAAE,QAAQ,aAAa,EAC7F,SAAS;CACP,oBAAoB,WAAW,KAAA,IAAY,KAAA,IAAYC,iBAAAA,UAAU,MAAM;CACvE,gBAAgB,QAAQC,wBAAAA,cAAc,OAAO,KAAK,IAAI,KAAA;CACtD,mBAAmB,QAAQ,+BAA+B,KAAA;AAC5D,EACF,EAAE;AAEF,MAAa,kBAAkBC,gBAAAA,SAAiC,WAAW;CACzE,MAAM,QAAQC,kBAAAA,SAAS,mBAAmB,cAAc,MAAM;CAC9D,MAAM,EACJ,UACA,SACA,cACA,OACA,WACA,YACA,QACA,UACA,QACA,OACA,OACA,QACA,UACA,WACA,QACA,UACA,eACA,SACA,MACA,aACA,YACA,KACA,GAAG,WACD;CAEJ,MAAM,QAAQC,6BAAAA,gBAAgB;CAC9B,MAAM,YAAYC,mBAAAA,UAAkC;EAClD,MAAM;EACN;EACA,SAAA,uBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;EACd;EACA;CACF,CAAC;CAED,MAAM,EAAE,iBAAiB,GAAG,GAAG,QAAQ,aAAa,UAAU,cAAcC,6BAAAA,mBAAmB;EAC7F;EACA;EACA;CACF,CAAC;CAED,MAAM,QAAQC,iCAAAA,sBAAsB,QAAQ;CAC5C,IAAI,CAAC,OACH,MAAM,IAAI,MACR,oLACF;CAGF,MAAM,aAAA,GAAA,eAAA,~~cAAyB~~,aAAaC,qBAAAA,WAAW,KAAK,GAAG,GAAG;CAClE,MAAM,aAAa,MAAM;CAEzB,MAAM,gBAAgB,UAAiD;EACrE,WAAW,eAAe,KAAK;EAC/B,gBAAgB,KAAK;EACrB,UAAU,IAAI;CAChB;CAEA,MAAM,gBAAgB,UAAiD;EACrE,WAAW,eAAe,KAAK;EAC/B,UAAU,KAAK;CACjB;CAEA,OACE,iBAAA,GAAA,kBAAA,~~MAAA~~,kBAAA,UAAA,EAAA,UAAA,CACE,iBAAA,GAAA,kBAAA,~~KAACC~~,uBAAAA,gBAAD;EAAgB,GAAI;EAA2B;YAC7C,iBAAA,GAAA,kBAAA,~~KAACC~~,YAAAA,KAAD;GACE,GAAI;GACJ,GAAI,UAAU,WAAW,EACvB,OAAO;IACL,GAAGC,yBAAAA,eAAe,OAAO,KAAK;IACtB;IACR,SAAS,CAAC,YAAY,SAAS,UAAU;IACzC,MAAM,KAAK,KAAK,MAAM,CAAC,MAAM;IAC7B,OAAO,KAAK,KAAK,MAAM,CAAC,MAAM;GAChC,EACF,CAAC;GACQ;GACT,KAAK;GACL,KAAK,EAAE,UAAU;aAEhB;EACE,CAAA;CACS,CAAA,IAAA,GAAA,MAAA,~~cAEF~~,OAAO;EACnB,GAAG;GACF,UAAU;EACX;EACA;CACF,CAAC,CACD,EAAA,CAAA;AAEN,CAAC;AAED,gBAAgB,UAAUC,uBAAAA;AAC1B,gBAAgB,eAAe;AAC/B,gBAAgB,cAAc"}
1	+ {"version":3,"file":"TooltipFloating.cjs","names":["getDefaultZIndex","createVarsResolver","getRadius","getThemeColor","factory","useProps","useMantineTheme","useStyles","useFloatingTooltip","getSingleElementChild","getRefProp","OptionalPortal","Box","getStyleObject","classes"],"sources":["../../../../src/components/Tooltip/TooltipFloating/TooltipFloating.tsx"],"sourcesContent":["import { cloneElement } from 'react';\nimport { useMergedRef } from '@mantine/hooks';\nimport {\n Box,\n createVarsResolver,\n factory,\n Factory,\n getDefaultZIndex,\n getRadius,\n getRefProp,\n getSingleElementChild,\n getStyleObject,\n getThemeColor,\n useMantineTheme,\n useProps,\n useStyles,\n} from '../../../core';\nimport { OptionalPortal } from '../../Portal';\nimport { TooltipBaseProps, TooltipCssVariables, TooltipStylesNames } from '../Tooltip.types';\nimport { useFloatingTooltip } from './use-floating-tooltip';\nimport classes from '../Tooltip.module.css';\n\nexport interface TooltipFloatingProps extends TooltipBaseProps {\n /** Offset from mouse in px @default 10 /\n offset?: number;\n\n /* Uncontrolled tooltip initial opened state */\n defaultOpened?: boolean;\n}\n\nexport type TooltipFloatingFactory = Factory<{\n props: TooltipFloatingProps;\n ref: HTMLDivElement;\n stylesNames: TooltipStylesNames;\n vars: TooltipCssVariables;\n}>;\n\nconst defaultProps = {\n refProp: 'ref',\n withinPortal: true,\n offset: 10,\n position: 'right',\n zIndex: getDefaultZIndex('popover'),\n} satisfies Partial<TooltipFloatingProps>;\n\nconst varsResolver = createVarsResolver<TooltipFloatingFactory>((theme, { radius, color }) => ({\n tooltip: {\n '--tooltip-radius': radius === undefined ? undefined : getRadius(radius),\n '--tooltip-bg': color ? getThemeColor(color, theme) : undefined,\n '--tooltip-color': color ? 'var(--mantine-color-white)' : undefined,\n },\n}));\n\nexport const TooltipFloating = factory<TooltipFloatingFactory>((_props) => {\n const props = useProps('TooltipFloating', defaultProps, _props);\n const {\n children,\n refProp,\n withinPortal,\n style,\n className,\n classNames,\n styles,\n unstyled,\n radius,\n color,\n label,\n offset,\n position,\n multiline,\n zIndex,\n disabled,\n defaultOpened,\n variant,\n vars,\n portalProps,\n attributes,\n ref,\n ...others\n } = props;\n\n const theme = useMantineTheme();\n const getStyles = useStyles<TooltipFloatingFactory>({\n name: 'TooltipFloating',\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 { handleMouseMove, x, y, opened, boundaryRef, floating, setOpened } = useFloatingTooltip({\n offset,\n position,\n defaultOpened,\n });\n\n const child = getSingleElementChild(children);\n if (!child) {\n throw new Error(\n '[@mantine/core] Tooltip.Floating 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 targetRef = useMergedRef(boundaryRef, getRefProp(child), ref);\n const childProps = child.props as any;\n\n const onMouseEnter = (event: React.MouseEvent<unknown, MouseEvent>) => {\n childProps.onMouseEnter?.(event);\n handleMouseMove(event);\n setOpened(true);\n };\n\n const onMouseLeave = (event: React.MouseEvent<unknown, MouseEvent>) => {\n childProps.onMouseLeave?.(event);\n setOpened(false);\n };\n\n return (\n <>\n <OptionalPortal {...portalProps} withinPortal={withinPortal}>\n <Box\n {...others}\n {...getStyles('tooltip', {\n style: {\n ...getStyleObject(style, theme),\n zIndex: zIndex as React.CSSProperties['zIndex'],\n display: !disabled && opened ? 'block' : 'none',\n top: (y && Math.round(y)) ?? '',\n left: (x && Math.round(x)) ?? '',\n },\n })}\n variant={variant}\n ref={floating}\n mod={{ multiline }}\n >\n {label}\n </Box>\n </OptionalPortal>\n\n {cloneElement(child, {\n ...childProps,\n [refProp]: targetRef,\n onMouseEnter,\n onMouseLeave,\n })}\n </>\n );\n});\n\nTooltipFloating.classes = classes;\nTooltipFloating.varsResolver = varsResolver;\nTooltipFloating.displayName = '@mantine/core/TooltipFloating';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAqCA,MAAM,eAAe;CACnB,SAAS;CACT,cAAc;CACd,QAAQ;CACR,UAAU;CACV,QAAQA,4BAAAA,iBAAiB,SAAS;AACpC;AAEA,MAAM,eAAeC,6BAAAA,oBAA4C,OAAO,EAAE,QAAQ,aAAa,EAC7F,SAAS;CACP,oBAAoB,WAAW,KAAA,IAAY,KAAA,IAAYC,iBAAAA,UAAU,MAAM;CACvE,gBAAgB,QAAQC,wBAAAA,cAAc,OAAO,KAAK,IAAI,KAAA;CACtD,mBAAmB,QAAQ,+BAA+B,KAAA;AAC5D,EACF,EAAE;AAEF,MAAa,kBAAkBC,gBAAAA,SAAiC,WAAW;CACzE,MAAM,QAAQC,kBAAAA,SAAS,mBAAmB,cAAc,MAAM;CAC9D,MAAM,EACJ,UACA,SACA,cACA,OACA,WACA,YACA,QACA,UACA,QACA,OACA,OACA,QACA,UACA,WACA,QACA,UACA,eACA,SACA,MACA,aACA,YACA,KACA,GAAG,WACD;CAEJ,MAAM,QAAQC,6BAAAA,gBAAgB;CAC9B,MAAM,YAAYC,mBAAAA,UAAkC;EAClD,MAAM;EACN;EACA,SAAA,uBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;EACd;EACA;CACF,CAAC;CAED,MAAM,EAAE,iBAAiB,GAAG,GAAG,QAAQ,aAAa,UAAU,cAAcC,6BAAAA,mBAAmB;EAC7F;EACA;EACA;CACF,CAAC;CAED,MAAM,QAAQC,iCAAAA,sBAAsB,QAAQ;CAC5C,IAAI,CAAC,OACH,MAAM,IAAI,MACR,oLACF;CAGF,MAAM,aAAA,GAAA,eAAA,aAAA,CAAyB,aAAaC,qBAAAA,WAAW,KAAK,GAAG,GAAG;CAClE,MAAM,aAAa,MAAM;CAEzB,MAAM,gBAAgB,UAAiD;EACrE,WAAW,eAAe,KAAK;EAC/B,gBAAgB,KAAK;EACrB,UAAU,IAAI;CAChB;CAEA,MAAM,gBAAgB,UAAiD;EACrE,WAAW,eAAe,KAAK;EAC/B,UAAU,KAAK;CACjB;CAEA,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAA,kBAAA,UAAA,EAAA,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,uBAAAA,gBAAD;EAAgB,GAAI;EAA2B;YAC7C,iBAAA,GAAA,kBAAA,IAAA,CAACC,YAAAA,KAAD;GACE,GAAI;GACJ,GAAI,UAAU,WAAW,EACvB,OAAO;IACL,GAAGC,yBAAAA,eAAe,OAAO,KAAK;IACtB;IACR,SAAS,CAAC,YAAY,SAAS,UAAU;IACzC,MAAM,KAAK,KAAK,MAAM,CAAC,MAAM;IAC7B,OAAO,KAAK,KAAK,MAAM,CAAC,MAAM;GAChC,EACF,CAAC;GACQ;GACT,KAAK;GACL,KAAK,EAAE,UAAU;aAEhB;EACE,CAAA;CACS,CAAA,IAAA,GAAA,MAAA,aAAA,CAEF,OAAO;EACnB,GAAG;GACF,UAAU;EACX;EACA;CACF,CAAC,CACD,EAAA,CAAA;AAEN,CAAC;AAED,gBAAgB,UAAUC,uBAAAA;AAC1B,gBAAgB,eAAe;AAC/B,gBAAgB,cAAc"}

package/cjs/components/Tooltip/TooltipFloating/use-floating-tooltip.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"use-floating-tooltip.cjs","names":[],"sources":["../../../../src/components/Tooltip/TooltipFloating/use-floating-tooltip.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react';\nimport { getOverflowAncestors, shift, useFloating } from '@floating-ui/react';\nimport { FloatingPosition } from '../../../utils/Floating';\n\ninterface UseFloatingTooltip {\n offset: number;\n position: FloatingPosition;\n defaultOpened?: boolean;\n}\n\nexport function useFloatingTooltip<T extends HTMLElement = any>({\n offset,\n position,\n defaultOpened,\n}: UseFloatingTooltip) {\n const [opened, setOpened] = useState(defaultOpened);\n const boundaryRef = useRef<T>(null);\n const { x, y, elements, refs, update, placement } = useFloating({\n placement: position,\n middleware: [\n shift({\n crossAxis: true,\n padding: 5,\n rootBoundary: 'document',\n }),\n ],\n });\n\n const horizontalOffset = placement.includes('right')\n ? offset\n : position.includes('left')\n ? offset * -1\n : 0;\n\n const verticalOffset = placement.includes('bottom')\n ? offset\n : position.includes('top')\n ? offset * -1\n : 0;\n\n const handleMouseMove = useCallback(\n ({ clientX, clientY }: MouseEvent \| React.MouseEvent<T, MouseEvent>) => {\n refs.setPositionReference({\n getBoundingClientRect() {\n return {\n width: 0,\n height: 0,\n x: clientX,\n y: clientY,\n left: clientX + horizontalOffset,\n top: clientY + verticalOffset,\n right: clientX,\n bottom: clientY,\n };\n },\n });\n },\n [elements.reference]\n );\n\n useEffect(() => {\n if (refs.floating.current) {\n const boundary = boundaryRef.current!;\n boundary.addEventListener('mousemove', handleMouseMove);\n\n const parents = getOverflowAncestors(refs.floating.current);\n parents.forEach((parent) => {\n parent.addEventListener('scroll', update);\n });\n\n return () => {\n boundary.removeEventListener('mousemove', handleMouseMove);\n parents.forEach((parent) => {\n parent.removeEventListener('scroll', update);\n });\n };\n }\n\n return undefined;\n }, [elements.reference, refs.floating.current, update, handleMouseMove, opened]);\n\n return { handleMouseMove, x, y, opened, setOpened, boundaryRef, floating: refs.setFloating };\n}\n"],"mappings":";;;;AAUA,SAAgB,mBAAgD,EAC9D,QACA,UACA,iBACqB;CACrB,MAAM,CAAC,QAAQ,cAAA,GAAA,MAAA,~~UAAsB~~,aAAa;CAClD,MAAM,eAAA,GAAA,MAAA,~~QAAwB~~,IAAI;CAClC,MAAM,EAAE,GAAG,GAAG,UAAU,MAAM,QAAQ,eAAA,GAAA,mBAAA,~~aAA0B~~;EAC9D,WAAW;EACX,YAAY,EAAA,GAAA,mBAAA,~~OACJ~~;GACJ,WAAW;GACX,SAAS;GACT,cAAc;EAChB,CAAC,CACH;CACF,CAAC;CAED,MAAM,mBAAmB,UAAU,SAAS,OAAO,IAC/C,SACA,SAAS,SAAS,MAAM,IACtB,SAAS,KACT;CAEN,MAAM,iBAAiB,UAAU,SAAS,QAAQ,IAC9C,SACA,SAAS,SAAS,KAAK,IACrB,SAAS,KACT;CAEN,MAAM,mBAAA,GAAA,MAAA,~~cACH~~,EAAE,SAAS,cAA4D;EACtE,KAAK,qBAAqB,EACxB,wBAAwB;GACtB,OAAO;IACL,OAAO;IACP,QAAQ;IACR,GAAG;IACH,GAAG;IACH,MAAM,UAAU;IAChB,KAAK,UAAU;IACf,OAAO;IACP,QAAQ;GACV;EACF,EACF,CAAC;CACH,GACA,CAAC,SAAS,SAAS,CACrB;CAEA,CAAA,GAAA,MAAA,~~iBAAgB~~;EACd,IAAI,KAAK,SAAS,SAAS;GACzB,MAAM,WAAW,YAAY;GAC7B,SAAS,iBAAiB,aAAa,eAAe;GAEtD,MAAM,WAAA,GAAA,mBAAA,~~sBAA~~+B,KAAK,SAAS,OAAO;GAC1D,QAAQ,SAAS,WAAW;IAC1B,OAAO,iBAAiB,UAAU,MAAM;GAC1C,CAAC;GAED,aAAa;IACX,SAAS,oBAAoB,aAAa,eAAe;IACzD,QAAQ,SAAS,WAAW;KAC1B,OAAO,oBAAoB,UAAU,MAAM;IAC7C,CAAC;GACH;EACF;CAGF,GAAG;EAAC,SAAS;EAAW,KAAK,SAAS;EAAS;EAAQ;EAAiB;CAAM,CAAC;CAE/E,OAAO;EAAE;EAAiB;EAAG;EAAG;EAAQ;EAAW;EAAa,UAAU,KAAK;CAAY;AAC7F"}
1	+ {"version":3,"file":"use-floating-tooltip.cjs","names":[],"sources":["../../../../src/components/Tooltip/TooltipFloating/use-floating-tooltip.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react';\nimport { getOverflowAncestors, shift, useFloating } from '@floating-ui/react';\nimport { FloatingPosition } from '../../../utils/Floating';\n\ninterface UseFloatingTooltip {\n offset: number;\n position: FloatingPosition;\n defaultOpened?: boolean;\n}\n\nexport function useFloatingTooltip<T extends HTMLElement = any>({\n offset,\n position,\n defaultOpened,\n}: UseFloatingTooltip) {\n const [opened, setOpened] = useState(defaultOpened);\n const boundaryRef = useRef<T>(null);\n const { x, y, elements, refs, update, placement } = useFloating({\n placement: position,\n middleware: [\n shift({\n crossAxis: true,\n padding: 5,\n rootBoundary: 'document',\n }),\n ],\n });\n\n const horizontalOffset = placement.includes('right')\n ? offset\n : position.includes('left')\n ? offset * -1\n : 0;\n\n const verticalOffset = placement.includes('bottom')\n ? offset\n : position.includes('top')\n ? offset * -1\n : 0;\n\n const handleMouseMove = useCallback(\n ({ clientX, clientY }: MouseEvent \| React.MouseEvent<T, MouseEvent>) => {\n refs.setPositionReference({\n getBoundingClientRect() {\n return {\n width: 0,\n height: 0,\n x: clientX,\n y: clientY,\n left: clientX + horizontalOffset,\n top: clientY + verticalOffset,\n right: clientX,\n bottom: clientY,\n };\n },\n });\n },\n [elements.reference]\n );\n\n useEffect(() => {\n if (refs.floating.current) {\n const boundary = boundaryRef.current!;\n boundary.addEventListener('mousemove', handleMouseMove);\n\n const parents = getOverflowAncestors(refs.floating.current);\n parents.forEach((parent) => {\n parent.addEventListener('scroll', update);\n });\n\n return () => {\n boundary.removeEventListener('mousemove', handleMouseMove);\n parents.forEach((parent) => {\n parent.removeEventListener('scroll', update);\n });\n };\n }\n\n return undefined;\n }, [elements.reference, refs.floating.current, update, handleMouseMove, opened]);\n\n return { handleMouseMove, x, y, opened, setOpened, boundaryRef, floating: refs.setFloating };\n}\n"],"mappings":";;;;AAUA,SAAgB,mBAAgD,EAC9D,QACA,UACA,iBACqB;CACrB,MAAM,CAAC,QAAQ,cAAA,GAAA,MAAA,SAAA,CAAsB,aAAa;CAClD,MAAM,eAAA,GAAA,MAAA,OAAA,CAAwB,IAAI;CAClC,MAAM,EAAE,GAAG,GAAG,UAAU,MAAM,QAAQ,eAAA,GAAA,mBAAA,YAAA,CAA0B;EAC9D,WAAW;EACX,YAAY,EAAA,GAAA,mBAAA,MAAA,CACJ;GACJ,WAAW;GACX,SAAS;GACT,cAAc;EAChB,CAAC,CACH;CACF,CAAC;CAED,MAAM,mBAAmB,UAAU,SAAS,OAAO,IAC/C,SACA,SAAS,SAAS,MAAM,IACtB,SAAS,KACT;CAEN,MAAM,iBAAiB,UAAU,SAAS,QAAQ,IAC9C,SACA,SAAS,SAAS,KAAK,IACrB,SAAS,KACT;CAEN,MAAM,mBAAA,GAAA,MAAA,YAAA,EACH,EAAE,SAAS,cAA4D;EACtE,KAAK,qBAAqB,EACxB,wBAAwB;GACtB,OAAO;IACL,OAAO;IACP,QAAQ;IACR,GAAG;IACH,GAAG;IACH,MAAM,UAAU;IAChB,KAAK,UAAU;IACf,OAAO;IACP,QAAQ;GACV;EACF,EACF,CAAC;CACH,GACA,CAAC,SAAS,SAAS,CACrB;CAEA,CAAA,GAAA,MAAA,UAAA,OAAgB;EACd,IAAI,KAAK,SAAS,SAAS;GACzB,MAAM,WAAW,YAAY;GAC7B,SAAS,iBAAiB,aAAa,eAAe;GAEtD,MAAM,WAAA,GAAA,mBAAA,qBAAA,CAA+B,KAAK,SAAS,OAAO;GAC1D,QAAQ,SAAS,WAAW;IAC1B,OAAO,iBAAiB,UAAU,MAAM;GAC1C,CAAC;GAED,aAAa;IACX,SAAS,oBAAoB,aAAa,eAAe;IACzD,QAAQ,SAAS,WAAW;KAC1B,OAAO,oBAAoB,UAAU,MAAM;IAC7C,CAAC;GACH;EACF;CAGF,GAAG;EAAC,SAAS;EAAW,KAAK,SAAS;EAAS;EAAQ;EAAiB;CAAM,CAAC;CAE/E,OAAO;EAAE;EAAiB;EAAG;EAAG;EAAQ;EAAW;EAAa,UAAU,KAAK;CAAY;AAC7F"}

package/cjs/components/Tooltip/TooltipGroup/TooltipGroup.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TooltipGroup.cjs","names":["useProps","FloatingDelayGroup"],"sources":["../../../../src/components/Tooltip/TooltipGroup/TooltipGroup.tsx"],"sourcesContent":["import { createContext } from 'react';\nimport { FloatingDelayGroup } from '@floating-ui/react';\nimport { ExtendComponent, Factory, MantineThemeComponent, useProps } from '../../../core';\n\nexport interface TooltipGroupContextValue {\n withinGroup: boolean;\n}\n\nexport const TooltipGroupContext = createContext<TooltipGroupContextValue>({ withinGroup: false });\n\nexport interface TooltipGroupProps {\n /** `Tooltip` components /\n children: React.ReactNode;\n\n /* Open delay in ms /\n openDelay?: number;\n\n /* Close delay in ms */\n closeDelay?: number;\n}\n\nconst defaultProps = {\n openDelay: 0,\n closeDelay: 0,\n} satisfies Partial<TooltipGroupProps>;\n\nexport function TooltipGroup(props: TooltipGroupProps) {\n const { openDelay, closeDelay, children } = useProps('TooltipGroup', defaultProps, props);\n\n return (\n <TooltipGroupContext value={{ withinGroup: true }}>\n <FloatingDelayGroup delay={{ open: openDelay, close: closeDelay }}>\n {children}\n </FloatingDelayGroup>\n </TooltipGroupContext>\n );\n}\n\nexport type TooltipGroupFactory = Factory<{\n props: TooltipGroupProps;\n}>;\n\nTooltipGroup.displayName = '@mantine/core/TooltipGroup';\nTooltipGroup.extend = (c: ExtendComponent<TooltipGroupFactory>): MantineThemeComponent => c;\n"],"mappings":";;;;;;AAQA,MAAa,uBAAA,GAAA,MAAA,~~eAA8D~~,EAAE,aAAa,MAAM,CAAC;AAajG,MAAM,eAAe;CACnB,WAAW;CACX,YAAY;AACd;AAEA,SAAgB,aAAa,OAA0B;CACrD,MAAM,EAAE,WAAW,YAAY,aAAaA,kBAAAA,SAAS,gBAAgB,cAAc,KAAK;CAExF,OACE,iBAAA,GAAA,kBAAA,~~KAAC~~,qBAAD;EAAqB,OAAO,EAAE,aAAa,KAAK;YAC9C,iBAAA,GAAA,kBAAA,~~KAACC~~,mBAAAA,oBAAD;GAAoB,OAAO;IAAE,MAAM;IAAW,OAAO;GAAW;GAC7D;EACiB,CAAA;CACD,CAAA;AAEzB;AAMA,aAAa,cAAc;AAC3B,aAAa,UAAU,MAAmE"}
1	+ {"version":3,"file":"TooltipGroup.cjs","names":["useProps","FloatingDelayGroup"],"sources":["../../../../src/components/Tooltip/TooltipGroup/TooltipGroup.tsx"],"sourcesContent":["import { createContext } from 'react';\nimport { FloatingDelayGroup } from '@floating-ui/react';\nimport { ExtendComponent, Factory, MantineThemeComponent, useProps } from '../../../core';\n\nexport interface TooltipGroupContextValue {\n withinGroup: boolean;\n}\n\nexport const TooltipGroupContext = createContext<TooltipGroupContextValue>({ withinGroup: false });\n\nexport interface TooltipGroupProps {\n /** `Tooltip` components /\n children: React.ReactNode;\n\n /* Open delay in ms /\n openDelay?: number;\n\n /* Close delay in ms */\n closeDelay?: number;\n}\n\nconst defaultProps = {\n openDelay: 0,\n closeDelay: 0,\n} satisfies Partial<TooltipGroupProps>;\n\nexport function TooltipGroup(props: TooltipGroupProps) {\n const { openDelay, closeDelay, children } = useProps('TooltipGroup', defaultProps, props);\n\n return (\n <TooltipGroupContext value={{ withinGroup: true }}>\n <FloatingDelayGroup delay={{ open: openDelay, close: closeDelay }}>\n {children}\n </FloatingDelayGroup>\n </TooltipGroupContext>\n );\n}\n\nexport type TooltipGroupFactory = Factory<{\n props: TooltipGroupProps;\n}>;\n\nTooltipGroup.displayName = '@mantine/core/TooltipGroup';\nTooltipGroup.extend = (c: ExtendComponent<TooltipGroupFactory>): MantineThemeComponent => c;\n"],"mappings":";;;;;;AAQA,MAAa,uBAAA,GAAA,MAAA,cAAA,CAA8D,EAAE,aAAa,MAAM,CAAC;AAajG,MAAM,eAAe;CACnB,WAAW;CACX,YAAY;AACd;AAEA,SAAgB,aAAa,OAA0B;CACrD,MAAM,EAAE,WAAW,YAAY,aAAaA,kBAAAA,SAAS,gBAAgB,cAAc,KAAK;CAExF,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,qBAAD;EAAqB,OAAO,EAAE,aAAa,KAAK;YAC9C,iBAAA,GAAA,kBAAA,IAAA,CAACC,mBAAAA,oBAAD;GAAoB,OAAO;IAAE,MAAM;IAAW,OAAO;GAAW;GAC7D;EACiB,CAAA;CACD,CAAA;AAEzB;AAMA,aAAa,cAAc;AAC3B,aAAa,UAAU,MAAmE"}

package/cjs/components/Tooltip/use-tooltip.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"use-tooltip.cjs","names":["TooltipGroupContext","autoUpdate"],"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,EAAA,GAAA,mBAAA,~~QAAQ~~,SAAS,MAAM,CAAC;CAE1D,IAAI,mBAAmB,OACrB,YAAY,MAAA,GAAA,mBAAA,~~OAER~~,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,aAAA,GAAA,mBAAA,~~MAAiB~~,KAAA,GAAA,mBAAA,~~MAAS~~,mBAAmB,IAAI,CACtF;CAGF,YAAY,MAAA,GAAA,mBAAA,~~OAAW~~;EAAE,SAAS,SAAS;EAAW,SAAS,SAAS;CAAY,CAAC,CAAC;CAEtF,IAAI,mBAAmB,QACrB,YAAY,KACV,OAAO,mBAAmB,WAAW,aAAA,GAAA,mBAAA,~~QAAmB~~,KAAA,GAAA,mBAAA,~~QAAW~~,mBAAmB,MAAM,CAC9F;MACK,IAAI,SAAS,QAClB,YAAY,MAAA,GAAA,mBAAA,~~QAAY~~,CAAC;CAG3B,OAAO;AACT;AAEA,SAAgB,WAAW,UAAsB;CAC/C,MAAM,CAAC,oBAAoB,0BAAA,GAAA,MAAA,~~UAAkC~~,SAAS,aAAa;CAEnF,MAAM,SADa,OAAO,SAAS,WAAW,YAClB,SAAS,SAAS;CAC9C,MAAM,eAAA,GAAA,MAAA,~~KAAkBA~~,qBAAAA,mBAAmB,~~EAAE~~;CAC7C,MAAM,OAAA,GAAA,eAAA,~~OAAY~~;CAElB,MAAM,YAAA,GAAA,MAAA,~~cACH~~,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,SAAA,GAAA,mBAAA,~~aACvC~~;EACd,UAAU,SAAS;EACnB,WAAW,SAAS;EACpB,MAAM;EACN,cAAc;EACd,YAAY,sBAAsB,QAAQ;EAC1C,sBAAsBC,mBAAAA;CACxB,CAAC;CAED,MAAM,EAAE,OAAO,YAAY,WAAW,kBAAA,GAAA,mBAAA,~~eAA~~+B,SAAS,EAAE,IAAI,IAAI,CAAC;CAEzF,MAAM,EAAE,mBAAmB,sBAAA,GAAA,mBAAA,~~iBAAqC~~;mCACrD,SAAS;GAChB,SAAS,SAAS,QAAQ;GAC1B,OAAO,cAAc,aAAa;IAAE,MAAM,SAAS;IAAW,OAAO,SAAS;GAAW;GACzF,WAAW,CAAC,SAAS,QAAQ;EAC/B,CAAC;mCACQ,SAAS;GAAE,SAAS,SAAS,QAAQ;GAAO,aAAa;EAAK,CAAC;kCAChE,SAAS,EAAE,MAAM,UAAU,CAAC;qCAEzB,SAAS,EAAE,SAAS,OAAO,SAAS,WAAW,YAAY,CAAC;CACzE,CAAC;CAED,MAAM,wBAAA,GAAA,MAAA,~~QAA8B~~,SAAS;CAC7C,CAAA,GAAA,eAAA,~~2BAA0B~~;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"}
1	+ {"version":3,"file":"use-tooltip.cjs","names":["TooltipGroupContext","autoUpdate"],"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,EAAA,GAAA,mBAAA,OAAA,CAAQ,SAAS,MAAM,CAAC;CAE1D,IAAI,mBAAmB,OACrB,YAAY,MAAA,GAAA,mBAAA,MAAA,CAER,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,aAAA,GAAA,mBAAA,KAAA,CAAiB,KAAA,GAAA,mBAAA,KAAA,CAAS,mBAAmB,IAAI,CACtF;CAGF,YAAY,MAAA,GAAA,mBAAA,MAAA,CAAW;EAAE,SAAS,SAAS;EAAW,SAAS,SAAS;CAAY,CAAC,CAAC;CAEtF,IAAI,mBAAmB,QACrB,YAAY,KACV,OAAO,mBAAmB,WAAW,aAAA,GAAA,mBAAA,OAAA,CAAmB,KAAA,GAAA,mBAAA,OAAA,CAAW,mBAAmB,MAAM,CAC9F;MACK,IAAI,SAAS,QAClB,YAAY,MAAA,GAAA,mBAAA,OAAA,CAAY,CAAC;CAG3B,OAAO;AACT;AAEA,SAAgB,WAAW,UAAsB;CAC/C,MAAM,CAAC,oBAAoB,0BAAA,GAAA,MAAA,SAAA,CAAkC,SAAS,aAAa;CAEnF,MAAM,SADa,OAAO,SAAS,WAAW,YAClB,SAAS,SAAS;CAC9C,MAAM,eAAA,GAAA,MAAA,IAAA,CAAkBA,qBAAAA,mBAAmB,CAAC,CAAC;CAC7C,MAAM,OAAA,GAAA,eAAA,MAAA,CAAY;CAElB,MAAM,YAAA,GAAA,MAAA,YAAA,EACH,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,SAAA,GAAA,mBAAA,YAAA,CACvC;EACd,UAAU,SAAS;EACnB,WAAW,SAAS;EACpB,MAAM;EACN,cAAc;EACd,YAAY,sBAAsB,QAAQ;EAC1C,sBAAsBC,mBAAAA;CACxB,CAAC;CAED,MAAM,EAAE,OAAO,YAAY,WAAW,kBAAA,GAAA,mBAAA,cAAA,CAA+B,SAAS,EAAE,IAAI,IAAI,CAAC;CAEzF,MAAM,EAAE,mBAAmB,sBAAA,GAAA,mBAAA,gBAAA,CAAqC;mCACrD,SAAS;GAChB,SAAS,SAAS,QAAQ;GAC1B,OAAO,cAAc,aAAa;IAAE,MAAM,SAAS;IAAW,OAAO,SAAS;GAAW;GACzF,WAAW,CAAC,SAAS,QAAQ;EAC/B,CAAC;mCACQ,SAAS;GAAE,SAAS,SAAS,QAAQ;GAAO,aAAa;EAAK,CAAC;kCAChE,SAAS,EAAE,MAAM,UAAU,CAAC;qCAEzB,SAAS,EAAE,SAAS,OAAO,SAAS,WAAW,YAAY,CAAC;CACzE,CAAC;CAED,MAAM,wBAAA,GAAA,MAAA,OAAA,CAA8B,SAAS;CAC7C,CAAA,GAAA,eAAA,oBAAA,OAA0B;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"}

package/cjs/components/Transition/Transition.cjs CHANGED Viewed

@@ -5,7 +5,7 @@ const require_use_transition = require("./use-transition.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region packages/@mantine/core/src/components/Transition/Transition.tsx
-function Transition({ keepMounted, transition = "fade", duration = 250, exitDuration = duration, mounted, children, timingFunction = "ease", onExit, onEntered, onEnter, onExited, enterDelay, exitDelay }) {
+function Transition({ keepMounted, keepMountedMode = "activity", transition = "fade", duration = 250, exitDuration = duration, mounted, children, timingFunction = "ease", onExit, onEntered, onEnter, onExited, enterDelay, exitDelay }) {
 	const env = require_Mantine_context.useMantineEnv();
 	const { transitionDuration, transitionStatus, transitionTimingFunction } = require_use_transition.useTransition({
 		mounted,
@@ -21,22 +21,29 @@ function Transition({ keepMounted, transition = "fade", duration = 250, exitDura
 	});
 	if (env === "test") return mounted ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: children({}) }) : keepMounted ? children({ display: "none" }) : null;
 	if (transitionDuration === 0) {
-		if (keepMounted) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.Activity, {
-			mode: mounted ? "visible" : "hidden",
-			children: children({})
-		});
+		if (keepMounted) {
+			if (keepMountedMode === "display-none") return mounted ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: children({}) }) : children({ display: "none" });
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.Activity, {
+				mode: mounted ? "visible" : "hidden",
+				children: children({})
+			});
+		}
 		return mounted ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: children({}) }) : null;
 	}
 	const isExited = transitionStatus === "exited";
-	if (keepMounted) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.Activity, {
-		mode: isExited ? "hidden" : "visible",
-		children: children(isExited ? {} : require_get_transition_styles.getTransitionStyles({
+	if (keepMounted) {
+		const keepMountedChildren = children(isExited ? keepMountedMode === "display-none" ? { display: "none" } : {} : require_get_transition_styles.getTransitionStyles({
 			transition,
 			duration: transitionDuration,
 			state: transitionStatus,
 			timingFunction: transitionTimingFunction
-		}))
-	});
+		}));
+		if (keepMountedMode === "display-none") return keepMountedChildren;
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.Activity, {
+			mode: isExited ? "hidden" : "visible",
+			children: keepMountedChildren
+		});
+	}
 	return isExited ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: children(require_get_transition_styles.getTransitionStyles({
 		transition,
 		duration: transitionDuration,

package/cjs/components/Transition/Transition.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Transition.cjs","names":["useMantineEnv","useTransition","Activity","getTransitionStyles"],"sources":["../../../src/components/Transition/Transition.tsx"],"sourcesContent":["import { Activity } from 'react';\nimport { useMantineEnv } from '../../core';\nimport { getTransitionStyles } from './get-transition-styles/get-transition-styles';\nimport { MantineTransition } from './transitions';\nimport { useTransition } from './use-transition';\n\nexport interface TransitionProps {\n /** If set, the element is kept in the DOM when hidden. React 19 `Activity` is used to preserve state while the element is not visible. /\n keepMounted?: boolean;\n\n /* Transition name or object /\n transition?: MantineTransition;\n\n /* Transition duration in ms @default 250 /\n duration?: number;\n\n /* Exit transition duration in ms @default 250 /\n exitDuration?: number;\n\n /* Transition timing function @default theme.transitionTimingFunction /\n timingFunction?: string;\n\n /* Determines whether component should be mounted to the DOM /\n mounted: boolean;\n\n /* Render function with transition styles argument /\n children: (styles: React.CSSProperties) => React.JSX.Element;\n\n /* Called when exit transition ends /\n onExited?: () => void;\n\n /* Called when exit transition starts /\n onExit?: () => void;\n\n /* Called when enter transition starts /\n onEnter?: () => void;\n\n /* Called when enter transition ends /\n onEntered?: () => void;\n\n /* Delay in ms before enter transition starts /\n enterDelay?: number;\n\n /* Delay in ms before exit transition starts */\n exitDelay?: number;\n}\n\nexport type TransitionOverride = Partial<Omit<TransitionProps, 'mounted'>>;\n\nexport function Transition({\n keepMounted,\n transition = 'fade',\n duration = 250,\n exitDuration = duration,\n mounted,\n children,\n timingFunction = 'ease',\n onExit,\n onEntered,\n onEnter,\n onExited,\n enterDelay,\n exitDelay,\n}: TransitionProps) {\n const env = useMantineEnv();\n const { transitionDuration, transitionStatus, transitionTimingFunction } = useTransition({\n mounted,\n exitDuration,\n duration,\n timingFunction,\n onExit,\n onEntered,\n onEnter,\n onExited,\n enterDelay,\n exitDelay,\n });\n\n if (env === 'test') {\n return mounted ? <>{children({})}</> : keepMounted ? children({ display: 'none' }) : null;\n }\n\n if (transitionDuration === 0) {\n if (keepMounted) {\n return <Activity mode={mounted ? 'visible' : 'hidden'}>{children({})}</Activity>;\n }\n return mounted ? <>{children({})}</> : null;\n }\n\n const isExited = transitionStatus === 'exited';\n\n if (keepMounted) {\n ~~return~~ (\n ~~<Activity mode={~~isExited ? '~~hidden~~' : '~~visible~~'}~~>\n {children(~~\n ~~isExited\n ?~~ {}\n : getTransitionStyles({\n transition,\n duration: transitionDuration,\n state: transitionStatus,\n timingFunction: transitionTimingFunction,\n })\n )}\n </Activity>\n ~~);\n~~ }\n\n return isExited ? null : (\n <>\n {children(\n getTransitionStyles({\n transition,\n duration: transitionDuration,\n state: transitionStatus,\n timingFunction: transitionTimingFunction,\n })\n )}\n </>\n );\n}\n\nTransition.displayName = '@mantine/core/Transition';\n\nexport namespace Transition {\n export type Props = TransitionProps;\n export type Override = TransitionOverride;\n}\n"],"mappings":";;;;;;;~~AAiDA~~,SAAgB,WAAW,EACzB,aACA,aAAa,QACb,WAAW,KACX,eAAe,UACf,SACA,UACA,iBAAiB,QACjB,QACA,WACA,SACA,UACA,YACA,aACkB;CAClB,MAAM,MAAMA,wBAAAA,cAAc;CAC1B,MAAM,EAAE,oBAAoB,kBAAkB,6BAA6BC,uBAAAA,cAAc;EACvF;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,IAAI,QAAQ,QACV,OAAO,UAAU,iBAAA,GAAA,kBAAA,~~KAAA~~,kBAAA,UAAA,EAAA,UAAG,SAAS,CAAC,CAAC,EAAI,CAAA,IAAI,cAAc,SAAS,EAAE,SAAS,OAAO,CAAC,IAAI;CAGvF,IAAI,uBAAuB,GAAG;EAC5B,IAAI,~~aACF~~,OAAO,iBAAA,GAAA,kBAAA,~~KAACC~~,MAAAA,UAAD;~~GAAU~~,MAAM,UAAU,YAAY;~~aAAW~~,SAAS,CAAC,CAAC;~~EAAY~~,CAAA;~~EAEjF~~,OAAO,UAAU,iBAAA,GAAA,kBAAA,~~KAAA~~,kBAAA,UAAA,EAAA,UAAG,SAAS,CAAC,CAAC,EAAI,CAAA,IAAI;CACzC;CAEA,MAAM,WAAW,qBAAqB;CAEtC,IAAI,~~aACF~~,~~OACE~~,~~iBAAA~~,~~GAAA~~,~~kBAAA~~,~~KAACA~~,~~MAAAA~~,~~UAAD;EAAU~~,~~MAAM~~,~~WAAW~~,~~WAAW;YACnC~~,~~SACC,WACI,~~CAAC,~~IACDC~~,8BAAAA,oBAAoB;GAClB;GACA,UAAU;GACV,OAAO;GACP,gBAAgB;EAClB,CAAC,CACP;~~CACQ~~,CAAA;~~CAId~~,OAAO,WAAW,OAChB,iBAAA,GAAA,kBAAA,~~KAAA~~,kBAAA,UAAA,EAAA,UACG,~~SACCA~~,8BAAAA,oBAAoB;EAClB;EACA,UAAU;EACV,OAAO;EACP,gBAAgB;CAClB,CAAC,CACH,EACA,CAAA;AAEN;AAEA,WAAW,cAAc"}
1	+ {"version":3,"file":"Transition.cjs","names":["useMantineEnv","useTransition","Activity","getTransitionStyles"],"sources":["../../../src/components/Transition/Transition.tsx"],"sourcesContent":["import { Activity } from 'react';\nimport { useMantineEnv } from '../../core';\nimport { getTransitionStyles } from './get-transition-styles/get-transition-styles';\nimport { MantineTransition } from './transitions';\nimport { useTransition } from './use-transition';\n\nexport interface TransitionProps {\n /** If set, the element is kept in the DOM when hidden. React 19 `Activity` is used to preserve state while the element is not visible. /\n keepMounted?: boolean;\n\n /\n Controls how the element is hidden when `keepMounted` is set:\n * `'activity'` – hidden with React 19 `Activity` component,\n * `'display-none'` – hidden with `display: none` styles\n * @default 'activity'\n /\n keepMountedMode?: 'activity' \| 'display-none';\n\n /* Transition name or object /\n transition?: MantineTransition;\n\n /* Transition duration in ms @default 250 /\n duration?: number;\n\n /* Exit transition duration in ms @default 250 /\n exitDuration?: number;\n\n /* Transition timing function @default theme.transitionTimingFunction /\n timingFunction?: string;\n\n /* Determines whether component should be mounted to the DOM /\n mounted: boolean;\n\n /* Render function with transition styles argument /\n children: (styles: React.CSSProperties) => React.JSX.Element;\n\n /* Called when exit transition ends /\n onExited?: () => void;\n\n /* Called when exit transition starts /\n onExit?: () => void;\n\n /* Called when enter transition starts /\n onEnter?: () => void;\n\n /* Called when enter transition ends /\n onEntered?: () => void;\n\n /* Delay in ms before enter transition starts /\n enterDelay?: number;\n\n /* Delay in ms before exit transition starts */\n exitDelay?: number;\n}\n\nexport type TransitionOverride = Partial<Omit<TransitionProps, 'mounted'>>;\n\nexport function Transition({\n keepMounted,\n keepMountedMode = 'activity',\n transition = 'fade',\n duration = 250,\n exitDuration = duration,\n mounted,\n children,\n timingFunction = 'ease',\n onExit,\n onEntered,\n onEnter,\n onExited,\n enterDelay,\n exitDelay,\n}: TransitionProps) {\n const env = useMantineEnv();\n const { transitionDuration, transitionStatus, transitionTimingFunction } = useTransition({\n mounted,\n exitDuration,\n duration,\n timingFunction,\n onExit,\n onEntered,\n onEnter,\n onExited,\n enterDelay,\n exitDelay,\n });\n\n if (env === 'test') {\n return mounted ? <>{children({})}</> : keepMounted ? children({ display: 'none' }) : null;\n }\n\n if (transitionDuration === 0) {\n if (keepMounted) {\n if (keepMountedMode === 'display-none') {\n return mounted ? <>{children({})}</> : children({ display: 'none' });\n }\n\n return <Activity mode={mounted ? 'visible' : 'hidden'}>{children({})}</Activity>;\n }\n return mounted ? <>{children({})}</> : null;\n }\n\n const isExited = transitionStatus === 'exited';\n\n if (keepMounted) {\n const keepMountedChildren = children(\n isExited\n ? keepMountedMode === 'display-none'\n ? { display: 'none' }\n : {}\n : getTransitionStyles({\n transition,\n duration: transitionDuration,\n state: transitionStatus,\n timingFunction: transitionTimingFunction,\n })\n );\n\n if (keepMountedMode === 'display-none') {\n return keepMountedChildren;\n }\n\n return <Activity mode={isExited ? 'hidden' : 'visible'}>{keepMountedChildren}</Activity>;\n }\n\n return isExited ? null : (\n <>\n {children(\n getTransitionStyles({\n transition,\n duration: transitionDuration,\n state: transitionStatus,\n timingFunction: transitionTimingFunction,\n })\n )}\n </>\n );\n}\n\nTransition.displayName = '@mantine/core/Transition';\n\nexport namespace Transition {\n export type Props = TransitionProps;\n export type Override = TransitionOverride;\n}\n"],"mappings":";;;;;;;AAyDA,SAAgB,WAAW,EACzB,aACA,kBAAkB,YAClB,aAAa,QACb,WAAW,KACX,eAAe,UACf,SACA,UACA,iBAAiB,QACjB,QACA,WACA,SACA,UACA,YACA,aACkB;CAClB,MAAM,MAAMA,wBAAAA,cAAc;CAC1B,MAAM,EAAE,oBAAoB,kBAAkB,6BAA6BC,uBAAAA,cAAc;EACvF;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,IAAI,QAAQ,QACV,OAAO,UAAU,iBAAA,GAAA,kBAAA,IAAA,CAAA,kBAAA,UAAA,EAAA,UAAG,SAAS,CAAC,CAAC,EAAI,CAAA,IAAI,cAAc,SAAS,EAAE,SAAS,OAAO,CAAC,IAAI;CAGvF,IAAI,uBAAuB,GAAG;EAC5B,IAAI,aAAa;GACf,IAAI,oBAAoB,gBACtB,OAAO,UAAU,iBAAA,GAAA,kBAAA,IAAA,CAAA,kBAAA,UAAA,EAAA,UAAG,SAAS,CAAC,CAAC,EAAI,CAAA,IAAI,SAAS,EAAE,SAAS,OAAO,CAAC;GAGrE,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAACC,MAAAA,UAAD;IAAU,MAAM,UAAU,YAAY;cAAW,SAAS,CAAC,CAAC;GAAY,CAAA;EACjF;EACA,OAAO,UAAU,iBAAA,GAAA,kBAAA,IAAA,CAAA,kBAAA,UAAA,EAAA,UAAG,SAAS,CAAC,CAAC,EAAI,CAAA,IAAI;CACzC;CAEA,MAAM,WAAW,qBAAqB;CAEtC,IAAI,aAAa;EACf,MAAM,sBAAsB,SAC1B,WACI,oBAAoB,iBAClB,EAAE,SAAS,OAAO,IAClB,CAAC,IACHC,8BAAAA,oBAAoB;GAClB;GACA,UAAU;GACV,OAAO;GACP,gBAAgB;EAClB,CAAC,CACP;EAEA,IAAI,oBAAoB,gBACtB,OAAO;EAGT,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAACD,MAAAA,UAAD;GAAU,MAAM,WAAW,WAAW;aAAY;EAA8B,CAAA;CACzF;CAEA,OAAO,WAAW,OAChB,iBAAA,GAAA,kBAAA,IAAA,CAAA,kBAAA,UAAA,EAAA,UACG,SACCC,8BAAAA,oBAAoB;EAClB;EACA,UAAU;EACV,OAAO;EACP,gBAAgB;CAClB,CAAC,CACH,EACA,CAAA;AAEN;AAEA,WAAW,cAAc"}

package/cjs/components/Transition/get-transition-styles/get-transition-styles.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"get-transition-styles.cjs","names":["transitions"],"sources":["../../../../src/components/Transition/get-transition-styles/get-transition-styles.ts"],"sourcesContent":["import { MantineTransition, transitions } from '../transitions';\n\nconst transitionStatuses = {\n entering: 'in',\n entered: 'in',\n exiting: 'out',\n exited: 'out',\n 'pre-exiting': 'out',\n 'pre-entering': 'out',\n} as const;\n\nexport function getTransitionStyles({\n transition,\n state,\n duration,\n timingFunction,\n}: {\n transition: MantineTransition;\n state: keyof typeof transitionStatuses;\n duration: number;\n timingFunction: React.CSSProperties['transitionTimingFunction'];\n}): React.CSSProperties {\n const shared: React.CSSProperties = {\n WebkitBackfaceVisibility: 'hidden',\n transitionDuration: `${duration}ms`,\n transitionTimingFunction: timingFunction,\n };\n\n if (typeof transition === 'string') {\n if (!(transition in transitions)) {\n return {};\n }\n\n return {\n transitionProperty: transitions[transition].transitionProperty,\n ...shared,\n ...transitions[transition].common,\n ...transitions[transition][transitionStatuses[state]],\n };\n }\n\n return {\n transitionProperty: transition.transitionProperty,\n ...shared,\n ...transition.common,\n ...transition[transitionStatuses[state]],\n };\n}\n"],"mappings":";;;AAEA,MAAM,qBAAqB;CACzB,UAAU;CACV,SAAS;CACT,SAAS;CACT,QAAQ;CACR,eAAe;CACf,gBAAgB;AAClB;AAEA,SAAgB,oBAAoB,EAClC,YACA,OACA,UACA,kBAMsB;CACtB,MAAM,SAA8B;EAClC,0BAA0B;EAC1B,oBAAoB,GAAG,SAAS;EAChC,0BAA0B;CAC5B;CAEA,IAAI,OAAO,eAAe,UAAU;EAClC,IAAI,EAAE,cAAcA,oBAAAA,cAClB,OAAO,CAAC;EAGV,OAAO;GACL,oBAAoBA,oBAAAA,YAAY,~~YAAY~~;GAC5C,GAAG;GACH,GAAGA,oBAAAA,YAAY,~~YAAY~~;GAC3B,GAAGA,oBAAAA,YAAY,~~YAAY~~,mBAAmB;EAChD;CACF;CAEA,OAAO;EACL,oBAAoB,WAAW;EAC/B,GAAG;EACH,GAAG,WAAW;EACd,GAAG,WAAW,mBAAmB;CACnC;AACF"}
1	+ {"version":3,"file":"get-transition-styles.cjs","names":["transitions"],"sources":["../../../../src/components/Transition/get-transition-styles/get-transition-styles.ts"],"sourcesContent":["import { MantineTransition, transitions } from '../transitions';\n\nconst transitionStatuses = {\n entering: 'in',\n entered: 'in',\n exiting: 'out',\n exited: 'out',\n 'pre-exiting': 'out',\n 'pre-entering': 'out',\n} as const;\n\nexport function getTransitionStyles({\n transition,\n state,\n duration,\n timingFunction,\n}: {\n transition: MantineTransition;\n state: keyof typeof transitionStatuses;\n duration: number;\n timingFunction: React.CSSProperties['transitionTimingFunction'];\n}): React.CSSProperties {\n const shared: React.CSSProperties = {\n WebkitBackfaceVisibility: 'hidden',\n transitionDuration: `${duration}ms`,\n transitionTimingFunction: timingFunction,\n };\n\n if (typeof transition === 'string') {\n if (!(transition in transitions)) {\n return {};\n }\n\n return {\n transitionProperty: transitions[transition].transitionProperty,\n ...shared,\n ...transitions[transition].common,\n ...transitions[transition][transitionStatuses[state]],\n };\n }\n\n return {\n transitionProperty: transition.transitionProperty,\n ...shared,\n ...transition.common,\n ...transition[transitionStatuses[state]],\n };\n}\n"],"mappings":";;;AAEA,MAAM,qBAAqB;CACzB,UAAU;CACV,SAAS;CACT,SAAS;CACT,QAAQ;CACR,eAAe;CACf,gBAAgB;AAClB;AAEA,SAAgB,oBAAoB,EAClC,YACA,OACA,UACA,kBAMsB;CACtB,MAAM,SAA8B;EAClC,0BAA0B;EAC1B,oBAAoB,GAAG,SAAS;EAChC,0BAA0B;CAC5B;CAEA,IAAI,OAAO,eAAe,UAAU;EAClC,IAAI,EAAE,cAAcA,oBAAAA,cAClB,OAAO,CAAC;EAGV,OAAO;GACL,oBAAoBA,oBAAAA,YAAY,WAAW,CAAC;GAC5C,GAAG;GACH,GAAGA,oBAAAA,YAAY,WAAW,CAAC;GAC3B,GAAGA,oBAAAA,YAAY,WAAW,CAAC,mBAAmB;EAChD;CACF;CAEA,OAAO;EACL,oBAAoB,WAAW;EAC/B,GAAG;EACH,GAAG,WAAW;EACd,GAAG,WAAW,mBAAmB;CACnC;AACF"}

package/cjs/components/Transition/use-transition.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"use-transition.cjs","names":["useMantineTheme"],"sources":["../../../src/components/Transition/use-transition.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport ReactDOM from 'react-dom';\nimport { useDidUpdate, useReducedMotion } from '@mantine/hooks';\nimport { useMantineTheme } from '../../core';\n\nexport type TransitionStatus =\n \| 'entered'\n \| 'exited'\n \| 'entering'\n \| 'exiting'\n \| 'pre-exiting'\n \| 'pre-entering';\n\ninterface UseTransition {\n duration: number;\n exitDuration: number;\n timingFunction: string;\n mounted: boolean;\n onEnter?: () => void;\n onExit?: () => void;\n onEntered?: () => void;\n onExited?: () => void;\n enterDelay?: number;\n exitDelay?: number;\n}\n\nexport function useTransition({\n duration,\n exitDuration,\n timingFunction,\n mounted,\n onEnter,\n onExit,\n onEntered,\n onExited,\n enterDelay,\n exitDelay,\n}: UseTransition) {\n const theme = useMantineTheme();\n const shouldReduceMotion = useReducedMotion();\n const reduceMotion = theme.respectReducedMotion ? shouldReduceMotion : false;\n const [transitionDuration, setTransitionDuration] = useState(reduceMotion ? 0 : duration);\n const [transitionStatus, setStatus] = useState<TransitionStatus>(mounted ? 'entered' : 'exited');\n const transitionTimeoutRef = useRef<number>(-1);\n const delayTimeoutRef = useRef<number>(-1);\n const rafRef = useRef(-1);\n\n function clearAllTimeouts() {\n window.clearTimeout(transitionTimeoutRef.current);\n window.clearTimeout(delayTimeoutRef.current);\n cancelAnimationFrame(rafRef.current);\n }\n\n const handleStateChange = (shouldMount: boolean) => {\n clearAllTimeouts();\n const preHandler = shouldMount ? onEnter : onExit;\n const handler = shouldMount ? onEntered : onExited;\n const newTransitionDuration = reduceMotion ? 0 : shouldMount ? duration : exitDuration;\n setTransitionDuration(newTransitionDuration);\n\n if (newTransitionDuration === 0) {\n typeof preHandler === 'function' && preHandler();\n typeof handler === 'function' && handler();\n setStatus(shouldMount ? 'entered' : 'exited');\n } else {\n rafRef.current = requestAnimationFrame(() => {\n ReactDOM.flushSync(() => {\n setStatus(shouldMount ? 'pre-entering' : 'pre-exiting');\n });\n rafRef.current = requestAnimationFrame(() => {\n typeof preHandler === 'function' && preHandler();\n setStatus(shouldMount ? 'entering' : 'exiting');\n transitionTimeoutRef.current = window.setTimeout(() => {\n typeof handler === 'function' && handler();\n setStatus(shouldMount ? 'entered' : 'exited');\n }, newTransitionDuration);\n });\n });\n }\n };\n\n const handleTransitionWithDelay = (shouldMount: boolean) => {\n clearAllTimeouts();\n const delay = shouldMount ? enterDelay : exitDelay;\n if (typeof delay !== 'number') {\n handleStateChange(shouldMount);\n return;\n }\n delayTimeoutRef.current = window.setTimeout(\n () => {\n handleStateChange(shouldMount);\n },\n shouldMount ? enterDelay : exitDelay\n );\n };\n\n useDidUpdate(() => {\n handleTransitionWithDelay(mounted);\n }, [mounted]);\n\n useEffect(\n () => () => {\n clearAllTimeouts();\n },\n []\n );\n\n return {\n transitionDuration,\n transitionStatus,\n transitionTimingFunction: timingFunction \|\| 'ease',\n };\n}\n"],"mappings":";;;;;;;;AA0BA,SAAgB,cAAc,EAC5B,UACA,cACA,gBACA,SACA,SACA,QACA,WACA,UACA,YACA,aACgB;CAChB,MAAM,QAAQA,6BAAAA,gBAAgB;CAC9B,MAAM,sBAAA,GAAA,eAAA,~~kBAAsC~~;CAC5C,MAAM,eAAe,MAAM,uBAAuB,qBAAqB;CACvE,MAAM,CAAC,oBAAoB,0BAAA,GAAA,MAAA,~~UAAkC~~,eAAe,IAAI,QAAQ;CACxF,MAAM,CAAC,kBAAkB,cAAA,GAAA,MAAA,~~UAAwC~~,UAAU,YAAY,QAAQ;CAC/F,MAAM,wBAAA,GAAA,MAAA,~~QAAsC~~,EAAE;CAC9C,MAAM,mBAAA,GAAA,MAAA,~~QAAiC~~,EAAE;CACzC,MAAM,UAAA,GAAA,MAAA,~~QAAgB~~,EAAE;CAExB,SAAS,mBAAmB;EAC1B,OAAO,aAAa,qBAAqB,OAAO;EAChD,OAAO,aAAa,gBAAgB,OAAO;EAC3C,qBAAqB,OAAO,OAAO;CACrC;CAEA,MAAM,qBAAqB,gBAAyB;EAClD,iBAAiB;EACjB,MAAM,aAAa,cAAc,UAAU;EAC3C,MAAM,UAAU,cAAc,YAAY;EAC1C,MAAM,wBAAwB,eAAe,IAAI,cAAc,WAAW;EAC1E,sBAAsB,qBAAqB;EAE3C,IAAI,0BAA0B,GAAG;GAC/B,OAAO,eAAe,cAAc,WAAW;GAC/C,OAAO,YAAY,cAAc,QAAQ;GACzC,UAAU,cAAc,YAAY,QAAQ;EAC9C,OACE,OAAO,UAAU,4BAA4B;GAC3C,UAAA,QAAS,gBAAgB;IACvB,UAAU,cAAc,iBAAiB,aAAa;GACxD,CAAC;GACD,OAAO,UAAU,4BAA4B;IAC3C,OAAO,eAAe,cAAc,WAAW;IAC/C,UAAU,cAAc,aAAa,SAAS;IAC9C,qBAAqB,UAAU,OAAO,iBAAiB;KACrD,OAAO,YAAY,cAAc,QAAQ;KACzC,UAAU,cAAc,YAAY,QAAQ;IAC9C,GAAG,qBAAqB;GAC1B,CAAC;EACH,CAAC;CAEL;CAEA,MAAM,6BAA6B,gBAAyB;EAC1D,iBAAiB;EAEjB,IAAI,QADU,cAAc,aAAa,eACpB,UAAU;GAC7B,kBAAkB,WAAW;GAC7B;EACF;EACA,gBAAgB,UAAU,OAAO,iBACzB;GACJ,kBAAkB,WAAW;EAC/B,GACA,cAAc,aAAa,SAC7B;CACF;CAEA,CAAA,GAAA,eAAA,~~oBAAmB~~;EACjB,0BAA0B,OAAO;CACnC,GAAG,CAAC,OAAO,CAAC;CAEZ,CAAA,GAAA,MAAA,~~uBACc~~;EACV,iBAAiB;CACnB,GACA,CAAC,CACH;CAEA,OAAO;EACL;EACA;EACA,0BAA0B,kBAAkB;CAC9C;AACF"}
1	+ {"version":3,"file":"use-transition.cjs","names":["useMantineTheme"],"sources":["../../../src/components/Transition/use-transition.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport ReactDOM from 'react-dom';\nimport { useDidUpdate, useReducedMotion } from '@mantine/hooks';\nimport { useMantineTheme } from '../../core';\n\nexport type TransitionStatus =\n \| 'entered'\n \| 'exited'\n \| 'entering'\n \| 'exiting'\n \| 'pre-exiting'\n \| 'pre-entering';\n\ninterface UseTransition {\n duration: number;\n exitDuration: number;\n timingFunction: string;\n mounted: boolean;\n onEnter?: () => void;\n onExit?: () => void;\n onEntered?: () => void;\n onExited?: () => void;\n enterDelay?: number;\n exitDelay?: number;\n}\n\nexport function useTransition({\n duration,\n exitDuration,\n timingFunction,\n mounted,\n onEnter,\n onExit,\n onEntered,\n onExited,\n enterDelay,\n exitDelay,\n}: UseTransition) {\n const theme = useMantineTheme();\n const shouldReduceMotion = useReducedMotion();\n const reduceMotion = theme.respectReducedMotion ? shouldReduceMotion : false;\n const [transitionDuration, setTransitionDuration] = useState(reduceMotion ? 0 : duration);\n const [transitionStatus, setStatus] = useState<TransitionStatus>(mounted ? 'entered' : 'exited');\n const transitionTimeoutRef = useRef<number>(-1);\n const delayTimeoutRef = useRef<number>(-1);\n const rafRef = useRef(-1);\n\n function clearAllTimeouts() {\n window.clearTimeout(transitionTimeoutRef.current);\n window.clearTimeout(delayTimeoutRef.current);\n cancelAnimationFrame(rafRef.current);\n }\n\n const handleStateChange = (shouldMount: boolean) => {\n clearAllTimeouts();\n const preHandler = shouldMount ? onEnter : onExit;\n const handler = shouldMount ? onEntered : onExited;\n const newTransitionDuration = reduceMotion ? 0 : shouldMount ? duration : exitDuration;\n setTransitionDuration(newTransitionDuration);\n\n if (newTransitionDuration === 0) {\n typeof preHandler === 'function' && preHandler();\n typeof handler === 'function' && handler();\n setStatus(shouldMount ? 'entered' : 'exited');\n } else {\n rafRef.current = requestAnimationFrame(() => {\n ReactDOM.flushSync(() => {\n setStatus(shouldMount ? 'pre-entering' : 'pre-exiting');\n });\n rafRef.current = requestAnimationFrame(() => {\n typeof preHandler === 'function' && preHandler();\n setStatus(shouldMount ? 'entering' : 'exiting');\n transitionTimeoutRef.current = window.setTimeout(() => {\n typeof handler === 'function' && handler();\n setStatus(shouldMount ? 'entered' : 'exited');\n }, newTransitionDuration);\n });\n });\n }\n };\n\n const handleTransitionWithDelay = (shouldMount: boolean) => {\n clearAllTimeouts();\n const delay = shouldMount ? enterDelay : exitDelay;\n if (typeof delay !== 'number') {\n handleStateChange(shouldMount);\n return;\n }\n delayTimeoutRef.current = window.setTimeout(\n () => {\n handleStateChange(shouldMount);\n },\n shouldMount ? enterDelay : exitDelay\n );\n };\n\n useDidUpdate(() => {\n handleTransitionWithDelay(mounted);\n }, [mounted]);\n\n useEffect(\n () => () => {\n clearAllTimeouts();\n },\n []\n );\n\n return {\n transitionDuration,\n transitionStatus,\n transitionTimingFunction: timingFunction \|\| 'ease',\n };\n}\n"],"mappings":";;;;;;;;AA0BA,SAAgB,cAAc,EAC5B,UACA,cACA,gBACA,SACA,SACA,QACA,WACA,UACA,YACA,aACgB;CAChB,MAAM,QAAQA,6BAAAA,gBAAgB;CAC9B,MAAM,sBAAA,GAAA,eAAA,iBAAA,CAAsC;CAC5C,MAAM,eAAe,MAAM,uBAAuB,qBAAqB;CACvE,MAAM,CAAC,oBAAoB,0BAAA,GAAA,MAAA,SAAA,CAAkC,eAAe,IAAI,QAAQ;CACxF,MAAM,CAAC,kBAAkB,cAAA,GAAA,MAAA,SAAA,CAAwC,UAAU,YAAY,QAAQ;CAC/F,MAAM,wBAAA,GAAA,MAAA,OAAA,CAAsC,EAAE;CAC9C,MAAM,mBAAA,GAAA,MAAA,OAAA,CAAiC,EAAE;CACzC,MAAM,UAAA,GAAA,MAAA,OAAA,CAAgB,EAAE;CAExB,SAAS,mBAAmB;EAC1B,OAAO,aAAa,qBAAqB,OAAO;EAChD,OAAO,aAAa,gBAAgB,OAAO;EAC3C,qBAAqB,OAAO,OAAO;CACrC;CAEA,MAAM,qBAAqB,gBAAyB;EAClD,iBAAiB;EACjB,MAAM,aAAa,cAAc,UAAU;EAC3C,MAAM,UAAU,cAAc,YAAY;EAC1C,MAAM,wBAAwB,eAAe,IAAI,cAAc,WAAW;EAC1E,sBAAsB,qBAAqB;EAE3C,IAAI,0BAA0B,GAAG;GAC/B,OAAO,eAAe,cAAc,WAAW;GAC/C,OAAO,YAAY,cAAc,QAAQ;GACzC,UAAU,cAAc,YAAY,QAAQ;EAC9C,OACE,OAAO,UAAU,4BAA4B;GAC3C,UAAA,QAAS,gBAAgB;IACvB,UAAU,cAAc,iBAAiB,aAAa;GACxD,CAAC;GACD,OAAO,UAAU,4BAA4B;IAC3C,OAAO,eAAe,cAAc,WAAW;IAC/C,UAAU,cAAc,aAAa,SAAS;IAC9C,qBAAqB,UAAU,OAAO,iBAAiB;KACrD,OAAO,YAAY,cAAc,QAAQ;KACzC,UAAU,cAAc,YAAY,QAAQ;IAC9C,GAAG,qBAAqB;GAC1B,CAAC;EACH,CAAC;CAEL;CAEA,MAAM,6BAA6B,gBAAyB;EAC1D,iBAAiB;EAEjB,IAAI,QADU,cAAc,aAAa,eACpB,UAAU;GAC7B,kBAAkB,WAAW;GAC7B;EACF;EACA,gBAAgB,UAAU,OAAO,iBACzB;GACJ,kBAAkB,WAAW;EAC/B,GACA,cAAc,aAAa,SAC7B;CACF;CAEA,CAAA,GAAA,eAAA,aAAA,OAAmB;EACjB,0BAA0B,OAAO;CACnC,GAAG,CAAC,OAAO,CAAC;CAEZ,CAAA,GAAA,MAAA,UAAA,aACc;EACV,iBAAiB;CACnB,GACA,CAAC,CACH;CAEA,OAAO;EACL;EACA;EACA,0BAA0B,kBAAkB;CAC9C;AACF"}

package/cjs/components/Tree/FlatTreeNode.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FlatTreeNode.cjs","names":["findElementAncestor","classes"],"sources":["../../../src/components/Tree/FlatTreeNode.tsx"],"sourcesContent":["import { memo, useRef } from 'react';\nimport { findElementAncestor } from '../../core';\nimport type { FlatTreeLineState } from './flatten-tree-data/flatten-tree-data';\nimport type { RenderNode, TreeNodeData } from './Tree';\nimport type { TreeController } from './use-tree';\nimport classes from './Tree.module.css';\n\nexport interface FlatTreeNodeProps {\n /** Node data from tree data /\n node: TreeNodeData;\n\n /* Nesting level of the node, starts at 1 /\n level: number;\n\n /* Value of the parent node, `null` for root nodes /\n parent: string \| null;\n\n /* Whether the node has children /\n hasChildren: boolean;\n\n /* Whether the node is expanded /\n expanded: boolean;\n\n /* Tree controller instance, return value of `useTree` hook /\n tree: TreeController;\n\n /* If set, tree node with children is expanded on click @default true /\n expandOnClick?: boolean;\n\n /* If set, tree node is selected on click @default false /\n selectOnClick?: boolean;\n\n /* If set, tree node with children is expanded on space key press @default true /\n expandOnSpace?: boolean;\n\n /* If set, tree node is checked on space key press @default false /\n checkOnSpace?: boolean;\n\n /* A function to render tree node label /\n renderNode?: RenderNode;\n\n /* Style to apply to the root element, used for virtualizer positioning /\n style?: React.CSSProperties;\n\n /* Tab index for the node /\n tabIndex?: number;\n\n /* Line state per ancestor + own level, computed by `flattenTreeData`.\n * When provided and the tree root has `data-with-lines`, connector lines are rendered. /\n linesPath?: FlatTreeLineState[];\n}\n\nexport const FlatTreeNode = memo(function FlatTreeNode({\n node,\n level,\n parent,\n hasChildren,\n expanded,\n tree,\n expandOnClick = true,\n selectOnClick,\n expandOnSpace = true,\n checkOnSpace,\n renderNode,\n style,\n tabIndex = -1,\n linesPath,\n}: FlatTreeNodeProps) {\n const ref = useRef<HTMLDivElement>(null);\n const isLoading = tree.isNodeLoading(node.value);\n const loadError = tree.getNodeLoadError(node.value);\n const selected = tree.selectedState.includes(node.value);\n\n const handleClick = (event: React.MouseEvent) => {\n event.stopPropagation();\n\n if (expandOnClick && hasChildren) {\n tree.toggleExpanded(node.value);\n }\n\n if (selectOnClick) {\n tree.select(node.value);\n }\n\n ref.current?.focus();\n };\n\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if (event.nativeEvent.code === 'ArrowRight') {\n event.stopPropagation();\n event.preventDefault();\n\n if (expanded && hasChildren) {\n const root = findElementAncestor(event.currentTarget as HTMLElement, '[data-tree-root]');\n const nodes = root\n ? Array.from(root.querySelectorAll<HTMLElement>('[role=treeitem]')).filter(\n (treeNode) => treeNode.style.display !== 'none'\n )\n : [];\n const index = nodes.indexOf(event.currentTarget as HTMLElement);\n if (index !== -1) {\n nodes[index + 1]?.focus();\n }\n } else if (hasChildren) {\n tree.expand(node.value);\n }\n }\n\n if (event.nativeEvent.code === 'ArrowLeft') {\n event.stopPropagation();\n event.preventDefault();\n\n if (expanded && hasChildren) {\n tree.collapse(node.value);\n } else if (parent) {\n const root = findElementAncestor(event.currentTarget as HTMLElement, '[data-tree-root]');\n const parentElement = root?.querySelector<HTMLElement>(\n `[role=treeitem][data-value=\"${CSS.escape(parent)}\"]`\n );\n parentElement?.focus();\n }\n }\n\n if (event.nativeEvent.code === 'ArrowDown' \|\| event.nativeEvent.code === 'ArrowUp') {\n const root = findElementAncestor(event.currentTarget as HTMLElement, '[data-tree-root]');\n\n if (!root) {\n return;\n }\n\n event.stopPropagation();\n event.preventDefault();\n const nodes = Array.from(root.querySelectorAll<HTMLElement>('[role=treeitem]')).filter(\n (treeNode) => treeNode.style.display !== 'none'\n );\n const index = nodes.indexOf(event.currentTarget as HTMLElement);\n\n if (index === -1) {\n return;\n }\n\n const nextIndex = event.nativeEvent.code === 'ArrowDown' ? index + 1 : index - 1;\n nodes[nextIndex]?.focus();\n }\n\n if (event.nativeEvent.code === 'Space') {\n if (expandOnSpace) {\n event.stopPropagation();\n event.preventDefault();\n tree.toggleExpanded(node.value);\n }\n\n if (checkOnSpace) {\n event.stopPropagation();\n event.preventDefault();\n if (tree.isNodeChecked(node.value)) {\n tree.uncheckNode(node.value);\n } else {\n tree.checkNode(node.value);\n }\n }\n }\n };\n\n const elementProps = {\n className: classes.label,\n style: {} as React.CSSProperties,\n onClick: handleClick,\n 'data-selected': selected \|\| undefined,\n 'data-value': node.value,\n };\n\n return (\n <div\n ref={ref}\n className={classes.node}\n style={{\n ...({\n '--label-offset': `calc(var(--level-offset, var(--mantine-spacing-lg)) ${level - 1})`,\n } as React.CSSProperties),\n ...style,\n }}\n role=\"treeitem\"\n aria-selected={selected}\n aria-expanded={hasChildren ? expanded : undefined}\n data-value={node.value}\n data-selected={selected \|\| undefined}\n data-level={level}\n tabIndex={tabIndex}\n onKeyDown={handleKeyDown}\n >\n {linesPath?.map((state, idx) => {\n if (state === 'none') {\n return null;\n }\n const column = idx + 2;\n return (\n <span\n key={column}\n aria-hidden\n className={`${classes.flatLine}${state === 'closing' ? ` ${classes.flatLineClosing}` : ''}`}\n style={{ '--flat-line-column': column } as React.CSSProperties}\n />\n );\n })}\n {typeof renderNode === 'function' ? (\n renderNode({\n node,\n level,\n selected,\n isRoot: level === 1,\n tree,\n expanded,\n hasChildren,\n isLoading,\n loadError,\n elementProps,\n dragHandleProps: undefined,\n })\n ) : (\n <div {...elementProps}>{node.label}</div>\n )}\n </div>\n );\n});\n\nFlatTreeNode.displayName = '@mantine/core/FlatTreeNode';\n"],"mappings":";;;;;;AAoDA,MAAa,gBAAA,GAAA,MAAA,~~MAAoB~~,SAAS,aAAa,EACrD,MACA,OACA,QACA,aACA,UACA,MACA,gBAAgB,MAChB,eACA,gBAAgB,MAChB,cACA,YACA,OACA,WAAW,IACX,aACoB;CACpB,MAAM,OAAA,GAAA,MAAA,~~QAA6B~~,IAAI;CACvC,MAAM,YAAY,KAAK,cAAc,KAAK,KAAK;CAC/C,MAAM,YAAY,KAAK,iBAAiB,KAAK,KAAK;CAClD,MAAM,WAAW,KAAK,cAAc,SAAS,KAAK,KAAK;CAEvD,MAAM,eAAe,UAA4B;EAC/C,MAAM,gBAAgB;EAEtB,IAAI,iBAAiB,aACnB,KAAK,eAAe,KAAK,KAAK;EAGhC,IAAI,eACF,KAAK,OAAO,KAAK,KAAK;EAGxB,IAAI,SAAS,MAAM;CACrB;CAEA,MAAM,iBAAiB,UAA+B;EACpD,IAAI,MAAM,YAAY,SAAS,cAAc;GAC3C,MAAM,gBAAgB;GACtB,MAAM,eAAe;GAErB,IAAI,YAAY,aAAa;IAC3B,MAAM,OAAOA,8BAAAA,oBAAoB,MAAM,eAA8B,kBAAkB;IACvF,MAAM,QAAQ,OACV,MAAM,KAAK,KAAK,iBAA8B,iBAAiB,CAAC,~~EAAE~~,QAC/D,aAAa,SAAS,MAAM,YAAY,MAC3C,IACA,CAAC;IACL,MAAM,QAAQ,MAAM,QAAQ,MAAM,aAA4B;IAC9D,IAAI,UAAU,IACZ,MAAM,QAAQ,~~IAAI~~,MAAM;GAE5B,OAAO,IAAI,aACT,KAAK,OAAO,KAAK,KAAK;EAE1B;EAEA,IAAI,MAAM,YAAY,SAAS,aAAa;GAC1C,MAAM,gBAAgB;GACtB,MAAM,eAAe;GAErB,IAAI,YAAY,aACd,KAAK,SAAS,KAAK,KAAK;QACnB,IAAI,QAKT,CAJaA,8BAAAA,oBAAoB,MAAM,eAA8B,kBAC5C,~~GAAG~~,cAC1B,+BAA+B,IAAI,OAAO,MAAM,EAAE,GACpD,~~IACe~~,MAAM;EAEzB;EAEA,IAAI,MAAM,YAAY,SAAS,eAAe,MAAM,YAAY,SAAS,WAAW;GAClF,MAAM,OAAOA,8BAAAA,oBAAoB,MAAM,eAA8B,kBAAkB;GAEvF,IAAI,CAAC,MACH;GAGF,MAAM,gBAAgB;GACtB,MAAM,eAAe;GACrB,MAAM,QAAQ,MAAM,KAAK,KAAK,iBAA8B,iBAAiB,CAAC,~~EAAE~~,QAC7E,aAAa,SAAS,MAAM,YAAY,MAC3C;GACA,MAAM,QAAQ,MAAM,QAAQ,MAAM,aAA4B;GAE9D,IAAI,UAAU,IACZ;GAIF,MADkB,MAAM,YAAY,SAAS,cAAc,QAAQ,IAAI,QAAQ,~~IAC7D~~,MAAM;EAC1B;EAEA,IAAI,MAAM,YAAY,SAAS,SAAS;GACtC,IAAI,eAAe;IACjB,MAAM,gBAAgB;IACtB,MAAM,eAAe;IACrB,KAAK,eAAe,KAAK,KAAK;GAChC;GAEA,IAAI,cAAc;IAChB,MAAM,gBAAgB;IACtB,MAAM,eAAe;IACrB,IAAI,KAAK,cAAc,KAAK,KAAK,GAC/B,KAAK,YAAY,KAAK,KAAK;SAE3B,KAAK,UAAU,KAAK,KAAK;GAE7B;EACF;CACF;CAEA,MAAM,eAAe;EACnB,WAAWC,oBAAAA,QAAQ;EACnB,OAAO,CAAC;EACR,SAAS;EACT,iBAAiB,YAAY,KAAA;EAC7B,cAAc,KAAK;CACrB;CAEA,OACE,iBAAA,GAAA,kBAAA,~~MAAC~~,OAAD;EACO;EACL,WAAWA,oBAAAA,QAAQ;EACnB,OAAO;GAEH,kBAAkB,yDAAyD,QAAQ,EAAE;GAEvF,GAAG;EACL;EACA,MAAK;EACL,iBAAe;EACf,iBAAe,cAAc,WAAW,KAAA;EACxC,cAAY,KAAK;EACjB,iBAAe,YAAY,KAAA;EAC3B,cAAY;EACF;EACV,WAAW;YAhBb,CAkBG,WAAW,KAAK,OAAO,QAAQ;GAC9B,IAAI,UAAU,QACZ,OAAO;GAET,MAAM,SAAS,MAAM;GACrB,OACE,iBAAA,GAAA,kBAAA,~~KAAC~~,QAAD;IAEE,eAAA;IACA,WAAW,GAAGA,oBAAAA,QAAQ,WAAW,UAAU,YAAY,IAAIA,oBAAAA,QAAQ,oBAAoB;IACvF,OAAO,EAAE,sBAAsB,OAAO;GACvC,GAJM,MAIN;EAEL,CAAC,GACA,OAAO,eAAe,aACrB,WAAW;GACT;GACA;GACA;GACA,QAAQ,UAAU;GAClB;GACA;GACA;GACA;GACA;GACA;GACA,iBAAiB,KAAA;EACnB,CAAC,IAED,iBAAA,GAAA,kBAAA,~~KAAC~~,OAAD;GAAK,GAAI;aAAe,KAAK;EAAW,CAAA,CAEvC;;AAET,CAAC;AAED,aAAa,cAAc"}
1	+ {"version":3,"file":"FlatTreeNode.cjs","names":["findElementAncestor","classes"],"sources":["../../../src/components/Tree/FlatTreeNode.tsx"],"sourcesContent":["import { memo, useRef } from 'react';\nimport { findElementAncestor } from '../../core';\nimport type { FlatTreeLineState } from './flatten-tree-data/flatten-tree-data';\nimport type { RenderNode, TreeNodeData } from './Tree';\nimport type { TreeController } from './use-tree';\nimport classes from './Tree.module.css';\n\nexport interface FlatTreeNodeProps {\n /** Node data from tree data /\n node: TreeNodeData;\n\n /* Nesting level of the node, starts at 1 /\n level: number;\n\n /* Value of the parent node, `null` for root nodes /\n parent: string \| null;\n\n /* Whether the node has children /\n hasChildren: boolean;\n\n /* Whether the node is expanded /\n expanded: boolean;\n\n /* Tree controller instance, return value of `useTree` hook /\n tree: TreeController;\n\n /* If set, tree node with children is expanded on click @default true /\n expandOnClick?: boolean;\n\n /* If set, tree node is selected on click @default false /\n selectOnClick?: boolean;\n\n /* If set, tree node with children is expanded on space key press @default true /\n expandOnSpace?: boolean;\n\n /* If set, tree node is checked on space key press @default false /\n checkOnSpace?: boolean;\n\n /* A function to render tree node label /\n renderNode?: RenderNode;\n\n /* Style to apply to the root element, used for virtualizer positioning /\n style?: React.CSSProperties;\n\n /* Tab index for the node /\n tabIndex?: number;\n\n /* Line state per ancestor + own level, computed by `flattenTreeData`.\n * When provided and the tree root has `data-with-lines`, connector lines are rendered. /\n linesPath?: FlatTreeLineState[];\n}\n\nexport const FlatTreeNode = memo(function FlatTreeNode({\n node,\n level,\n parent,\n hasChildren,\n expanded,\n tree,\n expandOnClick = true,\n selectOnClick,\n expandOnSpace = true,\n checkOnSpace,\n renderNode,\n style,\n tabIndex = -1,\n linesPath,\n}: FlatTreeNodeProps) {\n const ref = useRef<HTMLDivElement>(null);\n const isLoading = tree.isNodeLoading(node.value);\n const loadError = tree.getNodeLoadError(node.value);\n const selected = tree.selectedState.includes(node.value);\n\n const handleClick = (event: React.MouseEvent) => {\n event.stopPropagation();\n\n if (expandOnClick && hasChildren) {\n tree.toggleExpanded(node.value);\n }\n\n if (selectOnClick) {\n tree.select(node.value);\n }\n\n ref.current?.focus();\n };\n\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if (event.nativeEvent.code === 'ArrowRight') {\n event.stopPropagation();\n event.preventDefault();\n\n if (expanded && hasChildren) {\n const root = findElementAncestor(event.currentTarget as HTMLElement, '[data-tree-root]');\n const nodes = root\n ? Array.from(root.querySelectorAll<HTMLElement>('[role=treeitem]')).filter(\n (treeNode) => treeNode.style.display !== 'none'\n )\n : [];\n const index = nodes.indexOf(event.currentTarget as HTMLElement);\n if (index !== -1) {\n nodes[index + 1]?.focus();\n }\n } else if (hasChildren) {\n tree.expand(node.value);\n }\n }\n\n if (event.nativeEvent.code === 'ArrowLeft') {\n event.stopPropagation();\n event.preventDefault();\n\n if (expanded && hasChildren) {\n tree.collapse(node.value);\n } else if (parent) {\n const root = findElementAncestor(event.currentTarget as HTMLElement, '[data-tree-root]');\n const parentElement = root?.querySelector<HTMLElement>(\n `[role=treeitem][data-value=\"${CSS.escape(parent)}\"]`\n );\n parentElement?.focus();\n }\n }\n\n if (event.nativeEvent.code === 'ArrowDown' \|\| event.nativeEvent.code === 'ArrowUp') {\n const root = findElementAncestor(event.currentTarget as HTMLElement, '[data-tree-root]');\n\n if (!root) {\n return;\n }\n\n event.stopPropagation();\n event.preventDefault();\n const nodes = Array.from(root.querySelectorAll<HTMLElement>('[role=treeitem]')).filter(\n (treeNode) => treeNode.style.display !== 'none'\n );\n const index = nodes.indexOf(event.currentTarget as HTMLElement);\n\n if (index === -1) {\n return;\n }\n\n const nextIndex = event.nativeEvent.code === 'ArrowDown' ? index + 1 : index - 1;\n nodes[nextIndex]?.focus();\n }\n\n if (event.nativeEvent.code === 'Space') {\n if (expandOnSpace) {\n event.stopPropagation();\n event.preventDefault();\n tree.toggleExpanded(node.value);\n }\n\n if (checkOnSpace) {\n event.stopPropagation();\n event.preventDefault();\n if (tree.isNodeChecked(node.value)) {\n tree.uncheckNode(node.value);\n } else {\n tree.checkNode(node.value);\n }\n }\n }\n };\n\n const elementProps = {\n className: classes.label,\n style: {} as React.CSSProperties,\n onClick: handleClick,\n 'data-selected': selected \|\| undefined,\n 'data-value': node.value,\n };\n\n return (\n <div\n ref={ref}\n className={classes.node}\n style={{\n ...({\n '--label-offset': `calc(var(--level-offset, var(--mantine-spacing-lg)) ${level - 1})`,\n } as React.CSSProperties),\n ...style,\n }}\n role=\"treeitem\"\n aria-selected={selected}\n aria-expanded={hasChildren ? expanded : undefined}\n data-value={node.value}\n data-selected={selected \|\| undefined}\n data-level={level}\n tabIndex={tabIndex}\n onKeyDown={handleKeyDown}\n >\n {linesPath?.map((state, idx) => {\n if (state === 'none') {\n return null;\n }\n const column = idx + 2;\n return (\n <span\n key={column}\n aria-hidden\n className={`${classes.flatLine}${state === 'closing' ? ` ${classes.flatLineClosing}` : ''}`}\n style={{ '--flat-line-column': column } as React.CSSProperties}\n />\n );\n })}\n {typeof renderNode === 'function' ? (\n renderNode({\n node,\n level,\n selected,\n isRoot: level === 1,\n tree,\n expanded,\n hasChildren,\n isLoading,\n loadError,\n elementProps,\n dragHandleProps: undefined,\n })\n ) : (\n <div {...elementProps}>{node.label}</div>\n )}\n </div>\n );\n});\n\nFlatTreeNode.displayName = '@mantine/core/FlatTreeNode';\n"],"mappings":"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"}

package/cjs/components/Tree/Tree.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tree.cjs","names":["createVarsResolver","getSpacing","factory","useProps","useTree","useStyles","TreeNode","Box","classes"],"sources":["../../../src/components/Tree/Tree.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef } from 'react';\nimport { useClickOutside, useMergedRef } from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSpacing,\n MantineSpacing,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport type { TreeDragDropPayload } from './move-tree-node/move-tree-node';\nimport { TreeNode } from './TreeNode';\nimport type { TreeAllowDrop, TreeDragHandleProps } from './use-tree-node-drag-drop';\nimport { TreeController, useTree } from './use-tree';\nimport classes from './Tree.module.css';\n\nexport interface TreeNodeData {\n label: React.ReactNode;\n value: string;\n nodeProps?: Record<string, any>;\n children?: TreeNodeData[];\n hasChildren?: boolean;\n}\n\nexport interface RenderTreeNodePayload {\n /** Node level in the tree /\n level: number;\n\n /* `true` if the node is expanded, applicable only for nodes with `children` /\n expanded: boolean;\n\n /* `true` if the node has non-empty `children` array or `hasChildren` is set to `true` in the data /\n hasChildren: boolean;\n\n /* `true` if the node is selected /\n selected: boolean;\n\n /* `true` if the node is at the top-most level of the tree (level 1) /\n isRoot: boolean;\n\n /* `true` if the node's children are currently being loaded /\n isLoading: boolean;\n\n /* Error from the last failed load attempt, or `null` /\n loadError: Error \| null;\n\n /* Node data from the `data` prop of `Tree` /\n node: TreeNodeData;\n\n /* Tree controller instance, return value of `useTree` hook /\n tree: TreeController;\n\n /* Props to spread into the root node element /\n elementProps: {\n className: string;\n style: React.CSSProperties;\n onClick: (event: React.MouseEvent) => void;\n 'data-selected': boolean \| undefined;\n 'data-value': string;\n draggable?: boolean;\n onDragStart?: (event: React.DragEvent) => void;\n onDragOver?: (event: React.DragEvent) => void;\n onDragLeave?: (event: React.DragEvent) => void;\n onDrop?: (event: React.DragEvent) => void;\n onDragEnd?: (event: React.DragEvent) => void;\n };\n\n /* Props to spread into the drag handle element when `withDragHandle` is set on `Tree`.\n * `undefined` when `withDragHandle` is not enabled or drag-and-drop is disabled. /\n dragHandleProps: TreeDragHandleProps \| undefined;\n}\n\nexport type RenderNode = (payload: RenderTreeNodePayload) => React.ReactNode;\n\nexport type TreeStylesNames = 'root' \| 'node' \| 'subtree' \| 'label';\nexport type TreeCssVariables = {\n root: '--level-offset';\n};\n\nexport interface TreeDragState {\n draggedValue: string \| null;\n currentDropTarget: HTMLElement \| null;\n}\n\nexport interface TreeProps extends BoxProps, StylesApiProps<TreeFactory>, ElementProps<'ul'> {\n /* Data used to render nodes /\n data: TreeNodeData[];\n\n /* Horizontal padding of each subtree level, key of `theme.spacing` or any valid CSS value @default 'lg' /\n levelOffset?: MantineSpacing;\n\n /* If set, tree node with children is expanded on click @default true /\n expandOnClick?: boolean;\n\n /* If set, tree node with children is expanded on space key press @default true /\n expandOnSpace?: boolean;\n\n /* If set, tree node is checked on space key press @default false /\n checkOnSpace?: boolean;\n\n /* If set, tree node is selected on click @default false /\n selectOnClick?: boolean;\n\n /* Use-tree hook instance that can be used to manipulate component state /\n tree?: TreeController;\n\n /* A function to render tree node label /\n renderNode?: RenderNode;\n\n /* If set, selection is cleared when user clicks outside of the tree @default false /\n clearSelectionOnOutsideClick?: boolean;\n\n /* If set, tree nodes range can be selected with click when `Shift` key is pressed @default true /\n allowRangeSelection?: boolean;\n\n /* If set, subtree content is kept mounted when collapsed. React 19 `Activity` is used to preserve state. @default false /\n keepMounted?: boolean;\n\n /* Called when a node is dropped on another node, enables drag-and-drop when provided /\n onDragDrop?: (payload: TreeDragDropPayload) => void;\n\n /* Called for each potential drop target to determine whether a drop is allowed.\n * When it returns `false`, the drop indicator is hidden and the drop is rejected. /\n allowDrop?: TreeAllowDrop;\n\n /* If set, drag-and-drop must be initiated from an element that spreads `dragHandleProps`\n * from the `renderNode` payload, rather than anywhere on the node. @default false /\n withDragHandle?: boolean;\n\n /* If set, connecting lines are rendered showing parent-child relationships @default false */\n withLines?: boolean;\n}\n\nfunction getFlatValues(data: TreeNodeData[]): string[] {\n return data.reduce<string[]>((acc, item) => {\n acc.push(item.value);\n if (item.children) {\n acc.push(...getFlatValues(item.children));\n }\n return acc;\n }, []);\n}\n\nexport type TreeFactory = Factory<{\n props: TreeProps;\n ref: HTMLUListElement;\n stylesNames: TreeStylesNames;\n vars: TreeCssVariables;\n}>;\n\nconst defaultProps = {\n expandOnClick: true,\n allowRangeSelection: true,\n expandOnSpace: true,\n} satisfies Partial<TreeProps>;\n\nconst varsResolver = createVarsResolver<TreeFactory>((_theme, { levelOffset }) => ({\n root: {\n '--level-offset': getSpacing(levelOffset),\n },\n}));\n\nexport const Tree = factory<TreeFactory>((_props) => {\n const props = useProps('Tree', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n data,\n expandOnClick,\n tree,\n renderNode,\n selectOnClick,\n clearSelectionOnOutsideClick,\n allowRangeSelection,\n expandOnSpace,\n levelOffset,\n checkOnSpace,\n keepMounted,\n onDragDrop,\n allowDrop,\n withDragHandle,\n withLines,\n attributes,\n ref,\n ...others\n } = props;\n\n const defaultController = useTree();\n const controller = tree \|\| defaultController;\n\n const dragStateRef = useRef<TreeDragState>({ draggedValue: null, currentDropTarget: null });\n\n const getStyles = useStyles<TreeFactory>({\n name: 'Tree',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const clickOutsideRef = useClickOutside(\n () => clearSelectionOnOutsideClick && controller.clearSelected()\n );\n\n const mergedRef = useMergedRef(ref, clickOutsideRef);\n\n const flatValues = useMemo(() => getFlatValues(data), [data]);\n\n useEffect(() => {\n controller.initialize(data);\n }, [data]);\n\n const nodes = data.map((node, index) => (\n <TreeNode\n key={node.value}\n node={node}\n getStyles={getStyles}\n rootIndex={index}\n expandOnClick={expandOnClick}\n selectOnClick={selectOnClick}\n controller={controller}\n renderNode={renderNode}\n flatValues={flatValues}\n allowRangeSelection={allowRangeSelection}\n expandOnSpace={expandOnSpace}\n checkOnSpace={checkOnSpace}\n keepMounted={keepMounted}\n onDragDrop={onDragDrop}\n allowDrop={allowDrop}\n withDragHandle={withDragHandle}\n dragStateRef={dragStateRef}\n data={data}\n />\n ));\n\n return (\n <Box\n component=\"ul\"\n ref={mergedRef}\n {...getStyles('root')}\n {...others}\n role=\"tree\"\n aria-multiselectable={controller.multiple}\n data-tree-root\n data-with-lines={withLines \|\| undefined}\n >\n {nodes}\n </Box>\n );\n});\n\nTree.displayName = '@mantine/core/Tree';\nTree.classes = classes;\nTree.varsResolver = varsResolver;\n\nexport namespace Tree {\n export type Props = TreeProps;\n export type StylesNames = TreeStylesNames;\n export type Factory = TreeFactory;\n export type NodeData = TreeNodeData;\n export type RenderNodePayload = RenderTreeNodePayload;\n}\n"],"mappings":";;;;;;;;;;;;;;AA0IA,SAAS,cAAc,MAAgC;CACrD,OAAO,KAAK,QAAkB,KAAK,SAAS;EAC1C,IAAI,KAAK,KAAK,KAAK;EACnB,IAAI,KAAK,UACP,IAAI,KAAK,GAAG,cAAc,KAAK,QAAQ,CAAC;EAE1C,OAAO;CACT,GAAG,CAAC,CAAC;AACP;AASA,MAAM,eAAe;CACnB,eAAe;CACf,qBAAqB;CACrB,eAAe;AACjB;AAEA,MAAM,eAAeA,6BAAAA,oBAAiC,QAAQ,EAAE,mBAAmB,EACjF,MAAM,EACJ,kBAAkBC,iBAAAA,WAAW,WAAW,EAC1C,EACF,EAAE;AAEF,MAAa,OAAOC,gBAAAA,SAAsB,WAAW;CACnD,MAAM,QAAQC,kBAAAA,SAAS,QAAQ,cAAc,MAAM;CACnD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,MACA,eACA,MACA,YACA,eACA,8BACA,qBACA,eACA,aACA,cACA,aACA,YACA,WACA,gBACA,WACA,YACA,KACA,GAAG,WACD;CAEJ,MAAM,oBAAoBC,iBAAAA,QAAQ;CAClC,MAAM,aAAa,QAAQ;CAE3B,MAAM,gBAAA,GAAA,MAAA,~~QAAqC~~;EAAE,cAAc;EAAM,mBAAmB;CAAK,CAAC;CAE1F,MAAM,YAAYC,mBAAAA,UAAuB;EACvC,MAAM;EACN,SAAA,oBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAMD,MAAM,aAAA,GAAA,eAAA,~~cAAyB~~,MAAA,GAAA,eAAA,~~uBAHvB~~,gCAAgC,WAAW,cAAc,CAGf,CAAC;CAEnD,MAAM,cAAA,GAAA,MAAA,~~eAA2B~~,cAAc,IAAI,GAAG,CAAC,IAAI,CAAC;CAE5D,CAAA,GAAA,MAAA,~~iBAAgB~~;EACd,WAAW,WAAW,IAAI;CAC5B,GAAG,CAAC,IAAI,CAAC;CAET,MAAM,QAAQ,KAAK,KAAK,MAAM,UAC5B,iBAAA,GAAA,kBAAA,~~KAACC~~,iBAAAA,UAAD;EAEQ;EACK;EACX,WAAW;EACI;EACA;EACH;EACA;EACA;EACS;EACN;EACD;EACD;EACD;EACD;EACK;EACF;EACR;CACP,GAlBM,KAAK,KAkBX,CACF;CAED,OACE,iBAAA,GAAA,kBAAA,~~KAACC~~,YAAAA,KAAD;EACE,WAAU;EACV,KAAK;EACL,GAAI,UAAU,MAAM;EACpB,GAAI;EACJ,MAAK;EACL,wBAAsB,WAAW;EACjC,kBAAA;EACA,mBAAiB,aAAa,KAAA;YAE7B;CACE,CAAA;AAET,CAAC;AAED,KAAK,cAAc;AACnB,KAAK,UAAUC,oBAAAA;AACf,KAAK,eAAe"}
1	+ {"version":3,"file":"Tree.cjs","names":["createVarsResolver","getSpacing","factory","useProps","useTree","useStyles","TreeNode","Box","classes"],"sources":["../../../src/components/Tree/Tree.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef } from 'react';\nimport { useClickOutside, useMergedRef } from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSpacing,\n MantineSpacing,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport type { TreeDragDropPayload } from './move-tree-node/move-tree-node';\nimport { TreeNode } from './TreeNode';\nimport type { TreeAllowDrop, TreeDragHandleProps } from './use-tree-node-drag-drop';\nimport { TreeController, useTree } from './use-tree';\nimport classes from './Tree.module.css';\n\nexport interface TreeNodeData {\n label: React.ReactNode;\n value: string;\n nodeProps?: Record<string, any>;\n children?: TreeNodeData[];\n hasChildren?: boolean;\n}\n\nexport interface RenderTreeNodePayload {\n /** Node level in the tree /\n level: number;\n\n /* `true` if the node is expanded, applicable only for nodes with `children` /\n expanded: boolean;\n\n /* `true` if the node has non-empty `children` array or `hasChildren` is set to `true` in the data /\n hasChildren: boolean;\n\n /* `true` if the node is selected /\n selected: boolean;\n\n /* `true` if the node is at the top-most level of the tree (level 1) /\n isRoot: boolean;\n\n /* `true` if the node's children are currently being loaded /\n isLoading: boolean;\n\n /* Error from the last failed load attempt, or `null` /\n loadError: Error \| null;\n\n /* Node data from the `data` prop of `Tree` /\n node: TreeNodeData;\n\n /* Tree controller instance, return value of `useTree` hook /\n tree: TreeController;\n\n /* Props to spread into the root node element /\n elementProps: {\n className: string;\n style: React.CSSProperties;\n onClick: (event: React.MouseEvent) => void;\n 'data-selected': boolean \| undefined;\n 'data-value': string;\n draggable?: boolean;\n onDragStart?: (event: React.DragEvent) => void;\n onDragOver?: (event: React.DragEvent) => void;\n onDragLeave?: (event: React.DragEvent) => void;\n onDrop?: (event: React.DragEvent) => void;\n onDragEnd?: (event: React.DragEvent) => void;\n };\n\n /* Props to spread into the drag handle element when `withDragHandle` is set on `Tree`.\n * `undefined` when `withDragHandle` is not enabled or drag-and-drop is disabled. /\n dragHandleProps: TreeDragHandleProps \| undefined;\n}\n\nexport type RenderNode = (payload: RenderTreeNodePayload) => React.ReactNode;\n\nexport type TreeStylesNames = 'root' \| 'node' \| 'subtree' \| 'label';\nexport type TreeCssVariables = {\n root: '--level-offset';\n};\n\nexport interface TreeDragState {\n draggedValue: string \| null;\n currentDropTarget: HTMLElement \| null;\n}\n\nexport interface TreeProps extends BoxProps, StylesApiProps<TreeFactory>, ElementProps<'ul'> {\n /* Data used to render nodes /\n data: TreeNodeData[];\n\n /* Horizontal padding of each subtree level, key of `theme.spacing` or any valid CSS value @default 'lg' /\n levelOffset?: MantineSpacing;\n\n /* If set, tree node with children is expanded on click @default true /\n expandOnClick?: boolean;\n\n /* If set, tree node with children is expanded on space key press @default true /\n expandOnSpace?: boolean;\n\n /* If set, tree node is checked on space key press @default false /\n checkOnSpace?: boolean;\n\n /* If set, tree node is selected on click @default false /\n selectOnClick?: boolean;\n\n /* Use-tree hook instance that can be used to manipulate component state /\n tree?: TreeController;\n\n /* A function to render tree node label /\n renderNode?: RenderNode;\n\n /* If set, selection is cleared when user clicks outside of the tree @default false /\n clearSelectionOnOutsideClick?: boolean;\n\n /* If set, tree nodes range can be selected with click when `Shift` key is pressed @default true /\n allowRangeSelection?: boolean;\n\n /* If set, subtree content is kept mounted when collapsed. React 19 `Activity` is used to preserve state. @default false /\n keepMounted?: boolean;\n\n /* Called when a node is dropped on another node, enables drag-and-drop when provided /\n onDragDrop?: (payload: TreeDragDropPayload) => void;\n\n /* Called for each potential drop target to determine whether a drop is allowed.\n * When it returns `false`, the drop indicator is hidden and the drop is rejected. /\n allowDrop?: TreeAllowDrop;\n\n /* If set, drag-and-drop must be initiated from an element that spreads `dragHandleProps`\n * from the `renderNode` payload, rather than anywhere on the node. @default false /\n withDragHandle?: boolean;\n\n /* If set, connecting lines are rendered showing parent-child relationships @default false */\n withLines?: boolean;\n}\n\nfunction getFlatValues(data: TreeNodeData[]): string[] {\n return data.reduce<string[]>((acc, item) => {\n acc.push(item.value);\n if (item.children) {\n acc.push(...getFlatValues(item.children));\n }\n return acc;\n }, []);\n}\n\nexport type TreeFactory = Factory<{\n props: TreeProps;\n ref: HTMLUListElement;\n stylesNames: TreeStylesNames;\n vars: TreeCssVariables;\n}>;\n\nconst defaultProps = {\n expandOnClick: true,\n allowRangeSelection: true,\n expandOnSpace: true,\n} satisfies Partial<TreeProps>;\n\nconst varsResolver = createVarsResolver<TreeFactory>((_theme, { levelOffset }) => ({\n root: {\n '--level-offset': getSpacing(levelOffset),\n },\n}));\n\nexport const Tree = factory<TreeFactory>((_props) => {\n const props = useProps('Tree', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n data,\n expandOnClick,\n tree,\n renderNode,\n selectOnClick,\n clearSelectionOnOutsideClick,\n allowRangeSelection,\n expandOnSpace,\n levelOffset,\n checkOnSpace,\n keepMounted,\n onDragDrop,\n allowDrop,\n withDragHandle,\n withLines,\n attributes,\n ref,\n ...others\n } = props;\n\n const defaultController = useTree();\n const controller = tree \|\| defaultController;\n\n const dragStateRef = useRef<TreeDragState>({ draggedValue: null, currentDropTarget: null });\n\n const getStyles = useStyles<TreeFactory>({\n name: 'Tree',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const clickOutsideRef = useClickOutside(\n () => clearSelectionOnOutsideClick && controller.clearSelected()\n );\n\n const mergedRef = useMergedRef(ref, clickOutsideRef);\n\n const flatValues = useMemo(() => getFlatValues(data), [data]);\n\n useEffect(() => {\n controller.initialize(data);\n }, [data]);\n\n const nodes = data.map((node, index) => (\n <TreeNode\n key={node.value}\n node={node}\n getStyles={getStyles}\n rootIndex={index}\n expandOnClick={expandOnClick}\n selectOnClick={selectOnClick}\n controller={controller}\n renderNode={renderNode}\n flatValues={flatValues}\n allowRangeSelection={allowRangeSelection}\n expandOnSpace={expandOnSpace}\n checkOnSpace={checkOnSpace}\n keepMounted={keepMounted}\n onDragDrop={onDragDrop}\n allowDrop={allowDrop}\n withDragHandle={withDragHandle}\n dragStateRef={dragStateRef}\n data={data}\n />\n ));\n\n return (\n <Box\n component=\"ul\"\n ref={mergedRef}\n {...getStyles('root')}\n {...others}\n role=\"tree\"\n aria-multiselectable={controller.multiple}\n data-tree-root\n data-with-lines={withLines \|\| undefined}\n >\n {nodes}\n </Box>\n );\n});\n\nTree.displayName = '@mantine/core/Tree';\nTree.classes = classes;\nTree.varsResolver = varsResolver;\n\nexport namespace Tree {\n export type Props = TreeProps;\n export type StylesNames = TreeStylesNames;\n export type Factory = TreeFactory;\n export type NodeData = TreeNodeData;\n export type RenderNodePayload = RenderTreeNodePayload;\n}\n"],"mappings":";;;;;;;;;;;;;;AA0IA,SAAS,cAAc,MAAgC;CACrD,OAAO,KAAK,QAAkB,KAAK,SAAS;EAC1C,IAAI,KAAK,KAAK,KAAK;EACnB,IAAI,KAAK,UACP,IAAI,KAAK,GAAG,cAAc,KAAK,QAAQ,CAAC;EAE1C,OAAO;CACT,GAAG,CAAC,CAAC;AACP;AASA,MAAM,eAAe;CACnB,eAAe;CACf,qBAAqB;CACrB,eAAe;AACjB;AAEA,MAAM,eAAeA,6BAAAA,oBAAiC,QAAQ,EAAE,mBAAmB,EACjF,MAAM,EACJ,kBAAkBC,iBAAAA,WAAW,WAAW,EAC1C,EACF,EAAE;AAEF,MAAa,OAAOC,gBAAAA,SAAsB,WAAW;CACnD,MAAM,QAAQC,kBAAAA,SAAS,QAAQ,cAAc,MAAM;CACnD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,MACA,eACA,MACA,YACA,eACA,8BACA,qBACA,eACA,aACA,cACA,aACA,YACA,WACA,gBACA,WACA,YACA,KACA,GAAG,WACD;CAEJ,MAAM,oBAAoBC,iBAAAA,QAAQ;CAClC,MAAM,aAAa,QAAQ;CAE3B,MAAM,gBAAA,GAAA,MAAA,OAAA,CAAqC;EAAE,cAAc;EAAM,mBAAmB;CAAK,CAAC;CAE1F,MAAM,YAAYC,mBAAAA,UAAuB;EACvC,MAAM;EACN,SAAA,oBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAMD,MAAM,aAAA,GAAA,eAAA,aAAA,CAAyB,MAAA,GAAA,eAAA,gBAAA,OAHvB,gCAAgC,WAAW,cAAc,CAGf,CAAC;CAEnD,MAAM,cAAA,GAAA,MAAA,QAAA,OAA2B,cAAc,IAAI,GAAG,CAAC,IAAI,CAAC;CAE5D,CAAA,GAAA,MAAA,UAAA,OAAgB;EACd,WAAW,WAAW,IAAI;CAC5B,GAAG,CAAC,IAAI,CAAC;CAET,MAAM,QAAQ,KAAK,KAAK,MAAM,UAC5B,iBAAA,GAAA,kBAAA,IAAA,CAACC,iBAAAA,UAAD;EAEQ;EACK;EACX,WAAW;EACI;EACA;EACH;EACA;EACA;EACS;EACN;EACD;EACD;EACD;EACD;EACK;EACF;EACR;CACP,GAlBM,KAAK,KAkBX,CACF;CAED,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,YAAAA,KAAD;EACE,WAAU;EACV,KAAK;EACL,GAAI,UAAU,MAAM;EACpB,GAAI;EACJ,MAAK;EACL,wBAAsB,WAAW;EACjC,kBAAA;EACA,mBAAiB,aAAa,KAAA;YAE7B;CACE,CAAA;AAET,CAAC;AAED,KAAK,cAAc;AACnB,KAAK,UAAUC,oBAAAA;AACf,KAAK,eAAe"}