npm - @mantine/core - Versions diffs - 9.5.2 → 9.6.0 - Mend

@mantine/core 9.5.2 → 9.6.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 (874) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Table.cjs","names":["createVarsResolver","getSpacing","getThemeColor","rem","factory","useProps","useStyles","TableProvider","Box","TableDataRenderer","classes","TableTd","TableTh","TableTr","TableThead","TableTbody","TableTfoot","TableCaption","TableScrollContainer"],"sources":["../../../src/components/Table/Table.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSpacing,\n getThemeColor,\n MantineColor,\n MantineSpacing,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport {\n TableCaption,\n TableTbody,\n TableTd,\n TableTfoot,\n TableTh,\n TableThead,\n TableTr,\n type TableCaptionProps,\n type TableTbodyProps,\n type TableTdProps,\n type TableThProps,\n type TableTrProps,\n type TableTheadProps,\n type TableTfootProps,\n} from './Table.components';\nimport { TableProvider, type TableContextValue } from './Table.context';\nimport { TableDataRenderer } from './TableDataRenderer';\nimport { TableScrollContainer, type TableScrollContainerProps } from './TableScrollContainer';\nimport classes from './Table.module.css';\nexport type TableVariant = 'default' \| 'vertical';\n\nexport type TableStylesNames =\n \| 'table'\n \| 'thead'\n \| 'tbody'\n \| 'tfoot'\n \| 'tr'\n \| 'th'\n \| 'td'\n \| 'caption';\n\nexport type TableCssVariables = {\n table:\n \| '--table-layout'\n \| '--table-border-color'\n \| '--table-caption-side'\n \| '--table-horizontal-spacing'\n \| '--table-vertical-spacing'\n \| '--table-striped-color'\n \| '--table-highlight-on-hover-color'\n \| '--table-sticky-header-offset';\n};\n\nexport interface TableData {\n head?: React.ReactNode[];\n body?: React.ReactNode[][];\n foot?: React.ReactNode[];\n caption?: string;\n}\n\nexport interface TableProps extends BoxProps, StylesApiProps<TableFactory>, ElementProps<'table'> {\n /** Value of `table-layout` style @default auto /\n layout?: React.CSSProperties['tableLayout'];\n\n /* Side of the `Table.Caption` @default bottom /\n captionSide?: 'top' \| 'bottom';\n\n /* Color of table borders, key of `theme.colors` or any valid CSS color /\n borderColor?: MantineColor;\n\n /* If set, the table has the outer border @default false /\n withTableBorder?: boolean;\n\n /* If set, the table has borders between columns @default false /\n withColumnBorders?: boolean;\n\n /* If set, the table has borders between rows @default true /\n withRowBorders?: boolean;\n\n /* Horizontal cells spacing, key of `theme.spacing` or any valid CSS value for padding, numbers are converted to rem @default xs /\n horizontalSpacing?: MantineSpacing;\n\n /* Vertical cells spacing, key of `theme.spacing` or any valid CSS value for padding, numbers are converted to rem @default xs /\n verticalSpacing?: MantineSpacing;\n\n /* If set, every odd/even row background changes to `stripedColor`, if set to `true`, then `odd` value will be used @default false /\n striped?: boolean \| 'odd' \| 'even';\n\n /* Background color of striped rows, key of `theme.colors` or any valid CSS color /\n stripedColor?: MantineColor;\n\n /* If set, table rows background changes to `highlightOnHoverColor` when hovered @default false /\n highlightOnHover?: boolean;\n\n /* Background color of table rows when hovered, key of `theme.colors` or any valid CSS color /\n highlightOnHoverColor?: MantineColor;\n\n /* Data used to generate table, ignored if `children` prop is set /\n data?: TableData;\n\n /* If set, `Table.Thead` is sticky @default false /\n stickyHeader?: boolean;\n\n /* Offset from top at which `Table.Thead` should become sticky @default 0 /\n stickyHeaderOffset?: number \| string;\n\n /* If set, `font-variant-numeric: tabular-nums` style is applied @default false */\n tabularNums?: boolean;\n}\n\nexport type TableFactory = Factory<{\n props: TableProps;\n ref: HTMLTableElement;\n stylesNames: TableStylesNames;\n vars: TableCssVariables;\n variant: TableVariant;\n staticComponents: {\n Thead: typeof TableThead;\n Tbody: typeof TableTbody;\n Tfoot: typeof TableTfoot;\n Td: typeof TableTd;\n Th: typeof TableTh;\n Tr: typeof TableTr;\n Caption: typeof TableCaption;\n ScrollContainer: typeof TableScrollContainer;\n DataRenderer: typeof TableDataRenderer;\n };\n}>;\n\nconst defaultProps = {\n withRowBorders: true,\n verticalSpacing: 7,\n} satisfies Partial<TableProps>;\n\nconst varsResolver = createVarsResolver<TableFactory>(\n (\n theme,\n {\n layout,\n captionSide,\n horizontalSpacing,\n verticalSpacing,\n borderColor,\n stripedColor,\n highlightOnHoverColor,\n striped,\n highlightOnHover,\n stickyHeaderOffset,\n stickyHeader,\n }\n ) => ({\n table: {\n '--table-layout': layout,\n '--table-caption-side': captionSide,\n '--table-horizontal-spacing': getSpacing(horizontalSpacing),\n '--table-vertical-spacing': getSpacing(verticalSpacing),\n '--table-border-color': borderColor ? getThemeColor(borderColor, theme) : undefined,\n '--table-striped-color':\n striped && stripedColor ? getThemeColor(stripedColor, theme) : undefined,\n '--table-highlight-on-hover-color':\n highlightOnHover && highlightOnHoverColor\n ? getThemeColor(highlightOnHoverColor, theme)\n : undefined,\n '--table-sticky-header-offset': stickyHeader ? rem(stickyHeaderOffset) : undefined,\n },\n })\n);\n\nexport const Table = factory<TableFactory>((_props) => {\n const props = useProps('Table', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n horizontalSpacing,\n verticalSpacing,\n captionSide,\n stripedColor,\n highlightOnHoverColor,\n striped,\n highlightOnHover,\n withColumnBorders,\n withRowBorders,\n withTableBorder,\n borderColor,\n layout,\n data,\n children,\n stickyHeader,\n stickyHeaderOffset,\n mod,\n tabularNums,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<TableFactory>({\n name: 'Table',\n props,\n className,\n style,\n classes,\n classNames,\n styles,\n unstyled,\n attributes,\n rootSelector: 'table',\n vars,\n varsResolver,\n });\n\n return (\n <TableProvider\n value={{\n getStyles,\n stickyHeader,\n striped: striped === true ? 'odd' : striped \|\| undefined,\n highlightOnHover,\n withColumnBorders,\n withRowBorders,\n captionSide: captionSide \|\| 'bottom',\n }}\n >\n <Box\n component=\"table\"\n mod={[{ ~~'data-with-table-border':~~ withTableBorder, ~~'data-tabular-nums':~~ tabularNums }, mod]}\n {...getStyles('table')}\n {...others}\n >\n {children \|\| (!!data && <TableDataRenderer data={data} />)}\n </Box>\n </TableProvider>\n );\n});\n\nTable.classes = classes;\nTable.varsResolver = varsResolver;\nTable.displayName = '@mantine/core/Table';\nTable.Td = TableTd;\nTable.Th = TableTh;\nTable.Tr = TableTr;\nTable.Thead = TableThead;\nTable.Tbody = TableTbody;\nTable.Tfoot = TableTfoot;\nTable.Caption = TableCaption;\nTable.ScrollContainer = TableScrollContainer;\nTable.DataRenderer = TableDataRenderer;\n\nexport namespace Table {\n export type Props = TableProps;\n export type StylesNames = TableStylesNames;\n export type CssVariables = TableCssVariables;\n export type Factory = TableFactory;\n export type Data = TableData;\n export type ContextValue = TableContextValue;\n\n export namespace Caption {\n export type Props = TableCaptionProps;\n }\n\n export namespace Tbody {\n export type Props = TableTbodyProps;\n }\n\n export namespace Td {\n export type Props = TableTdProps;\n }\n\n export namespace Th {\n export type Props = TableThProps;\n }\n\n export namespace Tr {\n export type Props = TableTrProps;\n }\n\n export namespace Thead {\n export type Props = TableTheadProps;\n }\n\n export namespace Tfoot {\n export type Props = TableTfootProps;\n }\n\n export namespace ScrollContainer {\n export type Props = TableScrollContainerProps;\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;AAwIA,MAAM,eAAe;CACnB,gBAAgB;CAChB,iBAAiB;AACnB;AAEA,MAAM,eAAeA,6BAAAA,oBAEjB,OACA,EACE,QACA,aACA,mBACA,iBACA,aACA,cACA,uBACA,SACA,kBACA,oBACA,oBAEE,EACJ,OAAO;CACL,kBAAkB;CAClB,wBAAwB;CACxB,8BAA8BC,iBAAAA,WAAW,iBAAiB;CAC1D,4BAA4BA,iBAAAA,WAAW,eAAe;CACtD,wBAAwB,cAAcC,wBAAAA,cAAc,aAAa,KAAK,IAAI,KAAA;CAC1E,yBACE,WAAW,eAAeA,wBAAAA,cAAc,cAAc,KAAK,IAAI,KAAA;CACjE,oCACE,oBAAoB,wBAChBA,wBAAAA,cAAc,uBAAuB,KAAK,IAC1C,KAAA;CACN,gCAAgC,eAAeC,YAAAA,IAAI,kBAAkB,IAAI,KAAA;AAC3E,EACF,EACF;AAEA,MAAa,QAAQC,gBAAAA,SAAuB,WAAW;CACrD,MAAM,QAAQC,kBAAAA,SAAS,SAAS,cAAc,MAAM;CACpD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,mBACA,iBACA,aACA,cACA,uBACA,SACA,kBACA,mBACA,gBACA,iBACA,aACA,QACA,MACA,UACA,cACA,oBACA,KACA,aACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAAwB;EACxC,MAAM;EACN;EACA;EACA;EACA,SAAA,qBAAA;EACA;EACA;EACA;EACA;EACA,cAAc;EACd;EACA;CACF,CAAC;CAED,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,sBAAAA,eAAD;EACE,OAAO;GACL;GACA;GACA,SAAS,YAAY,OAAO,QAAQ,WAAW,KAAA;GAC/C;GACA;GACA;GACA,aAAa,eAAe;EAC9B;~~YAEA~~,iBAAA,GAAA,kBAAA,IAAA,CAACC,YAAAA,KAAD;GACE,WAAU;GACV,KAAK,CAAC;IAAE~~,0BAA0B~~;IAAiB~~,qBAAqB~~;GAAY,GAAG,GAAG;~~GAC1F~~,GAAI,UAAU,OAAO;GACrB,GAAI;~~aAEH~~,YAAa,CAAC,CAAC,QAAQ,iBAAA,GAAA,kBAAA,IAAA,CAACC,0BAAAA,mBAAD,EAAyB,KAAO,CAAA;EACrD,CAAA;CACQ,CAAA;AAEnB,CAAC;AAED,MAAM,UAAUC,qBAAAA;AAChB,MAAM,eAAe;AACrB,MAAM,cAAc;AACpB,MAAM,KAAKC,yBAAAA;AACX,MAAM,KAAKC,yBAAAA;AACX,MAAM,KAAKC,yBAAAA;AACX,MAAM,QAAQC,yBAAAA;AACd,MAAM,QAAQC,yBAAAA;AACd,MAAM,QAAQC,yBAAAA;AACd,MAAM,UAAUC,yBAAAA;AAChB,MAAM,kBAAkBC,6BAAAA;AACxB,MAAM,eAAeT,0BAAAA"}
1	+ {"version":3,"file":"Table.cjs","names":["createVarsResolver","getSpacing","getThemeColor","rem","factory","useProps","useStyles","TableProvider","Box","TableDataRenderer","classes","TableTd","TableTh","TableTr","TableThead","TableTbody","TableTfoot","TableCaption","TableScrollContainer"],"sources":["../../../src/components/Table/Table.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSpacing,\n getThemeColor,\n MantineColor,\n MantineSpacing,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport {\n TableCaption,\n TableTbody,\n TableTd,\n TableTfoot,\n TableTh,\n TableThead,\n TableTr,\n type TableCaptionProps,\n type TableTbodyProps,\n type TableTdProps,\n type TableThProps,\n type TableTrProps,\n type TableTheadProps,\n type TableTfootProps,\n} from './Table.components';\nimport { TableProvider, type TableContextValue } from './Table.context';\nimport { TableDataRenderer } from './TableDataRenderer';\nimport { TableScrollContainer, type TableScrollContainerProps } from './TableScrollContainer';\nimport classes from './Table.module.css';\nexport type TableVariant = 'default' \| 'vertical';\n\nexport type TableStylesNames =\n \| 'table'\n \| 'thead'\n \| 'tbody'\n \| 'tfoot'\n \| 'tr'\n \| 'th'\n \| 'td'\n \| 'caption';\n\nexport type TableCssVariables = {\n table:\n \| '--table-layout'\n \| '--table-border-color'\n \| '--table-caption-side'\n \| '--table-horizontal-spacing'\n \| '--table-vertical-spacing'\n \| '--table-striped-color'\n \| '--table-highlight-on-hover-color'\n \| '--table-sticky-header-offset';\n};\n\nexport interface TableData {\n head?: React.ReactNode[];\n body?: React.ReactNode[][];\n foot?: React.ReactNode[];\n caption?: string;\n}\n\nexport interface TableProps extends BoxProps, StylesApiProps<TableFactory>, ElementProps<'table'> {\n /** Value of `table-layout` style @default auto /\n layout?: React.CSSProperties['tableLayout'];\n\n /* Side of the `Table.Caption` @default bottom /\n captionSide?: 'top' \| 'bottom';\n\n /* Color of table borders, key of `theme.colors` or any valid CSS color /\n borderColor?: MantineColor;\n\n /* If set, the table has the outer border @default false /\n withTableBorder?: boolean;\n\n /* If set, the table has borders between columns @default false /\n withColumnBorders?: boolean;\n\n /* If set, the table has borders between rows @default true /\n withRowBorders?: boolean;\n\n /* Horizontal cells spacing, key of `theme.spacing` or any valid CSS value for padding, numbers are converted to rem @default xs /\n horizontalSpacing?: MantineSpacing;\n\n /* Vertical cells spacing, key of `theme.spacing` or any valid CSS value for padding, numbers are converted to rem @default xs /\n verticalSpacing?: MantineSpacing;\n\n /* If set, every odd/even row background changes to `stripedColor`, if set to `true`, then `odd` value will be used @default false /\n striped?: boolean \| 'odd' \| 'even';\n\n /* Background color of striped rows, key of `theme.colors` or any valid CSS color /\n stripedColor?: MantineColor;\n\n /* If set, table rows background changes to `highlightOnHoverColor` when hovered @default false /\n highlightOnHover?: boolean;\n\n /* Background color of table rows when hovered, key of `theme.colors` or any valid CSS color /\n highlightOnHoverColor?: MantineColor;\n\n /* Data used to generate table, ignored if `children` prop is set /\n data?: TableData;\n\n /* If set, `Table.Thead` is sticky @default false /\n stickyHeader?: boolean;\n\n /* Offset from top at which `Table.Thead` should become sticky @default 0 /\n stickyHeaderOffset?: number \| string;\n\n /* If set, `font-variant-numeric: tabular-nums` style is applied @default false */\n tabularNums?: boolean;\n}\n\nexport type TableFactory = Factory<{\n props: TableProps;\n ref: HTMLTableElement;\n stylesNames: TableStylesNames;\n vars: TableCssVariables;\n variant: TableVariant;\n staticComponents: {\n Thead: typeof TableThead;\n Tbody: typeof TableTbody;\n Tfoot: typeof TableTfoot;\n Td: typeof TableTd;\n Th: typeof TableTh;\n Tr: typeof TableTr;\n Caption: typeof TableCaption;\n ScrollContainer: typeof TableScrollContainer;\n DataRenderer: typeof TableDataRenderer;\n };\n}>;\n\nconst defaultProps = {\n withRowBorders: true,\n verticalSpacing: 7,\n} satisfies Partial<TableProps>;\n\nconst varsResolver = createVarsResolver<TableFactory>(\n (\n theme,\n {\n layout,\n captionSide,\n horizontalSpacing,\n verticalSpacing,\n borderColor,\n stripedColor,\n highlightOnHoverColor,\n striped,\n highlightOnHover,\n stickyHeaderOffset,\n stickyHeader,\n }\n ) => ({\n table: {\n '--table-layout': layout,\n '--table-caption-side': captionSide,\n '--table-horizontal-spacing': getSpacing(horizontalSpacing),\n '--table-vertical-spacing': getSpacing(verticalSpacing),\n '--table-border-color': borderColor ? getThemeColor(borderColor, theme) : undefined,\n '--table-striped-color':\n striped && stripedColor ? getThemeColor(stripedColor, theme) : undefined,\n '--table-highlight-on-hover-color':\n highlightOnHover && highlightOnHoverColor\n ? getThemeColor(highlightOnHoverColor, theme)\n : undefined,\n '--table-sticky-header-offset': stickyHeader ? rem(stickyHeaderOffset) : undefined,\n },\n })\n);\n\nexport const Table = factory<TableFactory>((_props) => {\n const props = useProps('Table', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n horizontalSpacing,\n verticalSpacing,\n captionSide,\n stripedColor,\n highlightOnHoverColor,\n striped,\n highlightOnHover,\n withColumnBorders,\n withRowBorders,\n withTableBorder,\n borderColor,\n layout,\n data,\n children,\n stickyHeader,\n stickyHeaderOffset,\n mod,\n tabularNums,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<TableFactory>({\n name: 'Table',\n props,\n className,\n style,\n classes,\n classNames,\n styles,\n unstyled,\n attributes,\n rootSelector: 'table',\n vars,\n varsResolver,\n });\n\n return (\n <TableProvider\n value={{\n getStyles,\n stickyHeader,\n striped: striped === true ? 'odd' : striped \|\| undefined,\n highlightOnHover,\n withColumnBorders,\n withRowBorders,\n captionSide: captionSide \|\| 'bottom',\n }}\n >\n <Box\n component=\"table\"\n mod={[{ withTableBorder, tabularNums }, mod]}\n {...getStyles('table')}\n {...others}\n >\n {children \|\| (!!data && <TableDataRenderer data={data} />)}\n </Box>\n </TableProvider>\n );\n});\n\nTable.classes = classes;\nTable.varsResolver = varsResolver;\nTable.displayName = '@mantine/core/Table';\nTable.Td = TableTd;\nTable.Th = TableTh;\nTable.Tr = TableTr;\nTable.Thead = TableThead;\nTable.Tbody = TableTbody;\nTable.Tfoot = TableTfoot;\nTable.Caption = TableCaption;\nTable.ScrollContainer = TableScrollContainer;\nTable.DataRenderer = TableDataRenderer;\n\nexport namespace Table {\n export type Props = TableProps;\n export type StylesNames = TableStylesNames;\n export type CssVariables = TableCssVariables;\n export type Factory = TableFactory;\n export type Data = TableData;\n export type ContextValue = TableContextValue;\n\n export namespace Caption {\n export type Props = TableCaptionProps;\n }\n\n export namespace Tbody {\n export type Props = TableTbodyProps;\n }\n\n export namespace Td {\n export type Props = TableTdProps;\n }\n\n export namespace Th {\n export type Props = TableThProps;\n }\n\n export namespace Tr {\n export type Props = TableTrProps;\n }\n\n export namespace Thead {\n export type Props = TableTheadProps;\n }\n\n export namespace Tfoot {\n export type Props = TableTfootProps;\n }\n\n export namespace ScrollContainer {\n export type Props = TableScrollContainerProps;\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;AAwIA,MAAM,eAAe;CACnB,gBAAgB;CAChB,iBAAiB;AACnB;AAEA,MAAM,eAAeA,6BAAAA,oBAEjB,OACA,EACE,QACA,aACA,mBACA,iBACA,aACA,cACA,uBACA,SACA,kBACA,oBACA,oBAEE,EACJ,OAAO;CACL,kBAAkB;CAClB,wBAAwB;CACxB,8BAA8BC,iBAAAA,WAAW,iBAAiB;CAC1D,4BAA4BA,iBAAAA,WAAW,eAAe;CACtD,wBAAwB,cAAcC,wBAAAA,cAAc,aAAa,KAAK,IAAI,KAAA;CAC1E,yBACE,WAAW,eAAeA,wBAAAA,cAAc,cAAc,KAAK,IAAI,KAAA;CACjE,oCACE,oBAAoB,wBAChBA,wBAAAA,cAAc,uBAAuB,KAAK,IAC1C,KAAA;CACN,gCAAgC,eAAeC,YAAAA,IAAI,kBAAkB,IAAI,KAAA;AAC3E,EACF,EACF;AAEA,MAAa,QAAQC,gBAAAA,SAAuB,WAAW;CACrD,MAAM,QAAQC,kBAAAA,SAAS,SAAS,cAAc,MAAM;CACpD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,mBACA,iBACA,aACA,cACA,uBACA,SACA,kBACA,mBACA,gBACA,iBACA,aACA,QACA,MACA,UACA,cACA,oBACA,KACA,aACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAAwB;EACxC,MAAM;EACN;EACA;EACA;EACA,SAAA,qBAAA;EACA;EACA;EACA;EACA;EACA,cAAc;EACd;EACA;CACF,CAAC;CAED,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,sBAAAA,eAAD;EACE,OAAO;GACL;GACA;GACA,SAAS,YAAY,OAAO,QAAQ,WAAW,KAAA;GAC/C;GACA;GACA;GACA,aAAa,eAAe;EAC9B;EAEA,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACC,YAAAA,KAAD;GACE,WAAU;GACV,KAAK,CAAC;IAAE;IAAiB;GAAY,GAAG,GAAG;GAC3C,GAAI,UAAU,OAAO;GACrB,GAAI;GAEH,UAAA,YAAa,CAAC,CAAC,QAAQ,iBAAA,GAAA,kBAAA,IAAA,CAACC,0BAAAA,mBAAD,EAAyB,KAAO,CAAA;EACrD,CAAA;CACQ,CAAA;AAEnB,CAAC;AAED,MAAM,UAAUC,qBAAAA;AAChB,MAAM,eAAe;AACrB,MAAM,cAAc;AACpB,MAAM,KAAKC,yBAAAA;AACX,MAAM,KAAKC,yBAAAA;AACX,MAAM,KAAKC,yBAAAA;AACX,MAAM,QAAQC,yBAAAA;AACd,MAAM,QAAQC,yBAAAA;AACd,MAAM,QAAQC,yBAAAA;AACd,MAAM,UAAUC,yBAAAA;AAChB,MAAM,kBAAkBC,6BAAAA;AACxB,MAAM,eAAeT,0BAAAA"}

package/cjs/components/Table/TableScrollContainer.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TableScrollContainer.cjs","names":["createVarsResolver","rem","factory","useProps","useStyles","Box","ScrollArea","classes"],"sources":["../../../src/components/Table/TableScrollContainer.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { ScrollArea, ScrollAreaProps } from '../ScrollArea';\nimport classes from './Table.module.css';\n\nexport type TableScrollContainerStylesNames = 'scrollContainer' \| 'scrollContainerInner';\nexport type TableScrollContainerCssVariables = {\n scrollContainer: '--table-min-width' \| '--table-max-height' \| '--table-overflow';\n};\n\nexport interface TableScrollContainerProps\n extends BoxProps, StylesApiProps<TableScrollContainerFactory>, ElementProps<'div'> {\n /** `min-width` of the `Table` at which it should become scrollable /\n minWidth: React.CSSProperties['minWidth'];\n\n /* `max-height` of the `Table` at which it should become scrollable /\n maxHeight?: React.CSSProperties['maxHeight'];\n\n /* Type of the scroll container, `native` to use native scrollbars, `scrollarea` to use `ScrollArea` component @default 'scrollarea' /\n type?: 'native' \| 'scrollarea';\n\n /* Props passed down to `ScrollArea` component, not applicable with `type=\"native\"` */\n scrollAreaProps?: ScrollAreaProps;\n}\n\nexport type TableScrollContainerFactory = Factory<{\n props: TableScrollContainerProps;\n ref: HTMLDivElement;\n stylesNames: TableScrollContainerStylesNames;\n vars: TableScrollContainerCssVariables;\n}>;\n\nconst defaultProps = {\n type: 'scrollarea',\n} satisfies Partial<TableScrollContainerProps>;\n\nconst varsResolver = createVarsResolver<TableScrollContainerFactory>(\n (_, { minWidth, maxHeight, type }) => ({\n scrollContainer: {\n '--table-min-width': rem(minWidth),\n '--table-max-height': rem(maxHeight),\n '--table-overflow': type === 'native' ? 'auto' : undefined,\n },\n })\n);\n\nexport const TableScrollContainer = factory<TableScrollContainerFactory>((_props) => {\n const props = useProps('TableScrollContainer', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n minWidth,\n maxHeight,\n type,\n scrollAreaProps,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<TableScrollContainerFactory>({\n name: 'TableScrollContainer',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n rootSelector: 'scrollContainer',\n });\n\n return (\n <Box<any>\n component={type === 'scrollarea' ? ScrollArea : 'div'}\n {...(type === 'scrollarea'\n ? maxHeight\n ? { offsetScrollbars: 'xy', ...scrollAreaProps }\n : { offsetScrollbars: 'x', ...scrollAreaProps }\n : {})}\n {...getStyles('scrollContainer')}\n {...others}\n >\n <div {...getStyles('scrollContainerInner')}>{children}</div>\n </Box>\n );\n});\n\nTableScrollContainer.classes = classes;\nTableScrollContainer.varsResolver = varsResolver;\nTableScrollContainer.displayName = '@mantine/core/TableScrollContainer';\n"],"mappings":";;;;;;;;;;;AA0CA,MAAM,eAAe,EACnB,MAAM,aACR;AAEA,MAAM,eAAeA,6BAAAA,oBAClB,GAAG,EAAE,UAAU,WAAW,YAAY,EACrC,iBAAiB;CACf,qBAAqBC,YAAAA,IAAI,QAAQ;CACjC,sBAAsBA,YAAAA,IAAI,SAAS;CACnC,oBAAoB,SAAS,WAAW,SAAS,KAAA;AACnD,EACF,EACF;AAEA,MAAa,uBAAuBC,gBAAAA,SAAsC,WAAW;CACnF,MAAM,QAAQC,kBAAAA,SAAS,wBAAwB,cAAc,MAAM;CACnE,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,UACA,WACA,MACA,iBACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAAuC;EACvD,MAAM;EACN,SAAA,qBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;CAChB,CAAC;CAED,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,YAAAA,KAAD;EACE,WAAW,SAAS,eAAeC,mBAAAA,aAAa;EAChD,GAAK,SAAS,eACV,YACE;GAAE,kBAAkB;GAAM,GAAG;EAAgB,IAC7C;GAAE,kBAAkB;GAAK,GAAG;EAAgB,IAC9C,CAAC;EACL,GAAI,UAAU,iBAAiB;EAC/B,GAAI;~~YAEJ~~,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;GAAK,GAAI,UAAU,sBAAsB;GAAI;EAAc,CAAA;CACxD,CAAA;AAET,CAAC;AAED,qBAAqB,UAAUC,qBAAAA;AAC/B,qBAAqB,eAAe;AACpC,qBAAqB,cAAc"}
1	+ {"version":3,"file":"TableScrollContainer.cjs","names":["createVarsResolver","rem","factory","useProps","useStyles","Box","ScrollArea","classes"],"sources":["../../../src/components/Table/TableScrollContainer.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { ScrollArea, ScrollAreaProps } from '../ScrollArea';\nimport classes from './Table.module.css';\n\nexport type TableScrollContainerStylesNames = 'scrollContainer' \| 'scrollContainerInner';\nexport type TableScrollContainerCssVariables = {\n scrollContainer: '--table-min-width' \| '--table-max-height' \| '--table-overflow';\n};\n\nexport interface TableScrollContainerProps\n extends BoxProps, StylesApiProps<TableScrollContainerFactory>, ElementProps<'div'> {\n /** `min-width` of the `Table` at which it should become scrollable /\n minWidth: React.CSSProperties['minWidth'];\n\n /* `max-height` of the `Table` at which it should become scrollable /\n maxHeight?: React.CSSProperties['maxHeight'];\n\n /* Type of the scroll container, `native` to use native scrollbars, `scrollarea` to use `ScrollArea` component @default 'scrollarea' /\n type?: 'native' \| 'scrollarea';\n\n /* Props passed down to `ScrollArea` component, not applicable with `type=\"native\"` */\n scrollAreaProps?: ScrollAreaProps;\n}\n\nexport type TableScrollContainerFactory = Factory<{\n props: TableScrollContainerProps;\n ref: HTMLDivElement;\n stylesNames: TableScrollContainerStylesNames;\n vars: TableScrollContainerCssVariables;\n}>;\n\nconst defaultProps = {\n type: 'scrollarea',\n} satisfies Partial<TableScrollContainerProps>;\n\nconst varsResolver = createVarsResolver<TableScrollContainerFactory>(\n (_, { minWidth, maxHeight, type }) => ({\n scrollContainer: {\n '--table-min-width': rem(minWidth),\n '--table-max-height': rem(maxHeight),\n '--table-overflow': type === 'native' ? 'auto' : undefined,\n },\n })\n);\n\nexport const TableScrollContainer = factory<TableScrollContainerFactory>((_props) => {\n const props = useProps('TableScrollContainer', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n minWidth,\n maxHeight,\n type,\n scrollAreaProps,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<TableScrollContainerFactory>({\n name: 'TableScrollContainer',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n rootSelector: 'scrollContainer',\n });\n\n return (\n <Box<any>\n component={type === 'scrollarea' ? ScrollArea : 'div'}\n {...(type === 'scrollarea'\n ? maxHeight\n ? { offsetScrollbars: 'xy', ...scrollAreaProps }\n : { offsetScrollbars: 'x', ...scrollAreaProps }\n : {})}\n {...getStyles('scrollContainer')}\n {...others}\n >\n <div {...getStyles('scrollContainerInner')}>{children}</div>\n </Box>\n );\n});\n\nTableScrollContainer.classes = classes;\nTableScrollContainer.varsResolver = varsResolver;\nTableScrollContainer.displayName = '@mantine/core/TableScrollContainer';\n"],"mappings":";;;;;;;;;;;AA0CA,MAAM,eAAe,EACnB,MAAM,aACR;AAEA,MAAM,eAAeA,6BAAAA,oBAClB,GAAG,EAAE,UAAU,WAAW,YAAY,EACrC,iBAAiB;CACf,qBAAqBC,YAAAA,IAAI,QAAQ;CACjC,sBAAsBA,YAAAA,IAAI,SAAS;CACnC,oBAAoB,SAAS,WAAW,SAAS,KAAA;AACnD,EACF,EACF;AAEA,MAAa,uBAAuBC,gBAAAA,SAAsC,WAAW;CACnF,MAAM,QAAQC,kBAAAA,SAAS,wBAAwB,cAAc,MAAM;CACnE,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,UACA,WACA,MACA,iBACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAAuC;EACvD,MAAM;EACN,SAAA,qBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;CAChB,CAAC;CAED,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,YAAAA,KAAD;EACE,WAAW,SAAS,eAAeC,mBAAAA,aAAa;EAChD,GAAK,SAAS,eACV,YACE;GAAE,kBAAkB;GAAM,GAAG;EAAgB,IAC7C;GAAE,kBAAkB;GAAK,GAAG;EAAgB,IAC9C,CAAC;EACL,GAAI,UAAU,iBAAiB;EAC/B,GAAI;EAEJ,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;GAAK,GAAI,UAAU,sBAAsB;GAAI;EAAc,CAAA;CACxD,CAAA;AAET,CAAC;AAED,qBAAqB,UAAUC,qBAAAA;AAC/B,qBAAqB,eAAe;AACpC,qBAAqB,cAAc"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"TableOfContents.cjs","names":["createVarsResolver","getFontSize","rem","getRadius","factory","useProps","useStyles","noop","UnstyledButton","Box","classes"],"sources":["../../../src/components/TableOfContents/TableOfContents.tsx"],"sourcesContent":["import {\n assignRef,\n useId,\n useScrollSpy,\n UseScrollSpyHeadingData,\n UseScrollSpyOptions,\n} from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getFontSize,\n getRadius,\n MantineColor,\n MantineRadius,\n MantineSize,\n noop,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { UnstyledButton, UnstyledButtonProps } from '../UnstyledButton';\nimport classes from './TableOfContents.module.css';\n\nexport type TableOfContentsStylesNames = 'root' \| 'control';\nexport type TableOfContentsVariant = 'filled' \| 'light' \| 'none';\nexport type TableOfContentsCssVariables = {\n root: '--toc-bg' \| '--toc-color' \| '--toc-size' \| '--toc-depth-offset' \| '--toc-radius';\n};\n\nexport interface InitialTableOfContentsData {\n /** Heading depth, 1-6 /\n depth: number;\n\n /* Heading text content value /\n value: string;\n\n /* Heading id, must be unique, used as `key` /\n id?: string;\n}\n\nexport interface TableOfContentsGetControlPropsPayload {\n /* True if the associated heading is currently the best match in the viewport /\n active: boolean;\n\n /* Data passed down from `use-scroll-spy` hook: depth, id, value /\n data: UseScrollSpyHeadingData;\n}\n\nexport interface TableOfContentsProps\n extends BoxProps, StylesApiProps<TableOfContentsFactory>, ElementProps<'div'> {\n /* Key of `theme.colors` or any valid CSS color value @default theme.primaryColor /\n color?: MantineColor;\n\n /* Controls font-size and padding of all elements @default 'md' /\n size?: MantineSize \| (string & {}) \| number;\n\n /* If set, adjusts text color based on background color for `filled` variant /\n autoContrast?: boolean;\n\n /* Options passed down to `use-scroll-spy` hook /\n scrollSpyOptions?: UseScrollSpyOptions;\n\n /* Data used to render content until actual values are retrieved from the DOM /\n initialData?: InitialTableOfContentsData[];\n\n /* A function to pass props down to controls, accepts values from `use-scroll-spy` hook as an argument and active state. /\n getControlProps?: (\n payload: TableOfContentsGetControlPropsPayload\n ) => UnstyledButtonProps & ElementProps<'button'> & Record<`data-${string}`, any>;\n\n /* Minimum `depth` value that requires offset, `1` by default /\n minDepthToOffset?: number;\n\n /* Controls padding on the left side of control, multiplied by (`depth` - `minDepthToOffset`), `20px` by default /\n depthOffset?: number \| string;\n\n /* Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius /\n radius?: MantineRadius;\n\n /* A function to reinitialize headings from `use-scroll-spy` hook */\n reinitializeRef?: React.RefObject<() => void>;\n}\n\nexport type TableOfContentsFactory = Factory<{\n props: TableOfContentsProps;\n ref: HTMLDivElement;\n stylesNames: TableOfContentsStylesNames;\n vars: TableOfContentsCssVariables;\n variant: TableOfContentsVariant;\n}>;\n\nconst defaultProps = {\n getControlProps: ({ data }) => ({\n children: data.value,\n }),\n} satisfies Partial<TableOfContentsProps>;\n\nconst varsResolver = createVarsResolver<TableOfContentsFactory>(\n (theme, { color, size, variant, autoContrast, depthOffset, radius }) => {\n const colors = theme.variantColorResolver({\n color: color \|\| theme.primaryColor,\n theme,\n variant: variant \|\| 'filled',\n autoContrast,\n });\n\n return {\n root: {\n '--toc-bg': variant !== 'none' ? colors.background : undefined,\n '--toc-color': variant !== 'none' ? colors.color : undefined,\n '--toc-size': getFontSize(size),\n '--toc-depth-offset': rem(depthOffset),\n '--toc-radius': getRadius(radius),\n },\n };\n }\n);\n\nexport const TableOfContents = factory<TableOfContentsFactory>((_props) => {\n const props = useProps('TableOfContents', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n color,\n autoContrast,\n scrollSpyOptions,\n initialData,\n getControlProps,\n minDepthToOffset,\n depthOffset,\n variant,\n radius,\n reinitializeRef,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<TableOfContentsFactory>({\n name: 'TableOfContents',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const idBase = useId();\n const spy = useScrollSpy(scrollSpyOptions);\n\n assignRef(reinitializeRef, spy.reinitialize);\n\n const headingsData = (\n spy.initialized ? spy.data : initialData \|\| []\n ) as UseScrollSpyHeadingData[];\n\n const controls = headingsData.map((data, index) => {\n const controlProps = getControlProps?.({\n active: index === spy.active,\n data: { ...data, getNode: data.getNode \|\| noop },\n });\n\n return (\n <UnstyledButton\n key={data.id \|\| `${idBase}-${index}`}\n __vars={{ '--depth-offset': `${data.depth - (minDepthToOffset \|\| 1)}` }}\n data-active={index === spy.active \|\| undefined}\n variant={variant}\n {...controlProps}\n {...getStyles('control', {\n className: controlProps?.className,\n style: controlProps?.style,\n })}\n />\n );\n });\n\n return (\n <Box variant={variant} {...getStyles('root')} {...others}>\n {controls}\n </Box>\n );\n});\n\nTableOfContents.displayName = '@mantine/core/TableOfContents';\nTableOfContents.classes = classes;\nTableOfContents.varsResolver = varsResolver;\n\nexport namespace TableOfContents {\n export type Props = TableOfContentsProps;\n export type StylesNames = TableOfContentsStylesNames;\n export type CssVariables = TableOfContentsCssVariables;\n export type Factory = TableOfContentsFactory;\n export type Variant = TableOfContentsVariant;\n}\n"],"mappings":";;;;;;;;;;;;;;AAgGA,MAAM,eAAe,EACnB,kBAAkB,EAAE,YAAY,EAC9B,UAAU,KAAK,MACjB,GACF;AAEA,MAAM,eAAeA,6BAAAA,oBAClB,OAAO,EAAE,OAAO,MAAM,SAAS,cAAc,aAAa,aAAa;CACtE,MAAM,SAAS,MAAM,qBAAqB;EACxC,OAAO,SAAS,MAAM;EACtB;EACA,SAAS,WAAW;EACpB;CACF,CAAC;CAED,OAAO,EACL,MAAM;EACJ,YAAY,YAAY,SAAS,OAAO,aAAa,KAAA;EACrD,eAAe,YAAY,SAAS,OAAO,QAAQ,KAAA;EACnD,cAAcC,iBAAAA,YAAY,IAAI;EAC9B,sBAAsBC,YAAAA,IAAI,WAAW;EACrC,gBAAgBC,iBAAAA,UAAU,MAAM;CAClC,EACF;AACF,CACF;AAEA,MAAa,kBAAkBC,gBAAAA,SAAiC,WAAW;CACzE,MAAM,QAAQC,kBAAAA,SAAS,mBAAmB,cAAc,MAAM;CAC9D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,OACA,cACA,kBACA,aACA,iBACA,kBACA,aACA,SACA,QACA,iBACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAAkC;EAClD,MAAM;EACN,SAAA,+BAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,UAAA,~~GAAA~~,~~eAAA~~,~~MAAA~~,~~CAAe~~;CACrB,MAAM,OAAA,~~GAAA~~,~~eAAA~~,~~aAAA~~,~~CAAmB~~,gBAAgB;CAEzC,CAAA,GAAA,eAAA,UAAA,CAAU,iBAAiB,IAAI,YAAY;CAM3C,MAAM,YAHJ,IAAI,cAAc,IAAI,OAAO,eAAe,CAAC,EAAA,CAGjB,KAAK,MAAM,UAAU;EACjD,MAAM,eAAe,kBAAkB;GACrC,QAAQ,UAAU,IAAI;GACtB,MAAM;IAAE,GAAG;IAAM,SAAS,KAAK,WAAWC,aAAAA;GAAK;EACjD,CAAC;EAED,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,uBAAAA,gBAAD;GAEE,QAAQ,EAAE,kBAAkB,GAAG,KAAK,SAAS,oBAAoB,KAAK;GACtE,eAAa,UAAU,IAAI,UAAU,KAAA;GAC5B;GACT,GAAI;GACJ,GAAI,UAAU,WAAW;IACvB,WAAW,cAAc;IACzB,OAAO,cAAc;GACvB,CAAC;EACF,GATM,KAAK,MAAM,GAAG,OAAO,GAAG,OAS9B;CAEL,CAAC;CAED,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,YAAAA,KAAD;EAAc;EAAS,GAAI,UAAU,MAAM;EAAG,GAAI;~~YAC~~/C;CACE,CAAA;AAET,CAAC;AAED,gBAAgB,cAAc;AAC9B,gBAAgB,UAAUC,+BAAAA;AAC1B,gBAAgB,eAAe"}
1	+ {"version":3,"file":"TableOfContents.cjs","names":["createVarsResolver","getFontSize","rem","getRadius","factory","useProps","useStyles","useId","useScrollSpy","noop","UnstyledButton","Box","classes"],"sources":["../../../src/components/TableOfContents/TableOfContents.tsx"],"sourcesContent":["import {\n assignRef,\n useId,\n useScrollSpy,\n UseScrollSpyHeadingData,\n UseScrollSpyOptions,\n} from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getFontSize,\n getRadius,\n MantineColor,\n MantineRadius,\n MantineSize,\n noop,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { UnstyledButton, UnstyledButtonProps } from '../UnstyledButton';\nimport classes from './TableOfContents.module.css';\n\nexport type TableOfContentsStylesNames = 'root' \| 'control';\nexport type TableOfContentsVariant = 'filled' \| 'light' \| 'none';\nexport type TableOfContentsCssVariables = {\n root: '--toc-bg' \| '--toc-color' \| '--toc-size' \| '--toc-depth-offset' \| '--toc-radius';\n};\n\nexport interface InitialTableOfContentsData {\n /** Heading depth, 1-6 /\n depth: number;\n\n /* Heading text content value /\n value: string;\n\n /* Heading id, must be unique, used as `key` /\n id?: string;\n}\n\nexport interface TableOfContentsGetControlPropsPayload {\n /* True if the associated heading is currently the best match in the viewport /\n active: boolean;\n\n /* Data passed down from `use-scroll-spy` hook: depth, id, value /\n data: UseScrollSpyHeadingData;\n}\n\nexport interface TableOfContentsProps\n extends BoxProps, StylesApiProps<TableOfContentsFactory>, ElementProps<'div'> {\n /* Key of `theme.colors` or any valid CSS color value @default theme.primaryColor /\n color?: MantineColor;\n\n /* Controls font-size and padding of all elements @default 'md' /\n size?: MantineSize \| (string & {}) \| number;\n\n /* If set, adjusts text color based on background color for `filled` variant /\n autoContrast?: boolean;\n\n /* Options passed down to `use-scroll-spy` hook /\n scrollSpyOptions?: UseScrollSpyOptions;\n\n /* Data used to render content until actual values are retrieved from the DOM /\n initialData?: InitialTableOfContentsData[];\n\n /* A function to pass props down to controls, accepts values from `use-scroll-spy` hook as an argument and active state. /\n getControlProps?: (\n payload: TableOfContentsGetControlPropsPayload\n ) => UnstyledButtonProps & ElementProps<'button'> & Record<`data-${string}`, any>;\n\n /* Minimum `depth` value that requires offset, `1` by default /\n minDepthToOffset?: number;\n\n /* Controls padding on the left side of control, multiplied by (`depth` - `minDepthToOffset`), `20px` by default /\n depthOffset?: number \| string;\n\n /* Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius /\n radius?: MantineRadius;\n\n /* A function to reinitialize headings from `use-scroll-spy` hook */\n reinitializeRef?: React.RefObject<() => void>;\n}\n\nexport type TableOfContentsFactory = Factory<{\n props: TableOfContentsProps;\n ref: HTMLDivElement;\n stylesNames: TableOfContentsStylesNames;\n vars: TableOfContentsCssVariables;\n variant: TableOfContentsVariant;\n}>;\n\nconst defaultProps = {\n getControlProps: ({ data }) => ({\n children: data.value,\n }),\n} satisfies Partial<TableOfContentsProps>;\n\nconst varsResolver = createVarsResolver<TableOfContentsFactory>(\n (theme, { color, size, variant, autoContrast, depthOffset, radius }) => {\n const colors = theme.variantColorResolver({\n color: color \|\| theme.primaryColor,\n theme,\n variant: variant \|\| 'filled',\n autoContrast,\n });\n\n return {\n root: {\n '--toc-bg': variant !== 'none' ? colors.background : undefined,\n '--toc-color': variant !== 'none' ? colors.color : undefined,\n '--toc-size': getFontSize(size),\n '--toc-depth-offset': rem(depthOffset),\n '--toc-radius': getRadius(radius),\n },\n };\n }\n);\n\nexport const TableOfContents = factory<TableOfContentsFactory>((_props) => {\n const props = useProps('TableOfContents', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n color,\n autoContrast,\n scrollSpyOptions,\n initialData,\n getControlProps,\n minDepthToOffset,\n depthOffset,\n variant,\n radius,\n reinitializeRef,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<TableOfContentsFactory>({\n name: 'TableOfContents',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const idBase = useId();\n const spy = useScrollSpy(scrollSpyOptions);\n\n assignRef(reinitializeRef, spy.reinitialize);\n\n const headingsData = (\n spy.initialized ? spy.data : initialData \|\| []\n ) as UseScrollSpyHeadingData[];\n\n const controls = headingsData.map((data, index) => {\n const controlProps = getControlProps?.({\n active: index === spy.active,\n data: { ...data, getNode: data.getNode \|\| noop },\n });\n\n return (\n <UnstyledButton\n key={data.id \|\| `${idBase}-${index}`}\n __vars={{ '--depth-offset': `${data.depth - (minDepthToOffset \|\| 1)}` }}\n data-active={index === spy.active \|\| undefined}\n variant={variant}\n {...controlProps}\n {...getStyles('control', {\n className: controlProps?.className,\n style: controlProps?.style,\n })}\n />\n );\n });\n\n return (\n <Box variant={variant} {...getStyles('root')} {...others}>\n {controls}\n </Box>\n );\n});\n\nTableOfContents.displayName = '@mantine/core/TableOfContents';\nTableOfContents.classes = classes;\nTableOfContents.varsResolver = varsResolver;\n\nexport namespace TableOfContents {\n export type Props = TableOfContentsProps;\n export type StylesNames = TableOfContentsStylesNames;\n export type CssVariables = TableOfContentsCssVariables;\n export type Factory = TableOfContentsFactory;\n export type Variant = TableOfContentsVariant;\n}\n"],"mappings":";;;;;;;;;;;;;;AAgGA,MAAM,eAAe,EACnB,kBAAkB,EAAE,YAAY,EAC9B,UAAU,KAAK,MACjB,GACF;AAEA,MAAM,eAAeA,6BAAAA,oBAClB,OAAO,EAAE,OAAO,MAAM,SAAS,cAAc,aAAa,aAAa;CACtE,MAAM,SAAS,MAAM,qBAAqB;EACxC,OAAO,SAAS,MAAM;EACtB;EACA,SAAS,WAAW;EACpB;CACF,CAAC;CAED,OAAO,EACL,MAAM;EACJ,YAAY,YAAY,SAAS,OAAO,aAAa,KAAA;EACrD,eAAe,YAAY,SAAS,OAAO,QAAQ,KAAA;EACnD,cAAcC,iBAAAA,YAAY,IAAI;EAC9B,sBAAsBC,YAAAA,IAAI,WAAW;EACrC,gBAAgBC,iBAAAA,UAAU,MAAM;CAClC,EACF;AACF,CACF;AAEA,MAAa,kBAAkBC,gBAAAA,SAAiC,WAAW;CACzE,MAAM,QAAQC,kBAAAA,SAAS,mBAAmB,cAAc,MAAM;CAC9D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,OACA,cACA,kBACA,aACA,iBACA,kBACA,aACA,SACA,QACA,iBACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAAkC;EAClD,MAAM;EACN,SAAA,+BAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,UAAA,GAASC,eAAAA,MAAAA,CAAM;CACrB,MAAM,OAAA,GAAMC,eAAAA,aAAAA,CAAa,gBAAgB;CAEzC,CAAA,GAAA,eAAA,UAAA,CAAU,iBAAiB,IAAI,YAAY;CAM3C,MAAM,YAHJ,IAAI,cAAc,IAAI,OAAO,eAAe,CAAC,EAAA,CAGjB,KAAK,MAAM,UAAU;EACjD,MAAM,eAAe,kBAAkB;GACrC,QAAQ,UAAU,IAAI;GACtB,MAAM;IAAE,GAAG;IAAM,SAAS,KAAK,WAAWC,aAAAA;GAAK;EACjD,CAAC;EAED,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,uBAAAA,gBAAD;GAEE,QAAQ,EAAE,kBAAkB,GAAG,KAAK,SAAS,oBAAoB,KAAK;GACtE,eAAa,UAAU,IAAI,UAAU,KAAA;GAC5B;GACT,GAAI;GACJ,GAAI,UAAU,WAAW;IACvB,WAAW,cAAc;IACzB,OAAO,cAAc;GACvB,CAAC;EACF,GATM,KAAK,MAAM,GAAG,OAAO,GAAG,OAS9B;CAEL,CAAC;CAED,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,YAAAA,KAAD;EAAc;EAAS,GAAI,UAAU,MAAM;EAAG,GAAI;EAC/C,UAAA;CACE,CAAA;AAET,CAAC;AAED,gBAAgB,cAAc;AAC9B,gBAAgB,UAAUC,+BAAAA;AAC1B,gBAAgB,eAAe"}

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

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

package/cjs/components/Tabs/TabsPanel/TabsPanel.cjs.map CHANGED Viewed

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

package/cjs/components/Tabs/TabsTab/TabsTab.cjs.map CHANGED Viewed

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

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

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

package/cjs/components/Text/Text.cjs CHANGED Viewed

@@ -24,27 +24,28 @@ const varsResolver = require_create_vars_resolver.createVarsResolver((theme, { v
 const Text = require_polymorphic_factory.polymorphicFactory((_props) => {
 	const props = require_use_props.useProps("Text", defaultProps, _props);
 	const { lineClamp, truncate, inline, inherit, gradient, span, textWrap, __staticSelector, vars, className, style, classNames, styles, unstyled, variant, mod, size, attributes, ...others } = props;
+	const getStyles = require_use_styles.useStyles({
+		name: ["Text", __staticSelector],
+		props,
+		classes: require_Text_module.default,
+		className,
+		style,
+		classNames,
+		styles,
+		unstyled,
+		attributes,
+		vars,
+		varsResolver
+	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Box.Box, {
-		...require_use_styles.useStyles({
-			name: ["Text", __staticSelector],
-			props,
-			classes: require_Text_module.default,
-			className,
-			style,
-			classNames,
-			styles,
-			unstyled,
-			attributes,
-			vars,
-			varsResolver
-		})("root", { focusable: true }),
+		...getStyles("root", { focusable: true }),
 		component: span ? "span" : "p",
 		variant,
 		mod: [{
-			"data-truncate": getTextTruncate(truncate),
-			"data-line-clamp": typeof lineClamp === "number",
-			"data-inline": inline,
-			"data-inherit": inherit
+			truncate: getTextTruncate(truncate),
+			lineClamp: typeof lineClamp === "number",
+			inline,
+			inherit
 		}, mod],
 		size,
 		...others

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

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

package/cjs/components/TextInput/TextInput.cjs CHANGED Viewed

@@ -5,13 +5,14 @@ const require_InputBase = require("../InputBase/InputBase.cjs");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region packages/@mantine/core/src/components/TextInput/TextInput.tsx
 const TextInput = require_factory.factory((props) => {
+	const _props = require_use_props.useProps([
+		"Input",
+		"InputWrapper",
+		"TextInput"
+	], null, props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_InputBase.InputBase, {
 		component: "input",
-		...require_use_props.useProps([
-			"Input",
-			"InputWrapper",
-			"TextInput"
-		], null, props),
+		..._props,
 		__staticSelector: "TextInput"
 	});
 });

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

	@@ -1 +1 @@
1	- {"version":3,"file":"TextInput.cjs","names":["factory","~~InputBase~~","~~useProps~~"],"sources":["../../../src/components/TextInput/TextInput.tsx"],"sourcesContent":["import { BoxProps, ElementProps, factory, Factory, StylesApiProps, useProps } from '../../core';\nimport { __BaseInputProps, __InputStylesNames, InputVariant } from '../Input';\nimport { InputBase } from '../InputBase';\n\nexport interface TextInputProps\n extends\n BoxProps,\n __BaseInputProps,\n StylesApiProps<TextInputFactory>,\n ElementProps<'input', 'size'> {}\n\nexport type TextInputFactory = Factory<{\n props: TextInputProps;\n variant: InputVariant;\n ref: HTMLInputElement;\n stylesNames: __InputStylesNames;\n}>;\n\nexport const TextInput = factory<TextInputFactory>((props) => {\n const _props = useProps(['Input', 'InputWrapper', 'TextInput'], null, props);\n return <InputBase component=\"input\" {..._props} __staticSelector=\"TextInput\" />;\n});\n\nTextInput.classes = InputBase.classes;\nTextInput.displayName = '@mantine/core/TextInput';\n\nexport namespace TextInput {\n export type Props = TextInputProps;\n export type Factory = TextInputFactory;\n}\n"],"mappings":";;;;;;AAkBA,MAAa,YAAYA,gBAAAA,SAA2B,UAAU;~~CAE5D~~,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAACC,kBAAAA,WAAD;EAAW,WAAU;EAAQ,~~GADrBC,kBAAAA,SAAS~~;~~GAAC;GAAS;GAAgB;EAAW~~,~~GAAG,MAAM,KACzB;EAAG,~~kBAAiB;CAAa,CAAA;AAChF,CAAC;AAED,UAAU,~~UAAUD~~,kBAAAA,UAAU;AAC9B,UAAU,cAAc"}
1	+ {"version":3,"file":"TextInput.cjs","names":["factory","useProps","InputBase"],"sources":["../../../src/components/TextInput/TextInput.tsx"],"sourcesContent":["import { BoxProps, ElementProps, factory, Factory, StylesApiProps, useProps } from '../../core';\nimport { __BaseInputProps, __InputStylesNames, InputVariant } from '../Input';\nimport { InputBase } from '../InputBase';\n\nexport interface TextInputProps\n extends\n BoxProps,\n __BaseInputProps,\n StylesApiProps<TextInputFactory>,\n ElementProps<'input', 'size'> {}\n\nexport type TextInputFactory = Factory<{\n props: TextInputProps;\n variant: InputVariant;\n ref: HTMLInputElement;\n stylesNames: __InputStylesNames;\n}>;\n\nexport const TextInput = factory<TextInputFactory>((props) => {\n const _props = useProps(['Input', 'InputWrapper', 'TextInput'], null, props);\n return <InputBase component=\"input\" {..._props} __staticSelector=\"TextInput\" />;\n});\n\nTextInput.classes = InputBase.classes;\nTextInput.displayName = '@mantine/core/TextInput';\n\nexport namespace TextInput {\n export type Props = TextInputProps;\n export type Factory = TextInputFactory;\n}\n"],"mappings":";;;;;;AAkBA,MAAa,YAAYA,gBAAAA,SAA2B,UAAU;CAC5D,MAAM,SAASC,kBAAAA,SAAS;EAAC;EAAS;EAAgB;CAAW,GAAG,MAAM,KAAK;CAC3E,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAACC,kBAAAA,WAAD;EAAW,WAAU;EAAQ,GAAI;EAAQ,kBAAiB;CAAa,CAAA;AAChF,CAAC;AAED,UAAU,UAAUA,kBAAAA,UAAU;AAC9B,UAAU,cAAc"}

package/cjs/components/Textarea/Autosize.cjs.map CHANGED Viewed

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

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

@@ -27,20 +27,21 @@ const varsResolver = require_create_vars_resolver.createVarsResolver((theme, { s
 const ThemeIcon = require_factory.factory((_props) => {
 	const props = require_use_props.useProps("ThemeIcon", null, _props);
 	const { classNames, className, style, styles, unstyled, vars, autoContrast, attributes, ...others } = props;
+	const getStyles = require_use_styles.useStyles({
+		name: "ThemeIcon",
+		classes: require_ThemeIcon_module.default,
+		props,
+		className,
+		style,
+		classNames,
+		styles,
+		unstyled,
+		attributes,
+		vars,
+		varsResolver
+	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Box.Box, {
-		...require_use_styles.useStyles({
-			name: "ThemeIcon",
-			classes: require_ThemeIcon_module.default,
-			props,
-			className,
-			style,
-			classNames,
-			styles,
-			unstyled,
-			attributes,
-			vars,
-			varsResolver
-		})("root"),
+		...getStyles("root"),
 		...others
 	});
 });

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,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"}
1	+ {"version":3,"file":"ThemeIcon.cjs","names":["createVarsResolver","getSize","getRadius","factory","useProps","useStyles","Box","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;CAEJ,MAAM,YAAYC,mBAAAA,UAA4B;EAC5C,MAAM;EACN,SAAA,yBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAACC,YAAAA,KAAD;EAAK,GAAI,UAAU,MAAM;EAAG,GAAI;CAAS,CAAA;AAClD,CAAC;AAED,UAAU,UAAUC,yBAAAA;AACpB,UAAU,eAAe;AACzB,UAAU,cAAc"}