@mantine/core 9.3.2 → 9.4.1

package/esm/components/EmptyState/EmptyStateTitle/EmptyStateTitle.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyStateTitle.mjs","names":["classes"],"sources":["../../../../src/components/EmptyState/EmptyStateTitle/EmptyStateTitle.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  CompoundStylesApiProps,\n  ElementProps,\n  factory,\n  Factory,\n  useProps,\n} from '../../../core';\nimport { useEmptyStateContext } from '../EmptyState.context';\nimport classes from '../EmptyState.module.css';\n\nexport type EmptyStateTitleStylesNames = 'title';\n\nexport interface EmptyStateTitleProps\n  extends BoxProps, CompoundStylesApiProps<EmptyStateTitleFactory>, ElementProps<'div'> {\n  /** Title content */\n  children?: React.ReactNode;\n\n  /** Heading order, renders the title as `h1`–`h6` element. By default, the title is rendered as a `div` without semantic heading level */\n  order?: 1 | 2 | 3 | 4 | 5 | 6;\n}\n\nexport type EmptyStateTitleFactory = Factory<{\n  props: EmptyStateTitleProps;\n  ref: HTMLDivElement;\n  stylesNames: EmptyStateTitleStylesNames;\n  compound: true;\n}>;\n\nexport const EmptyStateTitle = factory<EmptyStateTitleFactory>((_props) => {\n  const props = useProps('EmptyStateTitle', null, _props);\n  const { classNames, className, style, styles, vars, children, order, mod, ...others } = props;\n\n  const ctx = useEmptyStateContext();\n\n  return (\n    <Box<any>\n      component={order ? `h${order}` : 'div'}\n      mod={mod}\n      {...ctx.getStyles('title', { className, style, classNames, styles })}\n      {...others}\n    >\n      {children}\n    </Box>\n  );\n});\n\nEmptyStateTitle.classes = classes;\nEmptyStateTitle.displayName = '@mantine/core/EmptyStateTitle';\n"],"mappings":";;;;;;;;AA8BA,MAAa,kBAAkB,SAAiC,WAAW;CAEzE,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,UAAU,OAAO,KAAK,GAAG,WAD/D,SAAS,mBAAmB,MAAM,MAC4C;CAE5F,MAAM,MAAM,qBAAqB;CAEjC,OACE,oBAAC,KAAD;EACE,WAAW,QAAQ,IAAI,UAAU;EAC5B;EACL,GAAI,IAAI,UAAU,SAAS;GAAE;GAAW;GAAO;GAAY;EAAO,CAAC;EACnE,GAAI;EAEH;CACE,CAAA;AAET,CAAC;AAED,gBAAgB,UAAUA;AAC1B,gBAAgB,cAAc"}

package/esm/components/FileInput/FileInput.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"FileInput.mjs","names":[],"sources":["../../../src/components/FileInput/FileInput.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport { useMergedRef, useUncontrolled } from '@mantine/hooks';\nimport {\n  BoxProps,\n  ElementProps,\n  Factory,\n  genericFactory,\n  StylesApiProps,\n  useProps,\n  useResolvedStylesApi,\n} from '../../core';\nimport { CloseButton } from '../CloseButton';\nimport { FileButton } from '../FileButton';\nimport {\n  __BaseInputProps,\n  __InputStylesNames,\n  ClearSectionMode,\n  Input,\n  InputVariant,\n} from '../Input';\nimport { InputBase } from '../InputBase/InputBase';\n\nexport interface FileInputProps<Multiple = false>\n  extends\n    BoxProps,\n    __BaseInputProps,\n    StylesApiProps<FileInputFactory>,\n    ElementProps<'button', 'value' | 'defaultValue' | 'onChange' | 'placeholder'> {\n  component?: any;\n\n  /** Called when value changes */\n  onChange?: (payload: Multiple extends true ? File[] : File | null) => void;\n\n  /** Controlled component value */\n  value?: Multiple extends true ? File[] : File | null;\n\n  /** Uncontrolled component default value */\n  defaultValue?: Multiple extends true ? File[] : File | null;\n\n  /** If set, user can pick more than one file @default false */\n  multiple?: Multiple;\n\n  /** File input accept attribute, for example, `\"image/png,image/jpeg\"` */\n  accept?: string;\n\n  /** Input name attribute */\n  name?: string;\n\n  /** Input form attribute */\n  form?: string;\n\n  /** Value renderer. By default, displays file name. */\n  valueComponent?: React.FC<{ value: null | File | File[] }>;\n\n  /** If set, the clear button is displayed in the right section @default false */\n  clearable?: boolean;\n\n  /** Determines how the clear button and rightSection are rendered @default 'both' */\n  clearSectionMode?: ClearSectionMode;\n\n  /** Props passed down to the clear button */\n  clearButtonProps?: React.ComponentProps<'button'>;\n\n  /** If set, the input value cannot be changed  */\n  readOnly?: boolean;\n\n  /** Specifies that, optionally, a new file should be captured, and which device should be used to capture that new media of a type defined by the accept attribute. */\n  capture?: boolean | 'user' | 'environment';\n\n  /** Props passed down to the hidden `input[type=\"file\"]` */\n  fileInputProps?: React.ComponentProps<'input'>;\n\n  /** Input placeholder */\n  placeholder?: React.ReactNode;\n\n  /** Reference of the function that should be called when value changes to null or empty array */\n  resetRef?: React.Ref<() => void>;\n}\n\nexport type FileInputFactory = Factory<{\n  props: FileInputProps;\n  ref: HTMLButtonElement;\n  stylesNames: __InputStylesNames | 'placeholder';\n  variant: InputVariant;\n  signature: <Multiple extends boolean = false>(\n    props: FileInputProps<Multiple>\n  ) => React.JSX.Element;\n}>;\n\nconst DefaultValue: FileInputProps['valueComponent'] = ({ value }) => (\n  <div style={{ overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>\n    {Array.isArray(value) ? value.map((file) => file.name).join(', ') : value?.name}\n  </div>\n);\n\nconst defaultProps = {\n  valueComponent: DefaultValue,\n  size: 'sm',\n} satisfies Partial<FileInputProps>;\n\nexport const FileInput = genericFactory<FileInputFactory>((_props) => {\n  const props = useProps(['Input', 'InputWrapper', 'FileInput'], defaultProps, _props);\n  const {\n    unstyled,\n    vars,\n    onChange,\n    value,\n    defaultValue,\n    multiple,\n    accept,\n    name,\n    form,\n    valueComponent: ValueComponent,\n    clearable,\n    clearSectionMode,\n    clearButtonProps,\n    readOnly,\n    capture,\n    fileInputProps,\n    rightSection,\n    size,\n    placeholder,\n    component,\n    resetRef: resetRefProp,\n    classNames,\n    styles,\n    attributes,\n    ...others\n  } = props;\n\n  const resetRef = useRef<() => void>(null);\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<FileInputFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  const [_value, setValue] = useUncontrolled<null | File | File[]>({\n    value,\n    defaultValue,\n    onChange: onChange as any,\n    finalValue: multiple ? [] : null,\n  });\n\n  const hasValue = Array.isArray(_value) ? _value.length !== 0 : _value !== null;\n\n  const clearButton = (\n    <CloseButton\n      {...clearButtonProps}\n      variant=\"subtle\"\n      onClick={() => setValue(multiple ? [] : null)}\n      size={size}\n      unstyled={unstyled}\n    />\n  );\n\n  const _clearable = clearable && hasValue && !readOnly;\n\n  useEffect(() => {\n    if ((Array.isArray(_value) && _value.length === 0) || _value === null) {\n      resetRef.current?.();\n    }\n  }, [_value]);\n\n  return (\n    <FileButton\n      onChange={setValue}\n      multiple={multiple}\n      accept={accept}\n      name={name}\n      form={form}\n      resetRef={useMergedRef(resetRef, resetRefProp)}\n      disabled={readOnly}\n      capture={capture}\n      inputProps={fileInputProps}\n    >\n      {(fileButtonProps) => (\n        <InputBase\n          component={component || 'button'}\n          rightSection={rightSection}\n          __clearSection={clearButton}\n          __clearable={_clearable}\n          __clearSectionMode={clearSectionMode}\n          {...fileButtonProps}\n          {...others}\n          __staticSelector=\"FileInput\"\n          multiline\n          type=\"button\"\n          pointer\n          __stylesApiProps={props}\n          unstyled={unstyled}\n          size={size}\n          classNames={classNames}\n          styles={styles}\n          attributes={attributes}\n        >\n          {!hasValue ? (\n            <Input.Placeholder\n              __staticSelector=\"FileInput\"\n              classNames={resolvedClassNames}\n              styles={resolvedStyles}\n              attributes={attributes}\n            >\n              {placeholder}\n            </Input.Placeholder>\n          ) : (\n            <ValueComponent value={_value} />\n          )}\n        </InputBase>\n      )}\n    </FileButton>\n  );\n});\n\nFileInput.classes = InputBase.classes;\nFileInput.displayName = '@mantine/core/FileInput';\n\nexport namespace FileInput {\n  export type Props<Multiple extends boolean = false> = FileInputProps<Multiple>;\n  export type Factory = FileInputFactory;\n}\n"],"mappings":";;;;;;;;;;;;AAyFA,MAAM,gBAAkD,EAAE,YACxD,oBAAC,OAAD;CAAK,OAAO;EAAE,UAAU;EAAU,cAAc;EAAY,YAAY;CAAS;WAC9E,MAAM,QAAQ,KAAK,IAAI,MAAM,KAAK,SAAS,KAAK,IAAI,EAAE,KAAK,IAAI,IAAI,OAAO;AACxE,CAAA;AAGP,MAAM,eAAe;CACnB,gBAAgB;CAChB,MAAM;AACR;AAEA,MAAa,YAAY,gBAAkC,WAAW;CACpE,MAAM,QAAQ,SAAS;EAAC;EAAS;EAAgB;CAAW,GAAG,cAAc,MAAM;CACnF,MAAM,EACJ,UACA,MACA,UACA,OACA,cACA,UACA,QACA,MACA,MACA,gBAAgB,gBAChB,WACA,kBACA,kBACA,UACA,SACA,gBACA,cACA,MACA,aACA,WACA,UAAU,cACV,YACA,QACA,YACA,GAAG,WACD;CAEJ,MAAM,WAAW,OAAmB,IAAI;CACxC,MAAM,EAAE,oBAAoB,mBAAmB,qBAAuC;EACpF;EACA;EACA;CACF,CAAC;CAED,MAAM,CAAC,QAAQ,YAAY,gBAAsC;EAC/D;EACA;EACU;EACV,YAAY,WAAW,CAAC,IAAI;CAC9B,CAAC;CAED,MAAM,WAAW,MAAM,QAAQ,MAAM,IAAI,OAAO,WAAW,IAAI,WAAW;CAE1E,MAAM,cACJ,oBAAC,aAAD;EACE,GAAI;EACJ,SAAQ;EACR,eAAe,SAAS,WAAW,CAAC,IAAI,IAAI;EACtC;EACI;CACX,CAAA;CAGH,MAAM,aAAa,aAAa,YAAY,CAAC;CAE7C,gBAAgB;EACd,IAAK,MAAM,QAAQ,MAAM,KAAK,OAAO,WAAW,KAAM,WAAW,MAC/D,SAAS,UAAU;CAEvB,GAAG,CAAC,MAAM,CAAC;CAEX,OACE,oBAAC,YAAD;EACE,UAAU;EACA;EACF;EACF;EACA;EACN,UAAU,aAAa,UAAU,YAAY;EAC7C,UAAU;EACD;EACT,YAAY;aAEV,oBACA,oBAAC,WAAD;GACE,WAAW,aAAa;GACV;GACd,gBAAgB;GAChB,aAAa;GACb,oBAAoB;GACpB,GAAI;GACJ,GAAI;GACJ,kBAAiB;GACjB,WAAA;GACA,MAAK;GACL,SAAA;GACA,kBAAkB;GACR;GACJ;GACM;GACJ;GACI;aAEX,CAAC,WACA,oBAAC,MAAM,aAAP;IACE,kBAAiB;IACjB,YAAY;IACZ,QAAQ;IACI;cAEX;GACgB,CAAA,IAEnB,oBAAC,gBAAD,EAAgB,OAAO,OAAS,CAAA;EAEzB,CAAA;CAEH,CAAA;AAEhB,CAAC;AAED,UAAU,UAAU,UAAU;AAC9B,UAAU,cAAc"}
+{"version":3,"file":"FileInput.mjs","names":[],"sources":["../../../src/components/FileInput/FileInput.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport { useMergedRef, useUncontrolled } from '@mantine/hooks';\nimport {\n  BoxProps,\n  ElementProps,\n  Factory,\n  genericFactory,\n  StylesApiProps,\n  useProps,\n  useResolvedStylesApi,\n} from '../../core';\nimport { CloseButton } from '../CloseButton';\nimport { FileButton } from '../FileButton';\nimport {\n  __BaseInputProps,\n  __InputStylesNames,\n  ClearSectionMode,\n  Input,\n  InputVariant,\n} from '../Input';\nimport { InputBase } from '../InputBase/InputBase';\n\nexport interface FileInputProps<Multiple = false>\n  extends\n    BoxProps,\n    __BaseInputProps,\n    StylesApiProps<FileInputFactory>,\n    ElementProps<'button', 'value' | 'defaultValue' | 'onChange' | 'placeholder'> {\n  component?: any;\n\n  /** Called when value changes */\n  onChange?: (payload: Multiple extends true ? File[] : File | null) => void;\n\n  /** Controlled component value */\n  value?: Multiple extends true ? File[] : File | null;\n\n  /** Uncontrolled component default value */\n  defaultValue?: Multiple extends true ? File[] : File | null;\n\n  /** If set, user can pick more than one file @default false */\n  multiple?: Multiple;\n\n  /** File input accept attribute, for example, `\"image/png,image/jpeg\"` */\n  accept?: string;\n\n  /** Input name attribute */\n  name?: string;\n\n  /** Input form attribute */\n  form?: string;\n\n  /** Value renderer. By default, displays file name. */\n  valueComponent?: React.FC<{ value: null | File | File[] }>;\n\n  /** If set, the clear button is displayed in the right section @default false */\n  clearable?: boolean;\n\n  /** Determines how the clear button and rightSection are rendered @default 'both' */\n  clearSectionMode?: ClearSectionMode;\n\n  /** Props passed down to the clear button */\n  clearButtonProps?: React.ComponentProps<'button'>;\n\n  /** If set, the input value cannot be changed  */\n  readOnly?: boolean;\n\n  /** Specifies that, optionally, a new file should be captured, and which device should be used to capture that new media of a type defined by the accept attribute. */\n  capture?: boolean | 'user' | 'environment';\n\n  /** Props passed down to the hidden `input[type=\"file\"]` */\n  fileInputProps?: React.ComponentProps<'input'>;\n\n  /** Input placeholder */\n  placeholder?: React.ReactNode;\n\n  /** Reference of the function that should be called when value changes to null or empty array */\n  resetRef?: React.Ref<() => void>;\n}\n\nexport type FileInputFactory = Factory<{\n  props: FileInputProps;\n  ref: HTMLButtonElement;\n  stylesNames: __InputStylesNames | 'placeholder';\n  variant: InputVariant;\n  signature: <Multiple extends boolean = false>(\n    props: FileInputProps<Multiple>\n  ) => React.JSX.Element;\n}>;\n\nconst DefaultValue: FileInputProps['valueComponent'] = ({ value }) => (\n  <div style={{ overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>\n    {Array.isArray(value) ? value.map((file) => file.name).join(', ') : value?.name}\n  </div>\n);\n\nconst defaultProps = {\n  valueComponent: DefaultValue,\n  size: 'sm',\n} satisfies Partial<FileInputProps>;\n\nexport const FileInput = genericFactory<FileInputFactory>((_props) => {\n  const props = useProps(['Input', 'InputWrapper', 'FileInput'], defaultProps, _props);\n  const {\n    unstyled,\n    vars,\n    onChange,\n    value,\n    defaultValue,\n    multiple,\n    accept,\n    name,\n    form,\n    valueComponent: ValueComponent,\n    clearable,\n    clearSectionMode,\n    clearButtonProps,\n    readOnly,\n    capture,\n    fileInputProps,\n    rightSection,\n    size,\n    placeholder,\n    component,\n    resetRef: resetRefProp,\n    classNames,\n    styles,\n    attributes,\n    ...others\n  } = props;\n\n  const resetRef = useRef<() => void>(null);\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<FileInputFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  const [_value, setValue] = useUncontrolled<null | File | File[]>({\n    value,\n    defaultValue,\n    onChange: onChange as any,\n    finalValue: multiple ? [] : null,\n  });\n\n  const hasValue = Array.isArray(_value) ? _value.length !== 0 : _value !== null;\n\n  const clearButton = (\n    <CloseButton\n      {...clearButtonProps}\n      variant=\"subtle\"\n      onClick={() => setValue(multiple ? [] : null)}\n      size={size}\n      unstyled={unstyled}\n    />\n  );\n\n  const _clearable = clearable && hasValue && !readOnly;\n\n  useEffect(() => {\n    if ((Array.isArray(_value) && _value.length === 0) || _value === null) {\n      resetRef.current?.();\n    }\n  }, [_value]);\n\n  return (\n    <FileButton\n      onChange={setValue}\n      multiple={multiple}\n      accept={accept}\n      name={name}\n      form={form}\n      resetRef={useMergedRef(resetRef, resetRefProp)}\n      disabled={readOnly}\n      capture={capture}\n      inputProps={fileInputProps}\n    >\n      {(fileButtonProps) => (\n        <InputBase\n          component={component || 'button'}\n          rightSection={rightSection}\n          __clearSection={clearButton}\n          __clearable={_clearable}\n          __clearSectionMode={clearSectionMode}\n          {...fileButtonProps}\n          {...others}\n          __staticSelector=\"FileInput\"\n          multiline\n          type=\"button\"\n          pointer\n          __stylesApiProps={props}\n          unstyled={unstyled}\n          size={size}\n          classNames={classNames}\n          styles={styles}\n          attributes={attributes}\n        >\n          {!hasValue ? (\n            <Input.Placeholder\n              __staticSelector=\"FileInput\"\n              classNames={resolvedClassNames}\n              styles={resolvedStyles}\n              attributes={attributes}\n            >\n              {placeholder}\n            </Input.Placeholder>\n          ) : (\n            <ValueComponent value={_value} />\n          )}\n        </InputBase>\n      )}\n    </FileButton>\n  );\n});\n\nFileInput.classes = InputBase.classes;\nFileInput.displayName = '@mantine/core/FileInput';\n\nexport namespace FileInput {\n  export type Props<Multiple extends boolean = false> = FileInputProps<Multiple>;\n  export type Factory = FileInputFactory;\n}\n"],"mappings":";;;;;;;;;;;;AAyFA,MAAM,gBAAkD,EAAE,YACxD,oBAAC,OAAD;CAAK,OAAO;EAAE,UAAU;EAAU,cAAc;EAAY,YAAY;CAAS;WAC9E,MAAM,QAAQ,KAAK,IAAI,MAAM,KAAK,SAAS,KAAK,IAAI,CAAC,CAAC,KAAK,IAAI,IAAI,OAAO;AACxE,CAAA;AAGP,MAAM,eAAe;CACnB,gBAAgB;CAChB,MAAM;AACR;AAEA,MAAa,YAAY,gBAAkC,WAAW;CACpE,MAAM,QAAQ,SAAS;EAAC;EAAS;EAAgB;CAAW,GAAG,cAAc,MAAM;CACnF,MAAM,EACJ,UACA,MACA,UACA,OACA,cACA,UACA,QACA,MACA,MACA,gBAAgB,gBAChB,WACA,kBACA,kBACA,UACA,SACA,gBACA,cACA,MACA,aACA,WACA,UAAU,cACV,YACA,QACA,YACA,GAAG,WACD;CAEJ,MAAM,WAAW,OAAmB,IAAI;CACxC,MAAM,EAAE,oBAAoB,mBAAmB,qBAAuC;EACpF;EACA;EACA;CACF,CAAC;CAED,MAAM,CAAC,QAAQ,YAAY,gBAAsC;EAC/D;EACA;EACU;EACV,YAAY,WAAW,CAAC,IAAI;CAC9B,CAAC;CAED,MAAM,WAAW,MAAM,QAAQ,MAAM,IAAI,OAAO,WAAW,IAAI,WAAW;CAE1E,MAAM,cACJ,oBAAC,aAAD;EACE,GAAI;EACJ,SAAQ;EACR,eAAe,SAAS,WAAW,CAAC,IAAI,IAAI;EACtC;EACI;CACX,CAAA;CAGH,MAAM,aAAa,aAAa,YAAY,CAAC;CAE7C,gBAAgB;EACd,IAAK,MAAM,QAAQ,MAAM,KAAK,OAAO,WAAW,KAAM,WAAW,MAC/D,SAAS,UAAU;CAEvB,GAAG,CAAC,MAAM,CAAC;CAEX,OACE,oBAAC,YAAD;EACE,UAAU;EACA;EACF;EACF;EACA;EACN,UAAU,aAAa,UAAU,YAAY;EAC7C,UAAU;EACD;EACT,YAAY;aAEV,oBACA,oBAAC,WAAD;GACE,WAAW,aAAa;GACV;GACd,gBAAgB;GAChB,aAAa;GACb,oBAAoB;GACpB,GAAI;GACJ,GAAI;GACJ,kBAAiB;GACjB,WAAA;GACA,MAAK;GACL,SAAA;GACA,kBAAkB;GACR;GACJ;GACM;GACJ;GACI;aAEX,CAAC,WACA,oBAAC,MAAM,aAAP;IACE,kBAAiB;IACjB,YAAY;IACZ,QAAQ;IACI;cAEX;GACgB,CAAA,IAEnB,oBAAC,gBAAD,EAAgB,OAAO,OAAS,CAAA;EAEzB,CAAA;CAEH,CAAA;AAEhB,CAAC;AAED,UAAU,UAAU,UAAU;AAC9B,UAAU,cAAc"}

