@mantine/core 9.1.1 → 9.2.1

package/cjs/components/Stack/Stack.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Stack.cjs","names":["createVarsResolver","getSpacing","factory","useProps","Box","useStyles","classes"],"sources":["../../../src/components/Stack/Stack.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getSpacing,\n  MantineSpacing,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport classes from './Stack.module.css';\n\nexport type StackStylesNames = 'root';\nexport type StackCssVariables = {\n  root: '--stack-gap' | '--stack-align' | '--stack-justify';\n};\n\nexport interface StackProps extends BoxProps, StylesApiProps<StackFactory>, ElementProps<'div'> {\n  /** Key of `theme.spacing` or any valid CSS value to set `gap` property, numbers are converted to rem @default 'md' */\n  gap?: MantineSpacing;\n\n  /** Controls `align-items` CSS property @default 'stretch' */\n  align?: React.CSSProperties['alignItems'];\n\n  /** Controls `justify-content` CSS property @default 'flex-start' */\n  justify?: React.CSSProperties['justifyContent'];\n}\n\nexport type StackFactory = Factory<{\n  props: StackProps;\n  ref: HTMLDivElement;\n  stylesNames: StackStylesNames;\n  vars: StackCssVariables;\n}>;\n\nconst defaultProps = {\n  gap: 'md',\n  align: 'stretch',\n  justify: 'flex-start',\n} satisfies Partial<StackProps>;\n\nconst varsResolver = createVarsResolver<StackFactory>((_, { gap, align, justify }) => ({\n  root: {\n    '--stack-gap': getSpacing(gap),\n    '--stack-align': align,\n    '--stack-justify': justify,\n  },\n}));\n\nexport const Stack = factory<StackFactory>((_props) => {\n  const props = useProps('Stack', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    align,\n    justify,\n    gap,\n    variant,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<StackFactory>({\n    name: 'Stack',\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  return <Box {...getStyles('root')} variant={variant} {...others} />;\n});\n\nStack.classes = classes;\nStack.varsResolver = varsResolver;\nStack.displayName = '@mantine/core/Stack';\n\nexport namespace Stack {\n  export type Props = StackProps;\n  export type StylesNames = StackStylesNames;\n  export type CssVariables = StackCssVariables;\n  export type Factory = StackFactory;\n}\n"],"mappings":";;;;;;;;;;;AAsCA,MAAM,eAAe;CACnB,KAAK;CACL,OAAO;CACP,SAAS;CACV;AAED,MAAM,eAAeA,6BAAAA,oBAAkC,GAAG,EAAE,KAAK,OAAO,eAAe,EACrF,MAAM;CACJ,eAAeC,iBAAAA,WAAW,IAAI;CAC9B,iBAAiB;CACjB,mBAAmB;CACpB,EACF,EAAE;AAEH,MAAa,QAAQC,gBAAAA,SAAuB,WAAW;CACrD,MAAM,QAAQC,kBAAAA,SAAS,SAAS,cAAc,OAAO;CACrD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,OACA,SACA,KACA,SACA,YACA,GAAG,WACD;AAgBJ,QAAO,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EAAK,GAdMC,mBAAAA,UAAwB;GACxC,MAAM;GACN;GACA,SAAA,qBAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CAAC,CAEwB,OAAO;EAAW;EAAS,GAAI;EAAU,CAAA;EACnE;AAEF,MAAM,UAAUC,qBAAAA;AAChB,MAAM,eAAe;AACrB,MAAM,cAAc"}
+{"version":3,"file":"Stack.cjs","names":["createVarsResolver","getSpacing","factory","useProps","Box","useStyles","classes"],"sources":["../../../src/components/Stack/Stack.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getSpacing,\n  MantineSpacing,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport classes from './Stack.module.css';\n\nexport type StackStylesNames = 'root';\nexport type StackCssVariables = {\n  root: '--stack-gap' | '--stack-align' | '--stack-justify';\n};\n\nexport interface StackProps extends BoxProps, StylesApiProps<StackFactory>, ElementProps<'div'> {\n  /** Key of `theme.spacing` or any valid CSS value to set `gap` property, numbers are converted to rem @default 'md' */\n  gap?: MantineSpacing;\n\n  /** Controls `align-items` CSS property @default 'stretch' */\n  align?: React.CSSProperties['alignItems'];\n\n  /** Controls `justify-content` CSS property @default 'flex-start' */\n  justify?: React.CSSProperties['justifyContent'];\n}\n\nexport type StackFactory = Factory<{\n  props: StackProps;\n  ref: HTMLDivElement;\n  stylesNames: StackStylesNames;\n  vars: StackCssVariables;\n}>;\n\nconst defaultProps = {\n  gap: 'md',\n  align: 'stretch',\n  justify: 'flex-start',\n} satisfies Partial<StackProps>;\n\nconst varsResolver = createVarsResolver<StackFactory>((_, { gap, align, justify }) => ({\n  root: {\n    '--stack-gap': getSpacing(gap),\n    '--stack-align': align,\n    '--stack-justify': justify,\n  },\n}));\n\nexport const Stack = factory<StackFactory>((_props) => {\n  const props = useProps('Stack', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    align,\n    justify,\n    gap,\n    variant,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<StackFactory>({\n    name: 'Stack',\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  return <Box {...getStyles('root')} variant={variant} {...others} />;\n});\n\nStack.classes = classes;\nStack.varsResolver = varsResolver;\nStack.displayName = '@mantine/core/Stack';\n\nexport namespace Stack {\n  export type Props = StackProps;\n  export type StylesNames = StackStylesNames;\n  export type CssVariables = StackCssVariables;\n  export type Factory = StackFactory;\n}\n"],"mappings":";;;;;;;;;;;AAsCA,MAAM,eAAe;CACnB,KAAK;CACL,OAAO;CACP,SAAS;AACX;AAEA,MAAM,eAAeA,6BAAAA,oBAAkC,GAAG,EAAE,KAAK,OAAO,eAAe,EACrF,MAAM;CACJ,eAAeC,iBAAAA,WAAW,GAAG;CAC7B,iBAAiB;CACjB,mBAAmB;AACrB,EACF,EAAE;AAEF,MAAa,QAAQC,gBAAAA,SAAuB,WAAW;CACrD,MAAM,QAAQC,kBAAAA,SAAS,SAAS,cAAc,MAAM;CACpD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,OACA,SACA,KACA,SACA,YACA,GAAG,WACD;CAgBJ,OAAO,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EAAK,GAdMC,mBAAAA,UAAwB;GACxC,MAAM;GACN;GACA,SAAA,qBAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,CAEwB,EAAE,MAAM;EAAY;EAAS,GAAI;CAAS,CAAA;AACpE,CAAC;AAED,MAAM,UAAUC,qBAAAA;AAChB,MAAM,eAAe;AACrB,MAAM,cAAc"}

package/cjs/components/Stepper/Stepper.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Stepper.cjs","names":["createVarsResolver","getThemeColor","getAutoContrastValue","getContrastColor","getSize","rem","getSpacing","getRadius","getFontSize","factory","useProps","useStyles","Children","StepperCompleted","Activity","StepperProvider","Box","classes","StepperStep"],"sources":["../../../src/components/Stepper/Stepper.tsx"],"sourcesContent":["import { Activity, Children, cloneElement } from 'react';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getAutoContrastValue,\n  getContrastColor,\n  getFontSize,\n  getRadius,\n  getSize,\n  getSpacing,\n  getThemeColor,\n  MantineColor,\n  MantineRadius,\n  MantineSize,\n  MantineSpacing,\n  rem,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { StepperProvider, type StepperContextValue } from './Stepper.context';\nimport { StepperCompleted, StepperCompletedProps } from './StepperCompleted/StepperCompleted';\nimport { StepperStep, StepperStepProps } from './StepperStep/StepperStep';\nimport classes from './Stepper.module.css';\nexport type StepFragmentComponent = React.FC<{ step: number }>;\n\nexport type StepperStylesNames =\n  | 'root'\n  | 'separator'\n  | 'steps'\n  | 'content'\n  | 'step'\n  | 'stepLoader'\n  | 'verticalSeparator'\n  | 'stepWrapper'\n  | 'stepIcon'\n  | 'stepCompletedIcon'\n  | 'stepIconContent'\n  | 'stepBody'\n  | 'stepLabel'\n  | 'stepDescription';\n\nexport type StepperCssVariables = {\n  root:\n    | '--stepper-color'\n    | '--stepper-icon-color'\n    | '--stepper-icon-size'\n    | '--stepper-content-padding'\n    | '--stepper-radius'\n    | '--stepper-fz'\n    | '--stepper-spacing';\n};\n\nexport interface StepperProps\n  extends BoxProps, StylesApiProps<StepperFactory>, ElementProps<'div'> {\n  /** `Stepper.Step` components */\n  children: React.ReactNode;\n\n  /** Called when a clickable step is clicked with its 0-based index. Not called for the currently active step. */\n  onStepClick?: (stepIndex: number) => void;\n\n  /** Index of the active step */\n  active: number;\n\n  /** Step icon @default step index + 1 */\n  icon?: React.ReactNode | StepFragmentComponent;\n\n  /** Step icon displayed when step is completed @default CheckIcon */\n  completedIcon?: React.ReactNode | StepFragmentComponent;\n\n  /** Step icon displayed when step is in progress @default step index + 1 */\n  progressIcon?: React.ReactNode | StepFragmentComponent;\n\n  /** Key of `theme.colors` or any valid CSS color, controls colors of active and progress steps @default theme.primaryColor */\n  color?: MantineColor;\n\n  /** Controls size of the step icon, by default icon size is inferred from `size` prop */\n  iconSize?: number | string;\n\n  /** Key of `theme.spacing` or any valid CSS value to set `padding-top` of the content @default 'md' */\n  contentPadding?: MantineSpacing;\n\n  /** Stepper orientation @default 'horizontal' */\n  orientation?: 'vertical' | 'horizontal';\n\n  /** Icon position relative to the step body @default 'left' */\n  iconPosition?: 'right' | 'left';\n\n  /** Controls size of various Stepper elements */\n  size?: MantineSize;\n\n  /** Key of `theme.radius` or any valid CSS value to set steps border-radius @default \"xl\" */\n  radius?: MantineRadius;\n\n  /** When true, users can click and jump to any step. When false, users can only navigate to completed steps @default true */\n  allowNextStepsSelect?: boolean;\n\n  /** Determines whether steps should wrap to the next line if no space is available @default true */\n  wrap?: boolean;\n\n  /** When true, automatically adjusts the icon color in completed steps to ensure sufficient contrast against the step background color */\n  autoContrast?: boolean;\n\n  /** If set, all step content is kept mounted. React 19 `Activity` is used to preserve state while content is hidden. @default false */\n  keepMounted?: boolean;\n}\n\nexport type StepperFactory = Factory<{\n  props: StepperProps;\n  ref: HTMLDivElement;\n  stylesNames: StepperStylesNames;\n  vars: StepperCssVariables;\n  staticComponents: {\n    Step: typeof StepperStep;\n    Completed: typeof StepperCompleted;\n  };\n}>;\n\nconst defaultProps = {\n  orientation: 'horizontal',\n  iconPosition: 'left',\n  allowNextStepsSelect: true,\n  wrap: true,\n} satisfies Partial<StepperProps>;\n\nconst varsResolver = createVarsResolver<StepperFactory>(\n  (theme, { color, iconSize, size, contentPadding, radius, autoContrast }) => ({\n    root: {\n      '--stepper-color': color ? getThemeColor(color, theme) : undefined,\n      '--stepper-icon-color': getAutoContrastValue(autoContrast, theme)\n        ? getContrastColor({ color, theme, autoContrast })\n        : undefined,\n      '--stepper-icon-size':\n        iconSize === undefined ? getSize(size, 'stepper-icon-size') : rem(iconSize),\n      '--stepper-content-padding': getSpacing(contentPadding),\n      '--stepper-radius': radius === undefined ? undefined : getRadius(radius),\n      '--stepper-fz': getFontSize(size),\n      '--stepper-spacing': getSpacing(size),\n    },\n  })\n);\n\nexport const Stepper = factory<StepperFactory>((_props) => {\n  const props = useProps('Stepper', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    children,\n    onStepClick,\n    active,\n    icon,\n    completedIcon,\n    progressIcon,\n    color,\n    iconSize,\n    contentPadding,\n    orientation,\n    iconPosition,\n    size,\n    radius,\n    allowNextStepsSelect,\n    wrap,\n    autoContrast,\n    keepMounted,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<StepperFactory>({\n    name: 'Stepper',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const convertedChildren = Children.toArray(children) as React.ReactElement[];\n  const _children = convertedChildren.filter(\n    (child) => child.type !== StepperCompleted\n  ) as React.ReactElement<StepperStepProps>[];\n  const completedStep = convertedChildren.find(\n    (item) => item.type === StepperCompleted\n  ) as React.ReactElement<StepperCompletedProps>;\n\n  const items = _children.reduce<React.ReactElement<StepperStepProps>[]>(\n    (acc, item: React.ReactElement<StepperStepProps>, index) => {\n      const state =\n        active === index ? 'stepProgress' : active > index ? 'stepCompleted' : 'stepInactive';\n\n      const shouldAllowSelect = () => {\n        if (typeof onStepClick !== 'function') {\n          return false;\n        }\n\n        if (typeof item.props.allowStepSelect === 'boolean') {\n          return item.props.allowStepSelect;\n        }\n\n        return state === 'stepCompleted' || allowNextStepsSelect;\n      };\n\n      const isStepSelectionEnabled = shouldAllowSelect();\n\n      acc.push(\n        cloneElement(item, {\n          icon: item.props.icon || icon || index + 1,\n          key: index,\n          step: index,\n          state,\n          onClick: () => isStepSelectionEnabled && onStepClick?.(index),\n          allowStepClick: isStepSelectionEnabled,\n          completedIcon: item.props.completedIcon || completedIcon,\n          progressIcon: item.props.progressIcon || progressIcon,\n          color: item.props.color || color,\n          iconSize,\n          iconPosition: item.props.iconPosition || iconPosition,\n          orientation,\n        })\n      );\n\n      if (orientation === 'horizontal' && index !== _children.length - 1) {\n        acc.push(\n          <div\n            {...getStyles('separator')}\n            data-active={index < active || undefined}\n            data-orientation={orientation}\n            key={`separator-${index}`}\n          />\n        );\n      }\n\n      return acc;\n    },\n    []\n  );\n\n  const stepContent = _children[active]?.props?.children;\n  const completedContent = completedStep?.props?.children;\n  const content = active > _children.length - 1 ? completedContent : stepContent;\n\n  const contentSection = keepMounted ? (\n    <>\n      {_children.map((child, index) => (\n        <Activity key={index} mode={active === index ? 'visible' : 'hidden'}>\n          <div {...getStyles('content')}>{child.props.children}</div>\n        </Activity>\n      ))}\n      {completedStep && (\n        <Activity mode={active > _children.length - 1 ? 'visible' : 'hidden'}>\n          <div {...getStyles('content')}>{completedStep.props.children}</div>\n        </Activity>\n      )}\n    </>\n  ) : (\n    content && <div {...getStyles('content')}>{content}</div>\n  );\n\n  return (\n    <StepperProvider value={{ getStyles, orientation, iconPosition }}>\n      <Box {...getStyles('root')} size={size} {...others}>\n        <Box\n          {...getStyles('steps')}\n          mod={{\n            orientation,\n            'icon-position': iconPosition,\n            wrap: wrap && orientation !== 'vertical',\n          }}\n        >\n          {items}\n        </Box>\n        {contentSection}\n      </Box>\n    </StepperProvider>\n  );\n});\n\nStepper.classes = classes;\nStepper.varsResolver = varsResolver;\nStepper.displayName = '@mantine/core/Stepper';\nStepper.Completed = StepperCompleted;\nStepper.Step = StepperStep;\n\nexport namespace Stepper {\n  export type Props = StepperProps;\n  export type StylesNames = StepperStylesNames;\n  export type CssVariables = StepperCssVariables;\n  export type Factory = StepperFactory;\n  export type Step = StepFragmentComponent;\n  export type ContextValue = StepperContextValue;\n\n  export namespace Step {\n    export type Props = StepperStepProps;\n  }\n\n  export namespace Completed {\n    export type Props = StepperCompletedProps;\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"Stepper.cjs","names":["createVarsResolver","getThemeColor","getAutoContrastValue","getContrastColor","getSize","rem","getSpacing","getRadius","getFontSize","factory","useProps","useStyles","Children","StepperCompleted","Activity","StepperProvider","Box","classes","StepperStep"],"sources":["../../../src/components/Stepper/Stepper.tsx"],"sourcesContent":["import { Activity, Children, cloneElement } from 'react';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getAutoContrastValue,\n  getContrastColor,\n  getFontSize,\n  getRadius,\n  getSize,\n  getSpacing,\n  getThemeColor,\n  MantineColor,\n  MantineRadius,\n  MantineSize,\n  MantineSpacing,\n  rem,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { StepperProvider, type StepperContextValue } from './Stepper.context';\nimport { StepperCompleted, StepperCompletedProps } from './StepperCompleted/StepperCompleted';\nimport { StepperStep, StepperStepProps } from './StepperStep/StepperStep';\nimport classes from './Stepper.module.css';\nexport type StepFragmentComponent = React.FC<{ step: number }>;\n\nexport type StepperStylesNames =\n  | 'root'\n  | 'separator'\n  | 'steps'\n  | 'content'\n  | 'step'\n  | 'stepLoader'\n  | 'verticalSeparator'\n  | 'stepWrapper'\n  | 'stepIcon'\n  | 'stepCompletedIcon'\n  | 'stepIconContent'\n  | 'stepBody'\n  | 'stepLabel'\n  | 'stepDescription';\n\nexport type StepperCssVariables = {\n  root:\n    | '--stepper-color'\n    | '--stepper-icon-color'\n    | '--stepper-icon-size'\n    | '--stepper-content-padding'\n    | '--stepper-radius'\n    | '--stepper-fz'\n    | '--stepper-spacing';\n};\n\nexport interface StepperProps\n  extends BoxProps, StylesApiProps<StepperFactory>, ElementProps<'div'> {\n  /** `Stepper.Step` components */\n  children: React.ReactNode;\n\n  /** Called when a clickable step is clicked with its 0-based index. Not called for the currently active step. */\n  onStepClick?: (stepIndex: number) => void;\n\n  /** Index of the active step */\n  active: number;\n\n  /** Step icon @default step index + 1 */\n  icon?: React.ReactNode | StepFragmentComponent;\n\n  /** Step icon displayed when step is completed @default CheckIcon */\n  completedIcon?: React.ReactNode | StepFragmentComponent;\n\n  /** Step icon displayed when step is in progress @default step index + 1 */\n  progressIcon?: React.ReactNode | StepFragmentComponent;\n\n  /** Key of `theme.colors` or any valid CSS color, controls colors of active and progress steps @default theme.primaryColor */\n  color?: MantineColor;\n\n  /** Controls size of the step icon, by default icon size is inferred from `size` prop */\n  iconSize?: number | string;\n\n  /** Key of `theme.spacing` or any valid CSS value to set `padding-top` of the content @default 'md' */\n  contentPadding?: MantineSpacing;\n\n  /** Stepper orientation @default 'horizontal' */\n  orientation?: 'vertical' | 'horizontal';\n\n  /** Icon position relative to the step body @default 'left' */\n  iconPosition?: 'right' | 'left';\n\n  /** Controls size of various Stepper elements */\n  size?: MantineSize;\n\n  /** Key of `theme.radius` or any valid CSS value to set steps border-radius @default \"xl\" */\n  radius?: MantineRadius;\n\n  /** When true, users can click and jump to any step. When false, users can only navigate to completed steps @default true */\n  allowNextStepsSelect?: boolean;\n\n  /** Determines whether steps should wrap to the next line if no space is available @default true */\n  wrap?: boolean;\n\n  /** When true, automatically adjusts the icon color in completed steps to ensure sufficient contrast against the step background color */\n  autoContrast?: boolean;\n\n  /** If set, all step content is kept mounted. React 19 `Activity` is used to preserve state while content is hidden. @default false */\n  keepMounted?: boolean;\n}\n\nexport type StepperFactory = Factory<{\n  props: StepperProps;\n  ref: HTMLDivElement;\n  stylesNames: StepperStylesNames;\n  vars: StepperCssVariables;\n  staticComponents: {\n    Step: typeof StepperStep;\n    Completed: typeof StepperCompleted;\n  };\n}>;\n\nconst defaultProps = {\n  orientation: 'horizontal',\n  iconPosition: 'left',\n  allowNextStepsSelect: true,\n  wrap: true,\n} satisfies Partial<StepperProps>;\n\nconst varsResolver = createVarsResolver<StepperFactory>(\n  (theme, { color, iconSize, size, contentPadding, radius, autoContrast }) => ({\n    root: {\n      '--stepper-color': color ? getThemeColor(color, theme) : undefined,\n      '--stepper-icon-color': getAutoContrastValue(autoContrast, theme)\n        ? getContrastColor({ color, theme, autoContrast })\n        : undefined,\n      '--stepper-icon-size':\n        iconSize === undefined ? getSize(size, 'stepper-icon-size') : rem(iconSize),\n      '--stepper-content-padding': getSpacing(contentPadding),\n      '--stepper-radius': radius === undefined ? undefined : getRadius(radius),\n      '--stepper-fz': getFontSize(size),\n      '--stepper-spacing': getSpacing(size),\n    },\n  })\n);\n\nexport const Stepper = factory<StepperFactory>((_props) => {\n  const props = useProps('Stepper', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    children,\n    onStepClick,\n    active,\n    icon,\n    completedIcon,\n    progressIcon,\n    color,\n    iconSize,\n    contentPadding,\n    orientation,\n    iconPosition,\n    size,\n    radius,\n    allowNextStepsSelect,\n    wrap,\n    autoContrast,\n    keepMounted,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<StepperFactory>({\n    name: 'Stepper',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const convertedChildren = Children.toArray(children) as React.ReactElement[];\n  const _children = convertedChildren.filter(\n    (child) => child.type !== StepperCompleted\n  ) as React.ReactElement<StepperStepProps>[];\n  const completedStep = convertedChildren.find(\n    (item) => item.type === StepperCompleted\n  ) as React.ReactElement<StepperCompletedProps>;\n\n  const items = _children.reduce<React.ReactElement<StepperStepProps>[]>(\n    (acc, item: React.ReactElement<StepperStepProps>, index) => {\n      const state =\n        active === index ? 'stepProgress' : active > index ? 'stepCompleted' : 'stepInactive';\n\n      const shouldAllowSelect = () => {\n        if (typeof onStepClick !== 'function') {\n          return false;\n        }\n\n        if (typeof item.props.allowStepSelect === 'boolean') {\n          return item.props.allowStepSelect;\n        }\n\n        return state === 'stepCompleted' || allowNextStepsSelect;\n      };\n\n      const isStepSelectionEnabled = shouldAllowSelect();\n\n      acc.push(\n        cloneElement(item, {\n          icon: item.props.icon || icon || index + 1,\n          key: index,\n          step: index,\n          state,\n          onClick: () => isStepSelectionEnabled && onStepClick?.(index),\n          allowStepClick: isStepSelectionEnabled,\n          completedIcon: item.props.completedIcon || completedIcon,\n          progressIcon: item.props.progressIcon || progressIcon,\n          color: item.props.color || color,\n          iconSize,\n          iconPosition: item.props.iconPosition || iconPosition,\n          orientation,\n        })\n      );\n\n      if (orientation === 'horizontal' && index !== _children.length - 1) {\n        acc.push(\n          <div\n            {...getStyles('separator')}\n            data-active={index < active || undefined}\n            data-orientation={orientation}\n            key={`separator-${index}`}\n          />\n        );\n      }\n\n      return acc;\n    },\n    []\n  );\n\n  const stepContent = _children[active]?.props?.children;\n  const completedContent = completedStep?.props?.children;\n  const content = active > _children.length - 1 ? completedContent : stepContent;\n\n  const contentSection = keepMounted ? (\n    <>\n      {_children.map((child, index) => (\n        <Activity key={index} mode={active === index ? 'visible' : 'hidden'}>\n          <div {...getStyles('content')}>{child.props.children}</div>\n        </Activity>\n      ))}\n      {completedStep && (\n        <Activity mode={active > _children.length - 1 ? 'visible' : 'hidden'}>\n          <div {...getStyles('content')}>{completedStep.props.children}</div>\n        </Activity>\n      )}\n    </>\n  ) : (\n    content && <div {...getStyles('content')}>{content}</div>\n  );\n\n  return (\n    <StepperProvider value={{ getStyles, orientation, iconPosition }}>\n      <Box {...getStyles('root')} size={size} {...others}>\n        <Box\n          {...getStyles('steps')}\n          mod={{\n            orientation,\n            'icon-position': iconPosition,\n            wrap: wrap && orientation !== 'vertical',\n          }}\n        >\n          {items}\n        </Box>\n        {contentSection}\n      </Box>\n    </StepperProvider>\n  );\n});\n\nStepper.classes = classes;\nStepper.varsResolver = varsResolver;\nStepper.displayName = '@mantine/core/Stepper';\nStepper.Completed = StepperCompleted;\nStepper.Step = StepperStep;\n\nexport namespace Stepper {\n  export type Props = StepperProps;\n  export type StylesNames = StepperStylesNames;\n  export type CssVariables = StepperCssVariables;\n  export type Factory = StepperFactory;\n  export type Step = StepFragmentComponent;\n  export type ContextValue = StepperContextValue;\n\n  export namespace Step {\n    export type Props = StepperStepProps;\n  }\n\n  export namespace Completed {\n    export type Props = StepperCompletedProps;\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AA0HA,MAAM,eAAe;CACnB,aAAa;CACb,cAAc;CACd,sBAAsB;CACtB,MAAM;AACR;AAEA,MAAM,eAAeA,6BAAAA,oBAClB,OAAO,EAAE,OAAO,UAAU,MAAM,gBAAgB,QAAQ,oBAAoB,EAC3E,MAAM;CACJ,mBAAmB,QAAQC,wBAAAA,cAAc,OAAO,KAAK,IAAI,KAAA;CACzD,wBAAwBC,gCAAAA,qBAAqB,cAAc,KAAK,IAC5DC,2BAAAA,iBAAiB;EAAE;EAAO;EAAO;CAAa,CAAC,IAC/C,KAAA;CACJ,uBACE,aAAa,KAAA,IAAYC,iBAAAA,QAAQ,MAAM,mBAAmB,IAAIC,YAAAA,IAAI,QAAQ;CAC5E,6BAA6BC,iBAAAA,WAAW,cAAc;CACtD,oBAAoB,WAAW,KAAA,IAAY,KAAA,IAAYC,iBAAAA,UAAU,MAAM;CACvE,gBAAgBC,iBAAAA,YAAY,IAAI;CAChC,qBAAqBF,iBAAAA,WAAW,IAAI;AACtC,EACF,EACF;AAEA,MAAa,UAAUG,gBAAAA,SAAyB,WAAW;CACzD,MAAM,QAAQC,kBAAAA,SAAS,WAAW,cAAc,MAAM;CACtD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,aACA,QACA,MACA,eACA,cACA,OACA,UACA,gBACA,aACA,cACA,MACA,QACA,sBACA,MACA,cACA,aACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAA0B;EAC1C,MAAM;EACN,SAAA,uBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,oBAAoBC,MAAAA,SAAS,QAAQ,QAAQ;CACnD,MAAM,YAAY,kBAAkB,QACjC,UAAU,MAAM,SAASC,yBAAAA,gBAC5B;CACA,MAAM,gBAAgB,kBAAkB,MACrC,SAAS,KAAK,SAASA,yBAAAA,gBAC1B;CAEA,MAAM,QAAQ,UAAU,QACrB,KAAK,MAA4C,UAAU;EAC1D,MAAM,QACJ,WAAW,QAAQ,iBAAiB,SAAS,QAAQ,kBAAkB;EAEzE,MAAM,0BAA0B;GAC9B,IAAI,OAAO,gBAAgB,YACzB,OAAO;GAGT,IAAI,OAAO,KAAK,MAAM,oBAAoB,WACxC,OAAO,KAAK,MAAM;GAGpB,OAAO,UAAU,mBAAmB;EACtC;EAEA,MAAM,yBAAyB,kBAAkB;EAEjD,IAAI,MAAA,GAAA,MAAA,cACW,MAAM;GACjB,MAAM,KAAK,MAAM,QAAQ,QAAQ,QAAQ;GACzC,KAAK;GACL,MAAM;GACN;GACA,eAAe,0BAA0B,cAAc,KAAK;GAC5D,gBAAgB;GAChB,eAAe,KAAK,MAAM,iBAAiB;GAC3C,cAAc,KAAK,MAAM,gBAAgB;GACzC,OAAO,KAAK,MAAM,SAAS;GAC3B;GACA,cAAc,KAAK,MAAM,gBAAgB;GACzC;EACF,CAAC,CACH;EAEA,IAAI,gBAAgB,gBAAgB,UAAU,UAAU,SAAS,GAC/D,IAAI,KACF,iBAAA,GAAA,MAAA,eAAC,OAAD;GACE,GAAI,UAAU,WAAW;GACzB,eAAa,QAAQ,UAAU,KAAA;GAC/B,oBAAkB;GAClB,KAAK,aAAa;EACnB,CAAA,CACH;EAGF,OAAO;CACT,GACA,CAAC,CACH;CAEA,MAAM,cAAc,UAAU,SAAS,OAAO;CAC9C,MAAM,mBAAmB,eAAe,OAAO;CAC/C,MAAM,UAAU,SAAS,UAAU,SAAS,IAAI,mBAAmB;CAEnE,MAAM,iBAAiB,cACrB,iBAAA,GAAA,kBAAA,MAAA,kBAAA,UAAA,EAAA,UAAA,CACG,UAAU,KAAK,OAAO,UACrB,iBAAA,GAAA,kBAAA,KAACC,MAAAA,UAAD;EAAsB,MAAM,WAAW,QAAQ,YAAY;YACzD,iBAAA,GAAA,kBAAA,KAAC,OAAD;GAAK,GAAI,UAAU,SAAS;aAAI,MAAM,MAAM;EAAc,CAAA;CAClD,GAFK,KAEL,CACX,GACA,iBACC,iBAAA,GAAA,kBAAA,KAACA,MAAAA,UAAD;EAAU,MAAM,SAAS,UAAU,SAAS,IAAI,YAAY;YAC1D,iBAAA,GAAA,kBAAA,KAAC,OAAD;GAAK,GAAI,UAAU,SAAS;aAAI,cAAc,MAAM;EAAc,CAAA;CAC1D,CAAA,CAEZ,EAAA,CAAA,IAEF,WAAW,iBAAA,GAAA,kBAAA,KAAC,OAAD;EAAK,GAAI,UAAU,SAAS;YAAI;CAAa,CAAA;CAG1D,OACE,iBAAA,GAAA,kBAAA,KAACC,wBAAAA,iBAAD;EAAiB,OAAO;GAAE;GAAW;GAAa;EAAa;YAC7D,iBAAA,GAAA,kBAAA,MAACC,YAAAA,KAAD;GAAK,GAAI,UAAU,MAAM;GAAS;GAAM,GAAI;aAA5C,CACE,iBAAA,GAAA,kBAAA,KAACA,YAAAA,KAAD;IACE,GAAI,UAAU,OAAO;IACrB,KAAK;KACH;KACA,iBAAiB;KACjB,MAAM,QAAQ,gBAAgB;IAChC;cAEC;GACE,CAAA,GACJ,cACE;;CACU,CAAA;AAErB,CAAC;AAED,QAAQ,UAAUC,uBAAAA;AAClB,QAAQ,eAAe;AACvB,QAAQ,cAAc;AACtB,QAAQ,YAAYJ,yBAAAA;AACpB,QAAQ,OAAOK,oBAAAA"}

package/cjs/components/Stepper/Stepper.context.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Stepper.context.cjs","names":["createSafeContext"],"sources":["../../../src/components/Stepper/Stepper.context.ts"],"sourcesContent":["import { createSafeContext, GetStylesApi } from '../../core';\nimport type { StepperFactory } from './Stepper';\n\nexport interface StepperContextValue {\n  getStyles: GetStylesApi<StepperFactory>;\n  orientation: 'horizontal' | 'vertical' | undefined;\n  iconPosition: 'left' | 'right' | undefined;\n}\n\nexport const [StepperProvider, useStepperContext] = createSafeContext<StepperContextValue>(\n  'Stepper component was not found in tree'\n);\n"],"mappings":";;AASA,MAAa,CAAC,iBAAiB,6FAAqBA,kBAClD,0CACD"}
+{"version":3,"file":"Stepper.context.cjs","names":["createSafeContext"],"sources":["../../../src/components/Stepper/Stepper.context.ts"],"sourcesContent":["import { createSafeContext, GetStylesApi } from '../../core';\nimport type { StepperFactory } from './Stepper';\n\nexport interface StepperContextValue {\n  getStyles: GetStylesApi<StepperFactory>;\n  orientation: 'horizontal' | 'vertical' | undefined;\n  iconPosition: 'left' | 'right' | undefined;\n}\n\nexport const [StepperProvider, useStepperContext] = createSafeContext<StepperContextValue>(\n  'Stepper component was not found in tree'\n);\n"],"mappings":";;AASA,MAAa,CAAC,iBAAiB,2FAAqBA,EAAAA,kBAClD,yCACF"}

package/cjs/components/Stepper/StepperStep/StepperStep.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"StepperStep.cjs","names":["factory","useProps","useStepperContext","useMantineTheme","UnstyledButton","getThemeColor","Transition","Loader","CheckIcon","classes"],"sources":["../../../../src/components/Stepper/StepperStep/StepperStep.tsx"],"sourcesContent":["import {\n  BoxProps,\n  CompoundStylesApiProps,\n  ElementProps,\n  factory,\n  Factory,\n  getThemeColor,\n  MantineColor,\n  useMantineTheme,\n  useProps,\n} from '../../../core';\nimport { CheckIcon } from '../../Checkbox';\nimport { Loader } from '../../Loader';\nimport { Transition } from '../../Transition';\nimport { UnstyledButton } from '../../UnstyledButton';\nimport type { StepFragmentComponent } from '../Stepper';\nimport { useStepperContext } from '../Stepper.context';\nimport classes from '../Stepper.module.css';\n\nconst getStepFragment = (\n  Fragment: StepFragmentComponent | React.ReactNode,\n  step: number | undefined\n) => {\n  if (typeof Fragment === 'function') {\n    return <Fragment step={step || 0} />;\n  }\n\n  return Fragment;\n};\n\nexport type StepperStepStylesNames =\n  | 'step'\n  | 'stepLoader'\n  | 'verticalSeparator'\n  | 'stepWrapper'\n  | 'stepIcon'\n  | 'stepCompletedIcon'\n  | 'stepIconContent'\n  | 'stepBody'\n  | 'stepLabel'\n  | 'stepDescription';\n\nexport interface StepperStepProps\n  extends BoxProps, CompoundStylesApiProps<StepperStepFactory>, ElementProps<'button'> {\n  /** 0-based step index, automatically set by Stepper component */\n  step?: number;\n\n  /** Step state, automatically set by Stepper component based on active prop. stepInactive: not reached, stepProgress: current, stepCompleted: passed */\n  state?: 'stepInactive' | 'stepProgress' | 'stepCompleted';\n\n  /** Key of `theme.colors`, by default controlled by Stepper component */\n  color?: MantineColor;\n\n  /** When false, hides the step icon. Useful for creating compact steppers with only labels @default true */\n  withIcon?: boolean;\n\n  /** Step icon, defaults to `step index + 1` when rendered within Stepper */\n  icon?: React.ReactNode | StepFragmentComponent;\n\n  /** Step icon displayed when step is completed */\n  completedIcon?: React.ReactNode | StepFragmentComponent;\n\n  /** Step icon displayed when step is in progress */\n  progressIcon?: React.ReactNode | StepFragmentComponent;\n\n  /** Step label, render after icon */\n  label?: React.ReactNode | StepFragmentComponent;\n\n  /** Step description */\n  description?: React.ReactNode | StepFragmentComponent;\n\n  /** Icon wrapper size */\n  iconSize?: string | number;\n\n  /** Icon position relative to step body, controlled by Stepper component */\n  iconPosition?: 'right' | 'left';\n\n  /** Indicates loading state of the step */\n  loading?: boolean;\n\n  /** Set to false to disable clicks on step */\n  allowStepClick?: boolean;\n\n  /** Should step selection be allowed */\n  allowStepSelect?: boolean;\n\n  /** Static selector base */\n  __staticSelector?: string;\n\n  /** Component orientation */\n  orientation?: 'vertical' | 'horizontal';\n}\n\nexport type StepperStepFactory = Factory<{\n  props: StepperStepProps;\n  ref: HTMLButtonElement;\n  stylesNames: StepperStepStylesNames;\n  compound: true;\n}>;\n\nconst defaultProps = {\n  withIcon: true,\n  allowStepClick: true,\n  iconPosition: 'left',\n} satisfies Partial<StepperStepProps>;\n\nexport const StepperStep = factory<StepperStepFactory>((props) => {\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    vars,\n    step,\n    state,\n    color,\n    icon,\n    completedIcon,\n    progressIcon,\n    label,\n    description,\n    withIcon,\n    iconSize,\n    loading,\n    allowStepClick,\n    allowStepSelect,\n    iconPosition,\n    orientation,\n    mod,\n    ...others\n  } = useProps('StepperStep', defaultProps, props);\n\n  const ctx = useStepperContext();\n  const theme = useMantineTheme();\n  const stylesApi = { classNames, styles };\n\n  const _icon = state === 'stepCompleted' ? null : state === 'stepProgress' ? progressIcon : icon;\n  const dataAttributes = {\n    'data-progress': state === 'stepProgress' || undefined,\n    'data-completed': state === 'stepCompleted' || undefined,\n  };\n\n  return (\n    <UnstyledButton\n      {...ctx.getStyles('step', { className, style, variant: ctx.orientation, ...stylesApi })}\n      mod={[\n        { 'icon-position': iconPosition || ctx.iconPosition, 'allow-click': allowStepClick },\n        mod,\n      ]}\n      {...dataAttributes}\n      {...others}\n      __vars={{ '--step-color': color ? getThemeColor(color, theme) : undefined }}\n      tabIndex={allowStepClick ? 0 : -1}\n    >\n      {withIcon && (\n        <span {...ctx.getStyles('stepWrapper', stylesApi)}>\n          <span {...ctx.getStyles('stepIcon', stylesApi)} {...dataAttributes}>\n            <Transition mounted={state === 'stepCompleted'} transition=\"pop\" duration={200}>\n              {(transitionStyles) => (\n                <span\n                  {...ctx.getStyles('stepCompletedIcon', { style: transitionStyles, ...stylesApi })}\n                >\n                  {loading ? (\n                    <Loader\n                      color=\"var(--mantine-color-white)\"\n                      size=\"calc(var(--stepper-icon-size) / 2)\"\n                      {...ctx.getStyles('stepLoader', stylesApi)}\n                    />\n                  ) : (\n                    getStepFragment(completedIcon, step) || <CheckIcon size=\"60%\" />\n                  )}\n                </span>\n              )}\n            </Transition>\n\n            {state !== 'stepCompleted' ? (\n              <span {...ctx.getStyles('stepIconContent', stylesApi)}>\n                {loading ? (\n                  <Loader\n                    {...ctx.getStyles('stepLoader', stylesApi)}\n                    size=\"calc(var(--stepper-icon-size) / 2)\"\n                    color={color}\n                  />\n                ) : (\n                  getStepFragment(_icon || icon, step)\n                )}\n              </span>\n            ) : null}\n          </span>\n          {orientation === 'vertical' && (\n            <span\n              {...ctx.getStyles('verticalSeparator', stylesApi)}\n              data-active={state === 'stepCompleted' || undefined}\n            />\n          )}\n        </span>\n      )}\n\n      {(label || description) && (\n        <span\n          {...ctx.getStyles('stepBody', stylesApi)}\n          data-orientation={ctx.orientation}\n          data-icon-position={iconPosition || ctx.iconPosition}\n        >\n          {label && (\n            <span {...ctx.getStyles('stepLabel', stylesApi)}>{getStepFragment(label, step)}</span>\n          )}\n          {description && (\n            <span {...ctx.getStyles('stepDescription', stylesApi)}>\n              {getStepFragment(description, step)}\n            </span>\n          )}\n        </span>\n      )}\n    </UnstyledButton>\n  );\n});\n\nStepperStep.classes = classes;\nStepperStep.displayName = '@mantine/core/StepperStep';\n"],"mappings":"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"}
+{"version":3,"file":"StepperStep.cjs","names":["factory","useProps","useStepperContext","useMantineTheme","UnstyledButton","getThemeColor","Transition","Loader","CheckIcon","classes"],"sources":["../../../../src/components/Stepper/StepperStep/StepperStep.tsx"],"sourcesContent":["import {\n  BoxProps,\n  CompoundStylesApiProps,\n  ElementProps,\n  factory,\n  Factory,\n  getThemeColor,\n  MantineColor,\n  useMantineTheme,\n  useProps,\n} from '../../../core';\nimport { CheckIcon } from '../../Checkbox';\nimport { Loader } from '../../Loader';\nimport { Transition } from '../../Transition';\nimport { UnstyledButton } from '../../UnstyledButton';\nimport type { StepFragmentComponent } from '../Stepper';\nimport { useStepperContext } from '../Stepper.context';\nimport classes from '../Stepper.module.css';\n\nconst getStepFragment = (\n  Fragment: StepFragmentComponent | React.ReactNode,\n  step: number | undefined\n) => {\n  if (typeof Fragment === 'function') {\n    return <Fragment step={step || 0} />;\n  }\n\n  return Fragment;\n};\n\nexport type StepperStepStylesNames =\n  | 'step'\n  | 'stepLoader'\n  | 'verticalSeparator'\n  | 'stepWrapper'\n  | 'stepIcon'\n  | 'stepCompletedIcon'\n  | 'stepIconContent'\n  | 'stepBody'\n  | 'stepLabel'\n  | 'stepDescription';\n\nexport interface StepperStepProps\n  extends BoxProps, CompoundStylesApiProps<StepperStepFactory>, ElementProps<'button'> {\n  /** 0-based step index, automatically set by Stepper component */\n  step?: number;\n\n  /** Step state, automatically set by Stepper component based on active prop. stepInactive: not reached, stepProgress: current, stepCompleted: passed */\n  state?: 'stepInactive' | 'stepProgress' | 'stepCompleted';\n\n  /** Key of `theme.colors`, by default controlled by Stepper component */\n  color?: MantineColor;\n\n  /** When false, hides the step icon. Useful for creating compact steppers with only labels @default true */\n  withIcon?: boolean;\n\n  /** Step icon, defaults to `step index + 1` when rendered within Stepper */\n  icon?: React.ReactNode | StepFragmentComponent;\n\n  /** Step icon displayed when step is completed */\n  completedIcon?: React.ReactNode | StepFragmentComponent;\n\n  /** Step icon displayed when step is in progress */\n  progressIcon?: React.ReactNode | StepFragmentComponent;\n\n  /** Step label, render after icon */\n  label?: React.ReactNode | StepFragmentComponent;\n\n  /** Step description */\n  description?: React.ReactNode | StepFragmentComponent;\n\n  /** Icon wrapper size */\n  iconSize?: string | number;\n\n  /** Icon position relative to step body, controlled by Stepper component */\n  iconPosition?: 'right' | 'left';\n\n  /** Indicates loading state of the step */\n  loading?: boolean;\n\n  /** Set to false to disable clicks on step */\n  allowStepClick?: boolean;\n\n  /** Should step selection be allowed */\n  allowStepSelect?: boolean;\n\n  /** Static selector base */\n  __staticSelector?: string;\n\n  /** Component orientation */\n  orientation?: 'vertical' | 'horizontal';\n}\n\nexport type StepperStepFactory = Factory<{\n  props: StepperStepProps;\n  ref: HTMLButtonElement;\n  stylesNames: StepperStepStylesNames;\n  compound: true;\n}>;\n\nconst defaultProps = {\n  withIcon: true,\n  allowStepClick: true,\n  iconPosition: 'left',\n} satisfies Partial<StepperStepProps>;\n\nexport const StepperStep = factory<StepperStepFactory>((props) => {\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    vars,\n    step,\n    state,\n    color,\n    icon,\n    completedIcon,\n    progressIcon,\n    label,\n    description,\n    withIcon,\n    iconSize,\n    loading,\n    allowStepClick,\n    allowStepSelect,\n    iconPosition,\n    orientation,\n    mod,\n    ...others\n  } = useProps('StepperStep', defaultProps, props);\n\n  const ctx = useStepperContext();\n  const theme = useMantineTheme();\n  const stylesApi = { classNames, styles };\n\n  const _icon = state === 'stepCompleted' ? null : state === 'stepProgress' ? progressIcon : icon;\n  const dataAttributes = {\n    'data-progress': state === 'stepProgress' || undefined,\n    'data-completed': state === 'stepCompleted' || undefined,\n  };\n\n  return (\n    <UnstyledButton\n      {...ctx.getStyles('step', { className, style, variant: ctx.orientation, ...stylesApi })}\n      mod={[\n        { 'icon-position': iconPosition || ctx.iconPosition, 'allow-click': allowStepClick },\n        mod,\n      ]}\n      {...dataAttributes}\n      {...others}\n      __vars={{ '--step-color': color ? getThemeColor(color, theme) : undefined }}\n      tabIndex={allowStepClick ? 0 : -1}\n    >\n      {withIcon && (\n        <span {...ctx.getStyles('stepWrapper', stylesApi)}>\n          <span {...ctx.getStyles('stepIcon', stylesApi)} {...dataAttributes}>\n            <Transition mounted={state === 'stepCompleted'} transition=\"pop\" duration={200}>\n              {(transitionStyles) => (\n                <span\n                  {...ctx.getStyles('stepCompletedIcon', { style: transitionStyles, ...stylesApi })}\n                >\n                  {loading ? (\n                    <Loader\n                      color=\"var(--mantine-color-white)\"\n                      size=\"calc(var(--stepper-icon-size) / 2)\"\n                      {...ctx.getStyles('stepLoader', stylesApi)}\n                    />\n                  ) : (\n                    getStepFragment(completedIcon, step) || <CheckIcon size=\"60%\" />\n                  )}\n                </span>\n              )}\n            </Transition>\n\n            {state !== 'stepCompleted' ? (\n              <span {...ctx.getStyles('stepIconContent', stylesApi)}>\n                {loading ? (\n                  <Loader\n                    {...ctx.getStyles('stepLoader', stylesApi)}\n                    size=\"calc(var(--stepper-icon-size) / 2)\"\n                    color={color}\n                  />\n                ) : (\n                  getStepFragment(_icon || icon, step)\n                )}\n              </span>\n            ) : null}\n          </span>\n          {orientation === 'vertical' && (\n            <span\n              {...ctx.getStyles('verticalSeparator', stylesApi)}\n              data-active={state === 'stepCompleted' || undefined}\n            />\n          )}\n        </span>\n      )}\n\n      {(label || description) && (\n        <span\n          {...ctx.getStyles('stepBody', stylesApi)}\n          data-orientation={ctx.orientation}\n          data-icon-position={iconPosition || ctx.iconPosition}\n        >\n          {label && (\n            <span {...ctx.getStyles('stepLabel', stylesApi)}>{getStepFragment(label, step)}</span>\n          )}\n          {description && (\n            <span {...ctx.getStyles('stepDescription', stylesApi)}>\n              {getStepFragment(description, step)}\n            </span>\n          )}\n        </span>\n      )}\n    </UnstyledButton>\n  );\n});\n\nStepperStep.classes = classes;\nStepperStep.displayName = '@mantine/core/StepperStep';\n"],"mappings":"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"}

package/cjs/components/Switch/Switch.cjs

@@ -48,6 +48,11 @@ const Switch = require_factory.factory((_props) => {
 	});
 	const { styleProps, rest } = require_extract_style_props.extractStyleProps(others);
 	const uuid = (0, _mantine_hooks.useId)(id);
+	const describedBy = [
+		description ? `${uuid}-description` : void 0,
+		error && typeof error !== "boolean" ? `${uuid}-error` : void 0,
+		rest["aria-describedby"]
+	].filter(Boolean).join(" ") || void 0;
 	const withContextProps = {
 		checked: ctx?.value.includes(rest.value) ?? checked,
 		onChange: (event) => {
@@ -99,6 +104,7 @@ const Switch = require_factory.factory((_props) => {
 			type: "checkbox",
 			role: "switch",
 			inert: rest.inert,
+			"aria-describedby": describedBy,
 			...getStyles("input")
 		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_Box.Box, {
 			"aria-hidden": "true",

package/cjs/components/Switch/Switch.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.cjs","names":["createVarsResolver","getRadius","getSize","getThemeColor","factory","useProps","SwitchGroupContext","useStyles","extractStyleProps","InlineInput","Box","classes","InlineInputClasses","SwitchGroup"],"sources":["../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import { use } from 'react';\nimport { useId, useUncontrolled } from '@mantine/hooks';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  DataAttributes,\n  ElementProps,\n  extractStyleProps,\n  factory,\n  Factory,\n  getRadius,\n  getSize,\n  getThemeColor,\n  MantineColor,\n  MantineRadius,\n  MantineSize,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { InlineInput, InlineInputClasses, InlineInputStylesNames } from '../../utils/InlineInput';\nimport {\n  SwitchGroup,\n  SwitchGroupContext,\n  type SwitchGroupProps,\n  type SwitchGroupStylesNames,\n  type SwitchGroupFactory,\n  type SwitchGroupContextValue,\n} from './SwitchGroup/SwitchGroup';\nimport classes from './Switch.module.css';\nexport type SwitchStylesNames =\n  | 'root'\n  | 'track'\n  | 'trackLabel'\n  | 'thumb'\n  | 'input'\n  | InlineInputStylesNames;\n\nexport type SwitchCssVariables = {\n  root:\n    | '--switch-radius'\n    | '--switch-height'\n    | '--switch-width'\n    | '--switch-thumb-size'\n    | '--switch-label-font-size'\n    | '--switch-track-label-padding'\n    | '--switch-color';\n};\n\nexport interface SwitchProps\n  extends BoxProps, StylesApiProps<SwitchFactory>, ElementProps<'input', 'size' | 'children'> {\n  /** Id used to bind input and label, if not passed, unique id will be generated instead */\n  id?: string;\n\n  /** Content of the label associated with the switch */\n  label?: React.ReactNode;\n\n  /** Inner label when the `Switch` is in unchecked state */\n  offLabel?: React.ReactNode;\n\n  /** Inner label when the `Switch` is in checked state */\n  onLabel?: React.ReactNode;\n\n  /** Key of `theme.colors` or any valid CSS color to set input color in checked state @default theme.primaryColor */\n  color?: MantineColor;\n\n  /** Controls size of all elements */\n  size?: MantineSize | (string & {});\n\n  /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default 'xl' */\n  radius?: MantineRadius;\n\n  /** Props passed down to the root element */\n  wrapperProps?: React.ComponentProps<'div'> & DataAttributes;\n\n  /** Icon inside the thumb of the switch */\n  thumbIcon?: React.ReactNode;\n\n  /** Position of the label relative to the input @default 'right' */\n  labelPosition?: 'left' | 'right';\n\n  /** Description displayed below the label */\n  description?: React.ReactNode;\n\n  /** Error displayed below the label */\n  error?: React.ReactNode;\n\n  /** Assigns ref of the root element */\n  rootRef?: React.Ref<HTMLDivElement>;\n\n  /** If set, displays a colored dot inside the thumb that matches the track background color @default true */\n  withThumbIndicator?: boolean;\n}\n\nexport type SwitchFactory = Factory<{\n  props: SwitchProps;\n  ref: HTMLInputElement;\n  stylesNames: SwitchStylesNames;\n  vars: SwitchCssVariables;\n  staticComponents: {\n    Group: typeof SwitchGroup;\n  };\n}>;\n\nconst defaultProps = {\n  labelPosition: 'right',\n  withThumbIndicator: true,\n} satisfies Partial<SwitchProps>;\n\nconst varsResolver = createVarsResolver<SwitchFactory>((theme, { radius, color, size }) => ({\n  root: {\n    '--switch-radius': radius === undefined ? undefined : getRadius(radius),\n    '--switch-height': getSize(size, 'switch-height'),\n    '--switch-width': getSize(size, 'switch-width'),\n    '--switch-thumb-size': getSize(size, 'switch-thumb-size'),\n    '--switch-label-font-size': getSize(size, 'switch-label-font-size'),\n    '--switch-track-label-padding': getSize(size, 'switch-track-label-padding'),\n    '--switch-color': color ? getThemeColor(color, theme) : undefined,\n  },\n}));\n\nexport const Switch = factory<SwitchFactory>((_props) => {\n  const props = useProps('Switch', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    color,\n    label,\n    offLabel,\n    onLabel,\n    id,\n    size,\n    radius,\n    wrapperProps,\n    thumbIcon,\n    checked,\n    defaultChecked,\n    onChange,\n    labelPosition,\n    description,\n    error,\n    disabled,\n    variant,\n    rootRef,\n    mod,\n    withThumbIndicator,\n    attributes,\n    ...others\n  } = props;\n\n  const ctx = use(SwitchGroupContext);\n  const _size = size || ctx?.size;\n\n  const getStyles = useStyles<SwitchFactory>({\n    name: 'Switch',\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const { styleProps, rest } = extractStyleProps(others);\n  const uuid = useId(id);\n\n  const withContextProps = {\n    checked: ctx?.value.includes(rest.value as string) ?? checked,\n    onChange: (event: React.ChangeEvent<HTMLInputElement>) => {\n      ctx?.onChange(event);\n      onChange?.(event);\n    },\n  };\n\n  const _disabled = disabled || ctx?.isDisabled?.(rest.value as string);\n\n  const [_checked, handleChange] = useUncontrolled({\n    value: withContextProps.checked ?? checked,\n    defaultValue: defaultChecked,\n    finalValue: false,\n  });\n\n  return (\n    <InlineInput\n      {...getStyles('root')}\n      __staticSelector=\"Switch\"\n      __stylesApiProps={props}\n      id={uuid}\n      size={_size}\n      labelPosition={labelPosition}\n      label={label}\n      description={description}\n      error={error}\n      disabled={_disabled}\n      bodyElement=\"label\"\n      labelElement=\"span\"\n      classNames={classNames}\n      styles={styles}\n      unstyled={unstyled}\n      data-checked={withContextProps.checked}\n      variant={variant}\n      ref={rootRef}\n      mod={mod}\n      attributes={attributes}\n      inert={rest.inert}\n      {...styleProps}\n      {...wrapperProps}\n    >\n      <input\n        {...rest}\n        {...withContextProps}\n        disabled={_disabled}\n        checked={_checked}\n        data-checked={withContextProps.checked}\n        onChange={(event) => {\n          withContextProps.onChange?.(event);\n          handleChange(event.currentTarget.checked);\n        }}\n        id={uuid}\n        type=\"checkbox\"\n        role=\"switch\"\n        inert={rest.inert}\n        {...getStyles('input')}\n      />\n\n      <Box\n        aria-hidden=\"true\"\n        component=\"span\"\n        mod={{ error, 'label-position': labelPosition, 'without-labels': !onLabel && !offLabel }}\n        {...getStyles('track')}\n      >\n        <Box\n          component=\"span\"\n          mod={{ 'reduce-motion': true, 'with-thumb-indicator': withThumbIndicator && !thumbIcon }}\n          {...getStyles('thumb')}\n        >\n          {thumbIcon}\n        </Box>\n        <span {...getStyles('trackLabel')}>{_checked ? onLabel : offLabel}</span>\n      </Box>\n    </InlineInput>\n  );\n});\n\nSwitch.classes = { ...classes, ...InlineInputClasses };\nSwitch.varsResolver = varsResolver;\nSwitch.displayName = '@mantine/core/Switch';\nSwitch.Group = SwitchGroup;\n\nexport namespace Switch {\n  export type Props = SwitchProps;\n  export type StylesNames = SwitchStylesNames;\n  export type CssVariables = SwitchCssVariables;\n  export type Factory = SwitchFactory;\n\n  export namespace Group {\n    export type Props = SwitchGroupProps;\n    export type StylesNames = SwitchGroupStylesNames;\n    export type Factory = SwitchGroupFactory;\n    export type Context = SwitchGroupContextValue;\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"Switch.cjs","names":["createVarsResolver","getRadius","getSize","getThemeColor","factory","useProps","SwitchGroupContext","useStyles","extractStyleProps","InlineInput","Box","classes","InlineInputClasses","SwitchGroup"],"sources":["../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import { use } from 'react';\nimport { useId, useUncontrolled } from '@mantine/hooks';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  DataAttributes,\n  ElementProps,\n  extractStyleProps,\n  factory,\n  Factory,\n  getRadius,\n  getSize,\n  getThemeColor,\n  MantineColor,\n  MantineRadius,\n  MantineSize,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { InlineInput, InlineInputClasses, InlineInputStylesNames } from '../../utils/InlineInput';\nimport {\n  SwitchGroup,\n  SwitchGroupContext,\n  type SwitchGroupProps,\n  type SwitchGroupStylesNames,\n  type SwitchGroupFactory,\n  type SwitchGroupContextValue,\n} from './SwitchGroup/SwitchGroup';\nimport classes from './Switch.module.css';\nexport type SwitchStylesNames =\n  | 'root'\n  | 'track'\n  | 'trackLabel'\n  | 'thumb'\n  | 'input'\n  | InlineInputStylesNames;\n\nexport type SwitchCssVariables = {\n  root:\n    | '--switch-radius'\n    | '--switch-height'\n    | '--switch-width'\n    | '--switch-thumb-size'\n    | '--switch-label-font-size'\n    | '--switch-track-label-padding'\n    | '--switch-color';\n};\n\nexport interface SwitchProps\n  extends BoxProps, StylesApiProps<SwitchFactory>, ElementProps<'input', 'size' | 'children'> {\n  /** Id used to bind input and label, if not passed, unique id will be generated instead */\n  id?: string;\n\n  /** Content of the label associated with the switch */\n  label?: React.ReactNode;\n\n  /** Inner label when the `Switch` is in unchecked state */\n  offLabel?: React.ReactNode;\n\n  /** Inner label when the `Switch` is in checked state */\n  onLabel?: React.ReactNode;\n\n  /** Key of `theme.colors` or any valid CSS color to set input color in checked state @default theme.primaryColor */\n  color?: MantineColor;\n\n  /** Controls size of all elements */\n  size?: MantineSize | (string & {});\n\n  /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default 'xl' */\n  radius?: MantineRadius;\n\n  /** Props passed down to the root element */\n  wrapperProps?: React.ComponentProps<'div'> & DataAttributes;\n\n  /** Icon inside the thumb of the switch */\n  thumbIcon?: React.ReactNode;\n\n  /** Position of the label relative to the input @default 'right' */\n  labelPosition?: 'left' | 'right';\n\n  /** Description displayed below the label */\n  description?: React.ReactNode;\n\n  /** Error displayed below the label */\n  error?: React.ReactNode;\n\n  /** Assigns ref of the root element */\n  rootRef?: React.Ref<HTMLDivElement>;\n\n  /** If set, displays a colored dot inside the thumb that matches the track background color @default true */\n  withThumbIndicator?: boolean;\n}\n\nexport type SwitchFactory = Factory<{\n  props: SwitchProps;\n  ref: HTMLInputElement;\n  stylesNames: SwitchStylesNames;\n  vars: SwitchCssVariables;\n  staticComponents: {\n    Group: typeof SwitchGroup;\n  };\n}>;\n\nconst defaultProps = {\n  labelPosition: 'right',\n  withThumbIndicator: true,\n} satisfies Partial<SwitchProps>;\n\nconst varsResolver = createVarsResolver<SwitchFactory>((theme, { radius, color, size }) => ({\n  root: {\n    '--switch-radius': radius === undefined ? undefined : getRadius(radius),\n    '--switch-height': getSize(size, 'switch-height'),\n    '--switch-width': getSize(size, 'switch-width'),\n    '--switch-thumb-size': getSize(size, 'switch-thumb-size'),\n    '--switch-label-font-size': getSize(size, 'switch-label-font-size'),\n    '--switch-track-label-padding': getSize(size, 'switch-track-label-padding'),\n    '--switch-color': color ? getThemeColor(color, theme) : undefined,\n  },\n}));\n\nexport const Switch = factory<SwitchFactory>((_props) => {\n  const props = useProps('Switch', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    color,\n    label,\n    offLabel,\n    onLabel,\n    id,\n    size,\n    radius,\n    wrapperProps,\n    thumbIcon,\n    checked,\n    defaultChecked,\n    onChange,\n    labelPosition,\n    description,\n    error,\n    disabled,\n    variant,\n    rootRef,\n    mod,\n    withThumbIndicator,\n    attributes,\n    ...others\n  } = props;\n\n  const ctx = use(SwitchGroupContext);\n  const _size = size || ctx?.size;\n\n  const getStyles = useStyles<SwitchFactory>({\n    name: 'Switch',\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const { styleProps, rest } = extractStyleProps(others);\n  const uuid = useId(id);\n  const descriptionId = description ? `${uuid}-description` : undefined;\n  const errorId = error && typeof error !== 'boolean' ? `${uuid}-error` : undefined;\n  const describedBy =\n    [descriptionId, errorId, rest['aria-describedby']].filter(Boolean).join(' ') || undefined;\n\n  const withContextProps = {\n    checked: ctx?.value.includes(rest.value as string) ?? checked,\n    onChange: (event: React.ChangeEvent<HTMLInputElement>) => {\n      ctx?.onChange(event);\n      onChange?.(event);\n    },\n  };\n\n  const _disabled = disabled || ctx?.isDisabled?.(rest.value as string);\n\n  const [_checked, handleChange] = useUncontrolled({\n    value: withContextProps.checked ?? checked,\n    defaultValue: defaultChecked,\n    finalValue: false,\n  });\n\n  return (\n    <InlineInput\n      {...getStyles('root')}\n      __staticSelector=\"Switch\"\n      __stylesApiProps={props}\n      id={uuid}\n      size={_size}\n      labelPosition={labelPosition}\n      label={label}\n      description={description}\n      error={error}\n      disabled={_disabled}\n      bodyElement=\"label\"\n      labelElement=\"span\"\n      classNames={classNames}\n      styles={styles}\n      unstyled={unstyled}\n      data-checked={withContextProps.checked}\n      variant={variant}\n      ref={rootRef}\n      mod={mod}\n      attributes={attributes}\n      inert={rest.inert}\n      {...styleProps}\n      {...wrapperProps}\n    >\n      <input\n        {...rest}\n        {...withContextProps}\n        disabled={_disabled}\n        checked={_checked}\n        data-checked={withContextProps.checked}\n        onChange={(event) => {\n          withContextProps.onChange?.(event);\n          handleChange(event.currentTarget.checked);\n        }}\n        id={uuid}\n        type=\"checkbox\"\n        role=\"switch\"\n        inert={rest.inert}\n        aria-describedby={describedBy}\n        {...getStyles('input')}\n      />\n\n      <Box\n        aria-hidden=\"true\"\n        component=\"span\"\n        mod={{ error, 'label-position': labelPosition, 'without-labels': !onLabel && !offLabel }}\n        {...getStyles('track')}\n      >\n        <Box\n          component=\"span\"\n          mod={{ 'reduce-motion': true, 'with-thumb-indicator': withThumbIndicator && !thumbIcon }}\n          {...getStyles('thumb')}\n        >\n          {thumbIcon}\n        </Box>\n        <span {...getStyles('trackLabel')}>{_checked ? onLabel : offLabel}</span>\n      </Box>\n    </InlineInput>\n  );\n});\n\nSwitch.classes = { ...classes, ...InlineInputClasses };\nSwitch.varsResolver = varsResolver;\nSwitch.displayName = '@mantine/core/Switch';\nSwitch.Group = SwitchGroup;\n\nexport namespace Switch {\n  export type Props = SwitchProps;\n  export type StylesNames = SwitchStylesNames;\n  export type CssVariables = SwitchCssVariables;\n  export type Factory = SwitchFactory;\n\n  export namespace Group {\n    export type Props = SwitchGroupProps;\n    export type StylesNames = SwitchGroupStylesNames;\n    export type Factory = SwitchGroupFactory;\n    export type Context = SwitchGroupContextValue;\n  }\n}\n"],"mappings":"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"}

package/cjs/components/Switch/SwitchGroup/SwitchGroup.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SwitchGroup.cjs","names":["genericFactory","useProps","Input","InputsGroupFieldset"],"sources":["../../../../src/components/Switch/SwitchGroup/SwitchGroup.tsx"],"sourcesContent":["import { createContext } from 'react';\nimport { useUncontrolled } from '@mantine/hooks';\nimport {\n  DataAttributes,\n  Factory,\n  genericFactory,\n  MantineSize,\n  Primitive,\n  useProps,\n} from '../../../core';\nimport { InputsGroupFieldset } from '../../../utils/InputsGroupFieldset';\nimport { Input, InputWrapperProps, InputWrapperStylesNames } from '../../Input';\n\nexport interface SwitchGroupContextValue<Value extends Primitive = string> {\n  value: Value[];\n  onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;\n  size: MantineSize | (string & {}) | undefined;\n  isDisabled?: (value: Value) => boolean;\n}\n\nexport const SwitchGroupContext = createContext<SwitchGroupContextValue | null>(null);\n\nexport type SwitchGroupStylesNames = InputWrapperStylesNames;\n\nexport interface SwitchGroupProps<Value extends Primitive = string> extends Omit<\n  InputWrapperProps,\n  'onChange' | 'value' | 'defaultValue'\n> {\n  /** `Switch` components */\n  children: React.ReactNode;\n\n  /** Controlled component value */\n  value?: Value[];\n\n  /** Default value for uncontrolled component */\n  defaultValue?: Value[];\n\n  /** Called when value changes */\n  onChange?: (value: Value[]) => void;\n\n  /** Props passed down to the `Input.Wrapper` */\n  wrapperProps?: React.ComponentProps<'div'> & DataAttributes;\n\n  /** Controls size of the `Input.Wrapper` @default 'sm' */\n  size?: MantineSize | (string & {});\n\n  /** If set, value cannot be changed */\n  readOnly?: boolean;\n\n  /** `name` attribute of the hidden input for uncontrolled forms */\n  name?: string;\n\n  /** Props passed down to the hidden input for uncontrolled forms */\n  hiddenInputProps?: React.ComponentProps<'input'> & DataAttributes;\n\n  /** Separator for values in the hidden input for uncontrolled forms @default ',' */\n  hiddenInputValuesSeparator?: string;\n\n  /** Maximum number of switches that can be selected. When the limit is reached, unselected switches will be disabled */\n  maxSelectedValues?: number;\n\n  /** Sets `disabled` attribute, prevents interactions */\n  disabled?: boolean;\n}\n\nexport type SwitchGroupFactory = Factory<{\n  props: SwitchGroupProps;\n  ref: HTMLDivElement;\n  stylesNames: SwitchGroupStylesNames;\n  signature: <Value extends Primitive = string>(\n    props: SwitchGroupProps<Value>\n  ) => React.JSX.Element;\n}>;\n\nconst defaultProps = {\n  hiddenInputValuesSeparator: ',',\n} satisfies Partial<SwitchGroupProps>;\n\nexport const SwitchGroup = genericFactory<SwitchGroupFactory>(((\n  props: SwitchGroupProps<string>\n) => {\n  const {\n    value,\n    defaultValue,\n    onChange,\n    size,\n    wrapperProps,\n    children,\n    readOnly,\n    name,\n    hiddenInputValuesSeparator,\n    hiddenInputProps,\n    maxSelectedValues,\n    disabled,\n    ...others\n  } = useProps('SwitchGroup', defaultProps, props);\n\n  const [_value, setValue] = useUncontrolled({\n    value,\n    defaultValue,\n    finalValue: [],\n    onChange,\n  });\n\n  const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    const itemValue = event.currentTarget.value;\n\n    if (readOnly) {\n      return;\n    }\n\n    const isCurrentlySelected = _value.includes(itemValue);\n\n    if (!isCurrentlySelected && maxSelectedValues && _value.length >= maxSelectedValues) {\n      return;\n    }\n\n    setValue(\n      isCurrentlySelected ? _value.filter((item) => item !== itemValue) : [..._value, itemValue]\n    );\n  };\n\n  const isDisabled = (switchValue: string) => {\n    if (disabled) {\n      return true;\n    }\n\n    if (!maxSelectedValues) {\n      return false;\n    }\n\n    const isCurrentlySelected = _value.includes(switchValue);\n    const hasReachedLimit = _value.length >= maxSelectedValues;\n    return !isCurrentlySelected && hasReachedLimit;\n  };\n\n  const hiddenInputValue = _value.join(hiddenInputValuesSeparator);\n\n  return (\n    <SwitchGroupContext value={{ value: _value, onChange: handleChange, size, isDisabled }}>\n      <Input.Wrapper\n        size={size}\n        {...wrapperProps}\n        {...others}\n        labelElement=\"div\"\n        __staticSelector=\"SwitchGroup\"\n      >\n        <InputsGroupFieldset role=\"group\">{children}</InputsGroupFieldset>\n        <input type=\"hidden\" name={name} value={hiddenInputValue} {...hiddenInputProps} />\n      </Input.Wrapper>\n    </SwitchGroupContext>\n  );\n}) as any);\n\nSwitchGroup.classes = Input.Wrapper.classes;\nSwitchGroup.displayName = '@mantine/core/SwitchGroup';\n"],"mappings":";;;;;;;;;;AAoBA,MAAa,sBAAA,GAAA,MAAA,eAAmE,KAAK;AAsDrF,MAAM,eAAe,EACnB,4BAA4B,KAC7B;AAED,MAAa,cAAcA,gBAAAA,iBACzB,UACG;CACH,MAAM,EACJ,OACA,cACA,UACA,MACA,cACA,UACA,UACA,MACA,4BACA,kBACA,mBACA,UACA,GAAG,WACDC,kBAAAA,SAAS,eAAe,cAAc,MAAM;CAEhD,MAAM,CAAC,QAAQ,aAAA,GAAA,eAAA,iBAA4B;EACzC;EACA;EACA,YAAY,EAAE;EACd;EACD,CAAC;CAEF,MAAM,gBAAgB,UAA+C;EACnE,MAAM,YAAY,MAAM,cAAc;AAEtC,MAAI,SACF;EAGF,MAAM,sBAAsB,OAAO,SAAS,UAAU;AAEtD,MAAI,CAAC,uBAAuB,qBAAqB,OAAO,UAAU,kBAChE;AAGF,WACE,sBAAsB,OAAO,QAAQ,SAAS,SAAS,UAAU,GAAG,CAAC,GAAG,QAAQ,UAAU,CAC3F;;CAGH,MAAM,cAAc,gBAAwB;AAC1C,MAAI,SACF,QAAO;AAGT,MAAI,CAAC,kBACH,QAAO;EAGT,MAAM,sBAAsB,OAAO,SAAS,YAAY;EACxD,MAAM,kBAAkB,OAAO,UAAU;AACzC,SAAO,CAAC,uBAAuB;;CAGjC,MAAM,mBAAmB,OAAO,KAAK,2BAA2B;AAEhE,QACE,iBAAA,GAAA,kBAAA,KAAC,oBAAD;EAAoB,OAAO;GAAE,OAAO;GAAQ,UAAU;GAAc;GAAM;GAAY;YACpF,iBAAA,GAAA,kBAAA,MAACC,cAAAA,MAAM,SAAP;GACQ;GACN,GAAI;GACJ,GAAI;GACJ,cAAa;GACb,kBAAiB;aALnB,CAOE,iBAAA,GAAA,kBAAA,KAACC,4BAAAA,qBAAD;IAAqB,MAAK;IAAS;IAA+B,CAAA,EAClE,iBAAA,GAAA,kBAAA,KAAC,SAAD;IAAO,MAAK;IAAe;IAAM,OAAO;IAAkB,GAAI;IAAoB,CAAA,CACpE;;EACG,CAAA;GAEf;AAEV,YAAY,UAAUD,cAAAA,MAAM,QAAQ;AACpC,YAAY,cAAc"}
+{"version":3,"file":"SwitchGroup.cjs","names":["genericFactory","useProps","Input","InputsGroupFieldset"],"sources":["../../../../src/components/Switch/SwitchGroup/SwitchGroup.tsx"],"sourcesContent":["import { createContext } from 'react';\nimport { useUncontrolled } from '@mantine/hooks';\nimport {\n  DataAttributes,\n  Factory,\n  genericFactory,\n  MantineSize,\n  Primitive,\n  useProps,\n} from '../../../core';\nimport { InputsGroupFieldset } from '../../../utils/InputsGroupFieldset';\nimport { Input, InputWrapperProps, InputWrapperStylesNames } from '../../Input';\n\nexport interface SwitchGroupContextValue<Value extends Primitive = string> {\n  value: Value[];\n  onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;\n  size: MantineSize | (string & {}) | undefined;\n  isDisabled?: (value: Value) => boolean;\n}\n\nexport const SwitchGroupContext = createContext<SwitchGroupContextValue | null>(null);\n\nexport type SwitchGroupStylesNames = InputWrapperStylesNames;\n\nexport interface SwitchGroupProps<Value extends Primitive = string> extends Omit<\n  InputWrapperProps,\n  'onChange' | 'value' | 'defaultValue'\n> {\n  /** `Switch` components */\n  children: React.ReactNode;\n\n  /** Controlled component value */\n  value?: Value[];\n\n  /** Default value for uncontrolled component */\n  defaultValue?: Value[];\n\n  /** Called when value changes */\n  onChange?: (value: Value[]) => void;\n\n  /** Props passed down to the `Input.Wrapper` */\n  wrapperProps?: React.ComponentProps<'div'> & DataAttributes;\n\n  /** Controls size of the `Input.Wrapper` @default 'sm' */\n  size?: MantineSize | (string & {});\n\n  /** If set, value cannot be changed */\n  readOnly?: boolean;\n\n  /** `name` attribute of the hidden input for uncontrolled forms */\n  name?: string;\n\n  /** Props passed down to the hidden input for uncontrolled forms */\n  hiddenInputProps?: React.ComponentProps<'input'> & DataAttributes;\n\n  /** Separator for values in the hidden input for uncontrolled forms @default ',' */\n  hiddenInputValuesSeparator?: string;\n\n  /** Maximum number of switches that can be selected. When the limit is reached, unselected switches will be disabled */\n  maxSelectedValues?: number;\n\n  /** Sets `disabled` attribute, prevents interactions */\n  disabled?: boolean;\n}\n\nexport type SwitchGroupFactory = Factory<{\n  props: SwitchGroupProps;\n  ref: HTMLDivElement;\n  stylesNames: SwitchGroupStylesNames;\n  signature: <Value extends Primitive = string>(\n    props: SwitchGroupProps<Value>\n  ) => React.JSX.Element;\n}>;\n\nconst defaultProps = {\n  hiddenInputValuesSeparator: ',',\n} satisfies Partial<SwitchGroupProps>;\n\nexport const SwitchGroup = genericFactory<SwitchGroupFactory>(((\n  props: SwitchGroupProps<string>\n) => {\n  const {\n    value,\n    defaultValue,\n    onChange,\n    size,\n    wrapperProps,\n    children,\n    readOnly,\n    name,\n    hiddenInputValuesSeparator,\n    hiddenInputProps,\n    maxSelectedValues,\n    disabled,\n    ...others\n  } = useProps('SwitchGroup', defaultProps, props);\n\n  const [_value, setValue] = useUncontrolled({\n    value,\n    defaultValue,\n    finalValue: [],\n    onChange,\n  });\n\n  const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    const itemValue = event.currentTarget.value;\n\n    if (readOnly) {\n      return;\n    }\n\n    const isCurrentlySelected = _value.includes(itemValue);\n\n    if (!isCurrentlySelected && maxSelectedValues && _value.length >= maxSelectedValues) {\n      return;\n    }\n\n    setValue(\n      isCurrentlySelected ? _value.filter((item) => item !== itemValue) : [..._value, itemValue]\n    );\n  };\n\n  const isDisabled = (switchValue: string) => {\n    if (disabled) {\n      return true;\n    }\n\n    if (!maxSelectedValues) {\n      return false;\n    }\n\n    const isCurrentlySelected = _value.includes(switchValue);\n    const hasReachedLimit = _value.length >= maxSelectedValues;\n    return !isCurrentlySelected && hasReachedLimit;\n  };\n\n  const hiddenInputValue = _value.join(hiddenInputValuesSeparator);\n\n  return (\n    <SwitchGroupContext value={{ value: _value, onChange: handleChange, size, isDisabled }}>\n      <Input.Wrapper\n        size={size}\n        {...wrapperProps}\n        {...others}\n        labelElement=\"div\"\n        __staticSelector=\"SwitchGroup\"\n      >\n        <InputsGroupFieldset role=\"group\">{children}</InputsGroupFieldset>\n        <input type=\"hidden\" name={name} value={hiddenInputValue} {...hiddenInputProps} />\n      </Input.Wrapper>\n    </SwitchGroupContext>\n  );\n}) as any);\n\nSwitchGroup.classes = Input.Wrapper.classes;\nSwitchGroup.displayName = '@mantine/core/SwitchGroup';\n"],"mappings":";;;;;;;;;;AAoBA,MAAa,sBAAA,GAAA,MAAA,eAAmE,IAAI;AAsDpF,MAAM,eAAe,EACnB,4BAA4B,IAC9B;AAEA,MAAa,cAAcA,gBAAAA,iBACzB,UACG;CACH,MAAM,EACJ,OACA,cACA,UACA,MACA,cACA,UACA,UACA,MACA,4BACA,kBACA,mBACA,UACA,GAAG,WACDC,kBAAAA,SAAS,eAAe,cAAc,KAAK;CAE/C,MAAM,CAAC,QAAQ,aAAA,GAAA,eAAA,iBAA4B;EACzC;EACA;EACA,YAAY,CAAC;EACb;CACF,CAAC;CAED,MAAM,gBAAgB,UAA+C;EACnE,MAAM,YAAY,MAAM,cAAc;EAEtC,IAAI,UACF;EAGF,MAAM,sBAAsB,OAAO,SAAS,SAAS;EAErD,IAAI,CAAC,uBAAuB,qBAAqB,OAAO,UAAU,mBAChE;EAGF,SACE,sBAAsB,OAAO,QAAQ,SAAS,SAAS,SAAS,IAAI,CAAC,GAAG,QAAQ,SAAS,CAC3F;CACF;CAEA,MAAM,cAAc,gBAAwB;EAC1C,IAAI,UACF,OAAO;EAGT,IAAI,CAAC,mBACH,OAAO;EAGT,MAAM,sBAAsB,OAAO,SAAS,WAAW;EACvD,MAAM,kBAAkB,OAAO,UAAU;EACzC,OAAO,CAAC,uBAAuB;CACjC;CAEA,MAAM,mBAAmB,OAAO,KAAK,0BAA0B;CAE/D,OACE,iBAAA,GAAA,kBAAA,KAAC,oBAAD;EAAoB,OAAO;GAAE,OAAO;GAAQ,UAAU;GAAc;GAAM;EAAW;YACnF,iBAAA,GAAA,kBAAA,MAACC,cAAAA,MAAM,SAAP;GACQ;GACN,GAAI;GACJ,GAAI;GACJ,cAAa;GACb,kBAAiB;aALnB,CAOE,iBAAA,GAAA,kBAAA,KAACC,4BAAAA,qBAAD;IAAqB,MAAK;IAAS;GAA8B,CAAA,GACjE,iBAAA,GAAA,kBAAA,KAAC,SAAD;IAAO,MAAK;IAAe;IAAM,OAAO;IAAkB,GAAI;GAAmB,CAAA,CACpE;;CACG,CAAA;AAExB,EAAS;AAET,YAAY,UAAUD,cAAAA,MAAM,QAAQ;AACpC,YAAY,cAAc"}

package/cjs/components/Table/Table.cjs.map

@@ -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;CAClB;AAED,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,kBAAkB;CAC3D,4BAA4BA,iBAAAA,WAAW,gBAAgB;CACvD,wBAAwB,cAAcC,wBAAAA,cAAc,aAAa,MAAM,GAAG,KAAA;CAC1E,yBACE,WAAW,eAAeA,wBAAAA,cAAc,cAAc,MAAM,GAAG,KAAA;CACjE,oCACE,oBAAoB,wBAChBA,wBAAAA,cAAc,uBAAuB,MAAM,GAC3C,KAAA;CACN,gCAAgC,eAAeC,YAAAA,IAAI,mBAAmB,GAAG,KAAA;CAC1E,EACF,EACF;AAED,MAAa,QAAQC,gBAAAA,SAAuB,WAAW;CACrD,MAAM,QAAQC,kBAAAA,SAAS,SAAS,cAAc,OAAO;CACrD,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;EACD,CAAC;AAEF,QACE,iBAAA,GAAA,kBAAA,KAACC,sBAAAA,eAAD;EACE,OAAO;GACL;GACA;GACA,SAAS,YAAY,OAAO,QAAQ,WAAW,KAAA;GAC/C;GACA;GACA;GACA,aAAa,eAAe;GAC7B;YAED,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;GACE,WAAU;GACV,KAAK,CAAC;IAAE,0BAA0B;IAAiB,qBAAqB;IAAa,EAAE,IAAI;GAC3F,GAAI,UAAU,QAAQ;GACtB,GAAI;aAEH,YAAa,CAAC,CAAC,QAAQ,iBAAA,GAAA,kBAAA,KAACC,0BAAAA,mBAAD,EAAyB,MAAQ,CAAA;GACrD,CAAA;EACQ,CAAA;EAElB;AAEF,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"}
+{"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,KAACC,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,KAACC,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,KAACC,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/Table.components.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Table.components.cjs","names":["factory","useProps","useTableContext","Box","classes"],"sources":["../../../src/components/Table/Table.components.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  CompoundStylesApiProps,\n  ElementProps,\n  factory,\n  Factory,\n  FactoryPayload,\n  useProps,\n} from '../../core';\nimport type { TableFactory } from './Table';\nimport { TableContextValue, useTableContext } from './Table.context';\nimport classes from './Table.module.css';\n\nexport interface TableElementProps<Selector extends string>\n  extends\n    BoxProps,\n    CompoundStylesApiProps<Omit<TableFactory, 'stylesNames'> & { stylesNames: Selector }> {}\n\nexport interface TableThProps extends TableElementProps<'th'>, ElementProps<'th'> {}\nexport interface TableTdProps extends TableElementProps<'td'>, ElementProps<'td'> {}\nexport interface TableTrProps extends TableElementProps<'tr'>, ElementProps<'tr'> {}\nexport interface TableTheadProps extends TableElementProps<'thead'>, ElementProps<'thead'> {}\nexport interface TableTbodyProps extends TableElementProps<'tbody'>, ElementProps<'tbody'> {}\nexport interface TableTfootProps extends TableElementProps<'tfoot'>, ElementProps<'tfoot'> {}\nexport interface TableCaptionProps extends TableElementProps<'caption'>, ElementProps<'caption'> {}\n\nexport type TableThFactory = Factory<{\n  props: TableThProps;\n  ref: HTMLTableCellElement;\n  stylesNames: 'th';\n  compound: true;\n}>;\n\nexport type TableTdFactory = Factory<{\n  props: TableTdProps;\n  ref: HTMLTableCellElement;\n  stylesNames: 'td';\n  compound: true;\n}>;\n\nexport type TableTrFactory = Factory<{\n  props: TableTrProps;\n  ref: HTMLTableRowElement;\n  stylesNames: 'tr';\n  compound: true;\n}>;\n\nexport type TableTheadFactory = Factory<{\n  props: TableTheadProps;\n  ref: HTMLTableSectionElement;\n  stylesNames: 'thead';\n  compound: true;\n}>;\n\nexport type TableTbodyFactory = Factory<{\n  props: TableTbodyProps;\n  ref: HTMLTableSectionElement;\n  stylesNames: 'tbody';\n  compound: true;\n}>;\n\nexport type TableTfootFactory = Factory<{\n  props: TableTfootProps;\n  ref: HTMLTableSectionElement;\n  stylesNames: 'tfoot';\n  compound: true;\n}>;\n\nexport type TableCaptionFactory = Factory<{\n  props: TableCaptionProps;\n  ref: HTMLTableCaptionElement;\n  stylesNames: 'caption';\n  compound: true;\n}>;\n\ninterface TableElementOptions {\n  columnBorder?: true;\n  rowBorder?: true;\n  striped?: true;\n  highlightOnHover?: true;\n  captionSide?: true;\n  stickyHeader?: true;\n}\n\nfunction getDataAttributes(ctx: TableContextValue, options?: TableElementOptions) {\n  if (!options) {\n    return undefined;\n  }\n\n  const data: Record<string, boolean | string> = {};\n\n  if (options.columnBorder && ctx.withColumnBorders) {\n    data['data-with-column-border'] = true;\n  }\n\n  if (options.rowBorder && ctx.withRowBorders) {\n    data['data-with-row-border'] = true;\n  }\n\n  if (options.striped && ctx.striped) {\n    data['data-striped'] = ctx.striped;\n  }\n\n  if (options.highlightOnHover && ctx.highlightOnHover) {\n    data['data-hover'] = true;\n  }\n\n  if (options.captionSide && ctx.captionSide) {\n    data['data-side'] = ctx.captionSide;\n  }\n\n  if (options.stickyHeader && ctx.stickyHeader) {\n    data['data-sticky'] = true;\n  }\n\n  return data;\n}\n\nexport function tableElement<Factory extends FactoryPayload>(\n  element: 'th' | 'td' | 'tr' | 'thead' | 'tbody' | 'tfoot' | 'caption',\n  options?: TableElementOptions\n) {\n  const name = `Table${element.charAt(0).toUpperCase()}${element.slice(1)}`;\n  const Component = factory<Factory>((_props) => {\n    const props = useProps(name, {}, _props);\n    const { classNames, className, style, styles, ...others } = props;\n\n    const ctx = useTableContext();\n\n    return (\n      <Box\n        component={element}\n        {...getDataAttributes(ctx, options)}\n        {...ctx.getStyles(element, { className, classNames, style, styles, props })}\n        {...others}\n      />\n    );\n  });\n\n  Component.displayName = `@mantine/core/${name}`;\n  Component.classes = classes;\n  return Component;\n}\n\nexport const TableTh = tableElement<TableThFactory>('th', { columnBorder: true });\nexport const TableTd = tableElement<TableTdFactory>('td', { columnBorder: true });\nexport const TableTr = tableElement<TableTrFactory>('tr', {\n  rowBorder: true,\n  striped: true,\n  highlightOnHover: true,\n});\nexport const TableThead = tableElement<TableTheadFactory>('thead', { stickyHeader: true });\nexport const TableTbody = tableElement<TableTbodyFactory>('tbody');\nexport const TableTfoot = tableElement<TableTfootFactory>('tfoot');\nexport const TableCaption = tableElement<TableCaptionFactory>('caption', { captionSide: true });\n"],"mappings":";;;;;;;;;AAqFA,SAAS,kBAAkB,KAAwB,SAA+B;AAChF,KAAI,CAAC,QACH;CAGF,MAAM,OAAyC,EAAE;AAEjD,KAAI,QAAQ,gBAAgB,IAAI,kBAC9B,MAAK,6BAA6B;AAGpC,KAAI,QAAQ,aAAa,IAAI,eAC3B,MAAK,0BAA0B;AAGjC,KAAI,QAAQ,WAAW,IAAI,QACzB,MAAK,kBAAkB,IAAI;AAG7B,KAAI,QAAQ,oBAAoB,IAAI,iBAClC,MAAK,gBAAgB;AAGvB,KAAI,QAAQ,eAAe,IAAI,YAC7B,MAAK,eAAe,IAAI;AAG1B,KAAI,QAAQ,gBAAgB,IAAI,aAC9B,MAAK,iBAAiB;AAGxB,QAAO;;AAGT,SAAgB,aACd,SACA,SACA;CACA,MAAM,OAAO,QAAQ,QAAQ,OAAO,EAAE,CAAC,aAAa,GAAG,QAAQ,MAAM,EAAE;CACvE,MAAM,YAAYA,gBAAAA,SAAkB,WAAW;EAC7C,MAAM,QAAQC,kBAAAA,SAAS,MAAM,EAAE,EAAE,OAAO;EACxC,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,GAAG,WAAW;EAE5D,MAAM,MAAMC,sBAAAA,iBAAiB;AAE7B,SACE,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;GACE,WAAW;GACX,GAAI,kBAAkB,KAAK,QAAQ;GACnC,GAAI,IAAI,UAAU,SAAS;IAAE;IAAW;IAAY;IAAO;IAAQ;IAAO,CAAC;GAC3E,GAAI;GACJ,CAAA;GAEJ;AAEF,WAAU,cAAc,iBAAiB;AACzC,WAAU,UAAUC,qBAAAA;AACpB,QAAO;;AAGT,MAAa,UAAU,aAA6B,MAAM,EAAE,cAAc,MAAM,CAAC;AACjF,MAAa,UAAU,aAA6B,MAAM,EAAE,cAAc,MAAM,CAAC;AACjF,MAAa,UAAU,aAA6B,MAAM;CACxD,WAAW;CACX,SAAS;CACT,kBAAkB;CACnB,CAAC;AACF,MAAa,aAAa,aAAgC,SAAS,EAAE,cAAc,MAAM,CAAC;AAC1F,MAAa,aAAa,aAAgC,QAAQ;AAClE,MAAa,aAAa,aAAgC,QAAQ;AAClE,MAAa,eAAe,aAAkC,WAAW,EAAE,aAAa,MAAM,CAAC"}
+{"version":3,"file":"Table.components.cjs","names":["factory","useProps","useTableContext","Box","classes"],"sources":["../../../src/components/Table/Table.components.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  CompoundStylesApiProps,\n  ElementProps,\n  factory,\n  Factory,\n  FactoryPayload,\n  useProps,\n} from '../../core';\nimport type { TableFactory } from './Table';\nimport { TableContextValue, useTableContext } from './Table.context';\nimport classes from './Table.module.css';\n\nexport interface TableElementProps<Selector extends string>\n  extends\n    BoxProps,\n    CompoundStylesApiProps<Omit<TableFactory, 'stylesNames'> & { stylesNames: Selector }> {}\n\nexport interface TableThProps extends TableElementProps<'th'>, ElementProps<'th'> {}\nexport interface TableTdProps extends TableElementProps<'td'>, ElementProps<'td'> {}\nexport interface TableTrProps extends TableElementProps<'tr'>, ElementProps<'tr'> {}\nexport interface TableTheadProps extends TableElementProps<'thead'>, ElementProps<'thead'> {}\nexport interface TableTbodyProps extends TableElementProps<'tbody'>, ElementProps<'tbody'> {}\nexport interface TableTfootProps extends TableElementProps<'tfoot'>, ElementProps<'tfoot'> {}\nexport interface TableCaptionProps extends TableElementProps<'caption'>, ElementProps<'caption'> {}\n\nexport type TableThFactory = Factory<{\n  props: TableThProps;\n  ref: HTMLTableCellElement;\n  stylesNames: 'th';\n  compound: true;\n}>;\n\nexport type TableTdFactory = Factory<{\n  props: TableTdProps;\n  ref: HTMLTableCellElement;\n  stylesNames: 'td';\n  compound: true;\n}>;\n\nexport type TableTrFactory = Factory<{\n  props: TableTrProps;\n  ref: HTMLTableRowElement;\n  stylesNames: 'tr';\n  compound: true;\n}>;\n\nexport type TableTheadFactory = Factory<{\n  props: TableTheadProps;\n  ref: HTMLTableSectionElement;\n  stylesNames: 'thead';\n  compound: true;\n}>;\n\nexport type TableTbodyFactory = Factory<{\n  props: TableTbodyProps;\n  ref: HTMLTableSectionElement;\n  stylesNames: 'tbody';\n  compound: true;\n}>;\n\nexport type TableTfootFactory = Factory<{\n  props: TableTfootProps;\n  ref: HTMLTableSectionElement;\n  stylesNames: 'tfoot';\n  compound: true;\n}>;\n\nexport type TableCaptionFactory = Factory<{\n  props: TableCaptionProps;\n  ref: HTMLTableCaptionElement;\n  stylesNames: 'caption';\n  compound: true;\n}>;\n\ninterface TableElementOptions {\n  columnBorder?: true;\n  rowBorder?: true;\n  striped?: true;\n  highlightOnHover?: true;\n  captionSide?: true;\n  stickyHeader?: true;\n}\n\nfunction getDataAttributes(ctx: TableContextValue, options?: TableElementOptions) {\n  if (!options) {\n    return undefined;\n  }\n\n  const data: Record<string, boolean | string> = {};\n\n  if (options.columnBorder && ctx.withColumnBorders) {\n    data['data-with-column-border'] = true;\n  }\n\n  if (options.rowBorder && ctx.withRowBorders) {\n    data['data-with-row-border'] = true;\n  }\n\n  if (options.striped && ctx.striped) {\n    data['data-striped'] = ctx.striped;\n  }\n\n  if (options.highlightOnHover && ctx.highlightOnHover) {\n    data['data-hover'] = true;\n  }\n\n  if (options.captionSide && ctx.captionSide) {\n    data['data-side'] = ctx.captionSide;\n  }\n\n  if (options.stickyHeader && ctx.stickyHeader) {\n    data['data-sticky'] = true;\n  }\n\n  return data;\n}\n\nexport function tableElement<Factory extends FactoryPayload>(\n  element: 'th' | 'td' | 'tr' | 'thead' | 'tbody' | 'tfoot' | 'caption',\n  options?: TableElementOptions\n) {\n  const name = `Table${element.charAt(0).toUpperCase()}${element.slice(1)}`;\n  const Component = factory<Factory>((_props) => {\n    const props = useProps(name, {}, _props);\n    const { classNames, className, style, styles, ...others } = props;\n\n    const ctx = useTableContext();\n\n    return (\n      <Box\n        component={element}\n        {...getDataAttributes(ctx, options)}\n        {...ctx.getStyles(element, { className, classNames, style, styles, props })}\n        {...others}\n      />\n    );\n  });\n\n  Component.displayName = `@mantine/core/${name}`;\n  Component.classes = classes;\n  return Component;\n}\n\nexport const TableTh = tableElement<TableThFactory>('th', { columnBorder: true });\nexport const TableTd = tableElement<TableTdFactory>('td', { columnBorder: true });\nexport const TableTr = tableElement<TableTrFactory>('tr', {\n  rowBorder: true,\n  striped: true,\n  highlightOnHover: true,\n});\nexport const TableThead = tableElement<TableTheadFactory>('thead', { stickyHeader: true });\nexport const TableTbody = tableElement<TableTbodyFactory>('tbody');\nexport const TableTfoot = tableElement<TableTfootFactory>('tfoot');\nexport const TableCaption = tableElement<TableCaptionFactory>('caption', { captionSide: true });\n"],"mappings":";;;;;;;;;AAqFA,SAAS,kBAAkB,KAAwB,SAA+B;CAChF,IAAI,CAAC,SACH;CAGF,MAAM,OAAyC,CAAC;CAEhD,IAAI,QAAQ,gBAAgB,IAAI,mBAC9B,KAAK,6BAA6B;CAGpC,IAAI,QAAQ,aAAa,IAAI,gBAC3B,KAAK,0BAA0B;CAGjC,IAAI,QAAQ,WAAW,IAAI,SACzB,KAAK,kBAAkB,IAAI;CAG7B,IAAI,QAAQ,oBAAoB,IAAI,kBAClC,KAAK,gBAAgB;CAGvB,IAAI,QAAQ,eAAe,IAAI,aAC7B,KAAK,eAAe,IAAI;CAG1B,IAAI,QAAQ,gBAAgB,IAAI,cAC9B,KAAK,iBAAiB;CAGxB,OAAO;AACT;AAEA,SAAgB,aACd,SACA,SACA;CACA,MAAM,OAAO,QAAQ,QAAQ,OAAO,CAAC,EAAE,YAAY,IAAI,QAAQ,MAAM,CAAC;CACtE,MAAM,YAAYA,gBAAAA,SAAkB,WAAW;EAC7C,MAAM,QAAQC,kBAAAA,SAAS,MAAM,CAAC,GAAG,MAAM;EACvC,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,GAAG,WAAW;EAE5D,MAAM,MAAMC,sBAAAA,gBAAgB;EAE5B,OACE,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;GACE,WAAW;GACX,GAAI,kBAAkB,KAAK,OAAO;GAClC,GAAI,IAAI,UAAU,SAAS;IAAE;IAAW;IAAY;IAAO;IAAQ;GAAM,CAAC;GAC1E,GAAI;EACL,CAAA;CAEL,CAAC;CAED,UAAU,cAAc,iBAAiB;CACzC,UAAU,UAAUC,qBAAAA;CACpB,OAAO;AACT;AAEA,MAAa,UAAU,aAA6B,MAAM,EAAE,cAAc,KAAK,CAAC;AAChF,MAAa,UAAU,aAA6B,MAAM,EAAE,cAAc,KAAK,CAAC;AAChF,MAAa,UAAU,aAA6B,MAAM;CACxD,WAAW;CACX,SAAS;CACT,kBAAkB;AACpB,CAAC;AACD,MAAa,aAAa,aAAgC,SAAS,EAAE,cAAc,KAAK,CAAC;AACzF,MAAa,aAAa,aAAgC,OAAO;AACjE,MAAa,aAAa,aAAgC,OAAO;AACjE,MAAa,eAAe,aAAkC,WAAW,EAAE,aAAa,KAAK,CAAC"}

package/cjs/components/Table/Table.context.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Table.context.cjs","names":["createSafeContext"],"sources":["../../../src/components/Table/Table.context.ts"],"sourcesContent":["import { createSafeContext, GetStylesApi } from '../../core';\nimport type { TableFactory } from './Table';\n\nexport interface TableContextValue {\n  getStyles: GetStylesApi<TableFactory>;\n  stickyHeader: boolean | undefined;\n  striped: 'odd' | 'even' | undefined;\n  highlightOnHover: boolean | undefined;\n  withColumnBorders: boolean | undefined;\n  withRowBorders: boolean | undefined;\n  captionSide: 'top' | 'bottom';\n}\n\nexport const [TableProvider, useTableContext] = createSafeContext<TableContextValue>(\n  'Table component was not found in the tree'\n);\n"],"mappings":";;AAaA,MAAa,CAAC,eAAe,2FAAmBA,kBAC9C,4CACD"}
+{"version":3,"file":"Table.context.cjs","names":["createSafeContext"],"sources":["../../../src/components/Table/Table.context.ts"],"sourcesContent":["import { createSafeContext, GetStylesApi } from '../../core';\nimport type { TableFactory } from './Table';\n\nexport interface TableContextValue {\n  getStyles: GetStylesApi<TableFactory>;\n  stickyHeader: boolean | undefined;\n  striped: 'odd' | 'even' | undefined;\n  highlightOnHover: boolean | undefined;\n  withColumnBorders: boolean | undefined;\n  withRowBorders: boolean | undefined;\n  captionSide: 'top' | 'bottom';\n}\n\nexport const [TableProvider, useTableContext] = createSafeContext<TableContextValue>(\n  'Table component was not found in the tree'\n);\n"],"mappings":";;AAaA,MAAa,CAAC,eAAe,yFAAmBA,EAAAA,kBAC9C,2CACF"}

package/cjs/components/Table/Table.module.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Table.module.cjs","names":[],"sources":["../../../src/components/Table/Table.module.css"],"sourcesContent":[".table {\n  width: 100%;\n  border-collapse: collapse;\n  border-spacing: 0;\n  line-height: var(--mantine-line-height);\n  font-size: var(--mantine-font-size-sm);\n  table-layout: var(--table-layout, auto);\n  caption-side: var(--table-caption-side, bottom);\n  border: none;\n\n  @mixin where-light {\n    --table-hover-color: var(--mantine-color-gray-1);\n    --table-striped-color: var(--mantine-color-gray-0);\n    --table-border-color: var(--mantine-color-gray-3);\n  }\n\n  @mixin where-dark {\n    --table-hover-color: var(--mantine-color-dark-5);\n    --table-striped-color: var(--mantine-color-dark-6);\n    --table-border-color: var(--mantine-color-dark-4);\n  }\n\n  &:where([data-with-table-border]) {\n    border: rem(1px) solid var(--table-border-color);\n  }\n\n  &:where([data-tabular-nums]) {\n    font-variant-numeric: tabular-nums;\n  }\n\n  &:where([data-variant='vertical']) :where(.th) {\n    font-weight: var(--mantine-font-weight-medium);\n\n    @mixin where-light {\n      background-color: var(--mantine-color-gray-0);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-6);\n    }\n  }\n}\n\n.th {\n  text-align: left;\n\n  @mixin where-rtl {\n    text-align: right;\n  }\n}\n\n.tr {\n  border-bottom: none;\n  background-color: transparent;\n\n  @mixin hover {\n    &:where([data-hover]) {\n      background-color: var(--tr-hover-bg);\n    }\n  }\n\n  &:where([data-with-row-border]) {\n    border-bottom: rem(1px) solid var(--table-border-color);\n  }\n}\n\n.td,\n.th {\n  padding: var(--table-vertical-spacing) var(--table-horizontal-spacing, var(--mantine-spacing-xs));\n\n  &:where([data-with-column-border]:not(:first-child)) {\n    border-inline-start: rem(1px) solid var(--table-border-color);\n  }\n\n  &:where([data-with-column-border]:not(:last-child)) {\n    border-inline-end: rem(1px) solid var(--table-border-color);\n  }\n}\n\n.tbody {\n  & > :where(tr) {\n    &:where([data-with-row-border]:last-of-type) {\n      border-bottom: none;\n    }\n\n    &:where([data-striped='odd']:nth-of-type(odd)) {\n      background-color: var(--table-striped-color);\n    }\n\n    &:where([data-striped='even']:nth-of-type(even)) {\n      background-color: var(--table-striped-color);\n    }\n\n    &[data-hover] {\n      --tr-hover-bg: var(--table-highlight-on-hover-color, var(--table-hover-color));\n    }\n  }\n}\n\n.thead {\n  top: var(--table-sticky-header-offset, 0);\n  z-index: 3;\n\n  &:where([data-sticky]) {\n    position: sticky;\n\n    & :where(.th) {\n      position: sticky;\n      top: var(--table-sticky-header-offset, 0);\n      background-color: var(--mantine-color-body);\n    }\n  }\n}\n\n:where([data-with-table-border]) .thead[data-sticky] {\n  position: sticky;\n  top: var(--table-sticky-header-offset, 0);\n  z-index: 4;\n  border-top: none;\n}\n\n:where([data-with-table-border]) .thead[data-sticky]::before {\n  content: '';\n  display: block;\n  position: absolute;\n  left: 0;\n  top: -0.5px;\n  width: 100%;\n  height: 1px;\n  background-color: var(--table-border-color);\n  z-index: 5;\n}\n\n:where([data-with-table-border]) .thead[data-sticky] .th:first-child {\n  border-top: none;\n}\n\n.caption {\n  color: var(--mantine-color-dimmed);\n\n  &:where([data-side='top']) {\n    margin-bottom: var(--mantine-spacing-xs);\n  }\n\n  &:where([data-side='bottom']) {\n    margin-top: var(--mantine-spacing-xs);\n  }\n}\n\n.scrollContainer {\n  overflow-x: var(--table-overflow);\n}\n\n.scrollContainerInner {\n  min-width: var(--table-min-width);\n  max-height: var(--table-max-height);\n}\n"],"mappings":""}
+{"version":3,"file":"Table.module.cjs","names":[],"sources":["../../../src/components/Table/Table.module.css"],"sourcesContent":[".table {\n  width: 100%;\n  border-collapse: collapse;\n  border-spacing: 0;\n  line-height: var(--mantine-line-height);\n  font-size: var(--mantine-font-size-sm);\n  table-layout: var(--table-layout, auto);\n  caption-side: var(--table-caption-side, bottom);\n  border: none;\n\n  @mixin where-light {\n    --table-hover-color: var(--mantine-color-gray-1);\n    --table-striped-color: var(--mantine-color-gray-0);\n    --table-border-color: var(--mantine-color-gray-3);\n  }\n\n  @mixin where-dark {\n    --table-hover-color: var(--mantine-color-dark-5);\n    --table-striped-color: var(--mantine-color-dark-6);\n    --table-border-color: var(--mantine-color-dark-4);\n  }\n\n  &:where([data-with-table-border]) {\n    border: rem(1px) solid var(--table-border-color);\n  }\n\n  &:where([data-tabular-nums]) {\n    font-variant-numeric: tabular-nums;\n  }\n\n  &:where([data-variant='vertical']) :where(.th) {\n    font-weight: var(--mantine-font-weight-medium);\n\n    @mixin where-light {\n      background-color: var(--mantine-color-gray-0);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-6);\n    }\n  }\n}\n\n.th {\n  text-align: left;\n\n  @mixin where-rtl {\n    text-align: right;\n  }\n}\n\n.tr {\n  border-bottom: none;\n  background-color: transparent;\n\n  @mixin hover {\n    &:where([data-hover]) {\n      background-color: var(--tr-hover-bg);\n    }\n  }\n\n  &:where([data-with-row-border]) {\n    border-bottom: rem(1px) solid var(--table-border-color);\n  }\n}\n\n.td,\n.th {\n  padding: var(--table-vertical-spacing) var(--table-horizontal-spacing, var(--mantine-spacing-xs));\n\n  &:where([data-with-column-border]:not(:first-child)) {\n    border-inline-start: rem(1px) solid var(--table-border-color);\n  }\n\n  &:where([data-with-column-border]:not(:last-child)) {\n    border-inline-end: rem(1px) solid var(--table-border-color);\n  }\n}\n\n.tbody {\n  & > :where(tr) {\n    &:where([data-with-row-border]:last-of-type) {\n      border-bottom: none;\n    }\n\n    &:where([data-striped='odd']:nth-of-type(odd)) {\n      background-color: var(--table-striped-color);\n    }\n\n    &:where([data-striped='even']:nth-of-type(even)) {\n      background-color: var(--table-striped-color);\n    }\n\n    &[data-hover] {\n      --tr-hover-bg: var(--table-highlight-on-hover-color, var(--table-hover-color));\n    }\n  }\n}\n\n.thead {\n  top: var(--table-sticky-header-offset, 0);\n  z-index: 3;\n\n  &:where([data-sticky]) {\n    position: sticky;\n\n    & :where(.th) {\n      position: sticky;\n      top: var(--table-sticky-header-offset, 0);\n      background-color: var(--mantine-color-body);\n    }\n\n    /* border-collapse: collapse drops borders on position: sticky cells —\n       the tr's border-bottom scrolls away with the row, so redraw it with\n       box-shadow on the (sticky) th. The tr's border-bottom is suppressed\n       here so the two don't stack into a double line. */\n    & :where(.tr[data-with-row-border]) {\n      border-bottom: none;\n    }\n\n    & :where(.tr[data-with-row-border]) :where(.th) {\n      box-shadow: inset 0 -1px 0 var(--table-border-color);\n    }\n\n    & :where(.th[data-with-column-border]) {\n      border-inline-start: none;\n      border-inline-end: none;\n    }\n\n    /* Single pseudo-element per internal boundary, centered on the boundary\n       (-0.5px) to align with the body's border-collapse line. */\n    & :where(.th[data-with-column-border]:not(:first-child))::before {\n      content: '';\n      position: absolute;\n      inset-block: 0;\n      inset-inline-start: -0.5px;\n      width: 1px;\n      background-color: var(--table-border-color);\n    }\n  }\n}\n\n:where([data-with-table-border]) .thead[data-sticky] {\n  position: sticky;\n  top: var(--table-sticky-header-offset, 0);\n  z-index: 4;\n  border-top: none;\n}\n\n:where([data-with-table-border]) .thead[data-sticky]::before {\n  content: '';\n  display: block;\n  position: absolute;\n  left: 0;\n  top: -0.5px;\n  width: 100%;\n  height: 1px;\n  background-color: var(--table-border-color);\n  z-index: 5;\n}\n\n:where([data-with-table-border]) .thead[data-sticky] .th:first-child {\n  border-top: none;\n}\n\n.caption {\n  color: var(--mantine-color-dimmed);\n\n  &:where([data-side='top']) {\n    margin-bottom: var(--mantine-spacing-xs);\n  }\n\n  &:where([data-side='bottom']) {\n    margin-top: var(--mantine-spacing-xs);\n  }\n}\n\n.scrollContainer {\n  overflow-x: var(--table-overflow);\n}\n\n.scrollContainerInner {\n  min-width: var(--table-min-width);\n  max-height: var(--table-max-height);\n}\n"],"mappings":""}

package/cjs/components/Table/TableDataRenderer.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TableDataRenderer.cjs","names":["TableCaption","TableThead","TableTr","TableTh","TableTbody","TableTd","TableTfoot"],"sources":["../../../src/components/Table/TableDataRenderer.tsx"],"sourcesContent":["import type { TableData } from './Table';\nimport {\n  TableCaption,\n  TableTbody,\n  TableTd,\n  TableTfoot,\n  TableTh,\n  TableThead,\n  TableTr,\n} from './Table.components';\n\nexport interface TableDataRendererProps {\n  data: TableData;\n}\n\nexport function TableDataRenderer({ data }: TableDataRendererProps) {\n  return (\n    <>\n      {data.caption && <TableCaption>{data.caption}</TableCaption>}\n\n      {data.head && (\n        <TableThead>\n          <TableTr>\n            {data.head.map((item, index) => (\n              <TableTh key={index}>{item}</TableTh>\n            ))}\n          </TableTr>\n        </TableThead>\n      )}\n\n      {data.body && (\n        <TableTbody>\n          {data.body.map((row, rowIndex) => (\n            <TableTr key={rowIndex}>\n              {row.map((item, index) => (\n                <TableTd key={index}>{item}</TableTd>\n              ))}\n            </TableTr>\n          ))}\n        </TableTbody>\n      )}\n\n      {data.foot && (\n        <TableTfoot>\n          <TableTr>\n            {data.foot.map((item, index) => (\n              <TableTh key={index}>{item}</TableTh>\n            ))}\n          </TableTr>\n        </TableTfoot>\n      )}\n    </>\n  );\n}\n\nTableDataRenderer.displayName = '@mantine/core/TableDataRenderer';\n"],"mappings":";;;;;AAeA,SAAgB,kBAAkB,EAAE,QAAgC;AAClE,QACE,iBAAA,GAAA,kBAAA,MAAA,kBAAA,UAAA,EAAA,UAAA;EACG,KAAK,WAAW,iBAAA,GAAA,kBAAA,KAACA,yBAAAA,cAAD,EAAA,UAAe,KAAK,SAAuB,CAAA;EAE3D,KAAK,QACJ,iBAAA,GAAA,kBAAA,KAACC,yBAAAA,YAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,KAACC,yBAAAA,SAAD,EAAA,UACG,KAAK,KAAK,KAAK,MAAM,UACpB,iBAAA,GAAA,kBAAA,KAACC,yBAAAA,SAAD,EAAA,UAAsB,MAAe,EAAvB,MAAuB,CACrC,EACM,CAAA,EACC,CAAA;EAGd,KAAK,QACJ,iBAAA,GAAA,kBAAA,KAACC,yBAAAA,YAAD,EAAA,UACG,KAAK,KAAK,KAAK,KAAK,aACnB,iBAAA,GAAA,kBAAA,KAACF,yBAAAA,SAAD,EAAA,UACG,IAAI,KAAK,MAAM,UACd,iBAAA,GAAA,kBAAA,KAACG,yBAAAA,SAAD,EAAA,UAAsB,MAAe,EAAvB,MAAuB,CACrC,EACM,EAJI,SAIJ,CACV,EACS,CAAA;EAGd,KAAK,QACJ,iBAAA,GAAA,kBAAA,KAACC,yBAAAA,YAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,KAACJ,yBAAAA,SAAD,EAAA,UACG,KAAK,KAAK,KAAK,MAAM,UACpB,iBAAA,GAAA,kBAAA,KAACC,yBAAAA,SAAD,EAAA,UAAsB,MAAe,EAAvB,MAAuB,CACrC,EACM,CAAA,EACC,CAAA;EAEd,EAAA,CAAA;;AAIP,kBAAkB,cAAc"}
+{"version":3,"file":"TableDataRenderer.cjs","names":["TableCaption","TableThead","TableTr","TableTh","TableTbody","TableTd","TableTfoot"],"sources":["../../../src/components/Table/TableDataRenderer.tsx"],"sourcesContent":["import type { TableData } from './Table';\nimport {\n  TableCaption,\n  TableTbody,\n  TableTd,\n  TableTfoot,\n  TableTh,\n  TableThead,\n  TableTr,\n} from './Table.components';\n\nexport interface TableDataRendererProps {\n  data: TableData;\n}\n\nexport function TableDataRenderer({ data }: TableDataRendererProps) {\n  return (\n    <>\n      {data.caption && <TableCaption>{data.caption}</TableCaption>}\n\n      {data.head && (\n        <TableThead>\n          <TableTr>\n            {data.head.map((item, index) => (\n              <TableTh key={index}>{item}</TableTh>\n            ))}\n          </TableTr>\n        </TableThead>\n      )}\n\n      {data.body && (\n        <TableTbody>\n          {data.body.map((row, rowIndex) => (\n            <TableTr key={rowIndex}>\n              {row.map((item, index) => (\n                <TableTd key={index}>{item}</TableTd>\n              ))}\n            </TableTr>\n          ))}\n        </TableTbody>\n      )}\n\n      {data.foot && (\n        <TableTfoot>\n          <TableTr>\n            {data.foot.map((item, index) => (\n              <TableTh key={index}>{item}</TableTh>\n            ))}\n          </TableTr>\n        </TableTfoot>\n      )}\n    </>\n  );\n}\n\nTableDataRenderer.displayName = '@mantine/core/TableDataRenderer';\n"],"mappings":";;;;;AAeA,SAAgB,kBAAkB,EAAE,QAAgC;CAClE,OACE,iBAAA,GAAA,kBAAA,MAAA,kBAAA,UAAA,EAAA,UAAA;EACG,KAAK,WAAW,iBAAA,GAAA,kBAAA,KAACA,yBAAAA,cAAD,EAAA,UAAe,KAAK,QAAsB,CAAA;EAE1D,KAAK,QACJ,iBAAA,GAAA,kBAAA,KAACC,yBAAAA,YAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,KAACC,yBAAAA,SAAD,EAAA,UACG,KAAK,KAAK,KAAK,MAAM,UACpB,iBAAA,GAAA,kBAAA,KAACC,yBAAAA,SAAD,EAAA,UAAsB,KAAc,GAAtB,KAAsB,CACrC,EACM,CAAA,EACC,CAAA;EAGb,KAAK,QACJ,iBAAA,GAAA,kBAAA,KAACC,yBAAAA,YAAD,EAAA,UACG,KAAK,KAAK,KAAK,KAAK,aACnB,iBAAA,GAAA,kBAAA,KAACF,yBAAAA,SAAD,EAAA,UACG,IAAI,KAAK,MAAM,UACd,iBAAA,GAAA,kBAAA,KAACG,yBAAAA,SAAD,EAAA,UAAsB,KAAc,GAAtB,KAAsB,CACrC,EACM,GAJK,QAIL,CACV,EACS,CAAA;EAGb,KAAK,QACJ,iBAAA,GAAA,kBAAA,KAACC,yBAAAA,YAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,KAACJ,yBAAAA,SAAD,EAAA,UACG,KAAK,KAAK,KAAK,MAAM,UACpB,iBAAA,GAAA,kBAAA,KAACC,yBAAAA,SAAD,EAAA,UAAsB,KAAc,GAAtB,KAAsB,CACrC,EACM,CAAA,EACC,CAAA;CAEd,EAAA,CAAA;AAEN;AAEA,kBAAkB,cAAc"}

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

@@ -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,cACP;AAED,MAAM,eAAeA,6BAAAA,oBAClB,GAAG,EAAE,UAAU,WAAW,YAAY,EACrC,iBAAiB;CACf,qBAAqBC,YAAAA,IAAI,SAAS;CAClC,sBAAsBA,YAAAA,IAAI,UAAU;CACpC,oBAAoB,SAAS,WAAW,SAAS,KAAA;CAClD,EACF,EACF;AAED,MAAa,uBAAuBC,gBAAAA,SAAsC,WAAW;CACnF,MAAM,QAAQC,kBAAAA,SAAS,wBAAwB,cAAc,OAAO;CACpE,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;EACf,CAAC;AAEF,QACE,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EACE,WAAW,SAAS,eAAeC,mBAAAA,aAAa;EAChD,GAAK,SAAS,eACV,YACE;GAAE,kBAAkB;GAAM,GAAG;GAAiB,GAC9C;GAAE,kBAAkB;GAAK,GAAG;GAAiB,GAC/C,EAAE;EACN,GAAI,UAAU,kBAAkB;EAChC,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAAC,OAAD;GAAK,GAAI,UAAU,uBAAuB;GAAG;GAAe,CAAA;EACxD,CAAA;EAER;AAEF,qBAAqB,UAAUC,qBAAAA;AAC/B,qBAAqB,eAAe;AACpC,qBAAqB,cAAc"}
+{"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,KAACC,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,KAAC,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

@@ -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,OAChB,GACF;AAED,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;EACD,CAAC;AAEF,QAAO,EACL,MAAM;EACJ,YAAY,YAAY,SAAS,OAAO,aAAa,KAAA;EACrD,eAAe,YAAY,SAAS,OAAO,QAAQ,KAAA;EACnD,cAAcC,iBAAAA,YAAY,KAAK;EAC/B,sBAAsBC,YAAAA,IAAI,YAAY;EACtC,gBAAgBC,iBAAAA,UAAU,OAAO;EAClC,EACF;EAEJ;AAED,MAAa,kBAAkBC,gBAAAA,SAAiC,WAAW;CACzE,MAAM,QAAQC,kBAAAA,SAAS,mBAAmB,cAAc,OAAO;CAC/D,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;EACD,CAAC;CAEF,MAAM,UAAA,GAAA,eAAA,QAAgB;CACtB,MAAM,OAAA,GAAA,eAAA,cAAmB,iBAAiB;AAE1C,EAAA,GAAA,eAAA,WAAU,iBAAiB,IAAI,aAAa;CAM5C,MAAM,YAHJ,IAAI,cAAc,IAAI,OAAO,eAAe,EAAE,EAGlB,KAAK,MAAM,UAAU;EACjD,MAAM,eAAe,kBAAkB;GACrC,QAAQ,UAAU,IAAI;GACtB,MAAM;IAAE,GAAG;IAAM,SAAS,KAAK,WAAWC,aAAAA;IAAM;GACjD,CAAC;AAEF,SACE,iBAAA,GAAA,kBAAA,KAACC,uBAAAA,gBAAD;GAEE,QAAQ,EAAE,kBAAkB,GAAG,KAAK,SAAS,oBAAoB,MAAM;GACvE,eAAa,UAAU,IAAI,UAAU,KAAA;GAC5B;GACT,GAAI;GACJ,GAAI,UAAU,WAAW;IACvB,WAAW,cAAc;IACzB,OAAO,cAAc;IACtB,CAAC;GACF,EATK,KAAK,MAAM,GAAG,OAAO,GAAG,QAS7B;GAEJ;AAEF,QACE,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EAAc;EAAS,GAAI,UAAU,OAAO;EAAE,GAAI;YAC/C;EACG,CAAA;EAER;AAEF,gBAAgB,cAAc;AAC9B,gBAAgB,UAAUC,+BAAAA;AAC1B,gBAAgB,eAAe"}
+{"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,OAAe;CACrB,MAAM,OAAA,GAAA,eAAA,cAAmB,gBAAgB;CAEzC,CAAA,GAAA,eAAA,WAAU,iBAAiB,IAAI,YAAY;CAM3C,MAAM,YAHJ,IAAI,cAAc,IAAI,OAAO,eAAe,CAAC,GAGjB,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,KAACC,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,KAACC,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"}

package/cjs/components/Tabs/Tabs.cjs.map

@@ -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 { useId, useUncontrolled } from '@mantine/hooks';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getAutoContrastValue,\n  getContrastColor,\n  getRadius,\n  getSafeId,\n  getThemeColor,\n  MantineColor,\n  MantineRadius,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { TabsProvider, type TabsContextValue } from './Tabs.context';\nimport { TabsList, TabsListStylesNames, type TabsListProps } from './TabsList/TabsList';\nimport { TabsPanel, TabsPanelStylesNames, type TabsPanelProps } from './TabsPanel/TabsPanel';\nimport { TabsTab, TabsTabStylesNames, type TabsTabProps } from './TabsTab/TabsTab';\nimport classes from './Tabs.module.css';\nexport type TabsStylesNames =\n  | 'root'\n  | TabsListStylesNames\n  | TabsPanelStylesNames\n  | TabsTabStylesNames;\n\nexport type TabsVariant = 'default' | 'outline' | 'pills';\nexport type TabsCssVariables = {\n  root: '--tabs-color' | '--tabs-radius';\n};\n\nexport interface TabsProps\n  extends\n    BoxProps,\n    StylesApiProps<TabsFactory>,\n    ElementProps<'div', 'defaultValue' | 'value' | 'onChange'> {\n  /** Uncontrolled component default value */\n  defaultValue?: string | null;\n\n  /** Controlled component value */\n  value?: string | null;\n\n  /** Called when value changes */\n  onChange?: (value: string | null) => void;\n\n  /** Tabs orientation @default 'horizontal' */\n  orientation?: 'vertical' | 'horizontal';\n\n  /** `Tabs.List` placement relative to `Tabs.Panel`, applicable only when `orientation=\"vertical\"` @default 'left' */\n  placement?: 'left' | 'right';\n\n  /** Base id, used to generate ids to connect labels with controls, generated randomly by default */\n  id?: string;\n\n  /** If set, arrow key presses loop though items (first to last and last to first) @default true */\n  loop?: boolean;\n\n  /** If set, tab is activated with arrow key press @default true */\n  activateTabWithKeyboard?: boolean;\n\n  /** If set, tab can be deactivated @default false */\n  allowTabDeactivation?: boolean;\n\n  /** Tabs content */\n  children?: React.ReactNode;\n\n  /** Changes colors of `Tabs.Tab` components when variant is `pills` or `default`, does nothing for other variants */\n  color?: MantineColor;\n\n  /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius */\n  radius?: MantineRadius;\n\n  /** Determines whether tabs should have inverted styles @default false */\n  inverted?: boolean;\n\n  /** If set to `false`, `Tabs.Panel` content will be unmounted when the associated tab is not active @default true */\n  keepMounted?: boolean;\n\n  /** Controls how inactive tabs content is hidden when `keepMounted` is `true`, `'activity'` – hidden with `Activity` component, `'display-none'` – hidden with `display: none` styles @default 'activity' */\n  keepMountedMode?: 'activity' | 'display-none';\n\n  /** If set, adjusts text color based on background color for `pills` variant */\n  autoContrast?: boolean;\n}\n\nexport type TabsFactory = Factory<{\n  props: TabsProps;\n  ref: HTMLDivElement;\n  variant: TabsVariant;\n  stylesNames: TabsStylesNames;\n  vars: TabsCssVariables;\n  staticComponents: {\n    Tab: typeof TabsTab;\n    Panel: typeof TabsPanel;\n    List: typeof TabsList;\n  };\n}>;\n\nconst VALUE_ERROR =\n  'Tabs.Tab or Tabs.Panel component was rendered with invalid value or without value';\n\nconst defaultProps = {\n  keepMounted: true,\n  keepMountedMode: 'activity',\n  orientation: 'horizontal',\n  loop: true,\n  activateTabWithKeyboard: true,\n  variant: 'default',\n  placement: 'left',\n} satisfies Partial<TabsProps>;\n\nconst varsResolver = createVarsResolver<TabsFactory>((theme, { radius, color, autoContrast }) => ({\n  root: {\n    '--tabs-radius': getRadius(radius),\n    '--tabs-color': getThemeColor(color, theme),\n    '--tabs-text-color': getAutoContrastValue(autoContrast, theme)\n      ? getContrastColor({ color, theme, autoContrast })\n      : undefined,\n  },\n}));\n\nexport const Tabs = factory<TabsFactory>((_props) => {\n  const props = useProps('Tabs', defaultProps, _props);\n  const {\n    defaultValue,\n    value,\n    onChange,\n    orientation,\n    children,\n    loop,\n    id,\n    activateTabWithKeyboard,\n    allowTabDeactivation,\n    variant,\n    color,\n    radius,\n    inverted,\n    placement,\n    keepMounted,\n    keepMountedMode,\n    classNames,\n    styles,\n    unstyled,\n    className,\n    style,\n    vars,\n    autoContrast,\n    mod,\n    attributes,\n    ...others\n  } = props;\n\n  const uid = useId(id);\n\n  const [currentTab, setCurrentTab] = useUncontrolled({\n    value,\n    defaultValue,\n    finalValue: null,\n    onChange,\n  });\n\n  const getStyles = useStyles<TabsFactory>({\n    name: 'Tabs',\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  return (\n    <TabsProvider\n      value={{\n        placement,\n        value: currentTab,\n        orientation,\n        id: uid,\n        loop,\n        activateTabWithKeyboard,\n        getTabId: getSafeId(`${uid}-tab`, VALUE_ERROR),\n        getPanelId: getSafeId(`${uid}-panel`, VALUE_ERROR),\n        onChange: setCurrentTab,\n        allowTabDeactivation,\n        variant,\n        color,\n        radius,\n        inverted,\n        keepMounted,\n        keepMountedMode,\n        unstyled,\n        getStyles,\n      }}\n    >\n      <Box\n        id={uid}\n        variant={variant}\n        mod={[\n          {\n            orientation,\n            inverted: orientation === 'horizontal' && inverted,\n            placement: orientation === 'vertical' && placement,\n          },\n          mod,\n        ]}\n        {...getStyles('root')}\n        {...others}\n      >\n        {children}\n      </Box>\n    </TabsProvider>\n  );\n});\n\nTabs.classes = classes;\nTabs.varsResolver = varsResolver;\nTabs.displayName = '@mantine/core/Tabs';\nTabs.Tab = TabsTab;\nTabs.Panel = TabsPanel;\nTabs.List = TabsList;\n\nexport namespace Tabs {\n  export type Props = TabsProps;\n  export type StylesNames = TabsStylesNames;\n  export type CssVariables = TabsCssVariables;\n  export type Factory = TabsFactory;\n  export type Variant = TabsVariant;\n  export type ContextValue = TabsContextValue;\n\n  export namespace Tab {\n    export type Props = TabsTabProps;\n    export type StylesNames = TabsTabStylesNames;\n  }\n\n  export namespace Panel {\n    export type Props = TabsPanelProps;\n    export type StylesNames = TabsPanelStylesNames;\n  }\n\n  export namespace List {\n    export type Props = TabsListProps;\n    export type StylesNames = TabsListStylesNames;\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAsGA,MAAM,cACJ;AAEF,MAAM,eAAe;CACnB,aAAa;CACb,iBAAiB;CACjB,aAAa;CACb,MAAM;CACN,yBAAyB;CACzB,SAAS;CACT,WAAW;CACZ;AAED,MAAM,eAAeA,6BAAAA,oBAAiC,OAAO,EAAE,QAAQ,OAAO,oBAAoB,EAChG,MAAM;CACJ,iBAAiBC,iBAAAA,UAAU,OAAO;CAClC,gBAAgBC,wBAAAA,cAAc,OAAO,MAAM;CAC3C,qBAAqBC,gCAAAA,qBAAqB,cAAc,MAAM,GAC1DC,2BAAAA,iBAAiB;EAAE;EAAO;EAAO;EAAc,CAAC,GAChD,KAAA;CACL,EACF,EAAE;AAEH,MAAa,OAAOC,gBAAAA,SAAsB,WAAW;CACnD,MAAM,QAAQC,kBAAAA,SAAS,QAAQ,cAAc,OAAO;CACpD,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,OAAY,GAAG;CAErB,MAAM,CAAC,YAAY,kBAAA,GAAA,eAAA,iBAAiC;EAClD;EACA;EACA,YAAY;EACZ;EACD,CAAC;CAEF,MAAM,YAAYC,mBAAAA,UAAuB;EACvC,MAAM;EACN;EACA,SAAA,oBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,QACE,iBAAA,GAAA,kBAAA,KAACC,qBAAAA,cAAD;EACE,OAAO;GACL;GACA,OAAO;GACP;GACA,IAAI;GACJ;GACA;GACA,UAAUC,oBAAAA,UAAU,GAAG,IAAI,OAAO,YAAY;GAC9C,YAAYA,oBAAAA,UAAU,GAAG,IAAI,SAAS,YAAY;GAClD,UAAU;GACV;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD;YAED,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;GACE,IAAI;GACK;GACT,KAAK,CACH;IACE;IACA,UAAU,gBAAgB,gBAAgB;IAC1C,WAAW,gBAAgB,cAAc;IAC1C,EACD,IACD;GACD,GAAI,UAAU,OAAO;GACrB,GAAI;GAEH;GACG,CAAA;EACO,CAAA;EAEjB;AAEF,KAAK,UAAUC,oBAAAA;AACf,KAAK,eAAe;AACpB,KAAK,cAAc;AACnB,KAAK,MAAMC,gBAAAA;AACX,KAAK,QAAQC,kBAAAA;AACb,KAAK,OAAOC,iBAAAA"}
+{"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 { useId, useUncontrolled } from '@mantine/hooks';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getAutoContrastValue,\n  getContrastColor,\n  getRadius,\n  getSafeId,\n  getThemeColor,\n  MantineColor,\n  MantineRadius,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { TabsProvider, type TabsContextValue } from './Tabs.context';\nimport { TabsList, TabsListStylesNames, type TabsListProps } from './TabsList/TabsList';\nimport { TabsPanel, TabsPanelStylesNames, type TabsPanelProps } from './TabsPanel/TabsPanel';\nimport { TabsTab, TabsTabStylesNames, type TabsTabProps } from './TabsTab/TabsTab';\nimport classes from './Tabs.module.css';\nexport type TabsStylesNames =\n  | 'root'\n  | TabsListStylesNames\n  | TabsPanelStylesNames\n  | TabsTabStylesNames;\n\nexport type TabsVariant = 'default' | 'outline' | 'pills';\nexport type TabsCssVariables = {\n  root: '--tabs-color' | '--tabs-radius';\n};\n\nexport interface TabsProps\n  extends\n    BoxProps,\n    StylesApiProps<TabsFactory>,\n    ElementProps<'div', 'defaultValue' | 'value' | 'onChange'> {\n  /** Uncontrolled component default value */\n  defaultValue?: string | null;\n\n  /** Controlled component value */\n  value?: string | null;\n\n  /** Called when value changes */\n  onChange?: (value: string | null) => void;\n\n  /** Tabs orientation @default 'horizontal' */\n  orientation?: 'vertical' | 'horizontal';\n\n  /** `Tabs.List` placement relative to `Tabs.Panel`, applicable only when `orientation=\"vertical\"` @default 'left' */\n  placement?: 'left' | 'right';\n\n  /** Base id, used to generate ids to connect labels with controls, generated randomly by default */\n  id?: string;\n\n  /** If set, arrow key presses loop though items (first to last and last to first) @default true */\n  loop?: boolean;\n\n  /** If set, tab is activated with arrow key press @default true */\n  activateTabWithKeyboard?: boolean;\n\n  /** If set, tab can be deactivated @default false */\n  allowTabDeactivation?: boolean;\n\n  /** Tabs content */\n  children?: React.ReactNode;\n\n  /** Changes colors of `Tabs.Tab` components when variant is `pills` or `default`, does nothing for other variants */\n  color?: MantineColor;\n\n  /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius */\n  radius?: MantineRadius;\n\n  /** Determines whether tabs should have inverted styles @default false */\n  inverted?: boolean;\n\n  /** If set to `false`, `Tabs.Panel` content will be unmounted when the associated tab is not active @default true */\n  keepMounted?: boolean;\n\n  /** Controls how inactive tabs content is hidden when `keepMounted` is `true`, `'activity'` – hidden with `Activity` component, `'display-none'` – hidden with `display: none` styles @default 'activity' */\n  keepMountedMode?: 'activity' | 'display-none';\n\n  /** If set, adjusts text color based on background color for `pills` variant */\n  autoContrast?: boolean;\n}\n\nexport type TabsFactory = Factory<{\n  props: TabsProps;\n  ref: HTMLDivElement;\n  variant: TabsVariant;\n  stylesNames: TabsStylesNames;\n  vars: TabsCssVariables;\n  staticComponents: {\n    Tab: typeof TabsTab;\n    Panel: typeof TabsPanel;\n    List: typeof TabsList;\n  };\n}>;\n\nconst VALUE_ERROR =\n  'Tabs.Tab or Tabs.Panel component was rendered with invalid value or without value';\n\nconst defaultProps = {\n  keepMounted: true,\n  keepMountedMode: 'activity',\n  orientation: 'horizontal',\n  loop: true,\n  activateTabWithKeyboard: true,\n  variant: 'default',\n  placement: 'left',\n} satisfies Partial<TabsProps>;\n\nconst varsResolver = createVarsResolver<TabsFactory>((theme, { radius, color, autoContrast }) => ({\n  root: {\n    '--tabs-radius': getRadius(radius),\n    '--tabs-color': getThemeColor(color, theme),\n    '--tabs-text-color': getAutoContrastValue(autoContrast, theme)\n      ? getContrastColor({ color, theme, autoContrast })\n      : undefined,\n  },\n}));\n\nexport const Tabs = factory<TabsFactory>((_props) => {\n  const props = useProps('Tabs', defaultProps, _props);\n  const {\n    defaultValue,\n    value,\n    onChange,\n    orientation,\n    children,\n    loop,\n    id,\n    activateTabWithKeyboard,\n    allowTabDeactivation,\n    variant,\n    color,\n    radius,\n    inverted,\n    placement,\n    keepMounted,\n    keepMountedMode,\n    classNames,\n    styles,\n    unstyled,\n    className,\n    style,\n    vars,\n    autoContrast,\n    mod,\n    attributes,\n    ...others\n  } = props;\n\n  const uid = useId(id);\n\n  const [currentTab, setCurrentTab] = useUncontrolled({\n    value,\n    defaultValue,\n    finalValue: null,\n    onChange,\n  });\n\n  const getStyles = useStyles<TabsFactory>({\n    name: 'Tabs',\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  return (\n    <TabsProvider\n      value={{\n        placement,\n        value: currentTab,\n        orientation,\n        id: uid,\n        loop,\n        activateTabWithKeyboard,\n        getTabId: getSafeId(`${uid}-tab`, VALUE_ERROR),\n        getPanelId: getSafeId(`${uid}-panel`, VALUE_ERROR),\n        onChange: setCurrentTab,\n        allowTabDeactivation,\n        variant,\n        color,\n        radius,\n        inverted,\n        keepMounted,\n        keepMountedMode,\n        unstyled,\n        getStyles,\n      }}\n    >\n      <Box\n        id={uid}\n        variant={variant}\n        mod={[\n          {\n            orientation,\n            inverted: orientation === 'horizontal' && inverted,\n            placement: orientation === 'vertical' && placement,\n          },\n          mod,\n        ]}\n        {...getStyles('root')}\n        {...others}\n      >\n        {children}\n      </Box>\n    </TabsProvider>\n  );\n});\n\nTabs.classes = classes;\nTabs.varsResolver = varsResolver;\nTabs.displayName = '@mantine/core/Tabs';\nTabs.Tab = TabsTab;\nTabs.Panel = TabsPanel;\nTabs.List = TabsList;\n\nexport namespace Tabs {\n  export type Props = TabsProps;\n  export type StylesNames = TabsStylesNames;\n  export type CssVariables = TabsCssVariables;\n  export type Factory = TabsFactory;\n  export type Variant = TabsVariant;\n  export type ContextValue = TabsContextValue;\n\n  export namespace Tab {\n    export type Props = TabsTabProps;\n    export type StylesNames = TabsTabStylesNames;\n  }\n\n  export namespace Panel {\n    export type Props = TabsPanelProps;\n    export type StylesNames = TabsPanelStylesNames;\n  }\n\n  export namespace List {\n    export type Props = TabsListProps;\n    export type StylesNames = TabsListStylesNames;\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAsGA,MAAM,cACJ;AAEF,MAAM,eAAe;CACnB,aAAa;CACb,iBAAiB;CACjB,aAAa;CACb,MAAM;CACN,yBAAyB;CACzB,SAAS;CACT,WAAW;AACb;AAEA,MAAM,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,OAAY,EAAE;CAEpB,MAAM,CAAC,YAAY,kBAAA,GAAA,eAAA,iBAAiC;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,KAACC,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;EACF;YAEA,iBAAA,GAAA,kBAAA,KAACC,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/Tabs.context.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.context.cjs","names":["createSafeContext"],"sources":["../../../src/components/Tabs/Tabs.context.ts"],"sourcesContent":["import { createSafeContext, GetStylesApi } from '../../core';\nimport type { TabsFactory } from './Tabs';\n\nexport interface TabsContextValue {\n  id: string;\n  value: string | null;\n  orientation: 'horizontal' | 'vertical' | undefined;\n  loop: boolean | undefined;\n  activateTabWithKeyboard: boolean | undefined;\n  allowTabDeactivation: boolean | undefined;\n  onChange: (value: string | null) => void;\n  getTabId: (value: string) => string;\n  getPanelId: (value: string) => string;\n  variant: string | undefined;\n  color: string | undefined;\n  radius: string | number | undefined;\n  inverted: boolean | undefined;\n  keepMounted: boolean | undefined;\n  keepMountedMode: 'activity' | 'display-none' | undefined;\n  placement: 'right' | 'left' | undefined;\n  unstyled: boolean | undefined;\n  getStyles: GetStylesApi<TabsFactory>;\n}\n\nexport const [TabsProvider, useTabsContext] = createSafeContext<TabsContextValue>(\n  'Tabs component was not found in the tree'\n);\n"],"mappings":";;AAwBA,MAAa,CAAC,cAAc,0FAAkBA,kBAC5C,2CACD"}
+{"version":3,"file":"Tabs.context.cjs","names":["createSafeContext"],"sources":["../../../src/components/Tabs/Tabs.context.ts"],"sourcesContent":["import { createSafeContext, GetStylesApi } from '../../core';\nimport type { TabsFactory } from './Tabs';\n\nexport interface TabsContextValue {\n  id: string;\n  value: string | null;\n  orientation: 'horizontal' | 'vertical' | undefined;\n  loop: boolean | undefined;\n  activateTabWithKeyboard: boolean | undefined;\n  allowTabDeactivation: boolean | undefined;\n  onChange: (value: string | null) => void;\n  getTabId: (value: string) => string;\n  getPanelId: (value: string) => string;\n  variant: string | undefined;\n  color: string | undefined;\n  radius: string | number | undefined;\n  inverted: boolean | undefined;\n  keepMounted: boolean | undefined;\n  keepMountedMode: 'activity' | 'display-none' | undefined;\n  placement: 'right' | 'left' | undefined;\n  unstyled: boolean | undefined;\n  getStyles: GetStylesApi<TabsFactory>;\n}\n\nexport const [TabsProvider, useTabsContext] = createSafeContext<TabsContextValue>(\n  'Tabs component was not found in the tree'\n);\n"],"mappings":";;AAwBA,MAAa,CAAC,cAAc,wFAAkBA,EAAAA,kBAC5C,0CACF"}

package/cjs/components/Tabs/TabsList/TabsList.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TabsList.cjs","names":["factory","useProps","useTabsContext","Box","classes"],"sources":["../../../../src/components/Tabs/TabsList/TabsList.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  CompoundStylesApiProps,\n  ElementProps,\n  factory,\n  Factory,\n  useProps,\n} from '../../../core';\nimport { useTabsContext } from '../Tabs.context';\nimport classes from '../Tabs.module.css';\n\nexport type TabsListStylesNames = 'list';\n\nexport interface TabsListProps\n  extends BoxProps, CompoundStylesApiProps<TabsListFactory>, ElementProps<'div'> {\n  /** `Tabs.Tab` components */\n  children: React.ReactNode;\n\n  /** Determines whether tabs should take all available space @default false */\n  grow?: boolean;\n\n  /** Tabs alignment @default flex-start */\n  justify?: React.CSSProperties['justifyContent'];\n}\n\nexport type TabsListFactory = Factory<{\n  props: TabsListProps;\n  ref: HTMLDivElement;\n  stylesNames: TabsListStylesNames;\n  compound: true;\n}>;\n\nexport const TabsList = factory<TabsListFactory>((_props) => {\n  const props = useProps('TabsList', null, _props);\n  const { children, className, grow, justify, classNames, styles, style, mod, ...others } = props;\n\n  const ctx = useTabsContext();\n\n  return (\n    <Box\n      {...ctx.getStyles('list', {\n        className,\n        style,\n        classNames,\n        styles,\n        props,\n        variant: ctx.variant,\n      })}\n      role=\"tablist\"\n      variant={ctx.variant}\n      mod={[\n        {\n          grow,\n          orientation: ctx.orientation,\n          placement: ctx.orientation === 'vertical' && ctx.placement,\n          inverted: ctx.inverted,\n        },\n        mod,\n      ]}\n      aria-orientation={ctx.orientation}\n      __vars={{ '--tabs-justify': justify }}\n      {...others}\n    >\n      {children}\n    </Box>\n  );\n});\n\nTabsList.classes = classes;\nTabsList.displayName = '@mantine/core/TabsList';\n"],"mappings":";;;;;;;;;AAiCA,MAAa,WAAWA,gBAAAA,SAA0B,WAAW;CAC3D,MAAM,QAAQC,kBAAAA,SAAS,YAAY,MAAM,OAAO;CAChD,MAAM,EAAE,UAAU,WAAW,MAAM,SAAS,YAAY,QAAQ,OAAO,KAAK,GAAG,WAAW;CAE1F,MAAM,MAAMC,qBAAAA,gBAAgB;AAE5B,QACE,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EACE,GAAI,IAAI,UAAU,QAAQ;GACxB;GACA;GACA;GACA;GACA;GACA,SAAS,IAAI;GACd,CAAC;EACF,MAAK;EACL,SAAS,IAAI;EACb,KAAK,CACH;GACE;GACA,aAAa,IAAI;GACjB,WAAW,IAAI,gBAAgB,cAAc,IAAI;GACjD,UAAU,IAAI;GACf,EACD,IACD;EACD,oBAAkB,IAAI;EACtB,QAAQ,EAAE,kBAAkB,SAAS;EACrC,GAAI;EAEH;EACG,CAAA;EAER;AAEF,SAAS,UAAUC,oBAAAA;AACnB,SAAS,cAAc"}
+{"version":3,"file":"TabsList.cjs","names":["factory","useProps","useTabsContext","Box","classes"],"sources":["../../../../src/components/Tabs/TabsList/TabsList.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  CompoundStylesApiProps,\n  ElementProps,\n  factory,\n  Factory,\n  useProps,\n} from '../../../core';\nimport { useTabsContext } from '../Tabs.context';\nimport classes from '../Tabs.module.css';\n\nexport type TabsListStylesNames = 'list';\n\nexport interface TabsListProps\n  extends BoxProps, CompoundStylesApiProps<TabsListFactory>, ElementProps<'div'> {\n  /** `Tabs.Tab` components */\n  children: React.ReactNode;\n\n  /** Determines whether tabs should take all available space @default false */\n  grow?: boolean;\n\n  /** Tabs alignment @default flex-start */\n  justify?: React.CSSProperties['justifyContent'];\n}\n\nexport type TabsListFactory = Factory<{\n  props: TabsListProps;\n  ref: HTMLDivElement;\n  stylesNames: TabsListStylesNames;\n  compound: true;\n}>;\n\nexport const TabsList = factory<TabsListFactory>((_props) => {\n  const props = useProps('TabsList', null, _props);\n  const { children, className, grow, justify, classNames, styles, style, mod, ...others } = props;\n\n  const ctx = useTabsContext();\n\n  return (\n    <Box\n      {...ctx.getStyles('list', {\n        className,\n        style,\n        classNames,\n        styles,\n        props,\n        variant: ctx.variant,\n      })}\n      role=\"tablist\"\n      variant={ctx.variant}\n      mod={[\n        {\n          grow,\n          orientation: ctx.orientation,\n          placement: ctx.orientation === 'vertical' && ctx.placement,\n          inverted: ctx.inverted,\n        },\n        mod,\n      ]}\n      aria-orientation={ctx.orientation}\n      __vars={{ '--tabs-justify': justify }}\n      {...others}\n    >\n      {children}\n    </Box>\n  );\n});\n\nTabsList.classes = classes;\nTabsList.displayName = '@mantine/core/TabsList';\n"],"mappings":";;;;;;;;;AAiCA,MAAa,WAAWA,gBAAAA,SAA0B,WAAW;CAC3D,MAAM,QAAQC,kBAAAA,SAAS,YAAY,MAAM,MAAM;CAC/C,MAAM,EAAE,UAAU,WAAW,MAAM,SAAS,YAAY,QAAQ,OAAO,KAAK,GAAG,WAAW;CAE1F,MAAM,MAAMC,qBAAAA,eAAe;CAE3B,OACE,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EACE,GAAI,IAAI,UAAU,QAAQ;GACxB;GACA;GACA;GACA;GACA;GACA,SAAS,IAAI;EACf,CAAC;EACD,MAAK;EACL,SAAS,IAAI;EACb,KAAK,CACH;GACE;GACA,aAAa,IAAI;GACjB,WAAW,IAAI,gBAAgB,cAAc,IAAI;GACjD,UAAU,IAAI;EAChB,GACA,GACF;EACA,oBAAkB,IAAI;EACtB,QAAQ,EAAE,kBAAkB,QAAQ;EACpC,GAAI;EAEH;CACE,CAAA;AAET,CAAC;AAED,SAAS,UAAUC,oBAAAA;AACnB,SAAS,cAAc"}

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

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