@mantine/core 9.0.0-alpha.6 → 9.0.0-alpha.7

package/esm/components/Select/Select.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Select.mjs","names":["useId"],"sources":["../../../src/components/Select/Select.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef } from 'react';\nimport { useId, usePrevious, useUncontrolled } from '@mantine/hooks';\nimport {\n  BoxProps,\n  ElementProps,\n  Factory,\n  genericFactory,\n  MantineColor,\n  Primitive,\n  StylesApiProps,\n  useProps,\n  useResolvedStylesApi,\n} from '../../core';\nimport {\n  Combobox,\n  ComboboxItem,\n  ComboboxLikeProps,\n  ComboboxLikeRenderOptionInput,\n  ComboboxLikeStylesNames,\n  getOptionsLockup,\n  getParsedComboboxData,\n  OptionsDropdown,\n  OptionsFilter,\n  useCombobox,\n} from '../Combobox';\nimport {\n  __BaseInputProps,\n  __InputStylesNames,\n  ClearSectionMode,\n  InputClearButtonProps,\n  InputVariant,\n} from '../Input';\nimport { InputBase } from '../InputBase';\nimport { ScrollAreaProps } from '../ScrollArea';\n\nexport type SelectStylesNames = __InputStylesNames | ComboboxLikeStylesNames;\n\nexport interface SelectProps<Value extends Primitive = string>\n  extends\n    BoxProps,\n    __BaseInputProps,\n    ComboboxLikeProps<Value>,\n    StylesApiProps<SelectFactory>,\n    ElementProps<'input', 'onChange' | 'size' | 'value' | 'defaultValue'> {\n  /** Controlled component value */\n  value?: Value | null;\n\n  /** Uncontrolled component default value */\n  defaultValue?: Value | null;\n\n  /** Called when value changes */\n  onChange?: (value: Value | null, option: ComboboxItem<Value>) => void;\n\n  /** Called when the clear button is clicked */\n  onClear?: () => void;\n\n  /** Determines whether the select should be searchable @default false */\n  searchable?: boolean;\n\n  /** Displays check icon near the selected option label @default true */\n  withCheckIcon?: boolean;\n\n  /** Aligns unchecked labels with the checked one @default false */\n  withAlignedLabels?: boolean;\n\n  /** Position of the check icon relative to the option label @default 'left' */\n  checkIconPosition?: 'left' | 'right';\n\n  /** Message displayed when no options match the search query or when there is no data */\n  nothingFoundMessage?: React.ReactNode;\n\n  /** Controlled search value */\n  searchValue?: string;\n\n  /** Default search value */\n  defaultSearchValue?: string;\n\n  /** Called when search changes */\n  onSearchChange?: (value: string) => void;\n\n  /** Allows deselecting the selected option by clicking it @default true */\n  allowDeselect?: boolean;\n\n  /** Displays clear button in the right section when component has value @default false */\n  clearable?: boolean;\n\n  /** Determines how the clear button and rightSection are rendered @default 'both' */\n  clearSectionMode?: ClearSectionMode;\n\n  /** Props passed down to the clear button */\n  clearButtonProps?: InputClearButtonProps;\n\n  /** Props passed down to the hidden input */\n  hiddenInputProps?: Omit<React.ComponentProps<'input'>, 'value'>;\n\n  /** A function to render content of the option, replaces the default content of the option */\n  renderOption?: (item: ComboboxLikeRenderOptionInput<ComboboxItem>) => React.ReactNode;\n\n  /** Props passed down to the underlying `ScrollArea` component in the dropdown */\n  scrollAreaProps?: ScrollAreaProps;\n\n  /** Controls color of the default chevron, by default depends on the color scheme */\n  chevronColor?: MantineColor;\n\n  /** Automatically selects the highlighted option when input loses focus @default false */\n  autoSelectOnBlur?: boolean;\n\n  /** Opens dropdown when input receives focus (requires searchable={true}) @default true */\n  openOnFocus?: boolean;\n}\n\nexport type SelectFactory = Factory<{\n  props: SelectProps;\n  ref: HTMLInputElement;\n  stylesNames: SelectStylesNames;\n  variant: InputVariant;\n  signature: <Value extends Primitive = string>(props: SelectProps<Value>) => React.JSX.Element;\n}>;\n\nconst defaultProps = {\n  withCheckIcon: true,\n  allowDeselect: true,\n  checkIconPosition: 'left',\n  openOnFocus: true,\n} satisfies Partial<SelectProps>;\n\nexport const Select = genericFactory<SelectFactory>((_props) => {\n  const props = useProps('Select', defaultProps, _props);\n  const {\n    classNames,\n    styles,\n    unstyled,\n    vars,\n    dropdownOpened,\n    defaultDropdownOpened,\n    onDropdownClose,\n    onDropdownOpen,\n    onFocus,\n    onBlur,\n    onClick,\n    onChange,\n    data,\n    value,\n    defaultValue,\n    selectFirstOptionOnChange,\n    selectFirstOptionOnDropdownOpen,\n    onOptionSubmit,\n    comboboxProps,\n    readOnly,\n    disabled,\n    filter,\n    limit,\n    withScrollArea,\n    maxDropdownHeight,\n    size,\n    searchable,\n    rightSection,\n    checkIconPosition,\n    withCheckIcon,\n    withAlignedLabels,\n    nothingFoundMessage,\n    name,\n    form,\n    searchValue,\n    defaultSearchValue,\n    onSearchChange,\n    allowDeselect,\n    error,\n    rightSectionPointerEvents,\n    id,\n    clearable,\n    clearSectionMode,\n    clearButtonProps,\n    hiddenInputProps,\n    renderOption,\n    onClear,\n    autoComplete,\n    scrollAreaProps,\n    __defaultRightSection,\n    __clearSection,\n    __clearable,\n    chevronColor,\n    autoSelectOnBlur,\n    openOnFocus,\n    attributes,\n    ...others\n  } = props;\n\n  const parsedData = useMemo(() => getParsedComboboxData(data), [data]);\n  const retainedSelectedOptions = useRef<Record<string, ComboboxItem<Primitive>>>({});\n  const optionsLockup = useMemo(() => getOptionsLockup(parsedData), [parsedData]);\n  const _id = useId(id);\n\n  const [_value, setValue, controlled] = useUncontrolled({\n    value,\n    defaultValue,\n    finalValue: null,\n    onChange,\n  });\n\n  const selectedOption =\n    typeof _value === 'string'\n      ? _value in optionsLockup\n        ? optionsLockup[_value]\n        : retainedSelectedOptions.current[_value]\n      : undefined;\n  const previousSelectedOption = usePrevious(selectedOption);\n\n  const [search, setSearch, searchControlled] = useUncontrolled({\n    value: searchValue,\n    defaultValue: defaultSearchValue,\n    finalValue: selectedOption ? selectedOption.label : '',\n    onChange: onSearchChange,\n  });\n\n  const combobox = useCombobox({\n    opened: dropdownOpened,\n    defaultOpened: defaultDropdownOpened,\n    onDropdownOpen: () => {\n      onDropdownOpen?.();\n      if (selectFirstOptionOnDropdownOpen) {\n        combobox.selectFirstOption();\n      } else {\n        combobox.updateSelectedOptionIndex('active', { scrollIntoView: true });\n      }\n    },\n    onDropdownClose: () => {\n      onDropdownClose?.();\n      // Required for autoSelectOnBlur to work correctly\n      setTimeout(combobox.resetSelectedOption, 0);\n    },\n  });\n\n  const handleSearchChange = (value: string) => {\n    setSearch(value);\n    combobox.resetSelectedOption();\n  };\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<SelectFactory>({\n    props,\n    styles,\n    classNames,\n  });\n\n  useEffect(() => {\n    if (selectFirstOptionOnChange) {\n      combobox.selectFirstOption();\n    }\n  }, [selectFirstOptionOnChange, search]);\n\n  useEffect(() => {\n    if (value === null) {\n      handleSearchChange('');\n    }\n\n    if (\n      typeof value === 'string' &&\n      selectedOption &&\n      (previousSelectedOption?.value !== selectedOption.value ||\n        previousSelectedOption?.label !== selectedOption.label)\n    ) {\n      handleSearchChange(selectedOption.label);\n    }\n  }, [value, selectedOption]);\n\n  useEffect(() => {\n    if (!controlled && !searchControlled) {\n      handleSearchChange(\n        typeof _value === 'string'\n          ? _value in optionsLockup\n            ? optionsLockup[_value]?.label\n            : retainedSelectedOptions.current[_value]?.label || ''\n          : ''\n      );\n    }\n  }, [optionsLockup, _value]);\n\n  useEffect(() => {\n    if (_value) {\n      if (`${_value}` in optionsLockup) {\n        retainedSelectedOptions.current[`${_value}`] = optionsLockup[`${_value}`];\n      }\n    }\n  }, [optionsLockup, _value]);\n\n  const clearButton = (\n    <Combobox.ClearButton\n      {...clearButtonProps}\n      onClear={() => {\n        setValue(null, null);\n        handleSearchChange('');\n        onClear?.();\n      }}\n    />\n  );\n\n  const _clearable = clearable && !!_value && !disabled && !readOnly;\n\n  return (\n    <>\n      <Combobox\n        store={combobox}\n        __staticSelector=\"Select\"\n        classNames={resolvedClassNames}\n        styles={resolvedStyles}\n        unstyled={unstyled}\n        readOnly={readOnly}\n        size={size}\n        attributes={attributes}\n        keepMounted={autoSelectOnBlur}\n        onOptionSubmit={(val) => {\n          onOptionSubmit?.(val as any);\n          const optionLockup = allowDeselect\n            ? optionsLockup[val].value === _value\n              ? null\n              : optionsLockup[val]\n            : optionsLockup[val];\n\n          const nextValue = optionLockup ? optionLockup.value : null;\n\n          nextValue !== _value && setValue(nextValue as any, optionLockup);\n          !controlled &&\n            handleSearchChange(typeof nextValue === 'string' ? optionLockup?.label || '' : '');\n          combobox.closeDropdown();\n        }}\n        {...comboboxProps}\n      >\n        <Combobox.Target targetType={searchable ? 'input' : 'button'} autoComplete={autoComplete}>\n          <InputBase\n            id={_id}\n            __defaultRightSection={\n              <Combobox.Chevron\n                size={size}\n                error={error}\n                unstyled={unstyled}\n                color={chevronColor}\n              />\n            }\n            __clearSection={clearButton}\n            __clearable={_clearable}\n            __clearSectionMode={clearSectionMode}\n            rightSection={rightSection}\n            rightSectionPointerEvents={rightSectionPointerEvents || 'none'}\n            {...others}\n            size={size}\n            __staticSelector=\"Select\"\n            disabled={disabled}\n            readOnly={readOnly || !searchable}\n            value={search}\n            onChange={(event) => {\n              handleSearchChange(event.currentTarget.value);\n              combobox.openDropdown();\n              selectFirstOptionOnChange && combobox.selectFirstOption();\n            }}\n            onFocus={(event) => {\n              openOnFocus && !!searchable && combobox.openDropdown();\n              onFocus?.(event);\n            }}\n            onBlur={(event) => {\n              if (autoSelectOnBlur) {\n                combobox.clickSelectedOption();\n              }\n\n              !!searchable && combobox.closeDropdown();\n              const optionLockup =\n                typeof _value === 'string' &&\n                (_value in optionsLockup\n                  ? optionsLockup[_value]\n                  : retainedSelectedOptions.current[_value]);\n              handleSearchChange(optionLockup ? optionLockup.label || '' : '');\n              onBlur?.(event);\n            }}\n            onClick={(event) => {\n              searchable ? combobox.openDropdown() : combobox.toggleDropdown();\n              onClick?.(event);\n            }}\n            classNames={resolvedClassNames}\n            styles={resolvedStyles}\n            unstyled={unstyled}\n            pointer={!searchable}\n            error={error}\n            attributes={attributes}\n          />\n        </Combobox.Target>\n        <OptionsDropdown\n          data={parsedData as any}\n          hidden={readOnly || disabled}\n          filter={filter as OptionsFilter<Primitive> | undefined}\n          search={search}\n          limit={limit}\n          hiddenWhenEmpty={!nothingFoundMessage}\n          withScrollArea={withScrollArea}\n          maxDropdownHeight={maxDropdownHeight}\n          filterOptions={!!searchable && selectedOption?.label !== search}\n          value={_value}\n          checkIconPosition={checkIconPosition}\n          withCheckIcon={withCheckIcon}\n          withAlignedLabels={withAlignedLabels}\n          nothingFoundMessage={nothingFoundMessage}\n          unstyled={unstyled}\n          labelId={others.label ? `${_id}-label` : undefined}\n          aria-label={others.label ? undefined : others['aria-label']}\n          renderOption={renderOption}\n          scrollAreaProps={scrollAreaProps}\n        />\n      </Combobox>\n      <Combobox.HiddenInput\n        value={_value}\n        name={name}\n        form={form}\n        disabled={disabled}\n        {...hiddenInputProps}\n      />\n    </>\n  );\n});\n\nSelect.classes = { ...InputBase.classes, ...Combobox.classes };\nSelect.displayName = '@mantine/core/Select';\n"],"mappings":"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"}
+{"version":3,"file":"Select.mjs","names":["useId"],"sources":["../../../src/components/Select/Select.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef } from 'react';\nimport { useId, usePrevious, useUncontrolled } from '@mantine/hooks';\nimport {\n  BoxProps,\n  ElementProps,\n  Factory,\n  genericFactory,\n  MantineColor,\n  Primitive,\n  StylesApiProps,\n  useProps,\n  useResolvedStylesApi,\n} from '../../core';\nimport {\n  Combobox,\n  ComboboxItem,\n  ComboboxLikeProps,\n  ComboboxLikeRenderOptionInput,\n  ComboboxLikeStylesNames,\n  getOptionsLockup,\n  getParsedComboboxData,\n  OptionsDropdown,\n  OptionsFilter,\n  useCombobox,\n} from '../Combobox';\nimport {\n  __BaseInputProps,\n  __InputStylesNames,\n  ClearSectionMode,\n  InputClearButtonProps,\n  InputVariant,\n} from '../Input';\nimport { InputBase } from '../InputBase';\nimport { ScrollAreaProps } from '../ScrollArea';\n\nexport type SelectStylesNames = __InputStylesNames | ComboboxLikeStylesNames;\n\nexport interface SelectProps<Value extends Primitive = string>\n  extends\n    BoxProps,\n    __BaseInputProps,\n    ComboboxLikeProps<Value>,\n    StylesApiProps<SelectFactory>,\n    ElementProps<'input', 'onChange' | 'size' | 'value' | 'defaultValue'> {\n  /** Controlled component value */\n  value?: Value | null;\n\n  /** Uncontrolled component default value */\n  defaultValue?: Value | null;\n\n  /** Called when value changes */\n  onChange?: (value: Value | null, option: ComboboxItem<Value>) => void;\n\n  /** Called when the clear button is clicked */\n  onClear?: () => void;\n\n  /** Determines whether the select should be searchable @default false */\n  searchable?: boolean;\n\n  /** Displays check icon near the selected option label @default true */\n  withCheckIcon?: boolean;\n\n  /** Aligns unchecked labels with the checked one @default false */\n  withAlignedLabels?: boolean;\n\n  /** Position of the check icon relative to the option label @default 'left' */\n  checkIconPosition?: 'left' | 'right';\n\n  /** Message displayed when no options match the search query or when there is no data */\n  nothingFoundMessage?: React.ReactNode;\n\n  /** Controlled search value */\n  searchValue?: string;\n\n  /** Default search value */\n  defaultSearchValue?: string;\n\n  /** Called when search changes */\n  onSearchChange?: (value: string) => void;\n\n  /** Allows deselecting the selected option by clicking it @default true */\n  allowDeselect?: boolean;\n\n  /** Displays clear button in the right section when component has value @default false */\n  clearable?: boolean;\n\n  /** Determines how the clear button and rightSection are rendered @default 'both' */\n  clearSectionMode?: ClearSectionMode;\n\n  /** Props passed down to the clear button */\n  clearButtonProps?: InputClearButtonProps;\n\n  /** Props passed down to the hidden input */\n  hiddenInputProps?: Omit<React.ComponentProps<'input'>, 'value'>;\n\n  /** A function to render content of the option, replaces the default content of the option */\n  renderOption?: (item: ComboboxLikeRenderOptionInput<ComboboxItem>) => React.ReactNode;\n\n  /** Props passed down to the underlying `ScrollArea` component in the dropdown */\n  scrollAreaProps?: ScrollAreaProps;\n\n  /** Controls color of the default chevron, by default depends on the color scheme */\n  chevronColor?: MantineColor;\n\n  /** Automatically selects the highlighted option when input loses focus @default false */\n  autoSelectOnBlur?: boolean;\n\n  /** Opens dropdown when input receives focus (requires searchable={true}) @default true */\n  openOnFocus?: boolean;\n}\n\nexport type SelectFactory = Factory<{\n  props: SelectProps;\n  ref: HTMLInputElement;\n  stylesNames: SelectStylesNames;\n  variant: InputVariant;\n  signature: <Value extends Primitive = string>(props: SelectProps<Value>) => React.JSX.Element;\n}>;\n\nconst defaultProps = {\n  withCheckIcon: true,\n  allowDeselect: true,\n  checkIconPosition: 'left',\n  openOnFocus: true,\n} satisfies Partial<SelectProps>;\n\nexport const Select = genericFactory<SelectFactory>((_props) => {\n  const props = useProps('Select', defaultProps, _props);\n  const {\n    classNames,\n    styles,\n    unstyled,\n    vars,\n    dropdownOpened,\n    defaultDropdownOpened,\n    onDropdownClose,\n    onDropdownOpen,\n    onFocus,\n    onBlur,\n    onClick,\n    onChange,\n    data,\n    value,\n    defaultValue,\n    selectFirstOptionOnChange,\n    selectFirstOptionOnDropdownOpen,\n    onOptionSubmit,\n    comboboxProps,\n    readOnly,\n    disabled,\n    filter,\n    limit,\n    withScrollArea,\n    maxDropdownHeight,\n    size,\n    searchable,\n    rightSection,\n    checkIconPosition,\n    withCheckIcon,\n    withAlignedLabels,\n    nothingFoundMessage,\n    name,\n    form,\n    searchValue,\n    defaultSearchValue,\n    onSearchChange,\n    allowDeselect,\n    error,\n    rightSectionPointerEvents,\n    id,\n    clearable,\n    clearSectionMode,\n    clearButtonProps,\n    hiddenInputProps,\n    renderOption,\n    onClear,\n    autoComplete,\n    scrollAreaProps,\n    __defaultRightSection,\n    __clearSection,\n    __clearable,\n    chevronColor,\n    autoSelectOnBlur,\n    openOnFocus,\n    attributes,\n    ...others\n  } = props;\n\n  const parsedData = useMemo(() => getParsedComboboxData(data), [data]);\n  const retainedSelectedOptions = useRef<Record<string, ComboboxItem<Primitive>>>({});\n  const optionsLockup = useMemo(() => getOptionsLockup(parsedData), [parsedData]);\n  const _id = useId(id);\n\n  const [_value, setValue, controlled] = useUncontrolled({\n    value,\n    defaultValue,\n    finalValue: null,\n    onChange,\n  });\n\n  const selectedOption =\n    _value != null\n      ? `${_value}` in optionsLockup\n        ? optionsLockup[`${_value}`]\n        : retainedSelectedOptions.current[`${_value}`]\n      : undefined;\n  const previousSelectedOption = usePrevious(selectedOption);\n\n  const [search, setSearch, searchControlled] = useUncontrolled({\n    value: searchValue,\n    defaultValue: defaultSearchValue,\n    finalValue: selectedOption ? selectedOption.label : '',\n    onChange: onSearchChange,\n  });\n\n  const combobox = useCombobox({\n    opened: dropdownOpened,\n    defaultOpened: defaultDropdownOpened,\n    onDropdownOpen: () => {\n      onDropdownOpen?.();\n      if (selectFirstOptionOnDropdownOpen) {\n        combobox.selectFirstOption();\n      } else {\n        combobox.updateSelectedOptionIndex('active', { scrollIntoView: true });\n      }\n    },\n    onDropdownClose: () => {\n      onDropdownClose?.();\n      // Required for autoSelectOnBlur to work correctly\n      setTimeout(combobox.resetSelectedOption, 0);\n    },\n  });\n\n  const handleSearchChange = (value: string) => {\n    setSearch(value);\n    combobox.resetSelectedOption();\n  };\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<SelectFactory>({\n    props,\n    styles,\n    classNames,\n  });\n\n  useEffect(() => {\n    if (selectFirstOptionOnChange) {\n      combobox.selectFirstOption();\n    }\n  }, [selectFirstOptionOnChange, search]);\n\n  useEffect(() => {\n    if (value === null) {\n      handleSearchChange('');\n    }\n\n    if (\n      value != null &&\n      selectedOption &&\n      (previousSelectedOption?.value !== selectedOption.value ||\n        previousSelectedOption?.label !== selectedOption.label)\n    ) {\n      handleSearchChange(selectedOption.label);\n    }\n  }, [value, selectedOption]);\n\n  useEffect(() => {\n    if (!controlled && !searchControlled) {\n      handleSearchChange(\n        _value != null\n          ? `${_value}` in optionsLockup\n            ? optionsLockup[`${_value}`]?.label\n            : retainedSelectedOptions.current[`${_value}`]?.label || ''\n          : ''\n      );\n    }\n  }, [optionsLockup, _value]);\n\n  useEffect(() => {\n    if (_value) {\n      if (`${_value}` in optionsLockup) {\n        retainedSelectedOptions.current[`${_value}`] = optionsLockup[`${_value}`];\n      }\n    }\n  }, [optionsLockup, _value]);\n\n  const clearButton = (\n    <Combobox.ClearButton\n      {...clearButtonProps}\n      onClear={() => {\n        setValue(null, null);\n        handleSearchChange('');\n        onClear?.();\n      }}\n    />\n  );\n\n  const _clearable = clearable && !!_value && !disabled && !readOnly;\n\n  return (\n    <>\n      <Combobox\n        store={combobox}\n        __staticSelector=\"Select\"\n        classNames={resolvedClassNames}\n        styles={resolvedStyles}\n        unstyled={unstyled}\n        readOnly={readOnly}\n        size={size}\n        attributes={attributes}\n        keepMounted={autoSelectOnBlur}\n        onOptionSubmit={(val) => {\n          onOptionSubmit?.(val as any);\n          const optionLockup = allowDeselect\n            ? `${optionsLockup[val].value}` === `${_value}`\n              ? null\n              : optionsLockup[val]\n            : optionsLockup[val];\n\n          const nextValue = optionLockup ? optionLockup.value : null;\n\n          nextValue !== _value && setValue(nextValue as any, optionLockup);\n          !controlled && handleSearchChange(nextValue != null ? optionLockup?.label || '' : '');\n          combobox.closeDropdown();\n        }}\n        {...comboboxProps}\n      >\n        <Combobox.Target\n          targetType={searchable ? 'input' : 'button'}\n          autoComplete={autoComplete}\n          withExpandedAttribute\n        >\n          <InputBase\n            id={_id}\n            __defaultRightSection={\n              <Combobox.Chevron\n                size={size}\n                error={error}\n                unstyled={unstyled}\n                color={chevronColor}\n              />\n            }\n            __clearSection={clearButton}\n            __clearable={_clearable}\n            __clearSectionMode={clearSectionMode}\n            rightSection={rightSection}\n            rightSectionPointerEvents={rightSectionPointerEvents || 'none'}\n            {...others}\n            size={size}\n            __staticSelector=\"Select\"\n            disabled={disabled}\n            readOnly={readOnly || !searchable}\n            value={search}\n            onChange={(event) => {\n              handleSearchChange(event.currentTarget.value);\n              combobox.openDropdown();\n              selectFirstOptionOnChange && combobox.selectFirstOption();\n            }}\n            onFocus={(event) => {\n              openOnFocus && !!searchable && combobox.openDropdown();\n              onFocus?.(event);\n            }}\n            onBlur={(event) => {\n              if (autoSelectOnBlur) {\n                combobox.clickSelectedOption();\n              }\n\n              !!searchable && combobox.closeDropdown();\n              const optionLockup =\n                _value != null &&\n                (`${_value}` in optionsLockup\n                  ? optionsLockup[`${_value}`]\n                  : retainedSelectedOptions.current[`${_value}`]);\n              handleSearchChange(optionLockup ? optionLockup.label || '' : '');\n              onBlur?.(event);\n            }}\n            onClick={(event) => {\n              searchable ? combobox.openDropdown() : combobox.toggleDropdown();\n              onClick?.(event);\n            }}\n            classNames={resolvedClassNames}\n            styles={resolvedStyles}\n            unstyled={unstyled}\n            pointer={!searchable}\n            error={error}\n            attributes={attributes}\n          />\n        </Combobox.Target>\n        <OptionsDropdown\n          data={parsedData as any}\n          hidden={readOnly || disabled}\n          filter={filter as OptionsFilter<Primitive> | undefined}\n          search={search}\n          limit={limit}\n          hiddenWhenEmpty={!nothingFoundMessage}\n          withScrollArea={withScrollArea}\n          maxDropdownHeight={maxDropdownHeight}\n          filterOptions={!!searchable && selectedOption?.label !== search}\n          value={_value}\n          checkIconPosition={checkIconPosition}\n          withCheckIcon={withCheckIcon}\n          withAlignedLabels={withAlignedLabels}\n          nothingFoundMessage={nothingFoundMessage}\n          unstyled={unstyled}\n          labelId={others.label ? `${_id}-label` : undefined}\n          aria-label={others.label ? undefined : others['aria-label']}\n          renderOption={renderOption}\n          scrollAreaProps={scrollAreaProps}\n        />\n      </Combobox>\n      <Combobox.HiddenInput\n        value={_value}\n        name={name}\n        form={form}\n        disabled={disabled}\n        {...hiddenInputProps}\n      />\n    </>\n  );\n});\n\nSelect.classes = { ...InputBase.classes, ...Combobox.classes };\nSelect.displayName = '@mantine/core/Select';\n"],"mappings":"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"}

package/esm/components/TagsInput/TagsInput.mjs

@@ -245,6 +245,7 @@ const TagsInput = factory((_props) => {
 				...getStyles("pillsList"),
 				children: [values, /* @__PURE__ */ jsx(Combobox.EventsTarget, {
 					autoComplete,
+					withExpandedAttribute: true,
 					children: /* @__PURE__ */ jsx(PillsInput.Field, {
 						...rest,
 						ref: _ref,

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

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

package/esm/core/utils/get-env/get-env.mjs

@@ -1,7 +1,7 @@
 "use client";
 //#region packages/@mantine/core/src/core/utils/get-env/get-env.ts
 function getEnv() {
-	if (typeof process !== "undefined" && process.env && "production") return "production";
+	if (typeof process !== "undefined" && process.env && "development") return "development";
 	return "development";
 }
 //#endregion

package/esm/core/utils/get-env/get-env.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"get-env.mjs","names":[],"sources":["../../../../src/core/utils/get-env/get-env.ts"],"sourcesContent":["export function getEnv() {\n  if (typeof process !== 'undefined' && process.env && process.env.NODE_ENV) {\n    return process.env.NODE_ENV;\n  }\n\n  return 'development';\n}\n"],"mappings":";;AAAA,SAAgB,SAAS;AACvB,KAAI,OAAO,YAAY,eAAe,QAAQ,OAAA,aAC5C,QAAA;AAGF,QAAO"}
+{"version":3,"file":"get-env.mjs","names":[],"sources":["../../../../src/core/utils/get-env/get-env.ts"],"sourcesContent":["export function getEnv() {\n  if (typeof process !== 'undefined' && process.env && process.env.NODE_ENV) {\n    return process.env.NODE_ENV;\n  }\n\n  return 'development';\n}\n"],"mappings":";;AAAA,SAAgB,SAAS;AACvB,KAAI,OAAO,YAAY,eAAe,QAAQ,OAAA,cAC5C,QAAA;AAGF,QAAO"}

package/lib/components/Combobox/use-combobox-target-props/use-combobox-target-props.d.ts

@@ -8,21 +8,5 @@ interface UseComboboxTargetPropsInput {
 }
 export declare function useComboboxTargetProps({ onKeyDown, withKeyboardNavigation, withAriaAttributes, withExpandedAttribute, targetType, autoComplete, }: UseComboboxTargetPropsInput): {
     onKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => void;
-    'aria-haspopup': "listbox";
-    'aria-expanded': boolean | undefined;
-    'aria-controls': string | undefined;
-    'aria-activedescendant': string | undefined;
-    autoComplete: string | undefined;
-    'data-expanded': true | undefined;
-    'data-mantine-stop-propagation': true | undefined;
-} | {
-    onKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => void;
-    'aria-haspopup'?: undefined;
-    'aria-expanded'?: undefined;
-    'aria-controls'?: undefined;
-    'aria-activedescendant'?: undefined;
-    autoComplete?: undefined;
-    'data-expanded'?: undefined;
-    'data-mantine-stop-propagation'?: undefined;
 };
 export {};

package/lib/components/Input/InputClearSection/InputClearSection.d.ts

@@ -8,4 +8,4 @@ export interface InputClearSectionProps {
     size: MantineSize | string | undefined;
     __clearSectionMode: ClearSectionMode | undefined;
 }
-export declare function InputClearSection({ __clearable, __clearSection, rightSection, __defaultRightSection, size, __clearSectionMode, }: InputClearSectionProps): string | number | bigint | boolean | import("react/jsx-runtime").JSX.Element | Iterable<import("react").ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | null | undefined> | null | undefined;
+export declare function InputClearSection({ __clearable, __clearSection, rightSection, __defaultRightSection, size, __clearSectionMode, }: InputClearSectionProps): string | number | bigint | boolean | Iterable<import("react").ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element | null | undefined;

package/lib/components/Input/use-input-props.d.ts

@@ -8,7 +8,7 @@ interface BaseProps extends __BaseInputProps, BoxProps, StylesApiProps<{
     __stylesApiProps?: Record<string, any>;
     id?: string;
 }
-export declare function useInputProps<T extends BaseProps, U extends Partial<T> | null>(component: string, defaultProps: U, _props: T): Omit<T & (U extends null | undefined ? {} : { [Key in Extract<keyof T, keyof U>]-?: U[Key] | NonNullable<T[Key]>; }), "style" | "label" | "className" | "id" | "vars" | "mod" | "unstyled" | "variant" | "classNames" | "styles" | "attributes" | "size" | "required" | "description" | "error" | "wrapperProps" | "withAsterisk" | "labelProps" | "descriptionProps" | "errorProps" | "inputContainer" | "inputWrapperOrder" | "__staticSelector" | "__stylesApiProps"> & {
+export declare function useInputProps<T extends BaseProps, U extends Partial<T> | null>(component: string, defaultProps: U, _props: T): Omit<T & (U extends null | undefined ? {} : { [Key in Extract<keyof T, keyof U>]-?: U[Key] | NonNullable<T[Key]>; }), "label" | "style" | "size" | "styles" | "className" | "id" | "vars" | "variant" | "unstyled" | "attributes" | "classNames" | "mod" | "description" | "error" | "__staticSelector" | "required" | "__stylesApiProps" | "withAsterisk" | "labelProps" | "descriptionProps" | "errorProps" | "inputContainer" | "inputWrapperOrder" | "wrapperProps"> & {
     classNames: Partial<Record<string, string>> | ((theme: import("../..").MantineTheme, props: any, ctx: unknown) => Partial<Record<string, string>>) | undefined;
     styles: Partial<Record<string, import("../..").CSSProperties>> | ((theme: import("../..").MantineTheme, props: any, ctx: unknown) => Partial<Record<string, import("../..").CSSProperties>>) | undefined;
     unstyled: boolean | undefined;
@@ -23,17 +23,17 @@ export declare function useInputProps<T extends BaseProps, U extends Partial<T>
         autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {});
         autoFocus?: boolean | undefined;
         className: string | undefined;
-        contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
+        contentEditable?: (boolean | "false" | "true") | "inherit" | "plaintext-only" | undefined;
         contextMenu?: string | undefined;
         dir?: string | undefined;
-        draggable?: (boolean | "true" | "false") | undefined;
+        draggable?: (boolean | "false" | "true") | undefined;
         enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined;
         hidden?: boolean | undefined;
         id: string | undefined;
         lang?: string | undefined;
         nonce?: string | undefined;
         slot?: string | undefined;
-        spellCheck?: (boolean | "true" | "false") | undefined;
+        spellCheck?: (boolean | "false" | "true") | undefined;
         style: import("react").CSSProperties | ((theme: import("../..").MantineTheme) => import("../..").CSSProperties) | import("../..").MantineStyleProp[] | undefined;
         tabIndex?: number | undefined;
         title?: string | undefined;
@@ -71,11 +71,11 @@ export declare function useInputProps<T extends BaseProps, U extends Partial<T>
         exportparts?: string | undefined;
         part?: string | undefined;
         "aria-activedescendant"?: string | undefined;
-        "aria-atomic"?: (boolean | "true" | "false") | undefined;
+        "aria-atomic"?: (boolean | "false" | "true") | undefined;
         "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined;
         "aria-braillelabel"?: string | undefined;
         "aria-brailleroledescription"?: string | undefined;
-        "aria-busy"?: (boolean | "true" | "false") | undefined;
+        "aria-busy"?: (boolean | "false" | "true") | undefined;
         "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined;
         "aria-colcount"?: number | undefined;
         "aria-colindex"?: number | undefined;
@@ -86,37 +86,37 @@ export declare function useInputProps<T extends BaseProps, U extends Partial<T>
         "aria-describedby"?: string | undefined;
         "aria-description"?: string | undefined;
         "aria-details"?: string | undefined;
-        "aria-disabled"?: (boolean | "true" | "false") | undefined;
+        "aria-disabled"?: (boolean | "false" | "true") | undefined;
         "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined;
         "aria-errormessage"?: string | undefined;
-        "aria-expanded"?: (boolean | "true" | "false") | undefined;
+        "aria-expanded"?: (boolean | "false" | "true") | undefined;
         "aria-flowto"?: string | undefined;
-        "aria-grabbed"?: (boolean | "true" | "false") | undefined;
+        "aria-grabbed"?: (boolean | "false" | "true") | undefined;
         "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined;
-        "aria-hidden"?: (boolean | "true" | "false") | undefined;
+        "aria-hidden"?: (boolean | "false" | "true") | undefined;
         "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
         "aria-keyshortcuts"?: string | undefined;
         "aria-label"?: string | undefined;
         "aria-labelledby"?: string | undefined;
         "aria-level"?: number | undefined;
         "aria-live"?: "off" | "assertive" | "polite" | undefined;
-        "aria-modal"?: (boolean | "true" | "false") | undefined;
-        "aria-multiline"?: (boolean | "true" | "false") | undefined;
-        "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
+        "aria-modal"?: (boolean | "false" | "true") | undefined;
+        "aria-multiline"?: (boolean | "false" | "true") | undefined;
+        "aria-multiselectable"?: (boolean | "false" | "true") | undefined;
         "aria-orientation"?: "horizontal" | "vertical" | undefined;
         "aria-owns"?: string | undefined;
         "aria-placeholder"?: string | undefined;
         "aria-posinset"?: number | undefined;
         "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined;
-        "aria-readonly"?: (boolean | "true" | "false") | undefined;
+        "aria-readonly"?: (boolean | "false" | "true") | undefined;
         "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined;
-        "aria-required"?: (boolean | "true" | "false") | undefined;
+        "aria-required"?: (boolean | "false" | "true") | undefined;
         "aria-roledescription"?: string | undefined;
         "aria-rowcount"?: number | undefined;
         "aria-rowindex"?: number | undefined;
         "aria-rowindextext"?: string | undefined;
         "aria-rowspan"?: number | undefined;
-        "aria-selected"?: (boolean | "true" | "false") | undefined;
+        "aria-selected"?: (boolean | "false" | "true") | undefined;
         "aria-setsize"?: number | undefined;
         "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
         "aria-valuemax"?: number | undefined;
@@ -307,7 +307,7 @@ export declare function useInputProps<T extends BaseProps, U extends Partial<T>
         descriptionProps: (import(".").InputDescriptionProps & import("../..").DataAttributes) | undefined;
         unstyled: boolean | undefined;
         styles: Partial<Record<string, import("../..").CSSProperties>> | ((theme: import("../..").MantineTheme, props: any, ctx: unknown) => Partial<Record<string, import("../..").CSSProperties>>) | undefined;
-        size: import("../..").MantineSize | (string & {}) | undefined;
+        size: (string & {}) | import("../..").MantineSize | undefined;
         inputContainer: ((children: React.ReactNode) => React.ReactNode) | undefined;
         inputWrapperOrder: ("input" | "label" | "description" | "error")[] | undefined;
         withAsterisk: boolean | undefined;
@@ -322,7 +322,7 @@ export declare function useInputProps<T extends BaseProps, U extends Partial<T>
         classNames: Partial<Record<string, string>> | ((theme: import("../..").MantineTheme, props: any, ctx: unknown) => Partial<Record<string, string>>) | undefined;
         styles: Partial<Record<string, import("../..").CSSProperties>> | ((theme: import("../..").MantineTheme, props: any, ctx: unknown) => Partial<Record<string, import("../..").CSSProperties>>) | undefined;
         unstyled: boolean | undefined;
-        size: import("../..").MantineSize | (string & {}) | undefined;
+        size: (string & {}) | import("../..").MantineSize | undefined;
         __staticSelector: string | undefined;
         __stylesApiProps: Record<string, any> | BaseProps;
         error: import("react").ReactNode;

package/lib/components/Popover/use-popover.d.ts

@@ -43,10 +43,10 @@ export declare function usePopover(options: UsePopoverOptions): {
             floating: HTMLElement | null;
         } & import("@floating-ui/react").ExtendedElements<Element>;
         context: {
-            strategy: import("@floating-ui/utils").Strategy;
-            placement: import("@floating-ui/utils").Placement;
             x: number;
             y: number;
+            placement: import("@floating-ui/utils").Placement;
+            strategy: import("@floating-ui/utils").Strategy;
             middlewareData: import("@floating-ui/core").MiddlewareData;
             isPositioned: boolean;
             update: () => void;

package/lib/core/MantineProvider/color-functions/get-contrast-color/get-contrast-color.d.ts

@@ -4,6 +4,6 @@ interface GetContrastColorInput {
     theme: MantineTheme;
     autoContrast?: boolean | undefined | null;
 }
-export declare function getContrastColor({ color, theme, autoContrast }: GetContrastColorInput): "var(--mantine-color-white)" | "var(--mantine-color-black)";
-export declare function getPrimaryContrastColor(theme: MantineTheme, colorScheme: 'light' | 'dark'): "var(--mantine-color-white)" | "var(--mantine-color-black)";
+export declare function getContrastColor({ color, theme, autoContrast }: GetContrastColorInput): "var(--mantine-color-black)" | "var(--mantine-color-white)";
+export declare function getPrimaryContrastColor(theme: MantineTheme, colorScheme: 'light' | 'dark'): "var(--mantine-color-black)" | "var(--mantine-color-white)";
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mantine/core",
-  "version": "9.0.0-alpha.6",
+  "version": "9.0.0-alpha.7",
   "description": "React components library focused on usability, accessibility and developer experience",
   "homepage": "https://mantine.dev/",
   "license": "MIT",
@@ -43,16 +43,16 @@
     "directory": "packages/@mantine/core"
   },
   "peerDependencies": {
-    "@mantine/hooks": "9.0.0-alpha.6",
+    "@mantine/hooks": "9.0.0-alpha.7",
     "react": "^19.2.0",
     "react-dom": "^19.2.0"
   },
   "dependencies": {
     "@floating-ui/react": "^0.27.19",
     "clsx": "^2.1.1",
-    "react-number-format": "^5.4.4",
+    "react-number-format": "^5.4.5",
     "react-remove-scroll": "^2.7.2",
-    "type-fest": "^4.41.0"
+    "type-fest": "^5.5.0"
   },
   "devDependencies": {
     "@mantine-tests/core": "workspace:*",

package/cjs/components/MaskInput/MaskInput.cjs

@@ -1,24 +0,0 @@
-"use client";
-require("../../_virtual/_rolldown/runtime.cjs");
-const require_use_props = require("../../core/MantineProvider/use-props/use-props.cjs");
-const require_factory = require("../../core/factory/factory.cjs");
-const require_InputBase = require("../InputBase/InputBase.cjs");
-const require_use_mask_input_props = require("./use-mask-input-props.cjs");
-let react_jsx_runtime = require("react/jsx-runtime");
-//#region packages/@mantine/core/src/components/MaskInput/MaskInput.tsx
-const defaultProps = {};
-const MaskInput = require_factory.factory((props) => {
-	const { maskRef, elementProps } = require_use_mask_input_props.useMaskInputProps(require_use_props.useProps("MaskInput", defaultProps, props));
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_InputBase.InputBase, {
-		component: "input",
-		ref: maskRef,
-		...elementProps,
-		__staticSelector: "MaskInput"
-	});
-});
-MaskInput.classes = require_InputBase.InputBase.classes;
-MaskInput.displayName = "@mantine/core/MaskInput";
-//#endregion
-exports.MaskInput = MaskInput;
-
-//# sourceMappingURL=MaskInput.cjs.map

package/cjs/components/MaskInput/MaskInput.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"MaskInput.cjs","names":["factory","useMaskInputProps","useProps","InputBase"],"sources":["../../../src/components/MaskInput/MaskInput.tsx"],"sourcesContent":["import { BoxProps, ElementProps, factory, Factory, StylesApiProps, useProps } from '../../core';\nimport { __BaseInputProps, __InputStylesNames, InputVariant } from '../Input';\nimport { InputBase } from '../InputBase';\nimport { useMaskInputProps } from './use-mask-input-props';\n\nexport interface MaskInputProps\n  extends\n    BoxProps,\n    __BaseInputProps,\n    StylesApiProps<MaskInputFactory>,\n    ElementProps<'input', 'size'> {\n  /** Mask pattern string or array of string literals and RegExp objects */\n  mask: string | Array<string | RegExp>;\n\n  /** Override or extend the default token map */\n  tokens?: Record<string, RegExp>;\n\n  /** Called before masking on each keystroke, can return overrides for mask options */\n  modify?: (\n    value: string\n  ) => Partial<Pick<MaskInputProps, 'mask' | 'tokens' | 'slotChar' | 'separate'>> | undefined;\n\n  /** When true, raw and display values are decoupled */\n  separate?: boolean;\n\n  /** Character displayed in unfilled slots, `\"_\"` by default */\n  slotChar?: string | null;\n\n  /** Show mask pattern even when field is empty and unfocused */\n  alwaysShowMask?: boolean;\n\n  /** Show mask placeholder on focus, `true` by default */\n  showMaskOnFocus?: boolean;\n\n  /** Transform each character before validation and insertion */\n  transform?: (char: string) => string;\n\n  /** Clear value on blur when mask is incomplete, `false` by default */\n  autoClear?: boolean;\n\n  /** Called on every change with raw and masked values */\n  onChangeRaw?: (rawValue: string, maskedValue: string) => void;\n\n  /** Called when all required mask slots are filled */\n  onComplete?: (maskedValue: string, rawValue: string) => void;\n\n  /** Escape hatch for advanced cursor/value manipulation */\n  beforeMaskedStateChange?: (states: {\n    previousState: { value: string; selection: { start: number; end: number } | null };\n    currentState: { value: string; selection: { start: number; end: number } | null };\n    nextState: { value: string; selection: { start: number; end: number } | null };\n  }) => { value: string; selection: { start: number; end: number } | null };\n}\n\nexport type MaskInputFactory = Factory<{\n  props: MaskInputProps;\n  variant: InputVariant;\n  ref: HTMLInputElement;\n  stylesNames: __InputStylesNames;\n}>;\n\nconst defaultProps = {} satisfies Partial<MaskInputProps>;\n\nexport const MaskInput = factory<MaskInputFactory>((props) => {\n  const _props = useProps('MaskInput', defaultProps, props);\n  const { maskRef, elementProps } = useMaskInputProps(_props);\n\n  return (\n    <InputBase\n      component=\"input\"\n      ref={maskRef}\n      {...(elementProps as any)}\n      __staticSelector=\"MaskInput\"\n    />\n  );\n});\n\nMaskInput.classes = InputBase.classes;\nMaskInput.displayName = '@mantine/core/MaskInput';\n"],"mappings":";;;;;;;;AA6DA,MAAM,eAAe,EAAE;AAEvB,MAAa,YAAYA,gBAAAA,SAA2B,UAAU;CAE5D,MAAM,EAAE,SAAS,iBAAiBC,6BAAAA,kBADnBC,kBAAAA,SAAS,aAAa,cAAc,MAAM,CACE;AAE3D,QACE,iBAAA,GAAA,kBAAA,KAACC,kBAAAA,WAAD;EACE,WAAU;EACV,KAAK;EACL,GAAK;EACL,kBAAiB;EACjB,CAAA;EAEJ;AAEF,UAAU,UAAUA,kBAAAA,UAAU;AAC9B,UAAU,cAAc"}

package/cjs/components/MaskInput/use-mask-input-props.cjs

@@ -1,29 +0,0 @@
-"use client";
-require("../../_virtual/_rolldown/runtime.cjs");
-let _mantine_hooks = require("@mantine/hooks");
-//#region packages/@mantine/core/src/components/MaskInput/use-mask-input-props.ts
-function useMaskInputProps(props) {
-	const { mask, tokens, modify, separate, slotChar, alwaysShowMask, showMaskOnFocus, transform, autoClear, onChangeRaw, onComplete, beforeMaskedStateChange, ref, ...elementProps } = props;
-	const { ref: maskCallbackRef } = (0, _mantine_hooks.useMask)({
-		mask,
-		tokens,
-		modify,
-		separate,
-		slotChar,
-		alwaysShowMask,
-		showMaskOnFocus,
-		transform,
-		autoClear,
-		onChangeRaw,
-		onComplete,
-		beforeMaskedStateChange
-	});
-	return {
-		maskRef: (0, _mantine_hooks.useMergedRef)(ref, maskCallbackRef),
-		elementProps
-	};
-}
-//#endregion
-exports.useMaskInputProps = useMaskInputProps;
-
-//# sourceMappingURL=use-mask-input-props.cjs.map

package/cjs/components/MaskInput/use-mask-input-props.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-mask-input-props.cjs","names":[],"sources":["../../../src/components/MaskInput/use-mask-input-props.ts"],"sourcesContent":["import { useMask, useMergedRef } from '@mantine/hooks';\nimport type { MaskInputProps } from './MaskInput';\n\nexport function useMaskInputProps(props: MaskInputProps & { ref?: React.Ref<HTMLInputElement> }) {\n  const {\n    mask,\n    tokens,\n    modify,\n    separate,\n    slotChar,\n    alwaysShowMask,\n    showMaskOnFocus,\n    transform,\n    autoClear,\n    onChangeRaw,\n    onComplete,\n    beforeMaskedStateChange,\n    ref,\n    ...elementProps\n  } = props;\n\n  const { ref: maskCallbackRef } = useMask({\n    mask,\n    tokens,\n    modify,\n    separate,\n    slotChar,\n    alwaysShowMask,\n    showMaskOnFocus,\n    transform,\n    autoClear,\n    onChangeRaw,\n    onComplete,\n    beforeMaskedStateChange,\n  });\n\n  const maskRef = useMergedRef(ref, maskCallbackRef);\n\n  return { maskRef, elementProps };\n}\n"],"mappings":";;;;AAGA,SAAgB,kBAAkB,OAA+D;CAC/F,MAAM,EACJ,MACA,QACA,QACA,UACA,UACA,gBACA,iBACA,WACA,WACA,aACA,YACA,yBACA,KACA,GAAG,iBACD;CAEJ,MAAM,EAAE,KAAK,qBAAA,GAAA,eAAA,SAA4B;EACvC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAIF,QAAO;EAAE,UAAA,GAAA,eAAA,cAFoB,KAAK,gBAAgB;EAEhC;EAAc"}

package/cjs/components/Pagination/PaginationLabel/PaginationLabel.cjs

@@ -1,33 +0,0 @@
-"use client";
-require("../../../_virtual/_rolldown/runtime.cjs");
-const require_use_props = require("../../../core/MantineProvider/use-props/use-props.cjs");
-const require_factory = require("../../../core/factory/factory.cjs");
-const require_Box = require("../../../core/Box/Box.cjs");
-const require_Pagination_context = require("../Pagination.context.cjs");
-const require_Pagination_module = require("../Pagination.module.cjs");
-let react_jsx_runtime = require("react/jsx-runtime");
-//#region packages/@mantine/core/src/components/Pagination/PaginationLabel/PaginationLabel.tsx
-const defaultProps = { formatLabel: ({ page, totalPages }) => `Page ${page} of ${totalPages}` };
-const PaginationLabel = require_factory.factory((_props) => {
-	const { classNames, className, style, styles, vars, formatLabel, ...others } = require_use_props.useProps("PaginationLabel", defaultProps, _props);
-	const ctx = require_Pagination_context.usePaginationContext();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Box.Box, {
-		...ctx.getStyles("label", {
-			className,
-			style,
-			styles,
-			classNames
-		}),
-		...others,
-		children: formatLabel({
-			page: ctx.active,
-			totalPages: ctx.total
-		})
-	});
-});
-PaginationLabel.classes = require_Pagination_module.default;
-PaginationLabel.displayName = "@mantine/core/PaginationLabel";
-//#endregion
-exports.PaginationLabel = PaginationLabel;
-
-//# sourceMappingURL=PaginationLabel.cjs.map

package/cjs/components/Pagination/PaginationLabel/PaginationLabel.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"PaginationLabel.cjs","names":["factory","useProps","usePaginationContext","Box","classes"],"sources":["../../../../src/components/Pagination/PaginationLabel/PaginationLabel.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  CompoundStylesApiProps,\n  ElementProps,\n  factory,\n  Factory,\n  useProps,\n} from '../../../core';\nimport { usePaginationContext } from '../Pagination.context';\nimport classes from '../Pagination.module.css';\n\nexport type PaginationFormatLabel = (input: { page: number; totalPages: number }) => string;\nexport type PaginationLabelStylesNames = 'label';\n\nexport interface PaginationLabelProps\n  extends BoxProps, CompoundStylesApiProps<PaginationLabelFactory>, ElementProps<'div'> {\n  /** Function to format the label text */\n  formatLabel?: PaginationFormatLabel;\n}\n\nexport type PaginationLabelFactory = Factory<{\n  props: PaginationLabelProps;\n  ref: HTMLDivElement;\n  stylesNames: PaginationLabelStylesNames;\n  compound: true;\n}>;\n\nconst defaultProps = {\n  formatLabel: ({ page, totalPages }) => `Page ${page} of ${totalPages}`,\n} satisfies Partial<PaginationLabelProps>;\n\nexport const PaginationLabel = factory<PaginationLabelFactory>((_props) => {\n  const props = useProps('PaginationLabel', defaultProps, _props);\n  const { classNames, className, style, styles, vars, formatLabel, ...others } = props;\n  const ctx = usePaginationContext();\n\n  return (\n    <Box {...ctx.getStyles('label', { className, style, styles, classNames })} {...others}>\n      {formatLabel({ page: ctx.active, totalPages: ctx.total })}\n    </Box>\n  );\n});\n\nPaginationLabel.classes = classes;\nPaginationLabel.displayName = '@mantine/core/PaginationLabel';\n"],"mappings":";;;;;;;;;AA4BA,MAAM,eAAe,EACnB,cAAc,EAAE,MAAM,iBAAiB,QAAQ,KAAK,MAAM,cAC3D;AAED,MAAa,kBAAkBA,gBAAAA,SAAiC,WAAW;CAEzE,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,aAAa,GAAG,WADtDC,kBAAAA,SAAS,mBAAmB,cAAc,OAAO;CAE/D,MAAM,MAAMC,2BAAAA,sBAAsB;AAElC,QACE,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EAAK,GAAI,IAAI,UAAU,SAAS;GAAE;GAAW;GAAO;GAAQ;GAAY,CAAC;EAAE,GAAI;YAC5E,YAAY;GAAE,MAAM,IAAI;GAAQ,YAAY,IAAI;GAAO,CAAC;EACrD,CAAA;EAER;AAEF,gBAAgB,UAAUC,0BAAAA;AAC1B,gBAAgB,cAAc"}

package/cjs/components/RollingNumber/DigitColumn.cjs

@@ -1,41 +0,0 @@
-"use client";
-require("../../_virtual/_rolldown/runtime.cjs");
-let react_jsx_runtime = require("react/jsx-runtime");
-//#region packages/@mantine/core/src/components/RollingNumber/DigitColumn.tsx
-const DIGITS = [
-	"0",
-	"1",
-	"2",
-	"3",
-	"4",
-	"5",
-	"6",
-	"7",
-	"8",
-	"9"
-];
-function DigitColumn({ digit, getStyles, previousDigit, empty }) {
-	const digitIndex = DIGITS.indexOf(digit);
-	const prevIndex = previousDigit !== null ? DIGITS.indexOf(previousDigit) : -1;
-	const direction = prevIndex === -1 || digitIndex >= prevIndex ? "up" : "down";
-	const digitStyles = getStyles("digit");
-	const columnStyles = getStyles("digitColumn");
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-		...digitStyles,
-		"data-empty": empty || void 0,
-		"aria-hidden": "true",
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-			...columnStyles,
-			style: {
-				...columnStyles.style,
-				transform: `translateY(${-digitIndex}em)`
-			},
-			"data-direction": direction,
-			children: DIGITS.map((d) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: d }, d))
-		})
-	});
-}
-//#endregion
-exports.DigitColumn = DigitColumn;
-
-//# sourceMappingURL=DigitColumn.cjs.map

package/cjs/components/RollingNumber/DigitColumn.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"DigitColumn.cjs","names":[],"sources":["../../../src/components/RollingNumber/DigitColumn.tsx"],"sourcesContent":["import { useStyles } from '../../core';\nimport type { RollingNumberFactory } from './RollingNumber';\n\nconst DIGITS = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];\n\ninterface DigitColumnProps {\n  digit: string;\n  getStyles: ReturnType<typeof useStyles<RollingNumberFactory>>;\n  previousDigit: string | null;\n  empty?: boolean;\n}\n\nexport function DigitColumn({ digit, getStyles, previousDigit, empty }: DigitColumnProps) {\n  const digitIndex = DIGITS.indexOf(digit);\n  const prevIndex = previousDigit !== null ? DIGITS.indexOf(previousDigit) : -1;\n  const direction = prevIndex === -1 || digitIndex >= prevIndex ? 'up' : 'down';\n  const digitStyles = getStyles('digit');\n  const columnStyles = getStyles('digitColumn');\n\n  return (\n    <span {...digitStyles} data-empty={empty || undefined} aria-hidden=\"true\">\n      <span\n        {...columnStyles}\n        style={{ ...columnStyles.style, transform: `translateY(${-digitIndex}em)` }}\n        data-direction={direction}\n      >\n        {DIGITS.map((d) => (\n          <span key={d}>{d}</span>\n        ))}\n      </span>\n    </span>\n  );\n}\n"],"mappings":";;;;AAGA,MAAM,SAAS;CAAC;CAAK;CAAK;CAAK;CAAK;CAAK;CAAK;CAAK;CAAK;CAAK;CAAI;AASjE,SAAgB,YAAY,EAAE,OAAO,WAAW,eAAe,SAA2B;CACxF,MAAM,aAAa,OAAO,QAAQ,MAAM;CACxC,MAAM,YAAY,kBAAkB,OAAO,OAAO,QAAQ,cAAc,GAAG;CAC3E,MAAM,YAAY,cAAc,MAAM,cAAc,YAAY,OAAO;CACvE,MAAM,cAAc,UAAU,QAAQ;CACtC,MAAM,eAAe,UAAU,cAAc;AAE7C,QACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;EAAM,GAAI;EAAa,cAAY,SAAS,KAAA;EAAW,eAAY;YACjE,iBAAA,GAAA,kBAAA,KAAC,QAAD;GACE,GAAI;GACJ,OAAO;IAAE,GAAG,aAAa;IAAO,WAAW,cAAc,CAAC,WAAW;IAAM;GAC3E,kBAAgB;aAEf,OAAO,KAAK,MACX,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAA,UAAe,GAAS,EAAb,EAAa,CACxB;GACG,CAAA;EACF,CAAA"}