package/esm/components/Grid/GridCol/GridColVariables.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"GridColVariables.mjs","names":[],"sources":["../../../../src/components/Grid/GridCol/GridColVariables.tsx"],"sourcesContent":["import {\n  filterProps,\n  getBaseValue,\n  getSortedBreakpoints,\n  InlineStyles,\n  keys,\n  useMantineTheme,\n} from '../../../core';\nimport { GridBreakpoints, useGridContext } from '../Grid.context';\nimport type { ColSpan, GridColProps } from './GridCol';\n\ninterface GridColVariablesProps {\n  selector: string;\n  span: GridColProps['span'] | undefined;\n  order?: GridColProps['order'] | undefined;\n  offset?: GridColProps['offset'] | undefined;\n  align?: GridColProps['align'] | undefined;\n}\n\nconst getColumnFlexBasis = (colSpan: ColSpan | undefined, columns: number) => {\n  if (colSpan === 'content') {\n    return 'auto';\n  }\n\n  if (colSpan === 'auto') {\n    return '0rem';\n  }\n\n  if (!colSpan) {\n    return undefined;\n  }\n\n  if (colSpan === columns) {\n    return '100%';\n  }\n\n  const percentage = (100 * colSpan) / columns;\n  const gapFactor = (columns - colSpan) / columns;\n  return `calc(${percentage}% - ${gapFactor} * var(--grid-column-gap))`;\n};\n\nconst getColumnMaxWidth = (\n  colSpan: ColSpan | undefined,\n  columns: number,\n  grow: boolean | undefined\n) => {\n  if (grow || colSpan === 'auto') {\n    return '100%';\n  }\n\n  if (colSpan === 'content') {\n    return 'unset';\n  }\n\n  return getColumnFlexBasis(colSpan, columns);\n};\n\nconst getColumnFlexGrow = (colSpan: ColSpan | undefined, grow: boolean | undefined) => {\n  if (!colSpan) {\n    return undefined;\n  }\n\n  return colSpan === 'auto' || grow ? '1' : 'auto';\n};\n\nconst getColumnOffset = (offset: number | undefined, columns: number) => {\n  if (offset === 0) {\n    return '0';\n  }\n\n  if (!offset) {\n    return undefined;\n  }\n\n  const percentage = (100 * offset) / columns;\n  const gapFactor = offset / columns;\n  return `calc(${percentage}% + ${gapFactor} * var(--grid-column-gap))`;\n};\n\nexport function GridColVariables({ span, order, offset, align, selector }: GridColVariablesProps) {\n  const theme = useMantineTheme();\n  const ctx = useGridContext();\n  const _breakpoints = ctx.breakpoints || theme.breakpoints;\n\n  const baseValue = getBaseValue(span);\n  const baseSpan = baseValue === undefined ? 12 : baseValue;\n\n  const baseStyles: Record<string, string | undefined> = filterProps({\n    '--col-order': getBaseValue(order)?.toString(),\n    '--col-flex-grow': getColumnFlexGrow(baseSpan, ctx.grow),\n    '--col-flex-basis': getColumnFlexBasis(baseSpan, ctx.columns),\n    '--col-width': baseSpan === 'content' ? 'auto' : undefined,\n    '--col-max-width': getColumnMaxWidth(baseSpan, ctx.columns, ctx.grow),\n    '--col-offset': getColumnOffset(getBaseValue(offset), ctx.columns),\n    '--col-align-self': getBaseValue(align),\n  });\n\n  const queries = keys(_breakpoints).reduce<Record<string, Record<string, any>>>(\n    (acc, breakpoint) => {\n      if (!acc[breakpoint]) {\n        acc[breakpoint] = {};\n      }\n\n      if (typeof order === 'object' && order[breakpoint] !== undefined) {\n        acc[breakpoint]['--col-order'] = order[breakpoint]?.toString();\n      }\n\n      if (typeof span === 'object' && span[breakpoint] !== undefined) {\n        acc[breakpoint]['--col-flex-grow'] = getColumnFlexGrow(span[breakpoint], ctx.grow);\n        acc[breakpoint]['--col-flex-basis'] = getColumnFlexBasis(span[breakpoint], ctx.columns);\n        acc[breakpoint]['--col-width'] = span[breakpoint] === 'content' ? 'auto' : undefined;\n        acc[breakpoint]['--col-max-width'] = getColumnMaxWidth(\n          span[breakpoint],\n          ctx.columns,\n          ctx.grow\n        );\n      }\n\n      if (typeof offset === 'object' && offset[breakpoint] !== undefined) {\n        acc[breakpoint]['--col-offset'] = getColumnOffset(offset[breakpoint], ctx.columns);\n      }\n\n      if (typeof align === 'object' && align[breakpoint] !== undefined) {\n        acc[breakpoint]['--col-align-self'] = align[breakpoint];\n      }\n\n      return acc;\n    },\n    {}\n  );\n\n  const sortedBreakpoints = getSortedBreakpoints(keys(queries), _breakpoints).filter(\n    (breakpoint) => keys(queries[breakpoint.value]).length > 0\n  );\n\n  const values = sortedBreakpoints.map((breakpoint) => ({\n    query:\n      ctx.type === 'container'\n        ? `mantine-grid (min-width: ${_breakpoints[breakpoint.value as keyof GridBreakpoints]})`\n        : `(min-width: ${_breakpoints[breakpoint.value as keyof GridBreakpoints]})`,\n    styles: queries[breakpoint.value],\n  }));\n\n  return (\n    <InlineStyles\n      styles={baseStyles}\n      media={ctx.type === 'container' ? undefined : values}\n      container={ctx.type === 'container' ? values : undefined}\n      selector={selector}\n    />\n  );\n}\n"],"mappings":";;;;;;;;;;AAmBA,MAAM,sBAAsB,SAA8B,YAAoB;CAC5E,IAAI,YAAY,WACd,OAAO;CAGT,IAAI,YAAY,QACd,OAAO;CAGT,IAAI,CAAC,SACH;CAGF,IAAI,YAAY,SACd,OAAO;CAKT,OAAO,QAFa,MAAM,UAAW,QAEX,OADP,UAAU,WAAW,QACE;AAC5C;AAEA,MAAM,qBACJ,SACA,SACA,SACG;CACH,IAAI,QAAQ,YAAY,QACtB,OAAO;CAGT,IAAI,YAAY,WACd,OAAO;CAGT,OAAO,mBAAmB,SAAS,OAAO;AAC5C;AAEA,MAAM,qBAAqB,SAA8B,SAA8B;CACrF,IAAI,CAAC,SACH;CAGF,OAAO,YAAY,UAAU,OAAO,MAAM;AAC5C;AAEA,MAAM,mBAAmB,QAA4B,YAAoB;CACvE,IAAI,WAAW,GACb,OAAO;CAGT,IAAI,CAAC,QACH;CAKF,OAAO,QAFa,MAAM,SAAU,QAEV,MADR,SAAS,QACe;AAC5C;AAEA,SAAgB,iBAAiB,EAAE,MAAM,OAAO,QAAQ,OAAO,YAAmC;CAChG,MAAM,QAAQ,gBAAgB;CAC9B,MAAM,MAAM,eAAe;CAC3B,MAAM,eAAe,IAAI,eAAe,MAAM;CAE9C,MAAM,YAAY,aAAa,IAAI;CACnC,MAAM,WAAW,cAAc,KAAA,IAAY,KAAK;CAEhD,MAAM,aAAiD,YAAY;EACjE,eAAe,aAAa,KAAK,GAAG,SAAS;EAC7C,mBAAmB,kBAAkB,UAAU,IAAI,IAAI;EACvD,oBAAoB,mBAAmB,UAAU,IAAI,OAAO;EAC5D,eAAe,aAAa,YAAY,SAAS,KAAA;EACjD,mBAAmB,kBAAkB,UAAU,IAAI,SAAS,IAAI,IAAI;EACpE,gBAAgB,gBAAgB,aAAa,MAAM,GAAG,IAAI,OAAO;EACjE,oBAAoB,aAAa,KAAK;CACxC,CAAC;CAED,MAAM,UAAU,KAAK,YAAY,EAAE,QAChC,KAAK,eAAe;EACnB,IAAI,CAAC,IAAI,aACP,IAAI,cAAc,CAAC;EAGrB,IAAI,OAAO,UAAU,YAAY,MAAM,gBAAgB,KAAA,GACrD,IAAI,YAAY,iBAAiB,MAAM,aAAa,SAAS;EAG/D,IAAI,OAAO,SAAS,YAAY,KAAK,gBAAgB,KAAA,GAAW;GAC9D,IAAI,YAAY,qBAAqB,kBAAkB,KAAK,aAAa,IAAI,IAAI;GACjF,IAAI,YAAY,sBAAsB,mBAAmB,KAAK,aAAa,IAAI,OAAO;GACtF,IAAI,YAAY,iBAAiB,KAAK,gBAAgB,YAAY,SAAS,KAAA;GAC3E,IAAI,YAAY,qBAAqB,kBACnC,KAAK,aACL,IAAI,SACJ,IAAI,IACN;EACF;EAEA,IAAI,OAAO,WAAW,YAAY,OAAO,gBAAgB,KAAA,GACvD,IAAI,YAAY,kBAAkB,gBAAgB,OAAO,aAAa,IAAI,OAAO;EAGnF,IAAI,OAAO,UAAU,YAAY,MAAM,gBAAgB,KAAA,GACrD,IAAI,YAAY,sBAAsB,MAAM;EAG9C,OAAO;CACT,GACA,CAAC,CACH;CAMA,MAAM,SAJoB,qBAAqB,KAAK,OAAO,GAAG,YAAY,EAAE,QACzE,eAAe,KAAK,QAAQ,WAAW,MAAM,EAAE,SAAS,CAG5B,EAAE,KAAK,gBAAgB;EACpD,OACE,IAAI,SAAS,cACT,4BAA4B,aAAa,WAAW,OAAgC,KACpF,eAAe,aAAa,WAAW,OAAgC;EAC7E,QAAQ,QAAQ,WAAW;CAC7B,EAAE;CAEF,OACE,oBAAC,cAAD;EACE,QAAQ;EACR,OAAO,IAAI,SAAS,cAAc,KAAA,IAAY;EAC9C,WAAW,IAAI,SAAS,cAAc,SAAS,KAAA;EACrC;CACX,CAAA;AAEL"}
+{"version":3,"file":"GridColVariables.mjs","names":[],"sources":["../../../../src/components/Grid/GridCol/GridColVariables.tsx"],"sourcesContent":["import {\n  filterProps,\n  getBaseValue,\n  getSortedBreakpoints,\n  InlineStyles,\n  keys,\n  useMantineTheme,\n} from '../../../core';\nimport { GridBreakpoints, useGridContext } from '../Grid.context';\nimport type { ColSpan, GridColProps } from './GridCol';\n\ninterface GridColVariablesProps {\n  selector: string;\n  span: GridColProps['span'] | undefined;\n  order?: GridColProps['order'] | undefined;\n  offset?: GridColProps['offset'] | undefined;\n  align?: GridColProps['align'] | undefined;\n}\n\nconst getColumnFlexBasis = (colSpan: ColSpan | undefined, columns: number) => {\n  if (colSpan === 'content') {\n    return 'auto';\n  }\n\n  if (colSpan === 'auto') {\n    return '0rem';\n  }\n\n  if (!colSpan) {\n    return undefined;\n  }\n\n  if (colSpan === columns) {\n    return '100%';\n  }\n\n  const percentage = (100 * colSpan) / columns;\n  const gapFactor = (columns - colSpan) / columns;\n  return `calc(${percentage}% - ${gapFactor} * var(--grid-column-gap))`;\n};\n\nconst getColumnMaxWidth = (\n  colSpan: ColSpan | undefined,\n  columns: number,\n  grow: boolean | undefined\n) => {\n  if (grow || colSpan === 'auto') {\n    return '100%';\n  }\n\n  if (colSpan === 'content') {\n    return 'unset';\n  }\n\n  return getColumnFlexBasis(colSpan, columns);\n};\n\nconst getColumnFlexGrow = (colSpan: ColSpan | undefined, grow: boolean | undefined) => {\n  if (!colSpan) {\n    return undefined;\n  }\n\n  return colSpan === 'auto' || grow ? '1' : 'auto';\n};\n\nconst getColumnOffset = (offset: number | undefined, columns: number) => {\n  if (offset === 0) {\n    return '0';\n  }\n\n  if (!offset) {\n    return undefined;\n  }\n\n  const percentage = (100 * offset) / columns;\n  const gapFactor = offset / columns;\n  return `calc(${percentage}% + ${gapFactor} * var(--grid-column-gap))`;\n};\n\nexport function GridColVariables({ span, order, offset, align, selector }: GridColVariablesProps) {\n  const theme = useMantineTheme();\n  const ctx = useGridContext();\n  const _breakpoints = ctx.breakpoints || theme.breakpoints;\n\n  const baseValue = getBaseValue(span);\n  const baseSpan = baseValue === undefined ? 12 : baseValue;\n\n  const baseStyles: Record<string, string | undefined> = filterProps({\n    '--col-order': getBaseValue(order)?.toString(),\n    '--col-flex-grow': getColumnFlexGrow(baseSpan, ctx.grow),\n    '--col-flex-basis': getColumnFlexBasis(baseSpan, ctx.columns),\n    '--col-width': baseSpan === 'content' ? 'auto' : undefined,\n    '--col-max-width': getColumnMaxWidth(baseSpan, ctx.columns, ctx.grow),\n    '--col-offset': getColumnOffset(getBaseValue(offset), ctx.columns),\n    '--col-align-self': getBaseValue(align),\n  });\n\n  const queries = keys(_breakpoints).reduce<Record<string, Record<string, any>>>(\n    (acc, breakpoint) => {\n      if (!acc[breakpoint]) {\n        acc[breakpoint] = {};\n      }\n\n      if (typeof order === 'object' && order[breakpoint] !== undefined) {\n        acc[breakpoint]['--col-order'] = order[breakpoint]?.toString();\n      }\n\n      if (typeof span === 'object' && span[breakpoint] !== undefined) {\n        acc[breakpoint]['--col-flex-grow'] = getColumnFlexGrow(span[breakpoint], ctx.grow);\n        acc[breakpoint]['--col-flex-basis'] = getColumnFlexBasis(span[breakpoint], ctx.columns);\n        acc[breakpoint]['--col-width'] = span[breakpoint] === 'content' ? 'auto' : undefined;\n        acc[breakpoint]['--col-max-width'] = getColumnMaxWidth(\n          span[breakpoint],\n          ctx.columns,\n          ctx.grow\n        );\n      }\n\n      if (typeof offset === 'object' && offset[breakpoint] !== undefined) {\n        acc[breakpoint]['--col-offset'] = getColumnOffset(offset[breakpoint], ctx.columns);\n      }\n\n      if (typeof align === 'object' && align[breakpoint] !== undefined) {\n        acc[breakpoint]['--col-align-self'] = align[breakpoint];\n      }\n\n      return acc;\n    },\n    {}\n  );\n\n  const sortedBreakpoints = getSortedBreakpoints(keys(queries), _breakpoints).filter(\n    (breakpoint) => keys(queries[breakpoint.value]).length > 0\n  );\n\n  const values = sortedBreakpoints.map((breakpoint) => ({\n    query:\n      ctx.type === 'container'\n        ? `mantine-grid (min-width: ${_breakpoints[breakpoint.value as keyof GridBreakpoints]})`\n        : `(min-width: ${_breakpoints[breakpoint.value as keyof GridBreakpoints]})`,\n    styles: queries[breakpoint.value],\n  }));\n\n  return (\n    <InlineStyles\n      styles={baseStyles}\n      media={ctx.type === 'container' ? undefined : values}\n      container={ctx.type === 'container' ? values : undefined}\n      selector={selector}\n    />\n  );\n}\n"],"mappings":"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"}

package/esm/components/Grid/GridVariables.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"GridVariables.mjs","names":[],"sources":["../../../src/components/Grid/GridVariables.tsx"],"sourcesContent":["import {\n  filterProps,\n  getBaseValue,\n  getSortedBreakpoints,\n  getSpacing,\n  InlineStyles,\n  keys,\n  useMantineTheme,\n} from '../../core';\nimport type { GridProps } from './Grid';\nimport type { GridBreakpoints } from './Grid.context';\n\ninterface GridVariablesProps extends GridProps {\n  selector: string;\n}\n\nexport function GridVariables({\n  gap,\n  rowGap,\n  columnGap,\n  selector,\n  breakpoints,\n  type,\n}: GridVariablesProps) {\n  const theme = useMantineTheme();\n  const _breakpoints = breakpoints || theme.breakpoints;\n\n  const baseStyles: Record<string, string | undefined> = filterProps({\n    '--grid-gap': getSpacing(getBaseValue(gap)),\n    '--grid-row-gap': getSpacing(getBaseValue(rowGap)),\n    '--grid-column-gap': getSpacing(getBaseValue(columnGap)),\n  });\n\n  const queries = keys(_breakpoints).reduce<Record<string, Record<string, any>>>(\n    (acc, breakpoint) => {\n      if (!acc[breakpoint]) {\n        acc[breakpoint] = {};\n      }\n\n      if (typeof gap === 'object' && gap[breakpoint] !== undefined) {\n        acc[breakpoint]['--grid-gap'] = getSpacing(gap[breakpoint]);\n      }\n\n      if (typeof rowGap === 'object' && rowGap[breakpoint] !== undefined) {\n        acc[breakpoint]['--grid-row-gap'] = getSpacing(rowGap[breakpoint]);\n      }\n\n      if (typeof columnGap === 'object' && columnGap[breakpoint] !== undefined) {\n        acc[breakpoint]['--grid-column-gap'] = getSpacing(columnGap[breakpoint]);\n      }\n\n      return acc;\n    },\n    {}\n  );\n\n  const sortedBreakpoints = getSortedBreakpoints(keys(queries), _breakpoints).filter(\n    (breakpoint) => keys(queries[breakpoint.value]).length > 0\n  );\n\n  const values = sortedBreakpoints.map((breakpoint) => ({\n    query:\n      type === 'container'\n        ? `mantine-grid (min-width: ${_breakpoints[breakpoint.value as keyof GridBreakpoints]})`\n        : `(min-width: ${_breakpoints[breakpoint.value as keyof GridBreakpoints]})`,\n    styles: queries[breakpoint.value],\n  }));\n\n  return (\n    <InlineStyles\n      styles={baseStyles}\n      media={type === 'container' ? undefined : values}\n      container={type === 'container' ? values : undefined}\n      selector={selector}\n    />\n  );\n}\n"],"mappings":";;;;;;;;;;AAgBA,SAAgB,cAAc,EAC5B,KACA,QACA,WACA,UACA,aACA,QACqB;CACrB,MAAM,QAAQ,gBAAgB;CAC9B,MAAM,eAAe,eAAe,MAAM;CAE1C,MAAM,aAAiD,YAAY;EACjE,cAAc,WAAW,aAAa,GAAG,CAAC;EAC1C,kBAAkB,WAAW,aAAa,MAAM,CAAC;EACjD,qBAAqB,WAAW,aAAa,SAAS,CAAC;CACzD,CAAC;CAED,MAAM,UAAU,KAAK,YAAY,EAAE,QAChC,KAAK,eAAe;EACnB,IAAI,CAAC,IAAI,aACP,IAAI,cAAc,CAAC;EAGrB,IAAI,OAAO,QAAQ,YAAY,IAAI,gBAAgB,KAAA,GACjD,IAAI,YAAY,gBAAgB,WAAW,IAAI,WAAW;EAG5D,IAAI,OAAO,WAAW,YAAY,OAAO,gBAAgB,KAAA,GACvD,IAAI,YAAY,oBAAoB,WAAW,OAAO,WAAW;EAGnE,IAAI,OAAO,cAAc,YAAY,UAAU,gBAAgB,KAAA,GAC7D,IAAI,YAAY,uBAAuB,WAAW,UAAU,WAAW;EAGzE,OAAO;CACT,GACA,CAAC,CACH;CAMA,MAAM,SAJoB,qBAAqB,KAAK,OAAO,GAAG,YAAY,EAAE,QACzE,eAAe,KAAK,QAAQ,WAAW,MAAM,EAAE,SAAS,CAG5B,EAAE,KAAK,gBAAgB;EACpD,OACE,SAAS,cACL,4BAA4B,aAAa,WAAW,OAAgC,KACpF,eAAe,aAAa,WAAW,OAAgC;EAC7E,QAAQ,QAAQ,WAAW;CAC7B,EAAE;CAEF,OACE,oBAAC,cAAD;EACE,QAAQ;EACR,OAAO,SAAS,cAAc,KAAA,IAAY;EAC1C,WAAW,SAAS,cAAc,SAAS,KAAA;EACjC;CACX,CAAA;AAEL"}
+{"version":3,"file":"GridVariables.mjs","names":[],"sources":["../../../src/components/Grid/GridVariables.tsx"],"sourcesContent":["import {\n  filterProps,\n  getBaseValue,\n  getSortedBreakpoints,\n  getSpacing,\n  InlineStyles,\n  keys,\n  useMantineTheme,\n} from '../../core';\nimport type { GridProps } from './Grid';\nimport type { GridBreakpoints } from './Grid.context';\n\ninterface GridVariablesProps extends GridProps {\n  selector: string;\n}\n\nexport function GridVariables({\n  gap,\n  rowGap,\n  columnGap,\n  selector,\n  breakpoints,\n  type,\n}: GridVariablesProps) {\n  const theme = useMantineTheme();\n  const _breakpoints = breakpoints || theme.breakpoints;\n\n  const baseStyles: Record<string, string | undefined> = filterProps({\n    '--grid-gap': getSpacing(getBaseValue(gap)),\n    '--grid-row-gap': getSpacing(getBaseValue(rowGap)),\n    '--grid-column-gap': getSpacing(getBaseValue(columnGap)),\n  });\n\n  const queries = keys(_breakpoints).reduce<Record<string, Record<string, any>>>(\n    (acc, breakpoint) => {\n      if (!acc[breakpoint]) {\n        acc[breakpoint] = {};\n      }\n\n      if (typeof gap === 'object' && gap[breakpoint] !== undefined) {\n        acc[breakpoint]['--grid-gap'] = getSpacing(gap[breakpoint]);\n      }\n\n      if (typeof rowGap === 'object' && rowGap[breakpoint] !== undefined) {\n        acc[breakpoint]['--grid-row-gap'] = getSpacing(rowGap[breakpoint]);\n      }\n\n      if (typeof columnGap === 'object' && columnGap[breakpoint] !== undefined) {\n        acc[breakpoint]['--grid-column-gap'] = getSpacing(columnGap[breakpoint]);\n      }\n\n      return acc;\n    },\n    {}\n  );\n\n  const sortedBreakpoints = getSortedBreakpoints(keys(queries), _breakpoints).filter(\n    (breakpoint) => keys(queries[breakpoint.value]).length > 0\n  );\n\n  const values = sortedBreakpoints.map((breakpoint) => ({\n    query:\n      type === 'container'\n        ? `mantine-grid (min-width: ${_breakpoints[breakpoint.value as keyof GridBreakpoints]})`\n        : `(min-width: ${_breakpoints[breakpoint.value as keyof GridBreakpoints]})`,\n    styles: queries[breakpoint.value],\n  }));\n\n  return (\n    <InlineStyles\n      styles={baseStyles}\n      media={type === 'container' ? undefined : values}\n      container={type === 'container' ? values : undefined}\n      selector={selector}\n    />\n  );\n}\n"],"mappings":";;;;;;;;;;AAgBA,SAAgB,cAAc,EAC5B,KACA,QACA,WACA,UACA,aACA,QACqB;CACrB,MAAM,QAAQ,gBAAgB;CAC9B,MAAM,eAAe,eAAe,MAAM;CAE1C,MAAM,aAAiD,YAAY;EACjE,cAAc,WAAW,aAAa,GAAG,CAAC;EAC1C,kBAAkB,WAAW,aAAa,MAAM,CAAC;EACjD,qBAAqB,WAAW,aAAa,SAAS,CAAC;CACzD,CAAC;CAED,MAAM,UAAU,KAAK,YAAY,CAAC,CAAC,QAChC,KAAK,eAAe;EACnB,IAAI,CAAC,IAAI,aACP,IAAI,cAAc,CAAC;EAGrB,IAAI,OAAO,QAAQ,YAAY,IAAI,gBAAgB,KAAA,GACjD,IAAI,WAAW,CAAC,gBAAgB,WAAW,IAAI,WAAW;EAG5D,IAAI,OAAO,WAAW,YAAY,OAAO,gBAAgB,KAAA,GACvD,IAAI,WAAW,CAAC,oBAAoB,WAAW,OAAO,WAAW;EAGnE,IAAI,OAAO,cAAc,YAAY,UAAU,gBAAgB,KAAA,GAC7D,IAAI,WAAW,CAAC,uBAAuB,WAAW,UAAU,WAAW;EAGzE,OAAO;CACT,GACA,CAAC,CACH;CAMA,MAAM,SAJoB,qBAAqB,KAAK,OAAO,GAAG,YAAY,CAAC,CAAC,QACzE,eAAe,KAAK,QAAQ,WAAW,MAAM,CAAC,CAAC,SAAS,CAG5B,CAAC,CAAC,KAAK,gBAAgB;EACpD,OACE,SAAS,cACL,4BAA4B,aAAa,WAAW,OAAgC,KACpF,eAAe,aAAa,WAAW,OAAgC;EAC7E,QAAQ,QAAQ,WAAW;CAC7B,EAAE;CAEF,OACE,oBAAC,cAAD;EACE,QAAQ;EACR,OAAO,SAAS,cAAc,KAAA,IAAY;EAC1C,WAAW,SAAS,cAAc,SAAS,KAAA;EACjC;CACX,CAAA;AAEL"}

package/esm/components/Group/Group.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Group.mjs","names":["classes"],"sources":["../../../src/components/Group/Group.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 { filterFalsyChildren } from './filter-falsy-children/filter-falsy-children';\nimport classes from './Group.module.css';\n\nexport type GroupStylesNames = 'root';\nexport type GroupCssVariables = {\n  root:\n    | '--group-gap'\n    | '--group-align'\n    | '--group-justify'\n    | '--group-wrap'\n    | '--group-child-width';\n};\n\nexport interface GroupStylesCtx {\n  childWidth: string;\n}\n\nexport interface GroupProps extends BoxProps, StylesApiProps<GroupFactory>, ElementProps<'div'> {\n  __size?: any;\n\n  /** Controls `justify-content` CSS property @default 'flex-start' */\n  justify?: React.CSSProperties['justifyContent'];\n\n  /** Controls `align-items` CSS property @default 'center' */\n  align?: React.CSSProperties['alignItems'];\n\n  /** Controls `flex-wrap` CSS property @default 'wrap' */\n  wrap?: React.CSSProperties['flexWrap'];\n\n  /** Key of `theme.spacing` or any valid CSS value for `gap`, numbers are converted to rem @default 'md' */\n  gap?: MantineSpacing;\n\n  /** Determines whether each child element should have `flex-grow: 1` style @default false */\n  grow?: boolean;\n\n  /** Determines whether children should take only dedicated amount of space (`max-width` style is set based on the number of children) @default true */\n  preventGrowOverflow?: boolean;\n}\n\nexport type GroupFactory = Factory<{\n  props: GroupProps;\n  ref: HTMLDivElement;\n  stylesNames: GroupStylesNames;\n  vars: GroupCssVariables;\n  ctx: GroupStylesCtx;\n}>;\n\nconst defaultProps = {\n  preventGrowOverflow: true,\n  gap: 'md',\n  align: 'center',\n  justify: 'flex-start',\n  wrap: 'wrap',\n} satisfies Partial<GroupProps>;\n\nconst varsResolver = createVarsResolver<GroupFactory>(\n  (_, { grow, preventGrowOverflow, gap, align, justify, wrap }, { childWidth }) => ({\n    root: {\n      '--group-child-width': grow && preventGrowOverflow ? childWidth : undefined,\n      '--group-gap': getSpacing(gap),\n      '--group-align': align,\n      '--group-justify': justify,\n      '--group-wrap': wrap,\n    },\n  })\n);\n\nexport const Group = factory<GroupFactory>((_props) => {\n  const props = useProps('Group', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    children,\n    gap,\n    align,\n    justify,\n    wrap,\n    grow,\n    preventGrowOverflow,\n    vars,\n    variant,\n    __size,\n    mod,\n    attributes,\n    ...others\n  } = props;\n\n  const filteredChildren = filterFalsyChildren(children);\n  const childrenCount = filteredChildren.length;\n  const resolvedGap = getSpacing(gap ?? 'md');\n  const childWidth = `calc(${\n    100 / childrenCount\n  }% - (${resolvedGap} - ${resolvedGap} / ${childrenCount}))`;\n\n  const stylesCtx: GroupStylesCtx = { childWidth };\n\n  const getStyles = useStyles<GroupFactory>({\n    name: 'Group',\n    props,\n    stylesCtx,\n    className,\n    style,\n    classes,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  return (\n    <Box {...getStyles('root')} variant={variant} mod={[{ grow }, mod]} size={__size} {...others}>\n      {filteredChildren}\n    </Box>\n  );\n});\n\nGroup.classes = classes;\nGroup.varsResolver = varsResolver;\nGroup.displayName = '@mantine/core/Group';\n\nexport namespace Group {\n  export type Props = GroupProps;\n  export type StylesNames = GroupStylesNames;\n  export type CssVariables = GroupCssVariables;\n  export type StylesCtx = GroupStylesCtx;\n  export type Factory = GroupFactory;\n}\n"],"mappings":";;;;;;;;;;;AA4DA,MAAM,eAAe;CACnB,qBAAqB;CACrB,KAAK;CACL,OAAO;CACP,SAAS;CACT,MAAM;AACR;AAEA,MAAM,eAAe,oBAClB,GAAG,EAAE,MAAM,qBAAqB,KAAK,OAAO,SAAS,QAAQ,EAAE,kBAAkB,EAChF,MAAM;CACJ,uBAAuB,QAAQ,sBAAsB,aAAa,KAAA;CAClE,eAAe,WAAW,GAAG;CAC7B,iBAAiB;CACjB,mBAAmB;CACnB,gBAAgB;AAClB,EACF,EACF;AAEA,MAAa,QAAQ,SAAuB,WAAW;CACrD,MAAM,QAAQ,SAAS,SAAS,cAAc,MAAM;CACpD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,UACA,KACA,OACA,SACA,MACA,MACA,qBACA,MACA,SACA,QACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,mBAAmB,oBAAoB,QAAQ;CACrD,MAAM,gBAAgB,iBAAiB;CACvC,MAAM,cAAc,WAAW,OAAO,IAAI;CAsB1C,OACE,oBAAC,KAAD;EAAK,GAhBW,UAAwB;GACxC,MAAM;GACN;GACA,WAAA,EALkC,YAAA,QAHlC,MAAM,cACP,OAAO,YAAY,KAAK,YAAY,KAAK,cAAc,IAO9C;GACR;GACA;GACA,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,CAGmB,EAAE,MAAM;EAAY;EAAS,KAAK,CAAC,EAAE,KAAK,GAAG,GAAG;EAAG,MAAM;EAAQ,GAAI;YACnF;CACE,CAAA;AAET,CAAC;AAED,MAAM,UAAUA;AAChB,MAAM,eAAe;AACrB,MAAM,cAAc"}
+{"version":3,"file":"Group.mjs","names":["classes"],"sources":["../../../src/components/Group/Group.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 { filterFalsyChildren } from './filter-falsy-children/filter-falsy-children';\nimport classes from './Group.module.css';\n\nexport type GroupStylesNames = 'root';\nexport type GroupCssVariables = {\n  root:\n    | '--group-gap'\n    | '--group-align'\n    | '--group-justify'\n    | '--group-wrap'\n    | '--group-child-width';\n};\n\nexport interface GroupStylesCtx {\n  childWidth: string;\n}\n\nexport interface GroupProps extends BoxProps, StylesApiProps<GroupFactory>, ElementProps<'div'> {\n  __size?: any;\n\n  /** Controls `justify-content` CSS property @default 'flex-start' */\n  justify?: React.CSSProperties['justifyContent'];\n\n  /** Controls `align-items` CSS property @default 'center' */\n  align?: React.CSSProperties['alignItems'];\n\n  /** Controls `flex-wrap` CSS property @default 'wrap' */\n  wrap?: React.CSSProperties['flexWrap'];\n\n  /** Key of `theme.spacing` or any valid CSS value for `gap`, numbers are converted to rem @default 'md' */\n  gap?: MantineSpacing;\n\n  /** Determines whether each child element should have `flex-grow: 1` style @default false */\n  grow?: boolean;\n\n  /** Determines whether children should take only dedicated amount of space (`max-width` style is set based on the number of children) @default true */\n  preventGrowOverflow?: boolean;\n}\n\nexport type GroupFactory = Factory<{\n  props: GroupProps;\n  ref: HTMLDivElement;\n  stylesNames: GroupStylesNames;\n  vars: GroupCssVariables;\n  ctx: GroupStylesCtx;\n}>;\n\nconst defaultProps = {\n  preventGrowOverflow: true,\n  gap: 'md',\n  align: 'center',\n  justify: 'flex-start',\n  wrap: 'wrap',\n} satisfies Partial<GroupProps>;\n\nconst varsResolver = createVarsResolver<GroupFactory>(\n  (_, { grow, preventGrowOverflow, gap, align, justify, wrap }, { childWidth }) => ({\n    root: {\n      '--group-child-width': grow && preventGrowOverflow ? childWidth : undefined,\n      '--group-gap': getSpacing(gap),\n      '--group-align': align,\n      '--group-justify': justify,\n      '--group-wrap': wrap,\n    },\n  })\n);\n\nexport const Group = factory<GroupFactory>((_props) => {\n  const props = useProps('Group', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    children,\n    gap,\n    align,\n    justify,\n    wrap,\n    grow,\n    preventGrowOverflow,\n    vars,\n    variant,\n    __size,\n    mod,\n    attributes,\n    ...others\n  } = props;\n\n  const filteredChildren = filterFalsyChildren(children);\n  const childrenCount = filteredChildren.length;\n  const resolvedGap = getSpacing(gap ?? 'md');\n  const childWidth = `calc(${\n    100 / childrenCount\n  }% - (${resolvedGap} - ${resolvedGap} / ${childrenCount}))`;\n\n  const stylesCtx: GroupStylesCtx = { childWidth };\n\n  const getStyles = useStyles<GroupFactory>({\n    name: 'Group',\n    props,\n    stylesCtx,\n    className,\n    style,\n    classes,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  return (\n    <Box {...getStyles('root')} variant={variant} mod={[{ grow }, mod]} size={__size} {...others}>\n      {filteredChildren}\n    </Box>\n  );\n});\n\nGroup.classes = classes;\nGroup.varsResolver = varsResolver;\nGroup.displayName = '@mantine/core/Group';\n\nexport namespace Group {\n  export type Props = GroupProps;\n  export type StylesNames = GroupStylesNames;\n  export type CssVariables = GroupCssVariables;\n  export type StylesCtx = GroupStylesCtx;\n  export type Factory = GroupFactory;\n}\n"],"mappings":";;;;;;;;;;;AA4DA,MAAM,eAAe;CACnB,qBAAqB;CACrB,KAAK;CACL,OAAO;CACP,SAAS;CACT,MAAM;AACR;AAEA,MAAM,eAAe,oBAClB,GAAG,EAAE,MAAM,qBAAqB,KAAK,OAAO,SAAS,QAAQ,EAAE,kBAAkB,EAChF,MAAM;CACJ,uBAAuB,QAAQ,sBAAsB,aAAa,KAAA;CAClE,eAAe,WAAW,GAAG;CAC7B,iBAAiB;CACjB,mBAAmB;CACnB,gBAAgB;AAClB,EACF,EACF;AAEA,MAAa,QAAQ,SAAuB,WAAW;CACrD,MAAM,QAAQ,SAAS,SAAS,cAAc,MAAM;CACpD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,UACA,KACA,OACA,SACA,MACA,MACA,qBACA,MACA,SACA,QACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,mBAAmB,oBAAoB,QAAQ;CACrD,MAAM,gBAAgB,iBAAiB;CACvC,MAAM,cAAc,WAAW,OAAO,IAAI;CAsB1C,OACE,oBAAC,KAAD;EAAK,GAhBW,UAAwB;GACxC,MAAM;GACN;GACA,WAAA,EALkC,YAAA,QAHlC,MAAM,cACP,OAAO,YAAY,KAAK,YAAY,KAAK,cAAc,IAO9C;GACR;GACA;GACA,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,CAGmB,CAAC,CAAC,MAAM;EAAY;EAAS,KAAK,CAAC,EAAE,KAAK,GAAG,GAAG;EAAG,MAAM;EAAQ,GAAI;YACnF;CACE,CAAA;AAET,CAAC;AAED,MAAM,UAAUA;AAChB,MAAM,eAAe;AACrB,MAAM,cAAc"}

package/esm/components/Group/filter-falsy-children/filter-falsy-children.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"filter-falsy-children.mjs","names":[],"sources":["../../../../src/components/Group/filter-falsy-children/filter-falsy-children.ts"],"sourcesContent":["import { Children, ReactElement, ReactNode } from 'react';\n\nexport function filterFalsyChildren(children: ReactNode) {\n  return (Children.toArray(children) as ReactElement[]).filter(Boolean);\n}\n"],"mappings":";;;AAEA,SAAgB,oBAAoB,UAAqB;CACvD,OAAQ,SAAS,QAAQ,QAAQ,EAAqB,OAAO,OAAO;AACtE"}
+{"version":3,"file":"filter-falsy-children.mjs","names":[],"sources":["../../../../src/components/Group/filter-falsy-children/filter-falsy-children.ts"],"sourcesContent":["import { Children, ReactElement, ReactNode } from 'react';\n\nexport function filterFalsyChildren(children: ReactNode) {\n  return (Children.toArray(children) as ReactElement[]).filter(Boolean);\n}\n"],"mappings":";;;AAEA,SAAgB,oBAAoB,UAAqB;CACvD,OAAQ,SAAS,QAAQ,QAAQ,CAAC,CAAoB,OAAO,OAAO;AACtE"}

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

@@ -1 +1 @@
-{"version":3,"file":"highlighter.mjs","names":[],"sources":["../../../../src/components/Highlight/highlighter/highlighter.ts"],"sourcesContent":["function escapeRegex(value: string) {\n  return value.replace(/[\\\\^$.*+?()[\\]{}|]/g, '\\\\$&');\n}\n\nexport function foldAccents(text: string): string {\n  return text.normalize('NFD').replace(/\\p{M}/gu, '');\n}\n\nfunction foldAccentsWithMap(text: string): { folded: string; map: number[] } {\n  let folded = '';\n  const map: number[] = [];\n  let i = 0;\n\n  while (i < text.length) {\n    const cp = text.codePointAt(i)!;\n    const cpStr = String.fromCodePoint(cp);\n    const foldedCp = foldAccents(cpStr);\n    for (let j = 0; j < foldedCp.length; j += 1) {\n      map.push(i);\n    }\n    folded += foldedCp;\n    i += cpStr.length;\n  }\n\n  map.push(text.length);\n  return { folded, map };\n}\n\nfunction getAccentInsensitiveChunks(value: string, re: RegExp): HighlightChunk[] {\n  const { folded, map } = foldAccentsWithMap(value);\n  const chunks: HighlightChunk[] = [];\n  let lastOrigEnd = 0;\n  let match: RegExpExecArray | null;\n\n  while ((match = re.exec(folded)) !== null) {\n    const foldedStart = match.index;\n    const foldedEnd = foldedStart + match[0].length;\n    const origStart = map[foldedStart];\n    const origEnd = map[foldedEnd];\n\n    if (origStart > lastOrigEnd) {\n      chunks.push({ chunk: value.slice(lastOrigEnd, origStart), highlighted: false });\n    }\n    chunks.push({ chunk: value.slice(origStart, origEnd), highlighted: true });\n    lastOrigEnd = origEnd;\n\n    if (match[0].length === 0) {\n      re.lastIndex += 1;\n    }\n  }\n\n  if (lastOrigEnd < value.length) {\n    chunks.push({ chunk: value.slice(lastOrigEnd), highlighted: false });\n  }\n\n  return chunks.filter(({ chunk }) => chunk);\n}\n\nexport interface HighlightChunk {\n  chunk: string;\n  highlighted: boolean;\n  color?: string;\n}\n\nexport interface HighlighterOptions {\n  wholeWord?: boolean;\n  caseInsensitive?: boolean;\n  accentInsensitive?: boolean;\n}\n\nexport function highlighter(\n  value: string,\n  _highlight: string | string[],\n  options: HighlighterOptions = {}\n): HighlightChunk[] {\n  if (_highlight == null) {\n    return [{ chunk: value, highlighted: false }];\n  }\n\n  const { wholeWord = false, caseInsensitive = true, accentInsensitive = true } = options;\n\n  const prepareTerm = (term: string) =>\n    accentInsensitive ? foldAccents(escapeRegex(term)) : escapeRegex(term);\n\n  const highlight = Array.isArray(_highlight)\n    ? _highlight.map(prepareTerm)\n    : prepareTerm(_highlight);\n\n  const shouldHighlight = Array.isArray(highlight)\n    ? highlight.filter((part) => part.trim().length > 0).length > 0\n    : highlight.trim() !== '';\n\n  if (!shouldHighlight) {\n    return [{ chunk: value, highlighted: false }];\n  }\n\n  const matcher =\n    typeof highlight === 'string'\n      ? highlight.trim()\n      : highlight\n          .filter((part) => part.trim().length !== 0)\n          .map((part) => part.trim())\n          .sort((a, b) => b.length - a.length)\n          .join('|');\n\n  const pattern = wholeWord\n    ? `(?<![\\\\p{L}\\\\p{N}_])(${matcher})(?![\\\\p{L}\\\\p{N}_])`\n    : `(${matcher})`;\n  const flags = ['g', caseInsensitive ? 'i' : '', wholeWord ? 'u' : ''].join('');\n  const re = new RegExp(pattern, flags);\n\n  if (accentInsensitive) {\n    return getAccentInsensitiveChunks(value, re);\n  }\n\n  return value\n    .split(re)\n    .map((part, index) => ({ chunk: part, highlighted: index % 2 === 1 }))\n    .filter(({ chunk }) => chunk);\n}\n"],"mappings":";;AAAA,SAAS,YAAY,OAAe;CAClC,OAAO,MAAM,QAAQ,uBAAuB,MAAM;AACpD;AAEA,SAAgB,YAAY,MAAsB;CAChD,OAAO,KAAK,UAAU,KAAK,EAAE,QAAQ,WAAW,EAAE;AACpD;AAEA,SAAS,mBAAmB,MAAiD;CAC3E,IAAI,SAAS;CACb,MAAM,MAAgB,CAAC;CACvB,IAAI,IAAI;CAER,OAAO,IAAI,KAAK,QAAQ;EACtB,MAAM,KAAK,KAAK,YAAY,CAAC;EAC7B,MAAM,QAAQ,OAAO,cAAc,EAAE;EACrC,MAAM,WAAW,YAAY,KAAK;EAClC,KAAK,IAAI,IAAI,GAAG,IAAI,SAAS,QAAQ,KAAK,GACxC,IAAI,KAAK,CAAC;EAEZ,UAAU;EACV,KAAK,MAAM;CACb;CAEA,IAAI,KAAK,KAAK,MAAM;CACpB,OAAO;EAAE;EAAQ;CAAI;AACvB;AAEA,SAAS,2BAA2B,OAAe,IAA8B;CAC/E,MAAM,EAAE,QAAQ,QAAQ,mBAAmB,KAAK;CAChD,MAAM,SAA2B,CAAC;CAClC,IAAI,cAAc;CAClB,IAAI;CAEJ,QAAQ,QAAQ,GAAG,KAAK,MAAM,OAAO,MAAM;EACzC,MAAM,cAAc,MAAM;EAC1B,MAAM,YAAY,cAAc,MAAM,GAAG;EACzC,MAAM,YAAY,IAAI;EACtB,MAAM,UAAU,IAAI;EAEpB,IAAI,YAAY,aACd,OAAO,KAAK;GAAE,OAAO,MAAM,MAAM,aAAa,SAAS;GAAG,aAAa;EAAM,CAAC;EAEhF,OAAO,KAAK;GAAE,OAAO,MAAM,MAAM,WAAW,OAAO;GAAG,aAAa;EAAK,CAAC;EACzE,cAAc;EAEd,IAAI,MAAM,GAAG,WAAW,GACtB,GAAG,aAAa;CAEpB;CAEA,IAAI,cAAc,MAAM,QACtB,OAAO,KAAK;EAAE,OAAO,MAAM,MAAM,WAAW;EAAG,aAAa;CAAM,CAAC;CAGrE,OAAO,OAAO,QAAQ,EAAE,YAAY,KAAK;AAC3C;AAcA,SAAgB,YACd,OACA,YACA,UAA8B,CAAC,GACb;CAClB,IAAI,cAAc,MAChB,OAAO,CAAC;EAAE,OAAO;EAAO,aAAa;CAAM,CAAC;CAG9C,MAAM,EAAE,YAAY,OAAO,kBAAkB,MAAM,oBAAoB,SAAS;CAEhF,MAAM,eAAe,SACnB,oBAAoB,YAAY,YAAY,IAAI,CAAC,IAAI,YAAY,IAAI;CAEvE,MAAM,YAAY,MAAM,QAAQ,UAAU,IACtC,WAAW,IAAI,WAAW,IAC1B,YAAY,UAAU;CAM1B,IAAI,EAJoB,MAAM,QAAQ,SAAS,IAC3C,UAAU,QAAQ,SAAS,KAAK,KAAK,EAAE,SAAS,CAAC,EAAE,SAAS,IAC5D,UAAU,KAAK,MAAM,KAGvB,OAAO,CAAC;EAAE,OAAO;EAAO,aAAa;CAAM,CAAC;CAG9C,MAAM,UACJ,OAAO,cAAc,WACjB,UAAU,KAAK,IACf,UACG,QAAQ,SAAS,KAAK,KAAK,EAAE,WAAW,CAAC,EACzC,KAAK,SAAS,KAAK,KAAK,CAAC,EACzB,MAAM,GAAG,MAAM,EAAE,SAAS,EAAE,MAAM,EAClC,KAAK,GAAG;CAEjB,MAAM,UAAU,YACZ,wBAAwB,QAAQ,wBAChC,IAAI,QAAQ;CAChB,MAAM,QAAQ;EAAC;EAAK,kBAAkB,MAAM;EAAI,YAAY,MAAM;CAAE,EAAE,KAAK,EAAE;CAC7E,MAAM,KAAK,IAAI,OAAO,SAAS,KAAK;CAEpC,IAAI,mBACF,OAAO,2BAA2B,OAAO,EAAE;CAG7C,OAAO,MACJ,MAAM,EAAE,EACR,KAAK,MAAM,WAAW;EAAE,OAAO;EAAM,aAAa,QAAQ,MAAM;CAAE,EAAE,EACpE,QAAQ,EAAE,YAAY,KAAK;AAChC"}
+{"version":3,"file":"highlighter.mjs","names":[],"sources":["../../../../src/components/Highlight/highlighter/highlighter.ts"],"sourcesContent":["function escapeRegex(value: string) {\n  return value.replace(/[\\\\^$.*+?()[\\]{}|]/g, '\\\\$&');\n}\n\nexport function foldAccents(text: string): string {\n  return text.normalize('NFD').replace(/\\p{M}/gu, '');\n}\n\nfunction foldAccentsWithMap(text: string): { folded: string; map: number[] } {\n  let folded = '';\n  const map: number[] = [];\n  let i = 0;\n\n  while (i < text.length) {\n    const cp = text.codePointAt(i)!;\n    const cpStr = String.fromCodePoint(cp);\n    const foldedCp = foldAccents(cpStr);\n    for (let j = 0; j < foldedCp.length; j += 1) {\n      map.push(i);\n    }\n    folded += foldedCp;\n    i += cpStr.length;\n  }\n\n  map.push(text.length);\n  return { folded, map };\n}\n\nfunction getAccentInsensitiveChunks(value: string, re: RegExp): HighlightChunk[] {\n  const { folded, map } = foldAccentsWithMap(value);\n  const chunks: HighlightChunk[] = [];\n  let lastOrigEnd = 0;\n  let match: RegExpExecArray | null;\n\n  while ((match = re.exec(folded)) !== null) {\n    const foldedStart = match.index;\n    const foldedEnd = foldedStart + match[0].length;\n    const origStart = map[foldedStart];\n    const origEnd = map[foldedEnd];\n\n    if (origStart > lastOrigEnd) {\n      chunks.push({ chunk: value.slice(lastOrigEnd, origStart), highlighted: false });\n    }\n    chunks.push({ chunk: value.slice(origStart, origEnd), highlighted: true });\n    lastOrigEnd = origEnd;\n\n    if (match[0].length === 0) {\n      re.lastIndex += 1;\n    }\n  }\n\n  if (lastOrigEnd < value.length) {\n    chunks.push({ chunk: value.slice(lastOrigEnd), highlighted: false });\n  }\n\n  return chunks.filter(({ chunk }) => chunk);\n}\n\nexport interface HighlightChunk {\n  chunk: string;\n  highlighted: boolean;\n  color?: string;\n}\n\nexport interface HighlighterOptions {\n  wholeWord?: boolean;\n  caseInsensitive?: boolean;\n  accentInsensitive?: boolean;\n}\n\nexport function highlighter(\n  value: string,\n  _highlight: string | string[],\n  options: HighlighterOptions = {}\n): HighlightChunk[] {\n  if (_highlight == null) {\n    return [{ chunk: value, highlighted: false }];\n  }\n\n  const { wholeWord = false, caseInsensitive = true, accentInsensitive = true } = options;\n\n  const prepareTerm = (term: string) =>\n    accentInsensitive ? foldAccents(escapeRegex(term)) : escapeRegex(term);\n\n  const highlight = Array.isArray(_highlight)\n    ? _highlight.map(prepareTerm)\n    : prepareTerm(_highlight);\n\n  const shouldHighlight = Array.isArray(highlight)\n    ? highlight.filter((part) => part.trim().length > 0).length > 0\n    : highlight.trim() !== '';\n\n  if (!shouldHighlight) {\n    return [{ chunk: value, highlighted: false }];\n  }\n\n  const matcher =\n    typeof highlight === 'string'\n      ? highlight.trim()\n      : highlight\n          .filter((part) => part.trim().length !== 0)\n          .map((part) => part.trim())\n          .sort((a, b) => b.length - a.length)\n          .join('|');\n\n  const pattern = wholeWord\n    ? `(?<![\\\\p{L}\\\\p{N}_])(${matcher})(?![\\\\p{L}\\\\p{N}_])`\n    : `(${matcher})`;\n  const flags = ['g', caseInsensitive ? 'i' : '', wholeWord ? 'u' : ''].join('');\n  const re = new RegExp(pattern, flags);\n\n  if (accentInsensitive) {\n    return getAccentInsensitiveChunks(value, re);\n  }\n\n  return value\n    .split(re)\n    .map((part, index) => ({ chunk: part, highlighted: index % 2 === 1 }))\n    .filter(({ chunk }) => chunk);\n}\n"],"mappings":"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"}

package/esm/components/HoverCard/HoverCardDropdown/HoverCardDropdown.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"HoverCardDropdown.mjs","names":[],"sources":["../../../../src/components/HoverCard/HoverCardDropdown/HoverCardDropdown.tsx"],"sourcesContent":["import { use } from 'react';\nimport { createEventHandler, useProps } from '../../../core';\nimport { Popover, PopoverDropdownProps } from '../../Popover';\nimport { useHoverCardContext } from '../HoverCard.context';\nimport { HoverCardGroupContext } from '../HoverCardGroup/HoverCardGroup';\n\nexport interface HoverCardDropdownProps extends PopoverDropdownProps {\n  /** Dropdown content */\n  children?: React.ReactNode;\n}\n\nexport function HoverCardDropdown(props: HoverCardDropdownProps) {\n  const { children, onMouseEnter, onMouseLeave, ...others } = useProps(\n    'HoverCardDropdown',\n    null,\n    props\n  );\n\n  const ctx = useHoverCardContext();\n  const groupCtx = use(HoverCardGroupContext);\n\n  if (groupCtx.withinGroup && ctx.getFloatingProps && ctx.floating) {\n    const floatingProps = ctx.getFloatingProps();\n\n    return (\n      <Popover.Dropdown\n        ref={ctx.floating}\n        {...floatingProps}\n        onMouseEnter={createEventHandler<any>(onMouseEnter, floatingProps.onMouseEnter)}\n        onMouseLeave={createEventHandler<any>(onMouseLeave, floatingProps.onMouseLeave)}\n        {...others}\n      >\n        {children}\n      </Popover.Dropdown>\n    );\n  }\n\n  const handleMouseEnter = createEventHandler<any>(onMouseEnter, ctx.openDropdown);\n  const handleMouseLeave = createEventHandler<any>(onMouseLeave!, ctx.closeDropdown);\n\n  return (\n    <Popover.Dropdown onMouseEnter={handleMouseEnter} onMouseLeave={handleMouseLeave} {...others}>\n      {children}\n    </Popover.Dropdown>\n  );\n}\n\nHoverCardDropdown.displayName = '@mantine/core/HoverCardDropdown';\n"],"mappings":";;;;;;;;;AAWA,SAAgB,kBAAkB,OAA+B;CAC/D,MAAM,EAAE,UAAU,cAAc,cAAc,GAAG,WAAW,SAC1D,qBACA,MACA,KACF;CAEA,MAAM,MAAM,oBAAoB;CAGhC,IAFiB,IAAI,qBAEV,EAAE,eAAe,IAAI,oBAAoB,IAAI,UAAU;EAChE,MAAM,gBAAgB,IAAI,iBAAiB;EAE3C,OACE,oBAAC,QAAQ,UAAT;GACE,KAAK,IAAI;GACT,GAAI;GACJ,cAAc,mBAAwB,cAAc,cAAc,YAAY;GAC9E,cAAc,mBAAwB,cAAc,cAAc,YAAY;GAC9E,GAAI;GAEH;EACe,CAAA;CAEtB;CAEA,MAAM,mBAAmB,mBAAwB,cAAc,IAAI,YAAY;CAC/E,MAAM,mBAAmB,mBAAwB,cAAe,IAAI,aAAa;CAEjF,OACE,oBAAC,QAAQ,UAAT;EAAkB,cAAc;EAAkB,cAAc;EAAkB,GAAI;EACnF;CACe,CAAA;AAEtB;AAEA,kBAAkB,cAAc"}
+{"version":3,"file":"HoverCardDropdown.mjs","names":[],"sources":["../../../../src/components/HoverCard/HoverCardDropdown/HoverCardDropdown.tsx"],"sourcesContent":["import { use } from 'react';\nimport { createEventHandler, useProps } from '../../../core';\nimport { Popover, PopoverDropdownProps } from '../../Popover';\nimport { useHoverCardContext } from '../HoverCard.context';\nimport { HoverCardGroupContext } from '../HoverCardGroup/HoverCardGroup';\n\nexport interface HoverCardDropdownProps extends PopoverDropdownProps {\n  /** Dropdown content */\n  children?: React.ReactNode;\n}\n\nexport function HoverCardDropdown(props: HoverCardDropdownProps) {\n  const { children, onMouseEnter, onMouseLeave, ...others } = useProps(\n    'HoverCardDropdown',\n    null,\n    props\n  );\n\n  const ctx = useHoverCardContext();\n  const groupCtx = use(HoverCardGroupContext);\n\n  if (groupCtx.withinGroup && ctx.getFloatingProps && ctx.floating) {\n    const floatingProps = ctx.getFloatingProps();\n\n    return (\n      <Popover.Dropdown\n        ref={ctx.floating}\n        {...floatingProps}\n        onMouseEnter={createEventHandler<any>(onMouseEnter, floatingProps.onMouseEnter)}\n        onMouseLeave={createEventHandler<any>(onMouseLeave, floatingProps.onMouseLeave)}\n        {...others}\n      >\n        {children}\n      </Popover.Dropdown>\n    );\n  }\n\n  const handleMouseEnter = createEventHandler<any>(onMouseEnter, ctx.openDropdown);\n  const handleMouseLeave = createEventHandler<any>(onMouseLeave!, ctx.closeDropdown);\n\n  return (\n    <Popover.Dropdown onMouseEnter={handleMouseEnter} onMouseLeave={handleMouseLeave} {...others}>\n      {children}\n    </Popover.Dropdown>\n  );\n}\n\nHoverCardDropdown.displayName = '@mantine/core/HoverCardDropdown';\n"],"mappings":";;;;;;;;;AAWA,SAAgB,kBAAkB,OAA+B;CAC/D,MAAM,EAAE,UAAU,cAAc,cAAc,GAAG,WAAW,SAC1D,qBACA,MACA,KACF;CAEA,MAAM,MAAM,oBAAoB;CAGhC,IAFiB,IAAI,qBAEV,CAAC,CAAC,eAAe,IAAI,oBAAoB,IAAI,UAAU;EAChE,MAAM,gBAAgB,IAAI,iBAAiB;EAE3C,OACE,oBAAC,QAAQ,UAAT;GACE,KAAK,IAAI;GACT,GAAI;GACJ,cAAc,mBAAwB,cAAc,cAAc,YAAY;GAC9E,cAAc,mBAAwB,cAAc,cAAc,YAAY;GAC9E,GAAI;GAEH;EACe,CAAA;CAEtB;CAEA,MAAM,mBAAmB,mBAAwB,cAAc,IAAI,YAAY;CAC/E,MAAM,mBAAmB,mBAAwB,cAAe,IAAI,aAAa;CAEjF,OACE,oBAAC,QAAQ,UAAT;EAAkB,cAAc;EAAkB,cAAc;EAAkB,GAAI;EACnF;CACe,CAAA;AAEtB;AAEA,kBAAkB,cAAc"}

package/esm/components/HoverCard/use-hover-card.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-hover-card.mjs","names":["useId"],"sources":["../../../src/components/HoverCard/use-hover-card.ts"],"sourcesContent":["import { use, useCallback, useEffect, useRef, useState } from 'react';\nimport {\n  useDelayGroup,\n  useDismiss,\n  useFloating,\n  useHover,\n  useInteractions,\n  useRole,\n} from '@floating-ui/react';\nimport { useId } from '@mantine/hooks';\nimport { HoverCardGroupContext } from './HoverCardGroup/HoverCardGroup';\n\ninterface UseHoverCard {\n  openDelay?: number;\n  closeDelay?: number;\n  opened?: boolean;\n  defaultOpened?: boolean;\n  onOpen?: () => void;\n  onClose?: () => void;\n}\n\nexport function useHoverCard(settings: UseHoverCard) {\n  const [uncontrolledOpened, setUncontrolledOpened] = useState(settings.defaultOpened);\n  const controlled = typeof settings.opened === 'boolean';\n  const opened = controlled ? settings.opened : uncontrolledOpened;\n  const withinGroup = use(HoverCardGroupContext).withinGroup;\n  const uid = useId();\n\n  const openTimeout = useRef(-1);\n  const closeTimeout = useRef(-1);\n  const targetRef = useRef<HTMLElement | null>(null);\n\n  const assignTarget = useCallback((node: HTMLElement | null) => {\n    targetRef.current = node;\n  }, []);\n\n  const clearTimeouts = useCallback(() => {\n    window.clearTimeout(openTimeout.current);\n    window.clearTimeout(closeTimeout.current);\n  }, []);\n\n  const onChange = useCallback(\n    (_opened: boolean) => {\n      setUncontrolledOpened(_opened);\n\n      if (_opened) {\n        setCurrentId(uid);\n        settings.onOpen?.();\n      } else {\n        settings.onClose?.();\n      }\n    },\n    [uid, settings.onOpen, settings.onClose]\n  );\n\n  const { context, refs } = useFloating({\n    open: opened,\n    onOpenChange: onChange,\n  });\n\n  const { delay: groupDelay, setCurrentId } = useDelayGroup(context, { id: uid });\n\n  const { getReferenceProps, getFloatingProps } = useInteractions([\n    useHover(context, {\n      enabled: true,\n      delay: withinGroup ? groupDelay : { open: settings.openDelay, close: settings.closeDelay },\n    }),\n    useRole(context, { role: 'dialog' }),\n    useDismiss(context, { enabled: withinGroup }),\n  ]);\n\n  const openDropdown = useCallback(() => {\n    if (withinGroup) {\n      return; // Group mode handles this automatically\n    }\n\n    clearTimeouts();\n    if (settings.openDelay === 0 || settings.openDelay === undefined) {\n      onChange(true);\n    } else {\n      openTimeout.current = window.setTimeout(() => onChange(true), settings.openDelay);\n    }\n  }, [withinGroup, clearTimeouts, settings.openDelay, onChange]);\n\n  const closeDropdown = useCallback(() => {\n    if (withinGroup) {\n      return; // Group mode handles this automatically\n    }\n\n    clearTimeouts();\n    if (settings.closeDelay === 0 || settings.closeDelay === undefined) {\n      onChange(false);\n    } else {\n      closeTimeout.current = window.setTimeout(() => onChange(false), settings.closeDelay);\n    }\n  }, [withinGroup, clearTimeouts, settings.closeDelay, onChange]);\n\n  const onChangeRef = useRef(onChange);\n  onChangeRef.current = onChange;\n\n  useEffect(() => () => clearTimeouts(), [clearTimeouts]);\n\n  useEffect(() => {\n    if (!opened || withinGroup || typeof IntersectionObserver === 'undefined') {\n      return undefined;\n    }\n\n    const node = targetRef.current;\n    if (!node) {\n      return undefined;\n    }\n\n    const observer = new IntersectionObserver(() => {\n      if (!node.isConnected || node.getClientRects().length === 0) {\n        clearTimeouts();\n        onChangeRef.current(false);\n      }\n    });\n\n    observer.observe(node);\n    return () => observer.disconnect();\n  }, [opened, withinGroup, clearTimeouts]);\n\n  return {\n    opened,\n    reference: refs.setReference,\n    floating: refs.setFloating,\n    assignTarget,\n    getReferenceProps,\n    getFloatingProps,\n    openDropdown,\n    closeDropdown,\n  };\n}\n"],"mappings":";;;;;;AAqBA,SAAgB,aAAa,UAAwB;CACnD,MAAM,CAAC,oBAAoB,yBAAyB,SAAS,SAAS,aAAa;CAEnF,MAAM,SADa,OAAO,SAAS,WAAW,YAClB,SAAS,SAAS;CAC9C,MAAM,cAAc,IAAI,qBAAqB,EAAE;CAC/C,MAAM,MAAMA,QAAM;CAElB,MAAM,cAAc,OAAO,EAAE;CAC7B,MAAM,eAAe,OAAO,EAAE;CAC9B,MAAM,YAAY,OAA2B,IAAI;CAEjD,MAAM,eAAe,aAAa,SAA6B;EAC7D,UAAU,UAAU;CACtB,GAAG,CAAC,CAAC;CAEL,MAAM,gBAAgB,kBAAkB;EACtC,OAAO,aAAa,YAAY,OAAO;EACvC,OAAO,aAAa,aAAa,OAAO;CAC1C,GAAG,CAAC,CAAC;CAEL,MAAM,WAAW,aACd,YAAqB;EACpB,sBAAsB,OAAO;EAE7B,IAAI,SAAS;GACX,aAAa,GAAG;GAChB,SAAS,SAAS;EACpB,OACE,SAAS,UAAU;CAEvB,GACA;EAAC;EAAK,SAAS;EAAQ,SAAS;CAAO,CACzC;CAEA,MAAM,EAAE,SAAS,SAAS,YAAY;EACpC,MAAM;EACN,cAAc;CAChB,CAAC;CAED,MAAM,EAAE,OAAO,YAAY,iBAAiB,cAAc,SAAS,EAAE,IAAI,IAAI,CAAC;CAE9E,MAAM,EAAE,mBAAmB,qBAAqB,gBAAgB;EAC9D,SAAS,SAAS;GAChB,SAAS;GACT,OAAO,cAAc,aAAa;IAAE,MAAM,SAAS;IAAW,OAAO,SAAS;GAAW;EAC3F,CAAC;EACD,QAAQ,SAAS,EAAE,MAAM,SAAS,CAAC;EACnC,WAAW,SAAS,EAAE,SAAS,YAAY,CAAC;CAC9C,CAAC;CAED,MAAM,eAAe,kBAAkB;EACrC,IAAI,aACF;EAGF,cAAc;EACd,IAAI,SAAS,cAAc,KAAK,SAAS,cAAc,KAAA,GACrD,SAAS,IAAI;OAEb,YAAY,UAAU,OAAO,iBAAiB,SAAS,IAAI,GAAG,SAAS,SAAS;CAEpF,GAAG;EAAC;EAAa;EAAe,SAAS;EAAW;CAAQ,CAAC;CAE7D,MAAM,gBAAgB,kBAAkB;EACtC,IAAI,aACF;EAGF,cAAc;EACd,IAAI,SAAS,eAAe,KAAK,SAAS,eAAe,KAAA,GACvD,SAAS,KAAK;OAEd,aAAa,UAAU,OAAO,iBAAiB,SAAS,KAAK,GAAG,SAAS,UAAU;CAEvF,GAAG;EAAC;EAAa;EAAe,SAAS;EAAY;CAAQ,CAAC;CAE9D,MAAM,cAAc,OAAO,QAAQ;CACnC,YAAY,UAAU;CAEtB,sBAAsB,cAAc,GAAG,CAAC,aAAa,CAAC;CAEtD,gBAAgB;EACd,IAAI,CAAC,UAAU,eAAe,OAAO,yBAAyB,aAC5D;EAGF,MAAM,OAAO,UAAU;EACvB,IAAI,CAAC,MACH;EAGF,MAAM,WAAW,IAAI,2BAA2B;GAC9C,IAAI,CAAC,KAAK,eAAe,KAAK,eAAe,EAAE,WAAW,GAAG;IAC3D,cAAc;IACd,YAAY,QAAQ,KAAK;GAC3B;EACF,CAAC;EAED,SAAS,QAAQ,IAAI;EACrB,aAAa,SAAS,WAAW;CACnC,GAAG;EAAC;EAAQ;EAAa;CAAa,CAAC;CAEvC,OAAO;EACL;EACA,WAAW,KAAK;EAChB,UAAU,KAAK;EACf;EACA;EACA;EACA;EACA;CACF;AACF"}
+{"version":3,"file":"use-hover-card.mjs","names":["useId"],"sources":["../../../src/components/HoverCard/use-hover-card.ts"],"sourcesContent":["import { use, useCallback, useEffect, useRef, useState } from 'react';\nimport {\n  useDelayGroup,\n  useDismiss,\n  useFloating,\n  useHover,\n  useInteractions,\n  useRole,\n} from '@floating-ui/react';\nimport { useId } from '@mantine/hooks';\nimport { HoverCardGroupContext } from './HoverCardGroup/HoverCardGroup';\n\ninterface UseHoverCard {\n  openDelay?: number;\n  closeDelay?: number;\n  opened?: boolean;\n  defaultOpened?: boolean;\n  onOpen?: () => void;\n  onClose?: () => void;\n}\n\nexport function useHoverCard(settings: UseHoverCard) {\n  const [uncontrolledOpened, setUncontrolledOpened] = useState(settings.defaultOpened);\n  const controlled = typeof settings.opened === 'boolean';\n  const opened = controlled ? settings.opened : uncontrolledOpened;\n  const withinGroup = use(HoverCardGroupContext).withinGroup;\n  const uid = useId();\n\n  const openTimeout = useRef(-1);\n  const closeTimeout = useRef(-1);\n  const targetRef = useRef<HTMLElement | null>(null);\n\n  const assignTarget = useCallback((node: HTMLElement | null) => {\n    targetRef.current = node;\n  }, []);\n\n  const clearTimeouts = useCallback(() => {\n    window.clearTimeout(openTimeout.current);\n    window.clearTimeout(closeTimeout.current);\n  }, []);\n\n  const onChange = useCallback(\n    (_opened: boolean) => {\n      setUncontrolledOpened(_opened);\n\n      if (_opened) {\n        setCurrentId(uid);\n        settings.onOpen?.();\n      } else {\n        settings.onClose?.();\n      }\n    },\n    [uid, settings.onOpen, settings.onClose]\n  );\n\n  const { context, refs } = useFloating({\n    open: opened,\n    onOpenChange: onChange,\n  });\n\n  const { delay: groupDelay, setCurrentId } = useDelayGroup(context, { id: uid });\n\n  const { getReferenceProps, getFloatingProps } = useInteractions([\n    useHover(context, {\n      enabled: true,\n      delay: withinGroup ? groupDelay : { open: settings.openDelay, close: settings.closeDelay },\n    }),\n    useRole(context, { role: 'dialog' }),\n    useDismiss(context, { enabled: withinGroup }),\n  ]);\n\n  const openDropdown = useCallback(() => {\n    if (withinGroup) {\n      return; // Group mode handles this automatically\n    }\n\n    clearTimeouts();\n    if (settings.openDelay === 0 || settings.openDelay === undefined) {\n      onChange(true);\n    } else {\n      openTimeout.current = window.setTimeout(() => onChange(true), settings.openDelay);\n    }\n  }, [withinGroup, clearTimeouts, settings.openDelay, onChange]);\n\n  const closeDropdown = useCallback(() => {\n    if (withinGroup) {\n      return; // Group mode handles this automatically\n    }\n\n    clearTimeouts();\n    if (settings.closeDelay === 0 || settings.closeDelay === undefined) {\n      onChange(false);\n    } else {\n      closeTimeout.current = window.setTimeout(() => onChange(false), settings.closeDelay);\n    }\n  }, [withinGroup, clearTimeouts, settings.closeDelay, onChange]);\n\n  const onChangeRef = useRef(onChange);\n  onChangeRef.current = onChange;\n\n  useEffect(() => () => clearTimeouts(), [clearTimeouts]);\n\n  useEffect(() => {\n    if (!opened || withinGroup || typeof IntersectionObserver === 'undefined') {\n      return undefined;\n    }\n\n    const node = targetRef.current;\n    if (!node) {\n      return undefined;\n    }\n\n    const observer = new IntersectionObserver(() => {\n      if (!node.isConnected || node.getClientRects().length === 0) {\n        clearTimeouts();\n        onChangeRef.current(false);\n      }\n    });\n\n    observer.observe(node);\n    return () => observer.disconnect();\n  }, [opened, withinGroup, clearTimeouts]);\n\n  return {\n    opened,\n    reference: refs.setReference,\n    floating: refs.setFloating,\n    assignTarget,\n    getReferenceProps,\n    getFloatingProps,\n    openDropdown,\n    closeDropdown,\n  };\n}\n"],"mappings":";;;;;;AAqBA,SAAgB,aAAa,UAAwB;CACnD,MAAM,CAAC,oBAAoB,yBAAyB,SAAS,SAAS,aAAa;CAEnF,MAAM,SADa,OAAO,SAAS,WAAW,YAClB,SAAS,SAAS;CAC9C,MAAM,cAAc,IAAI,qBAAqB,CAAC,CAAC;CAC/C,MAAM,MAAMA,QAAM;CAElB,MAAM,cAAc,OAAO,EAAE;CAC7B,MAAM,eAAe,OAAO,EAAE;CAC9B,MAAM,YAAY,OAA2B,IAAI;CAEjD,MAAM,eAAe,aAAa,SAA6B;EAC7D,UAAU,UAAU;CACtB,GAAG,CAAC,CAAC;CAEL,MAAM,gBAAgB,kBAAkB;EACtC,OAAO,aAAa,YAAY,OAAO;EACvC,OAAO,aAAa,aAAa,OAAO;CAC1C,GAAG,CAAC,CAAC;CAEL,MAAM,WAAW,aACd,YAAqB;EACpB,sBAAsB,OAAO;EAE7B,IAAI,SAAS;GACX,aAAa,GAAG;GAChB,SAAS,SAAS;EACpB,OACE,SAAS,UAAU;CAEvB,GACA;EAAC;EAAK,SAAS;EAAQ,SAAS;CAAO,CACzC;CAEA,MAAM,EAAE,SAAS,SAAS,YAAY;EACpC,MAAM;EACN,cAAc;CAChB,CAAC;CAED,MAAM,EAAE,OAAO,YAAY,iBAAiB,cAAc,SAAS,EAAE,IAAI,IAAI,CAAC;CAE9E,MAAM,EAAE,mBAAmB,qBAAqB,gBAAgB;EAC9D,SAAS,SAAS;GAChB,SAAS;GACT,OAAO,cAAc,aAAa;IAAE,MAAM,SAAS;IAAW,OAAO,SAAS;GAAW;EAC3F,CAAC;EACD,QAAQ,SAAS,EAAE,MAAM,SAAS,CAAC;EACnC,WAAW,SAAS,EAAE,SAAS,YAAY,CAAC;CAC9C,CAAC;CAED,MAAM,eAAe,kBAAkB;EACrC,IAAI,aACF;EAGF,cAAc;EACd,IAAI,SAAS,cAAc,KAAK,SAAS,cAAc,KAAA,GACrD,SAAS,IAAI;OAEb,YAAY,UAAU,OAAO,iBAAiB,SAAS,IAAI,GAAG,SAAS,SAAS;CAEpF,GAAG;EAAC;EAAa;EAAe,SAAS;EAAW;CAAQ,CAAC;CAE7D,MAAM,gBAAgB,kBAAkB;EACtC,IAAI,aACF;EAGF,cAAc;EACd,IAAI,SAAS,eAAe,KAAK,SAAS,eAAe,KAAA,GACvD,SAAS,KAAK;OAEd,aAAa,UAAU,OAAO,iBAAiB,SAAS,KAAK,GAAG,SAAS,UAAU;CAEvF,GAAG;EAAC;EAAa;EAAe,SAAS;EAAY;CAAQ,CAAC;CAE9D,MAAM,cAAc,OAAO,QAAQ;CACnC,YAAY,UAAU;CAEtB,sBAAsB,cAAc,GAAG,CAAC,aAAa,CAAC;CAEtD,gBAAgB;EACd,IAAI,CAAC,UAAU,eAAe,OAAO,yBAAyB,aAC5D;EAGF,MAAM,OAAO,UAAU;EACvB,IAAI,CAAC,MACH;EAGF,MAAM,WAAW,IAAI,2BAA2B;GAC9C,IAAI,CAAC,KAAK,eAAe,KAAK,eAAe,CAAC,CAAC,WAAW,GAAG;IAC3D,cAAc;IACd,YAAY,QAAQ,KAAK;GAC3B;EACF,CAAC;EAED,SAAS,QAAQ,IAAI;EACrB,aAAa,SAAS,WAAW;CACnC,GAAG;EAAC;EAAQ;EAAa;CAAa,CAAC;CAEvC,OAAO;EACL;EACA,WAAW,KAAK;EAChB,UAAU,KAAK;EACf;EACA;EACA;EACA;EACA;CACF;AACF"}

package/esm/components/Input/Input.mjs

@@ -17,6 +17,7 @@ import { InputDescription } from "./InputDescription/InputDescription.mjs";
 import { InputError } from "./InputError/InputError.mjs";
 import { InputLabel } from "./InputLabel/InputLabel.mjs";
 import { InputPlaceholder } from "./InputPlaceholder/InputPlaceholder.mjs";
+import { InputSuccess } from "./InputSuccess/InputSuccess.mjs";
 import { InputWrapper } from "./InputWrapper/InputWrapper.mjs";
 import { use } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -27,6 +28,7 @@ const defaultProps = {
 	rightSectionPointerEvents: "none",
 	withAria: true,
 	withErrorStyles: true,
+	withSuccessStyles: true,
 	size: "sm",
 	loading: false,
 	loadingPosition: "right"
@@ -45,7 +47,7 @@ const varsResolver = createVarsResolver((_, props, ctx) => ({ wrapper: {
 } }));
 const Input = polymorphicFactory((_props) => {
 	const props = useProps("Input", defaultProps, _props);
-	const { classNames, className, style, styles, unstyled, required, __staticSelector, __stylesApiProps, size, wrapperProps, error, disabled, leftSection, leftSectionProps, leftSectionWidth, rightSection, rightSectionProps, rightSectionWidth, rightSectionPointerEvents, leftSectionPointerEvents, variant, vars, pointer, multiline, radius, id, withAria, withErrorStyles, mod, inputSize, attributes, __clearSection, __clearable, __clearSectionMode, __defaultRightSection, loading, loadingPosition, __bottomSection, __bottomSectionProps, rootRef, dir, ...others } = props;
+	const { classNames, className, style, styles, unstyled, required, __staticSelector, __stylesApiProps, size, wrapperProps, error, success, disabled, leftSection, leftSectionProps, leftSectionWidth, rightSection, rightSectionProps, rightSectionWidth, rightSectionPointerEvents, leftSectionPointerEvents, variant, vars, pointer, multiline, radius, id, withAria, withErrorStyles, withSuccessStyles, mod, inputSize, attributes, __clearSection, __clearable, __clearSectionMode, __defaultRightSection, loading, loadingPosition, __bottomSection, __bottomSectionProps, rootRef, dir, ...others } = props;
 	const { styleProps, rest } = extractStyleProps(others);
 	const ctx = use(InputWrapperContext);
 	const stylesCtx = {
@@ -94,6 +96,7 @@ const Input = polymorphicFactory((_props) => {
 			...wrapperProps,
 			mod: [{
 				error: !!error && withErrorStyles,
+				success: !!success && !error && withSuccessStyles,
 				pointer,
 				disabled,
 				multiline,
@@ -120,7 +123,8 @@ const Input = polymorphicFactory((_props) => {
 					required,
 					mod: {
 						disabled,
-						error: !!error && withErrorStyles
+						error: !!error && withErrorStyles,
+						success: !!success && !error && withSuccessStyles
 					},
 					variant,
 					__size: inputSize,
@@ -152,6 +156,7 @@ Input.varsResolver = varsResolver;
 Input.Wrapper = InputWrapper;
 Input.Label = InputLabel;
 Input.Error = InputError;
+Input.Success = InputSuccess;
 Input.Description = InputDescription;
 Input.Placeholder = InputPlaceholder;
 Input.ClearButton = InputClearButton;

package/esm/components/Input/Input.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Input.mjs","names":["classes"],"sources":["../../../src/components/Input/Input.tsx"],"sourcesContent":["import { use } from 'react';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  DataAttributes,\n  extractStyleProps,\n  getFontSize,\n  getRadius,\n  getSize,\n  MantineRadius,\n  MantineSize,\n  polymorphicFactory,\n  PolymorphicFactory,\n  rem,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { Loader } from '../Loader/Loader';\nimport { InputContext } from './Input.context';\nimport {\n  InputClearButton,\n  type InputClearButtonProps,\n  type InputClearButtonFactory,\n} from './InputClearButton/InputClearButton';\nimport {\n  ClearSectionMode,\n  InputClearSection,\n  type InputClearSectionProps,\n} from './InputClearSection/InputClearSection';\nimport {\n  InputDescription,\n  type InputDescriptionProps,\n  type InputDescriptionStylesNames,\n  type InputDescriptionCssVariables,\n  type InputDescriptionFactory,\n} from './InputDescription/InputDescription';\nimport {\n  InputError,\n  type InputErrorProps,\n  type InputErrorStylesNames,\n  type InputErrorCssVariables,\n  type InputErrorFactory,\n} from './InputError/InputError';\nimport {\n  InputLabel,\n  type InputLabelProps,\n  type InputLabelStylesNames,\n  type InputLabelCssVariables,\n  type InputLabelFactory,\n} from './InputLabel/InputLabel';\nimport {\n  InputPlaceholder,\n  type InputPlaceholderProps,\n  type InputPlaceholderStylesNames,\n  type InputPlaceholderFactory,\n} from './InputPlaceholder/InputPlaceholder';\nimport { InputWrapperContext } from './InputWrapper.context';\nimport {\n  __InputWrapperProps,\n  InputWrapper,\n  InputWrapperStylesNames,\n  type InputWrapperProps,\n  type InputWrapperFactory,\n} from './InputWrapper/InputWrapper';\nimport classes from './Input.module.css';\n// Required to be a separate type for docgen script\ntype WrapperProps = React.ComponentProps<'div'> & DataAttributes;\n\nexport interface __BaseInputProps extends __InputWrapperProps, __InputProps {\n  /** Props passed down to the root element */\n  wrapperProps?: WrapperProps;\n}\n\nexport type __InputStylesNames = InputStylesNames | InputWrapperStylesNames;\n\nexport type InputStylesNames = 'input' | 'wrapper' | 'section' | 'bottomSection';\nexport type InputVariant = 'default' | 'filled' | 'unstyled';\nexport type InputCssVariables = {\n  wrapper:\n    | '--input-height'\n    | '--input-fz'\n    | '--input-radius'\n    | '--input-left-section-width'\n    | '--input-right-section-width'\n    | '--input-left-section-pointer-events'\n    | '--input-right-section-pointer-events'\n    | '--input-padding-y'\n    | '--input-margin-top'\n    | '--input-margin-bottom';\n};\n\nexport interface InputStylesCtx {\n  offsetTop: boolean | undefined;\n  offsetBottom: boolean | undefined;\n}\n\nexport interface __InputProps {\n  /** Content section displayed on the left side of the input */\n  leftSection?: React.ReactNode;\n\n  /** Left section width, used to set `width` of the section and input `padding-left`, by default equals to the input height */\n  leftSectionWidth?: React.CSSProperties['width'];\n\n  /** Props passed down to the `leftSection` element */\n  leftSectionProps?: React.ComponentProps<'div'>;\n\n  /** Sets `pointer-events` styles on the `leftSection` element. Use `'all'` when section contains interactive elements (buttons, links). @default 'none' */\n  leftSectionPointerEvents?: React.CSSProperties['pointerEvents'];\n\n  /** Content section displayed on the right side of the input */\n  rightSection?: React.ReactNode;\n\n  /** Right section width, used to set `width` of the section and input `padding-right`, by default equals to the input height */\n  rightSectionWidth?: React.CSSProperties['width'];\n\n  /** Props passed down to the `rightSection` element */\n  rightSectionProps?: React.ComponentProps<'div'>;\n\n  /** Sets `pointer-events` styles on the `rightSection` element. Use `'all'` when section contains interactive elements (buttons, links). @default 'none' */\n  rightSectionPointerEvents?: React.CSSProperties['pointerEvents'];\n\n  /** Sets `required` attribute on the `input` element */\n  required?: boolean;\n\n  /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem @default theme.defaultRadius */\n  radius?: MantineRadius;\n\n  /** Sets `disabled` attribute on the `input` element */\n  disabled?: boolean;\n\n  /** Controls input `height`, horizontal `padding`, and `font-size` @default 'sm' */\n  size?: MantineSize | (string & {});\n\n  /** Determines whether the input should have `cursor: pointer` style. Use when input acts as a button-like trigger (e.g., `component=\"button\"` for Select/DatePicker). @default false */\n  pointer?: boolean;\n\n  /** Determines whether the input should have red border and red text color when the `error` prop is set @default true */\n  withErrorStyles?: boolean;\n\n  /** HTML `size` attribute for the input element (number of visible characters) */\n  inputSize?: string;\n\n  /** Section to be displayed when the input is `__clearable` and `rightSection` is not defined */\n  __clearSection?: React.ReactNode;\n\n  /** Determines whether the `__clearSection` should be displayed if it is passed to the component, has no effect if `rightSection` is defined */\n  __clearable?: boolean;\n\n  /** Determines how the clear button and rightSection are rendered @default 'both' */\n  __clearSectionMode?: ClearSectionMode;\n\n  /** Right section displayed when both `__clearSection` and `rightSection` are not defined */\n  __defaultRightSection?: React.ReactNode;\n\n  /** Displays loading indicator in the left or right section @default false */\n  loading?: boolean;\n\n  /** Position of the loading indicator @default 'right' */\n  loadingPosition?: 'left' | 'right';\n\n  /** Content section displayed at the bottom of the input, inside the border */\n  __bottomSection?: React.ReactNode;\n\n  /** Props passed down to the `__bottomSection` element */\n  __bottomSectionProps?: React.ComponentProps<'div'>;\n}\n\nexport interface InputProps extends BoxProps, __InputProps, StylesApiProps<InputFactory> {\n  __staticSelector?: string;\n\n  /** Props passed to Styles API context, replaces `Input.Wrapper` props */\n  __stylesApiProps?: Record<string, any>;\n\n  /** Determines whether the input should have error styles and `aria-invalid` attribute */\n  error?: React.ReactNode;\n\n  /** Adjusts padding and sizing calculations for multiline inputs (use with `component=\"textarea\"`). Does not make the input multiline by itself. @default false */\n  multiline?: boolean;\n\n  /** Input element id */\n  id?: string;\n\n  /** Determines whether `aria-` and other accessibility attributes should be added to the input. Only disable when implementing custom accessibility handling. @default true */\n  withAria?: boolean;\n\n  /** Props passed down to the root element of the `Input` component */\n  wrapperProps?: WrapperProps;\n\n  /** Root element ref */\n  rootRef?: React.Ref<HTMLDivElement>;\n}\n\nexport type InputFactory = PolymorphicFactory<{\n  props: InputProps;\n  defaultRef: HTMLInputElement;\n  defaultComponent: 'input';\n  stylesNames: InputStylesNames;\n  variant: InputVariant;\n  vars: InputCssVariables;\n  ctx: InputStylesCtx;\n  staticComponents: {\n    Label: typeof InputLabel;\n    Error: typeof InputError;\n    Description: typeof InputDescription;\n    Placeholder: typeof InputPlaceholder;\n    Wrapper: typeof InputWrapper;\n    ClearButton: typeof InputClearButton;\n  };\n}>;\n\nconst defaultProps = {\n  variant: 'default',\n  leftSectionPointerEvents: 'none',\n  rightSectionPointerEvents: 'none',\n  withAria: true,\n  withErrorStyles: true,\n  size: 'sm',\n  loading: false,\n  loadingPosition: 'right',\n} satisfies Partial<InputProps>;\n\nconst varsResolver = createVarsResolver<InputFactory>((_, props, ctx) => ({\n  wrapper: {\n    '--input-margin-top': ctx.offsetTop ? 'calc(var(--mantine-spacing-xs) / 2)' : undefined,\n    '--input-margin-bottom': ctx.offsetBottom ? 'calc(var(--mantine-spacing-xs) / 2)' : undefined,\n    '--input-height': getSize(props.size, 'input-height'),\n    '--input-fz': getFontSize(props.size),\n    '--input-radius': props.radius === undefined ? undefined : getRadius(props.radius),\n    '--input-left-section-width':\n      props.leftSectionWidth !== undefined ? rem(props.leftSectionWidth) : undefined,\n    '--input-right-section-width':\n      props.rightSectionWidth !== undefined ? rem(props.rightSectionWidth) : undefined,\n    '--input-padding-y': props.multiline ? getSize(props.size, 'input-padding-y') : undefined,\n    '--input-left-section-pointer-events': props.leftSectionPointerEvents,\n    '--input-right-section-pointer-events': props.rightSectionPointerEvents,\n  },\n}));\n\nexport const Input = polymorphicFactory<InputFactory>((_props) => {\n  const props = useProps('Input', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    required,\n    __staticSelector,\n    __stylesApiProps,\n    size,\n    wrapperProps,\n    error,\n    disabled,\n    leftSection,\n    leftSectionProps,\n    leftSectionWidth,\n    rightSection,\n    rightSectionProps,\n    rightSectionWidth,\n    rightSectionPointerEvents,\n    leftSectionPointerEvents,\n    variant,\n    vars,\n    pointer,\n    multiline,\n    radius,\n    id,\n    withAria,\n    withErrorStyles,\n    mod,\n    inputSize,\n    attributes,\n    __clearSection,\n    __clearable,\n    __clearSectionMode,\n    __defaultRightSection,\n    loading,\n    loadingPosition,\n    __bottomSection,\n    __bottomSectionProps,\n    rootRef,\n    dir,\n    ...others\n  } = props as typeof props & Pick<React.HTMLAttributes<HTMLDivElement>, 'dir'>;\n\n  const { styleProps, rest } = extractStyleProps(others);\n  const ctx = use(InputWrapperContext);\n  const stylesCtx: InputStylesCtx = { offsetBottom: ctx?.offsetBottom, offsetTop: ctx?.offsetTop };\n\n  const getStyles = useStyles<InputFactory>({\n    name: ['Input', __staticSelector],\n    props: __stylesApiProps || props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    stylesCtx,\n    rootSelector: 'wrapper',\n    vars,\n    varsResolver,\n  });\n\n  const ariaAttributes = withAria\n    ? {\n        required,\n        disabled,\n        'aria-invalid': error ? true : undefined,\n        'aria-describedby': ctx?.describedBy,\n        id: ctx?.inputId || id,\n      }\n    : {};\n\n  const loadingIndicator = loading ? (\n    <Loader\n      size={\n        loadingPosition === 'left'\n          ? 'calc(var(--input-left-section-size) / 2)'\n          : 'calc(var(--input-right-section-size) / 2)'\n      }\n    />\n  ) : null;\n\n  const _leftSection = loading && loadingPosition === 'left' ? loadingIndicator : leftSection;\n  const _rightSection: React.ReactNode = InputClearSection({\n    __clearable,\n    __clearSection,\n    rightSection: loading && loadingPosition === 'right' ? loadingIndicator : rightSection,\n    __defaultRightSection,\n    size,\n    __clearSectionMode,\n  });\n\n  return (\n    <InputContext value={{ size: size || 'sm' }}>\n      <Box\n        ref={rootRef}\n        dir={dir}\n        {...getStyles('wrapper')}\n        {...styleProps}\n        {...wrapperProps}\n        mod={[\n          {\n            error: !!error && withErrorStyles,\n            pointer,\n            disabled,\n            multiline,\n            'data-with-right-section': !!_rightSection,\n            'data-with-left-section': !!_leftSection,\n            'data-with-bottom-section': !!__bottomSection,\n          },\n          mod,\n        ]}\n        variant={variant}\n        size={size}\n      >\n        {_leftSection && (\n          <div\n            {...leftSectionProps}\n            data-position=\"left\"\n            {...getStyles('section', {\n              className: leftSectionProps?.className,\n              style: leftSectionProps?.style,\n            })}\n          >\n            {_leftSection}\n          </div>\n        )}\n\n        <Box\n          component=\"input\"\n          {...rest}\n          {...ariaAttributes}\n          required={required}\n          mod={{ disabled, error: !!error && withErrorStyles }}\n          variant={variant}\n          __size={inputSize}\n          {...getStyles('input')}\n        />\n\n        {__bottomSection && (\n          <div\n            {...__bottomSectionProps}\n            {...getStyles('bottomSection', {\n              className: __bottomSectionProps?.className,\n              style: __bottomSectionProps?.style,\n            })}\n          >\n            {__bottomSection}\n          </div>\n        )}\n\n        {_rightSection && (\n          <div\n            {...rightSectionProps}\n            data-position=\"right\"\n            {...getStyles('section', {\n              className: rightSectionProps?.className,\n              style: rightSectionProps?.style,\n            })}\n          >\n            {_rightSection}\n          </div>\n        )}\n      </Box>\n    </InputContext>\n  );\n});\n\nInput.classes = classes;\nInput.varsResolver = varsResolver;\nInput.Wrapper = InputWrapper;\nInput.Label = InputLabel;\nInput.Error = InputError;\nInput.Description = InputDescription;\nInput.Placeholder = InputPlaceholder;\nInput.ClearButton = InputClearButton;\nInput.displayName = '@mantine/core/Input';\n\nexport namespace Input {\n  export type Props = InputProps;\n  export type StylesNames = InputStylesNames;\n  export type CssVariables = InputCssVariables;\n  export type Factory = InputFactory;\n\n  export namespace Wrapper {\n    export type Props = InputWrapperProps;\n    export type StylesNames = InputWrapperStylesNames;\n    export type Factory = InputWrapperFactory;\n  }\n\n  export namespace Description {\n    export type Props = InputDescriptionProps;\n    export type StylesNames = InputDescriptionStylesNames;\n    export type CssVariables = InputDescriptionCssVariables;\n    export type Factory = InputDescriptionFactory;\n  }\n\n  export namespace Error {\n    export type Props = InputErrorProps;\n    export type StylesNames = InputErrorStylesNames;\n    export type CssVariables = InputErrorCssVariables;\n    export type Factory = InputErrorFactory;\n  }\n\n  export namespace Label {\n    export type Props = InputLabelProps;\n    export type StylesNames = InputLabelStylesNames;\n    export type CssVariables = InputLabelCssVariables;\n    export type Factory = InputLabelFactory;\n  }\n\n  export namespace Placeholder {\n    export type Props = InputPlaceholderProps;\n    export type StylesNames = InputPlaceholderStylesNames;\n    export type Factory = InputPlaceholderFactory;\n  }\n\n  export namespace ClearButton {\n    export type Props = InputClearButtonProps;\n    export type Factory = InputClearButtonFactory;\n  }\n\n  export namespace ClearSection {\n    export type Props = InputClearSectionProps;\n    export type Mode = ClearSectionMode;\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"Input.mjs","names":["classes"],"sources":["../../../src/components/Input/Input.tsx"],"sourcesContent":["import { use } from 'react';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  DataAttributes,\n  extractStyleProps,\n  getFontSize,\n  getRadius,\n  getSize,\n  MantineRadius,\n  MantineSize,\n  polymorphicFactory,\n  PolymorphicFactory,\n  rem,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport { Loader } from '../Loader/Loader';\nimport { InputContext } from './Input.context';\nimport {\n  InputClearButton,\n  type InputClearButtonProps,\n  type InputClearButtonFactory,\n} from './InputClearButton/InputClearButton';\nimport {\n  ClearSectionMode,\n  InputClearSection,\n  type InputClearSectionProps,\n} from './InputClearSection/InputClearSection';\nimport {\n  InputDescription,\n  type InputDescriptionProps,\n  type InputDescriptionStylesNames,\n  type InputDescriptionCssVariables,\n  type InputDescriptionFactory,\n} from './InputDescription/InputDescription';\nimport {\n  InputError,\n  type InputErrorProps,\n  type InputErrorStylesNames,\n  type InputErrorCssVariables,\n  type InputErrorFactory,\n} from './InputError/InputError';\nimport {\n  InputLabel,\n  type InputLabelProps,\n  type InputLabelStylesNames,\n  type InputLabelCssVariables,\n  type InputLabelFactory,\n} from './InputLabel/InputLabel';\nimport {\n  InputPlaceholder,\n  type InputPlaceholderProps,\n  type InputPlaceholderStylesNames,\n  type InputPlaceholderFactory,\n} from './InputPlaceholder/InputPlaceholder';\nimport { InputSuccess } from './InputSuccess/InputSuccess';\nimport { InputWrapperContext } from './InputWrapper.context';\nimport {\n  __InputWrapperProps,\n  InputWrapper,\n  InputWrapperStylesNames,\n  type InputWrapperProps,\n  type InputWrapperFactory,\n} from './InputWrapper/InputWrapper';\nimport classes from './Input.module.css';\n// Required to be a separate type for docgen script\ntype WrapperProps = React.ComponentProps<'div'> & DataAttributes;\n\nexport interface __BaseInputProps extends __InputWrapperProps, __InputProps {\n  /** Props passed down to the root element */\n  wrapperProps?: WrapperProps;\n}\n\nexport type __InputStylesNames = InputStylesNames | InputWrapperStylesNames;\n\nexport type InputStylesNames = 'input' | 'wrapper' | 'section' | 'bottomSection';\nexport type InputVariant = 'default' | 'filled' | 'unstyled';\nexport type InputCssVariables = {\n  wrapper:\n    | '--input-height'\n    | '--input-fz'\n    | '--input-radius'\n    | '--input-left-section-width'\n    | '--input-right-section-width'\n    | '--input-left-section-pointer-events'\n    | '--input-right-section-pointer-events'\n    | '--input-padding-y'\n    | '--input-margin-top'\n    | '--input-margin-bottom';\n};\n\nexport interface InputStylesCtx {\n  offsetTop: boolean | undefined;\n  offsetBottom: boolean | undefined;\n}\n\nexport interface __InputProps {\n  /** Content section displayed on the left side of the input */\n  leftSection?: React.ReactNode;\n\n  /** Left section width, used to set `width` of the section and input `padding-left`, by default equals to the input height */\n  leftSectionWidth?: React.CSSProperties['width'];\n\n  /** Props passed down to the `leftSection` element */\n  leftSectionProps?: React.ComponentProps<'div'>;\n\n  /** Sets `pointer-events` styles on the `leftSection` element. Use `'all'` when section contains interactive elements (buttons, links). @default 'none' */\n  leftSectionPointerEvents?: React.CSSProperties['pointerEvents'];\n\n  /** Content section displayed on the right side of the input */\n  rightSection?: React.ReactNode;\n\n  /** Right section width, used to set `width` of the section and input `padding-right`, by default equals to the input height */\n  rightSectionWidth?: React.CSSProperties['width'];\n\n  /** Props passed down to the `rightSection` element */\n  rightSectionProps?: React.ComponentProps<'div'>;\n\n  /** Sets `pointer-events` styles on the `rightSection` element. Use `'all'` when section contains interactive elements (buttons, links). @default 'none' */\n  rightSectionPointerEvents?: React.CSSProperties['pointerEvents'];\n\n  /** Sets `required` attribute on the `input` element */\n  required?: boolean;\n\n  /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem @default theme.defaultRadius */\n  radius?: MantineRadius;\n\n  /** Sets `disabled` attribute on the `input` element */\n  disabled?: boolean;\n\n  /** Controls input `height`, horizontal `padding`, and `font-size` @default 'sm' */\n  size?: MantineSize | (string & {});\n\n  /** Determines whether the input should have `cursor: pointer` style. Use when input acts as a button-like trigger (e.g., `component=\"button\"` for Select/DatePicker). @default false */\n  pointer?: boolean;\n\n  /** Determines whether the input should have red border and red text color when the `error` prop is set @default true */\n  withErrorStyles?: boolean;\n\n  /** Determines whether the input should have green border when the `success` prop is set @default true */\n  withSuccessStyles?: boolean;\n\n  /** HTML `size` attribute for the input element (number of visible characters) */\n  inputSize?: string;\n\n  /** Section to be displayed when the input is `__clearable` and `rightSection` is not defined */\n  __clearSection?: React.ReactNode;\n\n  /** Determines whether the `__clearSection` should be displayed if it is passed to the component, has no effect if `rightSection` is defined */\n  __clearable?: boolean;\n\n  /** Determines how the clear button and rightSection are rendered @default 'both' */\n  __clearSectionMode?: ClearSectionMode;\n\n  /** Right section displayed when both `__clearSection` and `rightSection` are not defined */\n  __defaultRightSection?: React.ReactNode;\n\n  /** Displays loading indicator in the left or right section @default false */\n  loading?: boolean;\n\n  /** Position of the loading indicator @default 'right' */\n  loadingPosition?: 'left' | 'right';\n\n  /** Content section displayed at the bottom of the input, inside the border */\n  __bottomSection?: React.ReactNode;\n\n  /** Props passed down to the `__bottomSection` element */\n  __bottomSectionProps?: React.ComponentProps<'div'>;\n}\n\nexport interface InputProps extends BoxProps, __InputProps, StylesApiProps<InputFactory> {\n  __staticSelector?: string;\n\n  /** Props passed to Styles API context, replaces `Input.Wrapper` props */\n  __stylesApiProps?: Record<string, any>;\n\n  /** Determines whether the input should have error styles and `aria-invalid` attribute */\n  error?: React.ReactNode;\n\n  /** Determines whether the input should have success styles */\n  success?: React.ReactNode;\n\n  /** Adjusts padding and sizing calculations for multiline inputs (use with `component=\"textarea\"`). Does not make the input multiline by itself. @default false */\n  multiline?: boolean;\n\n  /** Input element id */\n  id?: string;\n\n  /** Determines whether `aria-` and other accessibility attributes should be added to the input. Only disable when implementing custom accessibility handling. @default true */\n  withAria?: boolean;\n\n  /** Props passed down to the root element of the `Input` component */\n  wrapperProps?: WrapperProps;\n\n  /** Root element ref */\n  rootRef?: React.Ref<HTMLDivElement>;\n}\n\nexport type InputFactory = PolymorphicFactory<{\n  props: InputProps;\n  defaultRef: HTMLInputElement;\n  defaultComponent: 'input';\n  stylesNames: InputStylesNames;\n  variant: InputVariant;\n  vars: InputCssVariables;\n  ctx: InputStylesCtx;\n  staticComponents: {\n    Label: typeof InputLabel;\n    Error: typeof InputError;\n    Success: typeof InputSuccess;\n    Description: typeof InputDescription;\n    Placeholder: typeof InputPlaceholder;\n    Wrapper: typeof InputWrapper;\n    ClearButton: typeof InputClearButton;\n  };\n}>;\n\nconst defaultProps = {\n  variant: 'default',\n  leftSectionPointerEvents: 'none',\n  rightSectionPointerEvents: 'none',\n  withAria: true,\n  withErrorStyles: true,\n  withSuccessStyles: true,\n  size: 'sm',\n  loading: false,\n  loadingPosition: 'right',\n} satisfies Partial<InputProps>;\n\nconst varsResolver = createVarsResolver<InputFactory>((_, props, ctx) => ({\n  wrapper: {\n    '--input-margin-top': ctx.offsetTop ? 'calc(var(--mantine-spacing-xs) / 2)' : undefined,\n    '--input-margin-bottom': ctx.offsetBottom ? 'calc(var(--mantine-spacing-xs) / 2)' : undefined,\n    '--input-height': getSize(props.size, 'input-height'),\n    '--input-fz': getFontSize(props.size),\n    '--input-radius': props.radius === undefined ? undefined : getRadius(props.radius),\n    '--input-left-section-width':\n      props.leftSectionWidth !== undefined ? rem(props.leftSectionWidth) : undefined,\n    '--input-right-section-width':\n      props.rightSectionWidth !== undefined ? rem(props.rightSectionWidth) : undefined,\n    '--input-padding-y': props.multiline ? getSize(props.size, 'input-padding-y') : undefined,\n    '--input-left-section-pointer-events': props.leftSectionPointerEvents,\n    '--input-right-section-pointer-events': props.rightSectionPointerEvents,\n  },\n}));\n\nexport const Input = polymorphicFactory<InputFactory>((_props) => {\n  const props = useProps('Input', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    required,\n    __staticSelector,\n    __stylesApiProps,\n    size,\n    wrapperProps,\n    error,\n    success,\n    disabled,\n    leftSection,\n    leftSectionProps,\n    leftSectionWidth,\n    rightSection,\n    rightSectionProps,\n    rightSectionWidth,\n    rightSectionPointerEvents,\n    leftSectionPointerEvents,\n    variant,\n    vars,\n    pointer,\n    multiline,\n    radius,\n    id,\n    withAria,\n    withErrorStyles,\n    withSuccessStyles,\n    mod,\n    inputSize,\n    attributes,\n    __clearSection,\n    __clearable,\n    __clearSectionMode,\n    __defaultRightSection,\n    loading,\n    loadingPosition,\n    __bottomSection,\n    __bottomSectionProps,\n    rootRef,\n    dir,\n    ...others\n  } = props as typeof props & Pick<React.HTMLAttributes<HTMLDivElement>, 'dir'>;\n\n  const { styleProps, rest } = extractStyleProps(others);\n  const ctx = use(InputWrapperContext);\n  const stylesCtx: InputStylesCtx = { offsetBottom: ctx?.offsetBottom, offsetTop: ctx?.offsetTop };\n\n  const getStyles = useStyles<InputFactory>({\n    name: ['Input', __staticSelector],\n    props: __stylesApiProps || props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    stylesCtx,\n    rootSelector: 'wrapper',\n    vars,\n    varsResolver,\n  });\n\n  const ariaAttributes = withAria\n    ? {\n        required,\n        disabled,\n        'aria-invalid': error ? true : undefined,\n        'aria-describedby': ctx?.describedBy,\n        id: ctx?.inputId || id,\n      }\n    : {};\n\n  const loadingIndicator = loading ? (\n    <Loader\n      size={\n        loadingPosition === 'left'\n          ? 'calc(var(--input-left-section-size) / 2)'\n          : 'calc(var(--input-right-section-size) / 2)'\n      }\n    />\n  ) : null;\n\n  const _leftSection = loading && loadingPosition === 'left' ? loadingIndicator : leftSection;\n  const _rightSection: React.ReactNode = InputClearSection({\n    __clearable,\n    __clearSection,\n    rightSection: loading && loadingPosition === 'right' ? loadingIndicator : rightSection,\n    __defaultRightSection,\n    size,\n    __clearSectionMode,\n  });\n\n  return (\n    <InputContext value={{ size: size || 'sm' }}>\n      <Box\n        ref={rootRef}\n        dir={dir}\n        {...getStyles('wrapper')}\n        {...styleProps}\n        {...wrapperProps}\n        mod={[\n          {\n            error: !!error && withErrorStyles,\n            success: !!success && !error && withSuccessStyles,\n            pointer,\n            disabled,\n            multiline,\n            'data-with-right-section': !!_rightSection,\n            'data-with-left-section': !!_leftSection,\n            'data-with-bottom-section': !!__bottomSection,\n          },\n          mod,\n        ]}\n        variant={variant}\n        size={size}\n      >\n        {_leftSection && (\n          <div\n            {...leftSectionProps}\n            data-position=\"left\"\n            {...getStyles('section', {\n              className: leftSectionProps?.className,\n              style: leftSectionProps?.style,\n            })}\n          >\n            {_leftSection}\n          </div>\n        )}\n\n        <Box\n          component=\"input\"\n          {...rest}\n          {...ariaAttributes}\n          required={required}\n          mod={{\n            disabled,\n            error: !!error && withErrorStyles,\n            success: !!success && !error && withSuccessStyles,\n          }}\n          variant={variant}\n          __size={inputSize}\n          {...getStyles('input')}\n        />\n\n        {__bottomSection && (\n          <div\n            {...__bottomSectionProps}\n            {...getStyles('bottomSection', {\n              className: __bottomSectionProps?.className,\n              style: __bottomSectionProps?.style,\n            })}\n          >\n            {__bottomSection}\n          </div>\n        )}\n\n        {_rightSection && (\n          <div\n            {...rightSectionProps}\n            data-position=\"right\"\n            {...getStyles('section', {\n              className: rightSectionProps?.className,\n              style: rightSectionProps?.style,\n            })}\n          >\n            {_rightSection}\n          </div>\n        )}\n      </Box>\n    </InputContext>\n  );\n});\n\nInput.classes = classes;\nInput.varsResolver = varsResolver;\nInput.Wrapper = InputWrapper;\nInput.Label = InputLabel;\nInput.Error = InputError;\nInput.Success = InputSuccess;\nInput.Description = InputDescription;\nInput.Placeholder = InputPlaceholder;\nInput.ClearButton = InputClearButton;\nInput.displayName = '@mantine/core/Input';\n\nexport namespace Input {\n  export type Props = InputProps;\n  export type StylesNames = InputStylesNames;\n  export type CssVariables = InputCssVariables;\n  export type Factory = InputFactory;\n\n  export namespace Wrapper {\n    export type Props = InputWrapperProps;\n    export type StylesNames = InputWrapperStylesNames;\n    export type Factory = InputWrapperFactory;\n  }\n\n  export namespace Description {\n    export type Props = InputDescriptionProps;\n    export type StylesNames = InputDescriptionStylesNames;\n    export type CssVariables = InputDescriptionCssVariables;\n    export type Factory = InputDescriptionFactory;\n  }\n\n  export namespace Error {\n    export type Props = InputErrorProps;\n    export type StylesNames = InputErrorStylesNames;\n    export type CssVariables = InputErrorCssVariables;\n    export type Factory = InputErrorFactory;\n  }\n\n  export namespace Label {\n    export type Props = InputLabelProps;\n    export type StylesNames = InputLabelStylesNames;\n    export type CssVariables = InputLabelCssVariables;\n    export type Factory = InputLabelFactory;\n  }\n\n  export namespace Placeholder {\n    export type Props = InputPlaceholderProps;\n    export type StylesNames = InputPlaceholderStylesNames;\n    export type Factory = InputPlaceholderFactory;\n  }\n\n  export namespace ClearButton {\n    export type Props = InputClearButtonProps;\n    export type Factory = InputClearButtonFactory;\n  }\n\n  export namespace ClearSection {\n    export type Props = InputClearSectionProps;\n    export type Mode = ClearSectionMode;\n  }\n}\n"],"mappings":"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"}

package/esm/components/Input/Input.module.mjs

@@ -10,6 +10,7 @@ var Input_module_default = {
 	"label": "m_8fdc1311",
 	"required": "m_78a94662",
 	"error": "m_8f816625",
+	"success": "m_9d9d40e0",
 	"description": "m_fe47ce59"
 };
 //#endregion

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

@@ -1 +1 @@
-{"version":3,"file":"Input.module.mjs","names":[],"sources":["../../../src/components/Input/Input.module.css"],"sourcesContent":[".wrapper {\n  position: relative;\n  margin-top: var(--input-margin-top, 0rem);\n  margin-bottom: var(--input-margin-bottom, 0rem);\n\n  --input-height-xs: 30px;\n  --input-height-sm: 36px;\n  --input-height-md: 42px;\n  --input-height-lg: 50px;\n  --input-height-xl: 60px;\n\n  --input-padding-y-xs: 5px;\n  --input-padding-y-sm: 6px;\n  --input-padding-y-md: 8px;\n  --input-padding-y-lg: 10px;\n  --input-padding-y-xl: 13px;\n\n  --input-height: var(--input-height-sm);\n  --input-radius: var(--mantine-radius-default);\n\n  --input-cursor: text;\n  --input-line-height: calc(var(--input-height) - rem(2px));\n  --input-padding: calc(var(--input-height) / 3);\n  --input-padding-inline-start: var(--input-padding);\n  --input-padding-inline-end: var(--input-padding);\n  --input-placeholder-color: var(--mantine-color-placeholder);\n  --input-color: var(--mantine-color-text);\n  --input-disabled-bg: var(--mantine-color-disabled);\n  --input-disabled-color: var(--mantine-color-disabled-color);\n\n  --input-left-section-size: var(--input-left-section-width, calc(var(--input-height) - rem(2px)));\n\n  --input-right-section-size: var(\n    --input-right-section-width,\n    calc(var(--input-height) - rem(2px))\n  );\n\n  --input-size: var(--input-height);\n\n  --section-y: 1px;\n  --left-section-start: 1px;\n  --left-section-border-radius: var(--input-radius) 0 0 var(--input-radius);\n\n  --right-section-end: 1px;\n  --right-section-border-radius: 0 var(--input-radius) var(--input-radius) 0;\n\n  &[data-variant='unstyled'] {\n    --input-padding: 0;\n    --input-padding-y: 0;\n    --input-padding-inline-start: 0;\n    --input-padding-inline-end: 0;\n  }\n\n  &[data-pointer] {\n    --input-cursor: pointer;\n  }\n\n  &[data-with-bottom-section] {\n    --input-bottom-section-height: 28px;\n  }\n\n  &[data-multiline] {\n    --input-padding-y-xs: 4.5px;\n    --input-padding-y-sm: 5.5px;\n    --input-padding-y-md: 7px;\n    --input-padding-y-lg: 9.5px;\n    --input-padding-y-xl: 13px;\n\n    --input-size: auto;\n    --input-line-height: var(--mantine-line-height);\n  }\n\n  &[data-with-left-section] {\n    --input-padding-inline-start: var(--input-left-section-size);\n  }\n\n  &[data-with-right-section] {\n    --input-padding-inline-end: var(--input-right-section-size);\n\n    &:has([data-combined-clear-section]) {\n      .wrapper[data-size='xs'] & {\n        --input-padding-inline-end: 41px;\n      }\n\n      .wrapper[data-size='sm'] & {\n        --input-padding-inline-end: 50px;\n      }\n\n      .wrapper[data-size='md'] & {\n        --input-padding-inline-end: 60px;\n      }\n\n      .wrapper[data-size='lg'] & {\n        --input-padding-inline-end: 72px;\n      }\n\n      .wrapper[data-size='xl'] & {\n        --input-padding-inline-end: 89px;\n      }\n    }\n  }\n\n  @mixin light {\n    &[data-variant='default'] {\n      --input-bd: var(--mantine-color-gray-4);\n      --input-bg: var(--mantine-color-white);\n      --input-bd-focus: var(--mantine-primary-color-filled);\n    }\n\n    &[data-variant='filled'] {\n      --input-bd: transparent;\n      --input-bg: var(--mantine-color-gray-1);\n      --input-bd-focus: var(--mantine-primary-color-filled);\n    }\n\n    &[data-variant='unstyled'] {\n      --input-bd: transparent;\n      --input-bg: transparent;\n      --input-bd-focus: transparent;\n    }\n  }\n\n  @mixin dark {\n    &[data-variant='default'] {\n      --input-bd: var(--mantine-color-dark-4);\n      --input-bg: var(--mantine-color-dark-6);\n      --input-bd-focus: var(--mantine-primary-color-filled);\n    }\n\n    &[data-variant='filled'] {\n      --input-bd: transparent;\n      --input-bg: var(--mantine-color-dark-5);\n      --input-bd-focus: var(--mantine-primary-color-filled);\n    }\n\n    &[data-variant='unstyled'] {\n      --input-bd: transparent;\n      --input-bg: transparent;\n      --input-bd-focus: transparent;\n    }\n  }\n\n  [data-mantine-color-scheme] &[data-error] {\n    &:not([data-variant='unstyled']) {\n      --input-bd: var(--mantine-color-error);\n    }\n\n    --input-color: var(--mantine-color-error);\n    --input-placeholder-color: var(--mantine-color-error);\n    --input-section-color: var(--mantine-color-error);\n  }\n\n  @mixin where-rtl {\n    --left-section-border-radius: 0 var(--input-radius) var(--input-radius) 0;\n    --right-section-border-radius: var(--input-radius) 0 0 var(--input-radius);\n  }\n\n  &[dir='ltr'] {\n    --left-section-border-radius: var(--input-radius) 0 0 var(--input-radius);\n    --right-section-border-radius: 0 var(--input-radius) var(--input-radius) 0;\n  }\n}\n\n.input {\n  -webkit-tap-highlight-color: transparent;\n  appearance: none;\n  resize: var(--input-resize, none);\n  display: block;\n  width: 100%;\n  transition: border-color 100ms ease;\n\n  text-align: var(--input-text-align, start);\n  color: var(--input-color);\n  border: rem(1px) solid var(--input-bd);\n  background-color: var(--input-bg);\n  font-family: var(--input-font-family, var(--mantine-font-family));\n  height: var(--input-size);\n  min-height: var(--input-height);\n  line-height: var(--input-line-height);\n  font-size: var(--_input-fz, var(--input-fz, var(--mantine-font-size-md)));\n  border-radius: var(--input-radius);\n  padding-inline-start: var(--input-padding-inline-start);\n  padding-inline-end: var(--input-padding-inline-end);\n  padding-top: var(--input-padding-y, 0rem);\n  padding-bottom: var(--input-padding-y, 0rem);\n  cursor: var(--input-cursor);\n  overflow: var(--input-overflow);\n\n  /* Used as data attribute in Textarea component, does not have associated prop on the Input component */\n  &[data-no-overflow] {\n    --input-overflow: hidden;\n  }\n\n  /* Used as data attribute in JsonInput component, does not have associated prop on the Input component */\n  &[data-monospace] {\n    --input-font-family: var(--mantine-font-family-monospace);\n    --_input-fz: calc(var(--input-fz) - rem(2px));\n  }\n\n  &:focus,\n  &:focus-within {\n    outline: none;\n    --input-bd: var(--input-bd-focus);\n\n    [data-error] & {\n      --input-bd: var(--mantine-color-error);\n    }\n  }\n\n  &::placeholder {\n    color: var(--input-placeholder-color);\n    opacity: 1;\n  }\n\n  &::-webkit-inner-spin-button,\n  &::-webkit-outer-spin-button,\n  &::-webkit-search-decoration,\n  &::-webkit-search-cancel-button,\n  &::-webkit-search-results-button,\n  &::-webkit-search-results-decoration {\n    appearance: none;\n  }\n\n  &[type='number'] {\n    -moz-appearance: textfield;\n  }\n\n  &:disabled,\n  &[data-disabled] {\n    cursor: not-allowed;\n    opacity: 0.6;\n    background-color: var(--input-disabled-bg);\n    color: var(--input-disabled-color);\n  }\n\n  /* Required to be a separate selector to work in Firefox, can be merged with &:disabled once :has is supported */\n  &:has(input:disabled) {\n    cursor: not-allowed;\n    opacity: 0.6;\n    background-color: var(--input-disabled-bg);\n    color: var(--input-disabled-color);\n  }\n\n  &[readonly] {\n    caret-color: transparent;\n  }\n\n  [data-with-bottom-section] & {\n    padding-bottom: calc(var(--input-padding-y, 0rem) + var(--input-bottom-section-height));\n  }\n}\n\n.bottomSection {\n  position: absolute;\n  bottom: 1px;\n  left: 1px;\n  right: 1px;\n  height: var(--input-bottom-section-height);\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  padding-inline: var(--input-padding);\n  border-radius: 0 0 var(--input-radius) var(--input-radius);\n  pointer-events: all;\n  color: var(--mantine-color-dimmed);\n  font-size: var(--input-fz, var(--mantine-font-size-sm));\n}\n\n.section {\n  pointer-events: var(--section-pointer-events);\n  position: absolute;\n  z-index: 1;\n  inset-inline-start: var(--section-start);\n  inset-inline-end: var(--section-end);\n  bottom: var(--section-y);\n  top: var(--section-y);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: var(--section-size);\n  border-radius: var(--section-border-radius);\n  color: var(--input-section-color, var(--mantine-color-dimmed));\n\n  &[data-position='right'] {\n    --section-pointer-events: var(--input-right-section-pointer-events);\n    --section-end: var(--right-section-end);\n    --section-size: var(--input-right-section-size);\n    --section-border-radius: var(--right-section-border-radius);\n\n    &:has([data-combined-clear-section]) {\n      .wrapper[data-size='xs'] & {\n        --section-size: 41px;\n      }\n\n      .wrapper[data-size='sm'] & {\n        --section-size: 50px;\n      }\n\n      .wrapper[data-size='md'] & {\n        --section-size: 60px;\n      }\n\n      .wrapper[data-size='lg'] & {\n        --section-size: 72px;\n      }\n\n      .wrapper[data-size='xl'] & {\n        --section-size: 89px;\n      }\n    }\n  }\n\n  &[data-position='left'] {\n    --section-pointer-events: var(--input-left-section-pointer-events);\n    --section-start: var(--left-section-start);\n    --section-size: var(--input-left-section-size);\n    --section-border-radius: var(--left-section-border-radius);\n  }\n}\n\n/* ----- Input.Placeholder ----- */\n.placeholder {\n  color: var(--input-placeholder-color, var(--mantine-color-placeholder));\n\n  [data-error] & {\n    --input-placeholder-color: var(--input-color, var(--mantine-color-placeholder));\n  }\n}\n\n/* ----- Input.Wrapper ----- */\n.root {\n  line-height: var(--mantine-line-height);\n}\n\n.label {\n  display: inline-block;\n  font-weight: var(--mantine-font-weight-medium);\n  overflow-wrap: break-word;\n  cursor: default;\n  -webkit-tap-highlight-color: transparent;\n  font-size: var(--input-label-size, var(--mantine-font-size-sm));\n}\n\n.required {\n  color: var(--input-asterisk-color, var(--mantine-color-error));\n}\n\n.error,\n.description {\n  word-wrap: break-word;\n  line-height: 1.2;\n  display: block;\n  margin: 0;\n  padding: 0;\n}\n\n.error {\n  color: var(--mantine-color-error);\n  font-size: var(--input-error-size, calc(var(--mantine-font-size-sm) - rem(2px)));\n}\n\n.description {\n  color: var(--mantine-color-dimmed);\n  font-size: var(--input-description-size, calc(var(--mantine-font-size-sm) - rem(2px)));\n}\n"],"mappings":""}
+{"version":3,"file":"Input.module.mjs","names":[],"sources":["../../../src/components/Input/Input.module.css"],"sourcesContent":[".wrapper {\n  position: relative;\n  margin-top: var(--input-margin-top, 0rem);\n  margin-bottom: var(--input-margin-bottom, 0rem);\n\n  --input-height-xs: 30px;\n  --input-height-sm: 36px;\n  --input-height-md: 42px;\n  --input-height-lg: 50px;\n  --input-height-xl: 60px;\n\n  --input-padding-y-xs: 5px;\n  --input-padding-y-sm: 6px;\n  --input-padding-y-md: 8px;\n  --input-padding-y-lg: 10px;\n  --input-padding-y-xl: 13px;\n\n  --input-height: var(--input-height-sm);\n  --input-radius: var(--mantine-radius-default);\n\n  --input-cursor: text;\n  --input-line-height: calc(var(--input-height) - rem(2px));\n  --input-padding: calc(var(--input-height) / 3);\n  --input-padding-inline-start: var(--input-padding);\n  --input-padding-inline-end: var(--input-padding);\n  --input-placeholder-color: var(--mantine-color-placeholder);\n  --input-color: var(--mantine-color-text);\n  --input-disabled-bg: var(--mantine-color-disabled);\n  --input-disabled-color: var(--mantine-color-disabled-color);\n\n  --input-left-section-size: var(--input-left-section-width, calc(var(--input-height) - rem(2px)));\n\n  --input-right-section-size: var(\n    --input-right-section-width,\n    calc(var(--input-height) - rem(2px))\n  );\n\n  --input-size: var(--input-height);\n\n  --section-y: 1px;\n  --left-section-start: 1px;\n  --left-section-border-radius: var(--input-radius) 0 0 var(--input-radius);\n\n  --right-section-end: 1px;\n  --right-section-border-radius: 0 var(--input-radius) var(--input-radius) 0;\n\n  &[data-variant='unstyled'] {\n    --input-padding: 0;\n    --input-padding-y: 0;\n    --input-padding-inline-start: 0;\n    --input-padding-inline-end: 0;\n  }\n\n  &[data-pointer] {\n    --input-cursor: pointer;\n  }\n\n  &[data-with-bottom-section] {\n    --input-bottom-section-height: 28px;\n  }\n\n  &[data-multiline] {\n    --input-padding-y-xs: 4.5px;\n    --input-padding-y-sm: 5.5px;\n    --input-padding-y-md: 7px;\n    --input-padding-y-lg: 9.5px;\n    --input-padding-y-xl: 13px;\n\n    --input-size: auto;\n    --input-line-height: var(--mantine-line-height);\n  }\n\n  &[data-with-left-section] {\n    --input-padding-inline-start: var(--input-left-section-size);\n  }\n\n  &[data-with-right-section] {\n    --input-padding-inline-end: var(--input-right-section-size);\n\n    &:has([data-combined-clear-section]) {\n      .wrapper[data-size='xs'] & {\n        --input-padding-inline-end: 41px;\n      }\n\n      .wrapper[data-size='sm'] & {\n        --input-padding-inline-end: 50px;\n      }\n\n      .wrapper[data-size='md'] & {\n        --input-padding-inline-end: 60px;\n      }\n\n      .wrapper[data-size='lg'] & {\n        --input-padding-inline-end: 72px;\n      }\n\n      .wrapper[data-size='xl'] & {\n        --input-padding-inline-end: 89px;\n      }\n    }\n  }\n\n  @mixin light {\n    &[data-variant='default'] {\n      --input-bd: var(--mantine-color-gray-4);\n      --input-bg: var(--mantine-color-white);\n      --input-bd-focus: var(--mantine-primary-color-filled);\n    }\n\n    &[data-variant='filled'] {\n      --input-bd: transparent;\n      --input-bg: var(--mantine-color-gray-1);\n      --input-bd-focus: var(--mantine-primary-color-filled);\n    }\n\n    &[data-variant='unstyled'] {\n      --input-bd: transparent;\n      --input-bg: transparent;\n      --input-bd-focus: transparent;\n    }\n  }\n\n  @mixin dark {\n    &[data-variant='default'] {\n      --input-bd: var(--mantine-color-dark-4);\n      --input-bg: var(--mantine-color-dark-6);\n      --input-bd-focus: var(--mantine-primary-color-filled);\n    }\n\n    &[data-variant='filled'] {\n      --input-bd: transparent;\n      --input-bg: var(--mantine-color-dark-5);\n      --input-bd-focus: var(--mantine-primary-color-filled);\n    }\n\n    &[data-variant='unstyled'] {\n      --input-bd: transparent;\n      --input-bg: transparent;\n      --input-bd-focus: transparent;\n    }\n  }\n\n  [data-mantine-color-scheme] &[data-error] {\n    &:not([data-variant='unstyled']) {\n      --input-bd: var(--mantine-color-error);\n    }\n\n    --input-color: var(--mantine-color-error);\n    --input-placeholder-color: var(--mantine-color-error);\n    --input-section-color: var(--mantine-color-error);\n  }\n\n  [data-mantine-color-scheme] &[data-success] {\n    &:not([data-variant='unstyled']) {\n      --input-bd: var(--mantine-color-success);\n    }\n\n    --input-section-color: var(--mantine-color-success);\n  }\n\n  @mixin where-rtl {\n    --left-section-border-radius: 0 var(--input-radius) var(--input-radius) 0;\n    --right-section-border-radius: var(--input-radius) 0 0 var(--input-radius);\n  }\n\n  &[dir='ltr'] {\n    --left-section-border-radius: var(--input-radius) 0 0 var(--input-radius);\n    --right-section-border-radius: 0 var(--input-radius) var(--input-radius) 0;\n  }\n}\n\n.input {\n  -webkit-tap-highlight-color: transparent;\n  appearance: none;\n  resize: var(--input-resize, none);\n  display: block;\n  width: 100%;\n  transition: border-color 100ms ease;\n\n  text-align: var(--input-text-align, start);\n  color: var(--input-color);\n  border: rem(1px) solid var(--input-bd);\n  background-color: var(--input-bg);\n  font-family: var(--input-font-family, var(--mantine-font-family));\n  height: var(--input-size);\n  min-height: var(--input-height);\n  line-height: var(--input-line-height);\n  font-size: var(--_input-fz, var(--input-fz, var(--mantine-font-size-md)));\n  border-radius: var(--input-radius);\n  padding-inline-start: var(--input-padding-inline-start);\n  padding-inline-end: var(--input-padding-inline-end);\n  padding-top: var(--input-padding-y, 0rem);\n  padding-bottom: var(--input-padding-y, 0rem);\n  cursor: var(--input-cursor);\n  overflow: var(--input-overflow);\n\n  /* Used as data attribute in Textarea component, does not have associated prop on the Input component */\n  &[data-no-overflow] {\n    --input-overflow: hidden;\n  }\n\n  /* Used as data attribute in JsonInput component, does not have associated prop on the Input component */\n  &[data-monospace] {\n    --input-font-family: var(--mantine-font-family-monospace);\n    --_input-fz: calc(var(--input-fz) - rem(2px));\n  }\n\n  &:focus,\n  &:focus-within {\n    outline: none;\n    --input-bd: var(--input-bd-focus);\n\n    .wrapper[data-error] & {\n      --input-bd: var(--mantine-color-error);\n    }\n\n    .wrapper[data-success] & {\n      --input-bd: var(--mantine-color-success);\n    }\n  }\n\n  &::placeholder {\n    color: var(--input-placeholder-color);\n    opacity: 1;\n  }\n\n  &::-webkit-inner-spin-button,\n  &::-webkit-outer-spin-button,\n  &::-webkit-search-decoration,\n  &::-webkit-search-cancel-button,\n  &::-webkit-search-results-button,\n  &::-webkit-search-results-decoration {\n    appearance: none;\n  }\n\n  &[type='number'] {\n    -moz-appearance: textfield;\n  }\n\n  &:disabled,\n  &[data-disabled] {\n    cursor: not-allowed;\n    opacity: 0.6;\n    background-color: var(--input-disabled-bg);\n    color: var(--input-disabled-color);\n  }\n\n  /* Required to be a separate selector to work in Firefox, can be merged with &:disabled once :has is supported */\n  &:has(input:disabled) {\n    cursor: not-allowed;\n    opacity: 0.6;\n    background-color: var(--input-disabled-bg);\n    color: var(--input-disabled-color);\n  }\n\n  &[readonly] {\n    caret-color: transparent;\n  }\n\n  [data-with-bottom-section] & {\n    padding-bottom: calc(var(--input-padding-y, 0rem) + var(--input-bottom-section-height));\n  }\n}\n\n.bottomSection {\n  position: absolute;\n  bottom: 1px;\n  left: 1px;\n  right: 1px;\n  height: var(--input-bottom-section-height);\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  padding-inline: var(--input-padding);\n  border-radius: 0 0 var(--input-radius) var(--input-radius);\n  pointer-events: all;\n  color: var(--mantine-color-dimmed);\n  font-size: var(--input-fz, var(--mantine-font-size-sm));\n}\n\n.section {\n  pointer-events: var(--section-pointer-events);\n  position: absolute;\n  z-index: 1;\n  inset-inline-start: var(--section-start);\n  inset-inline-end: var(--section-end);\n  bottom: var(--section-y);\n  top: var(--section-y);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: var(--section-size);\n  border-radius: var(--section-border-radius);\n  color: var(--input-section-color, var(--mantine-color-dimmed));\n\n  &[data-position='right'] {\n    --section-pointer-events: var(--input-right-section-pointer-events);\n    --section-end: var(--right-section-end);\n    --section-size: var(--input-right-section-size);\n    --section-border-radius: var(--right-section-border-radius);\n\n    &:has([data-combined-clear-section]) {\n      .wrapper[data-size='xs'] & {\n        --section-size: 41px;\n      }\n\n      .wrapper[data-size='sm'] & {\n        --section-size: 50px;\n      }\n\n      .wrapper[data-size='md'] & {\n        --section-size: 60px;\n      }\n\n      .wrapper[data-size='lg'] & {\n        --section-size: 72px;\n      }\n\n      .wrapper[data-size='xl'] & {\n        --section-size: 89px;\n      }\n    }\n  }\n\n  &[data-position='left'] {\n    --section-pointer-events: var(--input-left-section-pointer-events);\n    --section-start: var(--left-section-start);\n    --section-size: var(--input-left-section-size);\n    --section-border-radius: var(--left-section-border-radius);\n  }\n}\n\n/* ----- Input.Placeholder ----- */\n.placeholder {\n  color: var(--input-placeholder-color, var(--mantine-color-placeholder));\n\n  .wrapper[data-error] & {\n    --input-placeholder-color: var(--input-color, var(--mantine-color-placeholder));\n  }\n}\n\n/* ----- Input.Wrapper ----- */\n.root {\n  line-height: var(--mantine-line-height);\n}\n\n.label {\n  display: inline-block;\n  font-weight: var(--mantine-font-weight-medium);\n  overflow-wrap: break-word;\n  cursor: default;\n  -webkit-tap-highlight-color: transparent;\n  font-size: var(--input-label-size, var(--mantine-font-size-sm));\n}\n\n.required {\n  color: var(--input-asterisk-color, var(--mantine-color-error));\n}\n\n.error,\n.success,\n.description {\n  word-wrap: break-word;\n  line-height: 1.2;\n  display: block;\n  margin: 0;\n  padding: 0;\n}\n\n.error {\n  color: var(--mantine-color-error);\n  font-size: var(--input-error-size, calc(var(--mantine-font-size-sm) - rem(2px)));\n}\n\n.success {\n  color: var(--mantine-color-success);\n  font-size: var(--input-success-size, calc(var(--mantine-font-size-sm) - rem(2px)));\n}\n\n.description {\n  color: var(--mantine-color-dimmed);\n  font-size: var(--input-description-size, calc(var(--mantine-font-size-sm) - rem(2px)));\n}\n"],"mappings":""}

package/esm/components/Input/InputDescription/InputDescription.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"InputDescription.mjs","names":["classes"],"sources":["../../../../src/components/Input/InputDescription/InputDescription.tsx"],"sourcesContent":["import { use } from 'react';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getFontSize,\n  MantineFontSize,\n  rem,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../../core';\nimport { InputWrapperContext } from '../InputWrapper.context';\nimport classes from '../Input.module.css';\n\nexport type InputDescriptionStylesNames = 'description';\nexport type InputDescriptionCssVariables = {\n  description: '--input-description-size';\n};\n\nexport interface InputDescriptionProps\n  extends BoxProps, StylesApiProps<InputDescriptionFactory>, ElementProps<'div'> {\n  __staticSelector?: string;\n  __inheritStyles?: boolean;\n\n  /** Controls description `font-size` @default 'sm' */\n  size?: MantineFontSize;\n}\n\nexport type InputDescriptionFactory = Factory<{\n  props: InputDescriptionProps;\n  ref: HTMLParagraphElement;\n  stylesNames: InputDescriptionStylesNames;\n  vars: InputDescriptionCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<InputDescriptionFactory>((_, { size }) => ({\n  description: {\n    '--input-description-size':\n      size === undefined ? undefined : `calc(${getFontSize(size)} - ${rem(2)})`,\n  },\n}));\n\nexport const InputDescription = factory<InputDescriptionFactory>((_props) => {\n  const props = useProps('InputDescription', null, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    __staticSelector,\n    __inheritStyles = true,\n    attributes,\n    ...others\n  } = useProps('InputDescription', null, props);\n  const ctx = use(InputWrapperContext);\n\n  const _getStyles = useStyles<InputDescriptionFactory>({\n    name: ['InputWrapper', __staticSelector],\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    rootSelector: 'description',\n    vars,\n    varsResolver,\n  });\n\n  const getStyles = (__inheritStyles && ctx?.getStyles) || _getStyles;\n\n  return (\n    <Box\n      component=\"p\"\n      {...getStyles('description', ctx?.getStyles ? { className, style } : undefined)}\n      {...others}\n    />\n  );\n});\n\nInputDescription.classes = classes;\nInputDescription.varsResolver = varsResolver;\nInputDescription.displayName = '@mantine/core/InputDescription';\n"],"mappings":";;;;;;;;;;;;;AAuCA,MAAM,eAAe,oBAA6C,GAAG,EAAE,YAAY,EACjF,aAAa,EACX,4BACE,SAAS,KAAA,IAAY,KAAA,IAAY,QAAQ,YAAY,IAAI,EAAE,KAAK,IAAI,CAAC,EAAE,GAC3E,EACF,EAAE;AAEF,MAAa,mBAAmB,SAAkC,WAAW;CAC3E,MAAM,QAAQ,SAAS,oBAAoB,MAAM,MAAM;CACvD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,kBACA,kBAAkB,MAClB,YACA,GAAG,WACD,SAAS,oBAAoB,MAAM,KAAK;CAC5C,MAAM,MAAM,IAAI,mBAAmB;CAEnC,MAAM,aAAa,UAAmC;EACpD,MAAM,CAAC,gBAAgB,gBAAgB;EACvC;EACA,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;EACd;EACA;CACF,CAAC;CAID,OACE,oBAAC,KAAD;EACE,WAAU;EACV,IALe,mBAAmB,KAAK,aAAc,YAKvC,eAAe,KAAK,YAAY;GAAE;GAAW;EAAM,IAAI,KAAA,CAAS;EAC9E,GAAI;CACL,CAAA;AAEL,CAAC;AAED,iBAAiB,UAAUA;AAC3B,iBAAiB,eAAe;AAChC,iBAAiB,cAAc"}
+{"version":3,"file":"InputDescription.mjs","names":["classes"],"sources":["../../../../src/components/Input/InputDescription/InputDescription.tsx"],"sourcesContent":["import { use } from 'react';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getFontSize,\n  MantineFontSize,\n  rem,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../../core';\nimport { InputWrapperContext } from '../InputWrapper.context';\nimport classes from '../Input.module.css';\n\nexport type InputDescriptionStylesNames = 'description';\nexport type InputDescriptionCssVariables = {\n  description: '--input-description-size';\n};\n\nexport interface InputDescriptionProps\n  extends BoxProps, StylesApiProps<InputDescriptionFactory>, ElementProps<'div'> {\n  __staticSelector?: string;\n  __inheritStyles?: boolean;\n\n  /** Controls description `font-size` @default 'sm' */\n  size?: MantineFontSize;\n}\n\nexport type InputDescriptionFactory = Factory<{\n  props: InputDescriptionProps;\n  ref: HTMLParagraphElement;\n  stylesNames: InputDescriptionStylesNames;\n  vars: InputDescriptionCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<InputDescriptionFactory>((_, { size }) => ({\n  description: {\n    '--input-description-size':\n      size === undefined ? undefined : `calc(${getFontSize(size)} - ${rem(2)})`,\n  },\n}));\n\nexport const InputDescription = factory<InputDescriptionFactory>((_props) => {\n  const props = useProps('InputDescription', null, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    __staticSelector,\n    __inheritStyles = true,\n    attributes,\n    ...others\n  } = useProps('InputDescription', null, props);\n  const ctx = use(InputWrapperContext);\n\n  const _getStyles = useStyles<InputDescriptionFactory>({\n    name: ['InputWrapper', __staticSelector],\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    rootSelector: 'description',\n    vars,\n    varsResolver,\n  });\n\n  const getStyles = (__inheritStyles && ctx?.getStyles) || _getStyles;\n\n  return (\n    <Box\n      component=\"p\"\n      {...getStyles('description', ctx?.getStyles ? { className, style } : undefined)}\n      {...others}\n    />\n  );\n});\n\nInputDescription.classes = classes;\nInputDescription.varsResolver = varsResolver;\nInputDescription.displayName = '@mantine/core/InputDescription';\n"],"mappings":";;;;;;;;;;;;;AAuCA,MAAM,eAAe,oBAA6C,GAAG,EAAE,YAAY,EACjF,aAAa,EACX,4BACE,SAAS,KAAA,IAAY,KAAA,IAAY,QAAQ,YAAY,IAAI,EAAE,KAAK,IAAI,CAAC,EAAE,GAC3E,EACF,EAAE;AAEF,MAAa,mBAAmB,SAAkC,WAAW;CAC3E,MAAM,QAAQ,SAAS,oBAAoB,MAAM,MAAM;CACvD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,kBACA,kBAAkB,MAClB,YACA,GAAG,WACD,SAAS,oBAAoB,MAAM,KAAK;CAC5C,MAAM,MAAM,IAAI,mBAAmB;CAEnC,MAAM,aAAa,UAAmC;EACpD,MAAM,CAAC,gBAAgB,gBAAgB;EACvC;EACA,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;EACd;EACA;CACF,CAAC;CAID,OACE,oBAAC,KAAD;EACE,WAAU;EACV,IALe,mBAAmB,KAAK,aAAc,WAAA,CAKvC,eAAe,KAAK,YAAY;GAAE;GAAW;EAAM,IAAI,KAAA,CAAS;EAC9E,GAAI;CACL,CAAA;AAEL,CAAC;AAED,iBAAiB,UAAUA;AAC3B,iBAAiB,eAAe;AAChC,iBAAiB,cAAc"}

package/esm/components/Input/InputError/InputError.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"InputError.mjs","names":["classes"],"sources":["../../../../src/components/Input/InputError/InputError.tsx"],"sourcesContent":["import { use } from 'react';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getFontSize,\n  MantineFontSize,\n  rem,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../../core';\nimport { InputWrapperContext } from '../InputWrapper.context';\nimport classes from '../Input.module.css';\n\nexport type InputErrorStylesNames = 'error';\nexport type InputErrorCssVariables = {\n  error: '--input-error-size';\n};\n\nexport interface InputErrorProps\n  extends BoxProps, StylesApiProps<InputErrorFactory>, ElementProps<'div'> {\n  __staticSelector?: string;\n  __inheritStyles?: boolean;\n\n  /** Controls error `font-size` @default 'sm' */\n  size?: MantineFontSize;\n}\n\nexport type InputErrorFactory = Factory<{\n  props: InputErrorProps;\n  ref: HTMLParagraphElement;\n  stylesNames: InputErrorStylesNames;\n  vars: InputErrorCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<InputErrorFactory>((_, { size }) => ({\n  error: {\n    '--input-error-size': size === undefined ? undefined : `calc(${getFontSize(size)} - ${rem(2)})`,\n  },\n}));\n\nexport const InputError = factory<InputErrorFactory>((_props) => {\n  const props = useProps('InputError', null, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    attributes,\n    __staticSelector,\n    __inheritStyles = true,\n    ...others\n  } = props;\n\n  const _getStyles = useStyles<InputErrorFactory>({\n    name: ['InputWrapper', __staticSelector],\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    rootSelector: 'error',\n    vars,\n    varsResolver,\n  });\n\n  const ctx = use(InputWrapperContext);\n  const getStyles = (__inheritStyles && ctx?.getStyles) || _getStyles;\n\n  return (\n    <Box\n      component=\"p\"\n      {...getStyles('error', ctx?.getStyles ? { className, style } : undefined)}\n      {...others}\n    />\n  );\n});\n\nInputError.classes = classes;\nInputError.varsResolver = varsResolver;\nInputError.displayName = '@mantine/core/InputError';\n"],"mappings":";;;;;;;;;;;;;AAuCA,MAAM,eAAe,oBAAuC,GAAG,EAAE,YAAY,EAC3E,OAAO,EACL,sBAAsB,SAAS,KAAA,IAAY,KAAA,IAAY,QAAQ,YAAY,IAAI,EAAE,KAAK,IAAI,CAAC,EAAE,GAC/F,EACF,EAAE;AAEF,MAAa,aAAa,SAA4B,WAAW;CAC/D,MAAM,QAAQ,SAAS,cAAc,MAAM,MAAM;CACjD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,YACA,kBACA,kBAAkB,MAClB,GAAG,WACD;CAEJ,MAAM,aAAa,UAA6B;EAC9C,MAAM,CAAC,gBAAgB,gBAAgB;EACvC;EACA,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;EACd;EACA;CACF,CAAC;CAED,MAAM,MAAM,IAAI,mBAAmB;CAGnC,OACE,oBAAC,KAAD;EACE,WAAU;EACV,IALe,mBAAmB,KAAK,aAAc,YAKvC,SAAS,KAAK,YAAY;GAAE;GAAW;EAAM,IAAI,KAAA,CAAS;EACxE,GAAI;CACL,CAAA;AAEL,CAAC;AAED,WAAW,UAAUA;AACrB,WAAW,eAAe;AAC1B,WAAW,cAAc"}
+{"version":3,"file":"InputError.mjs","names":["classes"],"sources":["../../../../src/components/Input/InputError/InputError.tsx"],"sourcesContent":["import { use } from 'react';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getFontSize,\n  MantineFontSize,\n  rem,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../../core';\nimport { InputWrapperContext } from '../InputWrapper.context';\nimport classes from '../Input.module.css';\n\nexport type InputErrorStylesNames = 'error';\nexport type InputErrorCssVariables = {\n  error: '--input-error-size';\n};\n\nexport interface InputErrorProps\n  extends BoxProps, StylesApiProps<InputErrorFactory>, ElementProps<'div'> {\n  __staticSelector?: string;\n  __inheritStyles?: boolean;\n\n  /** Controls error `font-size` @default 'sm' */\n  size?: MantineFontSize;\n}\n\nexport type InputErrorFactory = Factory<{\n  props: InputErrorProps;\n  ref: HTMLParagraphElement;\n  stylesNames: InputErrorStylesNames;\n  vars: InputErrorCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<InputErrorFactory>((_, { size }) => ({\n  error: {\n    '--input-error-size': size === undefined ? undefined : `calc(${getFontSize(size)} - ${rem(2)})`,\n  },\n}));\n\nexport const InputError = factory<InputErrorFactory>((_props) => {\n  const props = useProps('InputError', null, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    attributes,\n    __staticSelector,\n    __inheritStyles = true,\n    ...others\n  } = props;\n\n  const _getStyles = useStyles<InputErrorFactory>({\n    name: ['InputWrapper', __staticSelector],\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    rootSelector: 'error',\n    vars,\n    varsResolver,\n  });\n\n  const ctx = use(InputWrapperContext);\n  const getStyles = (__inheritStyles && ctx?.getStyles) || _getStyles;\n\n  return (\n    <Box\n      component=\"p\"\n      {...getStyles('error', ctx?.getStyles ? { className, style } : undefined)}\n      {...others}\n    />\n  );\n});\n\nInputError.classes = classes;\nInputError.varsResolver = varsResolver;\nInputError.displayName = '@mantine/core/InputError';\n"],"mappings":";;;;;;;;;;;;;AAuCA,MAAM,eAAe,oBAAuC,GAAG,EAAE,YAAY,EAC3E,OAAO,EACL,sBAAsB,SAAS,KAAA,IAAY,KAAA,IAAY,QAAQ,YAAY,IAAI,EAAE,KAAK,IAAI,CAAC,EAAE,GAC/F,EACF,EAAE;AAEF,MAAa,aAAa,SAA4B,WAAW;CAC/D,MAAM,QAAQ,SAAS,cAAc,MAAM,MAAM;CACjD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,YACA,kBACA,kBAAkB,MAClB,GAAG,WACD;CAEJ,MAAM,aAAa,UAA6B;EAC9C,MAAM,CAAC,gBAAgB,gBAAgB;EACvC;EACA,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;EACd;EACA;CACF,CAAC;CAED,MAAM,MAAM,IAAI,mBAAmB;CAGnC,OACE,oBAAC,KAAD;EACE,WAAU;EACV,IALe,mBAAmB,KAAK,aAAc,WAAA,CAKvC,SAAS,KAAK,YAAY;GAAE;GAAW;EAAM,IAAI,KAAA,CAAS;EACxE,GAAI;CACL,CAAA;AAEL,CAAC;AAED,WAAW,UAAUA;AACrB,WAAW,eAAe;AAC1B,WAAW,cAAc"}

package/esm/components/Input/InputPlaceholder/InputPlaceholder.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"InputPlaceholder.mjs","names":["classes"],"sources":["../../../../src/components/Input/InputPlaceholder/InputPlaceholder.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  ElementProps,\n  factory,\n  Factory,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../../core';\nimport classes from '../Input.module.css';\n\nexport type InputPlaceholderStylesNames = 'placeholder';\n\nexport interface InputPlaceholderProps\n  extends BoxProps, StylesApiProps<InputPlaceholderFactory>, ElementProps<'span'> {\n  __staticSelector?: string;\n\n  /** If set, the placeholder has error styles @default false */\n  error?: React.ReactNode;\n}\n\nexport type InputPlaceholderFactory = Factory<{\n  props: InputPlaceholderProps;\n  ref: HTMLSpanElement;\n  stylesNames: InputPlaceholderStylesNames;\n}>;\n\nexport const InputPlaceholder = factory<InputPlaceholderFactory>((_props) => {\n  const props = useProps('InputPlaceholder', null, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    __staticSelector,\n    error,\n    mod,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<InputPlaceholderFactory>({\n    name: ['InputPlaceholder', __staticSelector],\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    rootSelector: 'placeholder',\n  });\n\n  return (\n    <Box\n      {...getStyles('placeholder')}\n      mod={[{ error: !!error }, mod]}\n      component=\"span\"\n      {...others}\n    />\n  );\n});\n\nInputPlaceholder.classes = classes;\nInputPlaceholder.displayName = '@mantine/core/InputPlaceholder';\n"],"mappings":";;;;;;;;AA4BA,MAAa,mBAAmB,SAAkC,WAAW;CAC3E,MAAM,QAAQ,SAAS,oBAAoB,MAAM,MAAM;CACvD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,kBACA,OACA,KACA,YACA,GAAG,WACD;CAeJ,OACE,oBAAC,KAAD;EACE,GAfc,UAAmC;GACnD,MAAM,CAAC,oBAAoB,gBAAgB;GAC3C;GACA,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA,cAAc;EAChB,CAIgB,EAAE,aAAa;EAC3B,KAAK,CAAC,EAAE,OAAO,CAAC,CAAC,MAAM,GAAG,GAAG;EAC7B,WAAU;EACV,GAAI;CACL,CAAA;AAEL,CAAC;AAED,iBAAiB,UAAUA;AAC3B,iBAAiB,cAAc"}
+{"version":3,"file":"InputPlaceholder.mjs","names":["classes"],"sources":["../../../../src/components/Input/InputPlaceholder/InputPlaceholder.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  ElementProps,\n  factory,\n  Factory,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../../core';\nimport classes from '../Input.module.css';\n\nexport type InputPlaceholderStylesNames = 'placeholder';\n\nexport interface InputPlaceholderProps\n  extends BoxProps, StylesApiProps<InputPlaceholderFactory>, ElementProps<'span'> {\n  __staticSelector?: string;\n\n  /** If set, the placeholder has error styles @default false */\n  error?: React.ReactNode;\n}\n\nexport type InputPlaceholderFactory = Factory<{\n  props: InputPlaceholderProps;\n  ref: HTMLSpanElement;\n  stylesNames: InputPlaceholderStylesNames;\n}>;\n\nexport const InputPlaceholder = factory<InputPlaceholderFactory>((_props) => {\n  const props = useProps('InputPlaceholder', null, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    __staticSelector,\n    error,\n    mod,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<InputPlaceholderFactory>({\n    name: ['InputPlaceholder', __staticSelector],\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    rootSelector: 'placeholder',\n  });\n\n  return (\n    <Box\n      {...getStyles('placeholder')}\n      mod={[{ error: !!error }, mod]}\n      component=\"span\"\n      {...others}\n    />\n  );\n});\n\nInputPlaceholder.classes = classes;\nInputPlaceholder.displayName = '@mantine/core/InputPlaceholder';\n"],"mappings":";;;;;;;;AA4BA,MAAa,mBAAmB,SAAkC,WAAW;CAC3E,MAAM,QAAQ,SAAS,oBAAoB,MAAM,MAAM;CACvD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,kBACA,OACA,KACA,YACA,GAAG,WACD;CAeJ,OACE,oBAAC,KAAD;EACE,GAfc,UAAmC;GACnD,MAAM,CAAC,oBAAoB,gBAAgB;GAC3C;GACA,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA,cAAc;EAChB,CAIgB,CAAC,CAAC,aAAa;EAC3B,KAAK,CAAC,EAAE,OAAO,CAAC,CAAC,MAAM,GAAG,GAAG;EAC7B,WAAU;EACV,GAAI;CACL,CAAA;AAEL,CAAC;AAED,iBAAiB,UAAUA;AAC3B,iBAAiB,cAAc"}

package/esm/components/Input/InputSuccess/InputSuccess.mjs

@@ -0,0 +1,48 @@
+"use client";
+import { rem } from "../../../core/utils/units-converters/rem.mjs";
+import { getFontSize } from "../../../core/utils/get-size/get-size.mjs";
+import { createVarsResolver } from "../../../core/styles-api/create-vars-resolver/create-vars-resolver.mjs";
+import { useProps } from "../../../core/MantineProvider/use-props/use-props.mjs";
+import { useStyles } from "../../../core/styles-api/use-styles/use-styles.mjs";
+import { factory } from "../../../core/factory/factory.mjs";
+import { Box } from "../../../core/Box/Box.mjs";
+import { InputWrapperContext } from "../InputWrapper.context.mjs";
+import Input_module_default from "../Input.module.mjs";
+import { use } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region packages/@mantine/core/src/components/Input/InputSuccess/InputSuccess.tsx
+const varsResolver = createVarsResolver((_, { size }) => ({ success: { "--input-success-size": size === void 0 ? void 0 : `calc(${getFontSize(size)} - ${rem(2)})` } }));
+const InputSuccess = factory((_props) => {
+	const props = useProps("InputSuccess", null, _props);
+	const { classNames, className, style, styles, unstyled, vars, attributes, __staticSelector, __inheritStyles = true, ...others } = props;
+	const _getStyles = useStyles({
+		name: ["InputWrapper", __staticSelector],
+		props,
+		classes: Input_module_default,
+		className,
+		style,
+		classNames,
+		styles,
+		unstyled,
+		attributes,
+		rootSelector: "success",
+		vars,
+		varsResolver
+	});
+	const ctx = use(InputWrapperContext);
+	return /* @__PURE__ */ jsx(Box, {
+		component: "p",
+		...(__inheritStyles && ctx?.getStyles || _getStyles)("success", ctx?.getStyles ? {
+			className,
+			style
+		} : void 0),
+		...others
+	});
+});
+InputSuccess.classes = Input_module_default;
+InputSuccess.varsResolver = varsResolver;
+InputSuccess.displayName = "@mantine/core/InputSuccess";
+//#endregion
+export { InputSuccess };
+
+//# sourceMappingURL=InputSuccess.mjs.map

package/esm/components/Input/InputSuccess/InputSuccess.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputSuccess.mjs","names":["classes"],"sources":["../../../../src/components/Input/InputSuccess/InputSuccess.tsx"],"sourcesContent":["import { use } from 'react';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getFontSize,\n  MantineFontSize,\n  rem,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../../core';\nimport { InputWrapperContext } from '../InputWrapper.context';\nimport classes from '../Input.module.css';\n\nexport type InputSuccessStylesNames = 'success';\nexport type InputSuccessCssVariables = {\n  success: '--input-success-size';\n};\n\nexport interface InputSuccessProps\n  extends BoxProps, StylesApiProps<InputSuccessFactory>, ElementProps<'div'> {\n  __staticSelector?: string;\n  __inheritStyles?: boolean;\n\n  /** Controls success `font-size` @default 'sm' */\n  size?: MantineFontSize;\n}\n\nexport type InputSuccessFactory = Factory<{\n  props: InputSuccessProps;\n  ref: HTMLParagraphElement;\n  stylesNames: InputSuccessStylesNames;\n  vars: InputSuccessCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<InputSuccessFactory>((_, { size }) => ({\n  success: {\n    '--input-success-size':\n      size === undefined ? undefined : `calc(${getFontSize(size)} - ${rem(2)})`,\n  },\n}));\n\nexport const InputSuccess = factory<InputSuccessFactory>((_props) => {\n  const props = useProps('InputSuccess', null, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    attributes,\n    __staticSelector,\n    __inheritStyles = true,\n    ...others\n  } = props;\n\n  const _getStyles = useStyles<InputSuccessFactory>({\n    name: ['InputWrapper', __staticSelector],\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    rootSelector: 'success',\n    vars,\n    varsResolver,\n  });\n\n  const ctx = use(InputWrapperContext);\n  const getStyles = (__inheritStyles && ctx?.getStyles) || _getStyles;\n\n  return (\n    <Box\n      component=\"p\"\n      {...getStyles('success', ctx?.getStyles ? { className, style } : undefined)}\n      {...others}\n    />\n  );\n});\n\nInputSuccess.classes = classes;\nInputSuccess.varsResolver = varsResolver;\nInputSuccess.displayName = '@mantine/core/InputSuccess';\n"],"mappings":";;;;;;;;;;;;;AAuCA,MAAM,eAAe,oBAAyC,GAAG,EAAE,YAAY,EAC7E,SAAS,EACP,wBACE,SAAS,KAAA,IAAY,KAAA,IAAY,QAAQ,YAAY,IAAI,EAAE,KAAK,IAAI,CAAC,EAAE,GAC3E,EACF,EAAE;AAEF,MAAa,eAAe,SAA8B,WAAW;CACnE,MAAM,QAAQ,SAAS,gBAAgB,MAAM,MAAM;CACnD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,YACA,kBACA,kBAAkB,MAClB,GAAG,WACD;CAEJ,MAAM,aAAa,UAA+B;EAChD,MAAM,CAAC,gBAAgB,gBAAgB;EACvC;EACA,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;EACd;EACA;CACF,CAAC;CAED,MAAM,MAAM,IAAI,mBAAmB;CAGnC,OACE,oBAAC,KAAD;EACE,WAAU;EACV,IALe,mBAAmB,KAAK,aAAc,WAAA,CAKvC,WAAW,KAAK,YAAY;GAAE;GAAW;EAAM,IAAI,KAAA,CAAS;EAC1E,GAAI;CACL,CAAA;AAEL,CAAC;AAED,aAAa,UAAUA;AACvB,aAAa,eAAe;AAC5B,aAAa,cAAc"}