npm - @mantine/core - Versions diffs - 9.1.1 → 9.2.1 - Mend

@mantine/core 9.1.1 → 9.2.1

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

Files changed (1160) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"PasswordInput.cjs","names":["PasswordToggleIcon","createVarsResolver","getSize","factory","useProps","useStyles","useResolvedStylesApi","extractStyleProps","ActionIcon","Input","classes","InputBase"],"sources":["../../../src/components/PasswordInput/PasswordInput.tsx"],"sourcesContent":["import cx from 'clsx';\nimport { useId, useUncontrolled } from '@mantine/hooks';\nimport {\n BoxProps,\n createVarsResolver,\n ElementProps,\n extractStyleProps,\n factory,\n Factory,\n getSize,\n StylesApiProps,\n useProps,\n useResolvedStylesApi,\n useStyles,\n} from '../../core';\nimport { ActionIcon } from '../ActionIcon';\nimport { __BaseInputProps, __InputStylesNames, Input, InputVariant } from '../Input';\nimport { InputBase } from '../InputBase';\nimport { PasswordToggleIcon } from './PasswordToggleIcon';\nimport classes from './PasswordInput.module.css';\n\nexport type PasswordInputStylesNames =\n \| 'root'\n \| 'visibilityToggle'\n \| 'innerInput'\n \| __InputStylesNames;\nexport type PasswordInputCssVariables = {\n root: '--psi-icon-size' \| '--psi-button-size';\n};\n\nexport interface PasswordInputProps\n extends\n BoxProps,\n Omit<__BaseInputProps, 'pointer'>,\n StylesApiProps<PasswordInputFactory>,\n ElementProps<'input', 'size'> {\n /** A component to replace the visibility toggle icon /\n visibilityToggleIcon?: React.FC<{ reveal: boolean }>;\n\n /* Props passed down to the visibility toggle button /\n visibilityToggleButtonProps?: Record<string, any>;\n\n /* If set, the input value is visible /\n visible?: boolean;\n\n /* If set, the input value is visible by default /\n defaultVisible?: boolean;\n\n /* Called when visibility changes */\n onVisibilityChange?: (visible: boolean) => void;\n}\n\nexport type PasswordInputFactory = Factory<{\n props: PasswordInputProps;\n ref: HTMLInputElement;\n stylesNames: PasswordInputStylesNames;\n vars: PasswordInputCssVariables;\n variant: InputVariant;\n}>;\n\nconst defaultProps = {\n visibilityToggleIcon: PasswordToggleIcon,\n size: 'sm',\n} satisfies Partial<PasswordInputProps>;\n\nconst varsResolver = createVarsResolver<PasswordInputFactory>((_, { size }) => ({\n root: {\n '--psi-icon-size': getSize(size, 'psi-icon-size'),\n '--psi-button-size': getSize(size, 'psi-button-size'),\n },\n}));\n\nexport const PasswordInput = factory<PasswordInputFactory>((_props) => {\n const props = useProps('PasswordInput', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n required,\n error,\n leftSection,\n disabled,\n id,\n variant,\n inputContainer,\n description,\n label,\n size,\n errorProps,\n descriptionProps,\n labelProps,\n withAsterisk,\n inputWrapperOrder,\n wrapperProps,\n radius,\n rightSection,\n rightSectionWidth,\n rightSectionPointerEvents,\n leftSectionWidth,\n visible,\n defaultVisible,\n onVisibilityChange,\n visibilityToggleIcon: VisibilityToggleIcon,\n visibilityToggleButtonProps,\n rightSectionProps,\n leftSectionProps,\n leftSectionPointerEvents,\n withErrorStyles,\n mod,\n attributes,\n ...others\n } = props;\n\n const uuid = useId(id);\n\n const [_visible, setVisibility] = useUncontrolled({\n value: visible,\n defaultValue: defaultVisible,\n finalValue: false,\n onChange: onVisibilityChange,\n });\n\n const toggleVisibility = () => setVisibility(!_visible);\n\n const getStyles = useStyles<PasswordInputFactory>({\n name: 'PasswordInput',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<PasswordInputFactory>({\n classNames,\n styles,\n props,\n });\n\n const { styleProps, rest } = extractStyleProps(others);\n const errorId = errorProps?.id \|\| `${uuid}-error`;\n const descriptionId = descriptionProps?.id \|\| `${uuid}-description`;\n const hasError = !!error && typeof error !== 'boolean';\n const hasDescription = !!description;\n const _describedBy = `${hasError ? errorId : ''} ${hasDescription ? descriptionId : ''}`;\n const describedBy = _describedBy.trim().length > 0 ? _describedBy.trim() : undefined;\n\n const visibilityToggleButton = (\n <ActionIcon<'button'>\n {...getStyles('visibilityToggle')}\n disabled={disabled}\n radius={radius}\n aria-pressed={_visible}\n tabIndex={-1}\n aria-label=\"Toggle password visibility\"\n {...visibilityToggleButtonProps}\n variant={visibilityToggleButtonProps?.variant ?? 'subtle'}\n color=\"gray\"\n unstyled={unstyled}\n onTouchEnd={(event) => {\n event.preventDefault();\n visibilityToggleButtonProps?.onTouchEnd?.(event);\n toggleVisibility();\n }}\n onMouseDown={(event) => {\n event.preventDefault();\n visibilityToggleButtonProps?.onMouseDown?.(event);\n toggleVisibility();\n }}\n onKeyDown={(event) => {\n visibilityToggleButtonProps?.onKeyDown?.(event);\n if (event.key === ' ') {\n event.preventDefault();\n toggleVisibility();\n }\n }}\n >\n <VisibilityToggleIcon reveal={_visible} />\n </ActionIcon>\n );\n\n return (\n <Input.Wrapper\n required={required}\n id={uuid}\n label={label}\n error={error}\n description={description}\n size={size}\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n __staticSelector=\"PasswordInput\"\n __stylesApiProps={props}\n unstyled={unstyled}\n withAsterisk={withAsterisk}\n inputWrapperOrder={inputWrapperOrder}\n inputContainer={inputContainer}\n variant={variant}\n labelProps={{ ...labelProps, htmlFor: uuid }}\n descriptionProps={{ ...descriptionProps, id: descriptionId }}\n errorProps={{ ...errorProps, id: errorId }}\n mod={mod}\n attributes={attributes}\n {...getStyles('root')}\n {...styleProps}\n {...wrapperProps}\n >\n <Input\n component=\"div\"\n error={error}\n leftSection={leftSection}\n size={size}\n classNames={{ ...resolvedClassNames, input: cx(classes.input, resolvedClassNames?.input) }}\n styles={resolvedStyles}\n radius={radius}\n disabled={disabled}\n __staticSelector=\"PasswordInput\"\n __stylesApiProps={props}\n rightSectionWidth={rightSectionWidth}\n rightSection={rightSection ?? visibilityToggleButton}\n variant={variant}\n unstyled={unstyled}\n leftSectionWidth={leftSectionWidth}\n rightSectionPointerEvents={rightSectionPointerEvents \|\| 'all'}\n rightSectionProps={rightSectionProps}\n leftSectionProps={leftSectionProps}\n leftSectionPointerEvents={leftSectionPointerEvents}\n withAria={false}\n withErrorStyles={withErrorStyles}\n attributes={attributes}\n >\n <input\n required={required}\n data-invalid={!!error \|\| undefined}\n data-with-left-section={!!leftSection \|\| undefined}\n {...getStyles('innerInput')}\n disabled={disabled}\n id={uuid}\n {...rest}\n aria-describedby={describedBy}\n autoComplete={rest.autoComplete \|\| 'off'}\n type={_visible ? 'text' : 'password'}\n />\n </Input>\n </Input.Wrapper>\n );\n});\n\nPasswordInput.classes = { ...InputBase.classes, ...classes };\nPasswordInput.varsResolver = varsResolver;\nPasswordInput.displayName = '@mantine/core/PasswordInput';\n\nexport namespace PasswordInput {\n export type Props = PasswordInputProps;\n export type StylesNames = PasswordInputStylesNames;\n export type CssVariables = PasswordInputCssVariables;\n export type Factory = PasswordInputFactory;\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"PasswordInput.cjs","names":["PasswordToggleIcon","createVarsResolver","getSize","factory","useProps","useStyles","useResolvedStylesApi","extractStyleProps","ActionIcon","Input","classes","InputBase"],"sources":["../../../src/components/PasswordInput/PasswordInput.tsx"],"sourcesContent":["import cx from 'clsx';\nimport { useId, useUncontrolled } from '@mantine/hooks';\nimport {\n BoxProps,\n createVarsResolver,\n ElementProps,\n extractStyleProps,\n factory,\n Factory,\n getSize,\n StylesApiProps,\n useProps,\n useResolvedStylesApi,\n useStyles,\n} from '../../core';\nimport { ActionIcon } from '../ActionIcon';\nimport { __BaseInputProps, __InputStylesNames, Input, InputVariant } from '../Input';\nimport { InputBase } from '../InputBase';\nimport { PasswordToggleIcon } from './PasswordToggleIcon';\nimport classes from './PasswordInput.module.css';\n\nexport type PasswordInputStylesNames =\n \| 'root'\n \| 'visibilityToggle'\n \| 'innerInput'\n \| __InputStylesNames;\nexport type PasswordInputCssVariables = {\n root: '--psi-icon-size' \| '--psi-button-size';\n};\n\nexport interface PasswordInputProps\n extends\n BoxProps,\n Omit<__BaseInputProps, 'pointer'>,\n StylesApiProps<PasswordInputFactory>,\n ElementProps<'input', 'size'> {\n /** A component to replace the visibility toggle icon /\n visibilityToggleIcon?: React.FC<{ reveal: boolean }>;\n\n /* Props passed down to the visibility toggle button /\n visibilityToggleButtonProps?: Record<string, any>;\n\n /* If set, the input value is visible /\n visible?: boolean;\n\n /* If set, the input value is visible by default /\n defaultVisible?: boolean;\n\n /* Called when visibility changes */\n onVisibilityChange?: (visible: boolean) => void;\n}\n\nexport type PasswordInputFactory = Factory<{\n props: PasswordInputProps;\n ref: HTMLInputElement;\n stylesNames: PasswordInputStylesNames;\n vars: PasswordInputCssVariables;\n variant: InputVariant;\n}>;\n\nconst defaultProps = {\n visibilityToggleIcon: PasswordToggleIcon,\n size: 'sm',\n} satisfies Partial<PasswordInputProps>;\n\nconst varsResolver = createVarsResolver<PasswordInputFactory>((_, { size }) => ({\n root: {\n '--psi-icon-size': getSize(size, 'psi-icon-size'),\n '--psi-button-size': getSize(size, 'psi-button-size'),\n },\n}));\n\nexport const PasswordInput = factory<PasswordInputFactory>((_props) => {\n const props = useProps(['Input', 'InputWrapper', 'PasswordInput'], defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n required,\n error,\n leftSection,\n disabled,\n id,\n variant,\n inputContainer,\n description,\n label,\n size,\n errorProps,\n descriptionProps,\n labelProps,\n withAsterisk,\n inputWrapperOrder,\n wrapperProps,\n radius,\n rightSection,\n rightSectionWidth,\n rightSectionPointerEvents,\n leftSectionWidth,\n visible,\n defaultVisible,\n onVisibilityChange,\n visibilityToggleIcon: VisibilityToggleIcon,\n visibilityToggleButtonProps,\n rightSectionProps,\n leftSectionProps,\n leftSectionPointerEvents,\n withErrorStyles,\n mod,\n attributes,\n ...others\n } = props;\n\n const uuid = useId(id);\n\n const [_visible, setVisibility] = useUncontrolled({\n value: visible,\n defaultValue: defaultVisible,\n finalValue: false,\n onChange: onVisibilityChange,\n });\n\n const toggleVisibility = () => setVisibility(!_visible);\n\n const getStyles = useStyles<PasswordInputFactory>({\n name: 'PasswordInput',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<PasswordInputFactory>({\n classNames,\n styles,\n props,\n });\n\n const { styleProps, rest } = extractStyleProps(others);\n const errorId = errorProps?.id \|\| `${uuid}-error`;\n const descriptionId = descriptionProps?.id \|\| `${uuid}-description`;\n const hasError = !!error && typeof error !== 'boolean';\n const hasDescription = !!description;\n const _describedBy = `${hasError ? errorId : ''} ${hasDescription ? descriptionId : ''}`;\n const describedBy = _describedBy.trim().length > 0 ? _describedBy.trim() : undefined;\n\n const visibilityToggleButton = (\n <ActionIcon<'button'>\n {...getStyles('visibilityToggle')}\n disabled={disabled}\n radius={radius}\n aria-pressed={_visible}\n tabIndex={-1}\n aria-label=\"Toggle password visibility\"\n {...visibilityToggleButtonProps}\n variant={visibilityToggleButtonProps?.variant ?? 'subtle'}\n color=\"gray\"\n unstyled={unstyled}\n onTouchEnd={(event) => {\n event.preventDefault();\n visibilityToggleButtonProps?.onTouchEnd?.(event);\n toggleVisibility();\n }}\n onMouseDown={(event) => {\n event.preventDefault();\n visibilityToggleButtonProps?.onMouseDown?.(event);\n toggleVisibility();\n }}\n onKeyDown={(event) => {\n visibilityToggleButtonProps?.onKeyDown?.(event);\n if (event.key === ' ') {\n event.preventDefault();\n toggleVisibility();\n }\n }}\n >\n <VisibilityToggleIcon reveal={_visible} />\n </ActionIcon>\n );\n\n return (\n <Input.Wrapper\n required={required}\n id={uuid}\n label={label}\n error={error}\n description={description}\n size={size}\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n __staticSelector=\"PasswordInput\"\n __stylesApiProps={props}\n unstyled={unstyled}\n withAsterisk={withAsterisk}\n inputWrapperOrder={inputWrapperOrder}\n inputContainer={inputContainer}\n variant={variant}\n labelProps={{ ...labelProps, htmlFor: uuid }}\n descriptionProps={{ ...descriptionProps, id: descriptionId }}\n errorProps={{ ...errorProps, id: errorId }}\n mod={mod}\n attributes={attributes}\n {...getStyles('root')}\n {...styleProps}\n {...wrapperProps}\n >\n <Input\n component=\"div\"\n error={error}\n leftSection={leftSection}\n size={size}\n classNames={{ ...resolvedClassNames, input: cx(classes.input, resolvedClassNames?.input) }}\n styles={resolvedStyles}\n radius={radius}\n disabled={disabled}\n __staticSelector=\"PasswordInput\"\n __stylesApiProps={props}\n rightSectionWidth={rightSectionWidth}\n rightSection={rightSection ?? visibilityToggleButton}\n variant={variant}\n unstyled={unstyled}\n leftSectionWidth={leftSectionWidth}\n rightSectionPointerEvents={rightSectionPointerEvents \|\| 'all'}\n rightSectionProps={rightSectionProps}\n leftSectionProps={leftSectionProps}\n leftSectionPointerEvents={leftSectionPointerEvents}\n withAria={false}\n withErrorStyles={withErrorStyles}\n attributes={attributes}\n >\n <input\n required={required}\n data-invalid={!!error \|\| undefined}\n data-with-left-section={!!leftSection \|\| undefined}\n {...getStyles('innerInput')}\n disabled={disabled}\n id={uuid}\n {...rest}\n aria-describedby={describedBy}\n autoComplete={rest.autoComplete \|\| 'off'}\n type={_visible ? 'text' : 'password'}\n />\n </Input>\n </Input.Wrapper>\n );\n});\n\nPasswordInput.classes = { ...InputBase.classes, ...classes };\nPasswordInput.varsResolver = varsResolver;\nPasswordInput.displayName = '@mantine/core/PasswordInput';\n\nexport namespace PasswordInput {\n export type Props = PasswordInputProps;\n export type StylesNames = PasswordInputStylesNames;\n export type CssVariables = PasswordInputCssVariables;\n export type Factory = PasswordInputFactory;\n}\n"],"mappings":"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"}

package/cjs/components/PasswordInput/PasswordToggleIcon.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PasswordToggleIcon.cjs","names":[],"sources":["../../../src/components/PasswordInput/PasswordToggleIcon.tsx"],"sourcesContent":["export interface PasswordToggleIconProps {\n reveal: boolean;\n}\n\nexport type PasswordInputVisibilityToggleIcon = React.FC<PasswordToggleIconProps>;\n\nexport function PasswordToggleIcon({ reveal }: PasswordToggleIconProps) {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 256 256\"\n style={{ width: 'var(--psi-icon-size)', height: 'var(--psi-icon-size)' }}\n >\n {reveal ? (\n <>\n <path fill=\"none\" d=\"M0 0h256v256H0z\" />\n <path\n fill=\"none\"\n stroke=\"currentColor\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth=\"16\"\n d=\"M48 40l160 176M154.91 157.6a40 40 0 01-53.82-59.2M135.53 88.71a40 40 0 0132.3 35.53\"\n />\n <path\n fill=\"none\"\n stroke=\"currentColor\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth=\"16\"\n d=\"M208.61 169.1C230.41 149.58 240 128 240 128s-32-72-112-72a126 126 0 00-20.68 1.68M74 68.6C33.23 89.24 16 128 16 128s32 72 112 72a118.05 118.05 0 0054-12.6\"\n />\n </>\n ) : (\n <>\n <path fill=\"none\" d=\"M0 0h256v256H0z\" />\n <path\n fill=\"none\"\n stroke=\"currentColor\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth=\"16\"\n d=\"M128 56c-80 0-112 72-112 72s32 72 112 72 112-72 112-72-32-72-112-72z\"\n />\n <circle\n cx=\"128\"\n cy=\"128\"\n r=\"40\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth=\"16\"\n />\n </>\n )}\n </svg>\n );\n}\n"],"mappings":";;;;AAMA,SAAgB,mBAAmB,EAAE,UAAmC;~~AACtE~~,~~QACE~~,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,OAAM;EACN,SAAQ;EACR,OAAO;GAAE,OAAO;GAAwB,QAAQ;~~GAAwB~~;~~YAEvE~~,SACC,iBAAA,GAAA,kBAAA,MAAA,kBAAA,UAAA,EAAA,UAAA;GACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;IAAM,MAAK;IAAO,GAAE;~~IAAoB~~,CAAA;~~GACxC~~,iBAAA,GAAA,kBAAA,KAAC,QAAD;IACE,MAAK;IACL,QAAO;IACP,eAAc;IACd,gBAAe;IACf,aAAY;IACZ,GAAE;~~IACF~~,CAAA;~~GACF~~,iBAAA,GAAA,kBAAA,KAAC,QAAD;IACE,MAAK;IACL,QAAO;IACP,eAAc;IACd,gBAAe;IACf,aAAY;IACZ,GAAE;~~IACF~~,CAAA;~~GACD~~,EAAA,CAAA,~~GAEH~~,iBAAA,GAAA,kBAAA,MAAA,kBAAA,UAAA,EAAA,UAAA;GACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;IAAM,MAAK;IAAO,GAAE;~~IAAoB~~,CAAA;~~GACxC~~,iBAAA,GAAA,kBAAA,KAAC,QAAD;IACE,MAAK;IACL,QAAO;IACP,eAAc;IACd,gBAAe;IACf,aAAY;IACZ,GAAE;~~IACF~~,CAAA;~~GACF~~,iBAAA,GAAA,kBAAA,KAAC,UAAD;IACE,IAAG;IACH,IAAG;IACH,GAAE;IACF,MAAK;IACL,QAAO;IACP,eAAc;IACd,gBAAe;IACf,aAAY;~~IACZ~~,CAAA;~~GACD~~,EAAA,CAAA;~~EAED~~,CAAA"}
1	+ {"version":3,"file":"PasswordToggleIcon.cjs","names":[],"sources":["../../../src/components/PasswordInput/PasswordToggleIcon.tsx"],"sourcesContent":["export interface PasswordToggleIconProps {\n reveal: boolean;\n}\n\nexport type PasswordInputVisibilityToggleIcon = React.FC<PasswordToggleIconProps>;\n\nexport function PasswordToggleIcon({ reveal }: PasswordToggleIconProps) {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 256 256\"\n style={{ width: 'var(--psi-icon-size)', height: 'var(--psi-icon-size)' }}\n >\n {reveal ? (\n <>\n <path fill=\"none\" d=\"M0 0h256v256H0z\" />\n <path\n fill=\"none\"\n stroke=\"currentColor\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth=\"16\"\n d=\"M48 40l160 176M154.91 157.6a40 40 0 01-53.82-59.2M135.53 88.71a40 40 0 0132.3 35.53\"\n />\n <path\n fill=\"none\"\n stroke=\"currentColor\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth=\"16\"\n d=\"M208.61 169.1C230.41 149.58 240 128 240 128s-32-72-112-72a126 126 0 00-20.68 1.68M74 68.6C33.23 89.24 16 128 16 128s32 72 112 72a118.05 118.05 0 0054-12.6\"\n />\n </>\n ) : (\n <>\n <path fill=\"none\" d=\"M0 0h256v256H0z\" />\n <path\n fill=\"none\"\n stroke=\"currentColor\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth=\"16\"\n d=\"M128 56c-80 0-112 72-112 72s32 72 112 72 112-72 112-72-32-72-112-72z\"\n />\n <circle\n cx=\"128\"\n cy=\"128\"\n r=\"40\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth=\"16\"\n />\n </>\n )}\n </svg>\n );\n}\n"],"mappings":";;;;AAMA,SAAgB,mBAAmB,EAAE,UAAmC;CACtE,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,OAAM;EACN,SAAQ;EACR,OAAO;GAAE,OAAO;GAAwB,QAAQ;EAAuB;YAEtE,SACC,iBAAA,GAAA,kBAAA,MAAA,kBAAA,UAAA,EAAA,UAAA;GACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;IAAM,MAAK;IAAO,GAAE;GAAmB,CAAA;GACvC,iBAAA,GAAA,kBAAA,KAAC,QAAD;IACE,MAAK;IACL,QAAO;IACP,eAAc;IACd,gBAAe;IACf,aAAY;IACZ,GAAE;GACH,CAAA;GACD,iBAAA,GAAA,kBAAA,KAAC,QAAD;IACE,MAAK;IACL,QAAO;IACP,eAAc;IACd,gBAAe;IACf,aAAY;IACZ,GAAE;GACH,CAAA;EACD,EAAA,CAAA,IAEF,iBAAA,GAAA,kBAAA,MAAA,kBAAA,UAAA,EAAA,UAAA;GACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;IAAM,MAAK;IAAO,GAAE;GAAmB,CAAA;GACvC,iBAAA,GAAA,kBAAA,KAAC,QAAD;IACE,MAAK;IACL,QAAO;IACP,eAAc;IACd,gBAAe;IACf,aAAY;IACZ,GAAE;GACH,CAAA;GACD,iBAAA,GAAA,kBAAA,KAAC,UAAD;IACE,IAAG;IACH,IAAG;IACH,GAAE;IACF,MAAK;IACL,QAAO;IACP,eAAc;IACd,gBAAe;IACf,aAAY;GACb,CAAA;EACD,EAAA,CAAA;CAED,CAAA;AAET"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Pill.cjs","names":["createVarsResolver","getSize","getRadius","factory","useProps","PillGroupContext","PillsInputContext","useStyles","Box","CloseButton","classes","PillGroup"],"sources":["../../../src/components/Pill/Pill.tsx"],"sourcesContent":["import { use } from 'react';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getRadius,\n getSize,\n MantineRadius,\n MantineSize,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { CloseButton, CloseButtonProps } from '../CloseButton';\nimport { PillsInputContext } from '../PillsInput/PillsInput.context';\nimport {\n PillGroup,\n PillGroupContext,\n type PillGroupProps,\n type PillGroupStylesNames,\n type PillGroupCssVariables,\n type PillGroupFactory,\n} from './PillGroup/PillGroup';\nimport classes from './Pill.module.css';\nexport type PillStylesNames = 'root' \| 'label' \| 'remove';\nexport type PillVariant = 'default' \| 'contrast';\nexport type PillCssVariables = {\n root: '--pill-fz' \| '--pill-radius' \| '--pill-height';\n};\n\nexport interface PillProps extends BoxProps, StylesApiProps<PillFactory>, ElementProps<'div'> {\n /** Controls pill `font-size` and `padding` @default 'sm' /\n size?: MantineSize;\n\n /* Controls visibility of the remove button @default false /\n withRemoveButton?: boolean;\n\n /* Called when the remove button is clicked /\n onRemove?: () => void;\n\n /* Props passed down to the remove button /\n removeButtonProps?: CloseButtonProps & React.ComponentProps<'button'>;\n\n /* Key of `theme.radius` or any valid CSS value to set border-radius. Numbers are converted to rem. @default 'xl' /\n radius?: MantineRadius;\n\n /* Adds disabled attribute, applies disabled styles */\n disabled?: boolean;\n}\n\nexport type PillFactory = Factory<{\n props: PillProps;\n ref: HTMLDivElement;\n stylesNames: PillStylesNames;\n vars: PillCssVariables;\n variant: PillVariant;\n ctx: { size: MantineSize \| (string & {}) \| undefined };\n staticComponents: {\n Group: typeof PillGroup;\n };\n}>;\n\nconst defaultProps = {\n variant: 'default',\n} satisfies Partial<PillProps>;\n\nconst varsResolver = createVarsResolver<PillFactory>((_, { radius }, { size }) => ({\n root: {\n '--pill-fz': getSize(size, 'pill-fz'),\n '--pill-height': getSize(size, 'pill-height'),\n '--pill-radius': radius === undefined ? undefined : getRadius(radius),\n },\n}));\n\nexport const Pill = factory<PillFactory>((_props) => {\n const props = useProps('Pill', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n variant,\n children,\n withRemoveButton,\n onRemove,\n removeButtonProps,\n radius,\n size,\n disabled,\n mod,\n attributes,\n ...others\n } = props;\n\n const ctx = use(PillGroupContext);\n const pillsInputCtx = use(PillsInputContext);\n const _size = size \|\| ctx?.size \|\| undefined;\n const _variant = pillsInputCtx?.variant === 'filled' ? 'contrast' : variant \|\| 'default';\n\n const getStyles = useStyles<PillFactory>({\n name: 'Pill',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n stylesCtx: { size: _size },\n });\n\n return (\n <Box\n component=\"span\"\n variant={_variant}\n size={_size}\n {...getStyles('root', { variant: _variant })}\n mod={[\n { 'with-remove': withRemoveButton && !disabled, disabled: disabled \|\| ctx?.disabled },\n mod,\n ]}\n {...others}\n >\n <span {...getStyles('label')}>{children}</span>\n {withRemoveButton && (\n <CloseButton\n variant=\"transparent\"\n radius={radius}\n tabIndex={-1}\n aria-hidden\n unstyled={unstyled}\n {...removeButtonProps}\n {...getStyles('remove', {\n className: removeButtonProps?.className,\n style: removeButtonProps?.style,\n })}\n onMouseDown={(event) => {\n event.preventDefault();\n event.stopPropagation();\n removeButtonProps?.onMouseDown?.(event);\n }}\n onClick={(event) => {\n event.stopPropagation();\n onRemove?.();\n removeButtonProps?.onClick?.(event);\n }}\n />\n )}\n </Box>\n );\n});\n\nPill.classes = classes;\nPill.varsResolver = varsResolver;\nPill.displayName = '@mantine/core/Pill';\nPill.Group = PillGroup;\n\nexport namespace Pill {\n export type Props = PillProps;\n export type StylesNames = PillStylesNames;\n export type CssVariables = PillCssVariables;\n export type Factory = PillFactory;\n export type Variant = PillVariant;\n\n export namespace Group {\n export type Props = PillGroupProps;\n export type StylesNames = PillGroupStylesNames;\n export type CssVariables = PillGroupCssVariables;\n export type Factory = PillGroupFactory;\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;AAiEA,MAAM,eAAe,EACnB,SAAS,~~WACV~~;~~AAED~~,MAAM,eAAeA,6BAAAA,oBAAiC,GAAG,EAAE,UAAU,EAAE,YAAY,EACjF,MAAM;CACJ,aAAaC,iBAAAA,QAAQ,MAAM,~~UAAU~~;~~CACrC~~,iBAAiBA,iBAAAA,QAAQ,MAAM,~~cAAc~~;~~CAC7C~~,iBAAiB,WAAW,KAAA,IAAY,KAAA,IAAYC,iBAAAA,UAAU,~~OAAO~~;~~CACtE~~,EACF,EAAE;~~AAEH~~,MAAa,OAAOC,gBAAAA,SAAsB,WAAW;CACnD,MAAM,QAAQC,kBAAAA,SAAS,QAAQ,cAAc,~~OAAO~~;~~CACpD~~,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,SACA,UACA,kBACA,UACA,mBACA,QACA,MACA,UACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,OAAA,GAAA,MAAA,KAAUC,kBAAAA,~~iBAAiB~~;~~CACjC~~,MAAM,iBAAA,GAAA,MAAA,KAAoBC,2BAAAA,~~kBAAkB~~;~~CAC5C~~,MAAM,QAAQ,QAAQ,KAAK,QAAQ,KAAA;CACnC,MAAM,WAAW,eAAe,YAAY,WAAW,aAAa,WAAW;CAE/E,MAAM,YAAYC,mBAAAA,UAAuB;EACvC,MAAM;EACN,SAAA,oBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,WAAW,EAAE,MAAM,~~OAAO~~;~~EAC3B~~,CAAC;~~AAEF~~,~~QACE~~,iBAAA,GAAA,kBAAA,MAACC,YAAAA,KAAD;EACE,WAAU;EACV,SAAS;EACT,MAAM;EACN,GAAI,UAAU,QAAQ,EAAE,SAAS,~~UAAU~~,CAAC;~~EAC5C~~,KAAK,CACH;GAAE,eAAe,oBAAoB,CAAC;GAAU,UAAU,YAAY,KAAK;~~GAAU~~,~~EACrF~~,~~IACD~~;~~EACD~~,GAAI;YATN,CAWE,iBAAA,GAAA,kBAAA,KAAC,QAAD;GAAM,GAAI,UAAU,~~QAAQ~~;~~GAAG~~;~~GAAgB~~,CAAA,~~EAC9C~~,oBACC,iBAAA,GAAA,kBAAA,KAACC,oBAAAA,aAAD;GACE,SAAQ;GACA;GACR,UAAU;GACV,eAAA;GACU;GACV,GAAI;GACJ,GAAI,UAAU,UAAU;IACtB,WAAW,mBAAmB;IAC9B,OAAO,mBAAmB;~~IAC3B~~,CAAC;~~GACF~~,cAAc,UAAU;~~AACtB~~,~~UAAM~~,~~gBAAgB~~;~~AACtB~~,~~UAAM~~,~~iBAAiB~~;~~AACvB~~,~~uBAAmB~~,cAAc,~~MAAM;;GAEzC~~,UAAU,UAAU;~~AAClB~~,~~UAAM~~,~~iBAAiB~~;~~AACvB~~,~~gBAAY~~;~~AACZ~~,~~uBAAmB~~,UAAU,~~MAAM;;GAErC~~,CAAA,CAEA;;~~EAER~~;~~AAEF~~,KAAK,UAAUC,oBAAAA;AACf,KAAK,eAAe;AACpB,KAAK,cAAc;AACnB,KAAK,QAAQC,kBAAAA"}
1	+ {"version":3,"file":"Pill.cjs","names":["createVarsResolver","getSize","getRadius","factory","useProps","PillGroupContext","PillsInputContext","useStyles","Box","CloseButton","classes","PillGroup"],"sources":["../../../src/components/Pill/Pill.tsx"],"sourcesContent":["import { use } from 'react';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getRadius,\n getSize,\n MantineRadius,\n MantineSize,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { CloseButton, CloseButtonProps } from '../CloseButton';\nimport { PillsInputContext } from '../PillsInput/PillsInput.context';\nimport {\n PillGroup,\n PillGroupContext,\n type PillGroupProps,\n type PillGroupStylesNames,\n type PillGroupCssVariables,\n type PillGroupFactory,\n} from './PillGroup/PillGroup';\nimport classes from './Pill.module.css';\nexport type PillStylesNames = 'root' \| 'label' \| 'remove';\nexport type PillVariant = 'default' \| 'contrast';\nexport type PillCssVariables = {\n root: '--pill-fz' \| '--pill-radius' \| '--pill-height';\n};\n\nexport interface PillProps extends BoxProps, StylesApiProps<PillFactory>, ElementProps<'div'> {\n /** Controls pill `font-size` and `padding` @default 'sm' /\n size?: MantineSize;\n\n /* Controls visibility of the remove button @default false /\n withRemoveButton?: boolean;\n\n /* Called when the remove button is clicked /\n onRemove?: () => void;\n\n /* Props passed down to the remove button /\n removeButtonProps?: CloseButtonProps & React.ComponentProps<'button'>;\n\n /* Key of `theme.radius` or any valid CSS value to set border-radius. Numbers are converted to rem. @default 'xl' /\n radius?: MantineRadius;\n\n /* Adds disabled attribute, applies disabled styles */\n disabled?: boolean;\n}\n\nexport type PillFactory = Factory<{\n props: PillProps;\n ref: HTMLDivElement;\n stylesNames: PillStylesNames;\n vars: PillCssVariables;\n variant: PillVariant;\n ctx: { size: MantineSize \| (string & {}) \| undefined };\n staticComponents: {\n Group: typeof PillGroup;\n };\n}>;\n\nconst defaultProps = {\n variant: 'default',\n} satisfies Partial<PillProps>;\n\nconst varsResolver = createVarsResolver<PillFactory>((_, { radius }, { size }) => ({\n root: {\n '--pill-fz': getSize(size, 'pill-fz'),\n '--pill-height': getSize(size, 'pill-height'),\n '--pill-radius': radius === undefined ? undefined : getRadius(radius),\n },\n}));\n\nexport const Pill = factory<PillFactory>((_props) => {\n const props = useProps('Pill', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n variant,\n children,\n withRemoveButton,\n onRemove,\n removeButtonProps,\n radius,\n size,\n disabled,\n mod,\n attributes,\n ...others\n } = props;\n\n const ctx = use(PillGroupContext);\n const pillsInputCtx = use(PillsInputContext);\n const _size = size \|\| ctx?.size \|\| undefined;\n const _variant = pillsInputCtx?.variant === 'filled' ? 'contrast' : variant \|\| 'default';\n\n const getStyles = useStyles<PillFactory>({\n name: 'Pill',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n stylesCtx: { size: _size },\n });\n\n return (\n <Box\n component=\"span\"\n variant={_variant}\n size={_size}\n {...getStyles('root', { variant: _variant })}\n mod={[\n { 'with-remove': withRemoveButton && !disabled, disabled: disabled \|\| ctx?.disabled },\n mod,\n ]}\n {...others}\n >\n <span {...getStyles('label')}>{children}</span>\n {withRemoveButton && (\n <CloseButton\n variant=\"transparent\"\n radius={radius}\n tabIndex={-1}\n aria-hidden\n unstyled={unstyled}\n {...removeButtonProps}\n {...getStyles('remove', {\n className: removeButtonProps?.className,\n style: removeButtonProps?.style,\n })}\n onMouseDown={(event) => {\n event.preventDefault();\n event.stopPropagation();\n removeButtonProps?.onMouseDown?.(event);\n }}\n onClick={(event) => {\n event.stopPropagation();\n onRemove?.();\n removeButtonProps?.onClick?.(event);\n }}\n />\n )}\n </Box>\n );\n});\n\nPill.classes = classes;\nPill.varsResolver = varsResolver;\nPill.displayName = '@mantine/core/Pill';\nPill.Group = PillGroup;\n\nexport namespace Pill {\n export type Props = PillProps;\n export type StylesNames = PillStylesNames;\n export type CssVariables = PillCssVariables;\n export type Factory = PillFactory;\n export type Variant = PillVariant;\n\n export namespace Group {\n export type Props = PillGroupProps;\n export type StylesNames = PillGroupStylesNames;\n export type CssVariables = PillGroupCssVariables;\n export type Factory = PillGroupFactory;\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;AAiEA,MAAM,eAAe,EACnB,SAAS,UACX;AAEA,MAAM,eAAeA,6BAAAA,oBAAiC,GAAG,EAAE,UAAU,EAAE,YAAY,EACjF,MAAM;CACJ,aAAaC,iBAAAA,QAAQ,MAAM,SAAS;CACpC,iBAAiBA,iBAAAA,QAAQ,MAAM,aAAa;CAC5C,iBAAiB,WAAW,KAAA,IAAY,KAAA,IAAYC,iBAAAA,UAAU,MAAM;AACtE,EACF,EAAE;AAEF,MAAa,OAAOC,gBAAAA,SAAsB,WAAW;CACnD,MAAM,QAAQC,kBAAAA,SAAS,QAAQ,cAAc,MAAM;CACnD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,SACA,UACA,kBACA,UACA,mBACA,QACA,MACA,UACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,OAAA,GAAA,MAAA,KAAUC,kBAAAA,gBAAgB;CAChC,MAAM,iBAAA,GAAA,MAAA,KAAoBC,2BAAAA,iBAAiB;CAC3C,MAAM,QAAQ,QAAQ,KAAK,QAAQ,KAAA;CACnC,MAAM,WAAW,eAAe,YAAY,WAAW,aAAa,WAAW;CAE/E,MAAM,YAAYC,mBAAAA,UAAuB;EACvC,MAAM;EACN,SAAA,oBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,WAAW,EAAE,MAAM,MAAM;CAC3B,CAAC;CAED,OACE,iBAAA,GAAA,kBAAA,MAACC,YAAAA,KAAD;EACE,WAAU;EACV,SAAS;EACT,MAAM;EACN,GAAI,UAAU,QAAQ,EAAE,SAAS,SAAS,CAAC;EAC3C,KAAK,CACH;GAAE,eAAe,oBAAoB,CAAC;GAAU,UAAU,YAAY,KAAK;EAAS,GACpF,GACF;EACA,GAAI;YATN,CAWE,iBAAA,GAAA,kBAAA,KAAC,QAAD;GAAM,GAAI,UAAU,OAAO;GAAI;EAAe,CAAA,GAC7C,oBACC,iBAAA,GAAA,kBAAA,KAACC,oBAAAA,aAAD;GACE,SAAQ;GACA;GACR,UAAU;GACV,eAAA;GACU;GACV,GAAI;GACJ,GAAI,UAAU,UAAU;IACtB,WAAW,mBAAmB;IAC9B,OAAO,mBAAmB;GAC5B,CAAC;GACD,cAAc,UAAU;IACtB,MAAM,eAAe;IACrB,MAAM,gBAAgB;IACtB,mBAAmB,cAAc,KAAK;GACxC;GACA,UAAU,UAAU;IAClB,MAAM,gBAAgB;IACtB,WAAW;IACX,mBAAmB,UAAU,KAAK;GACpC;EACD,CAAA,CAEA;;AAET,CAAC;AAED,KAAK,UAAUC,oBAAAA;AACf,KAAK,eAAe;AACpB,KAAK,cAAc;AACnB,KAAK,QAAQC,kBAAAA"}

package/cjs/components/Pill/Pill.module.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Pill.module.cjs","names":[],"sources":["../../../src/components/Pill/Pill.module.css"],"sourcesContent":[".root {\n --pill-fz-xs: 10px;\n --pill-fz-sm: 12px;\n --pill-fz-md: 14px;\n --pill-fz-lg: 16px;\n --pill-fz-xl: 18px;\n\n --pill-height-xs: 18px;\n --pill-height-sm: 22px;\n --pill-height-md: 25px;\n --pill-height-lg: 28px;\n --pill-height-xl: 32px;\n\n --pill-fz: var(--pill-fz-sm);\n --pill-height: var(--pill-height-sm);\n\n font-size: var(--pill-fz);\n flex: 0;\n height: var(--pill-height);\n padding-inline: 0.8em;\n display: inline-flex;\n align-items: center;\n border-radius: var(--pill-radius, 1000rem);\n line-height: 1;\n white-space: nowrap;\n user-select: none;\n -webkit-user-select: none;\n max-width: 100%;\n\n @mixin where-dark {\n background-color: var(--mantine-color-dark-7);\n color: var(--mantine-color-dark-0);\n }\n\n @mixin where-light {\n color: var(--mantine-color-black);\n }\n\n &:where([data-with-remove]:not(:has(button:disabled))) {\n padding-inline-end: 0;\n }\n\n &:where([data-disabled], :has(button:disabled)) {\n cursor: not-allowed;\n }\n}\n\n.root--default {\n @mixin where-light {\n background-color: var(--mantine-color-gray-1);\n\n &:where([data-disabled], :has(button:disabled)) {\n background-color: var(--mantine-color-disabled);\n }\n }\n}\n\n.root--contrast {\n @mixin where-light {\n background-color: var(--mantine-color-white);\n\n &:where([data-disabled], :has(button:disabled)) {\n background-color: var(--mantine-color-disabled);\n }\n }\n}\n\n.label {\n cursor: inherit;\n overflow: hidden;\n text-overflow: ellipsis;\n display: flex;\n align-items: center;\n height: 100%;\n text-box-trim: trim-both;\n text-box-edge: cap alphabetic;\n}\n\n.remove {\n color: inherit;\n font-size: inherit;\n height: 100%;\n min-height: unset;\n min-width: 2em;\n width: unset;\n border-radius: 0;\n padding-inline-start: 0.1em;\n padding-inline-end: 0.3em;\n flex: 0;\n border-end-end-radius: var(--pill-radius, 50%);\n border-start-end-radius: var(--pill-radius, 50%);\n\n .root[data-disabled] > &,\n &:disabled {\n display: none;\n background-color: transparent;\n width: 0.8em;\n min-width: 0.8em;\n padding: 0;\n cursor: not-allowed;\n\n & > svg {\n display: none;\n }\n }\n\n & > svg {\n pointer-events: none;\n }\n}\n\n.group {\n --pg-gap-xs: 6px;\n --pg-gap-sm: 8px;\n --pg-gap-md: 10px;\n --pg-gap-lg: 12px;\n --pg-gap-xl: 12px;\n --pg-gap: var(--pg-gap-sm);\n\n display: flex;\n align-items: center;\n gap: var(--pg-gap);\n flex-wrap: wrap;\n}\n"],"mappings":""}
1	+ {"version":3,"file":"Pill.module.cjs","names":[],"sources":["../../../src/components/Pill/Pill.module.css"],"sourcesContent":[".root {\n --pill-fz-xs: 10px;\n --pill-fz-sm: 12px;\n --pill-fz-md: 14px;\n --pill-fz-lg: 16px;\n --pill-fz-xl: 18px;\n\n --pill-height-xs: 18px;\n --pill-height-sm: 22px;\n --pill-height-md: 25px;\n --pill-height-lg: 28px;\n --pill-height-xl: 32px;\n\n --pill-fz: var(--pill-fz-sm);\n --pill-height: var(--pill-height-sm);\n\n font-size: var(--pill-fz);\n flex: 0;\n height: var(--pill-height);\n padding-inline: 0.8em;\n display: inline-flex;\n align-items: center;\n border-radius: var(--pill-radius, 1000rem);\n line-height: 1;\n white-space: nowrap;\n user-select: none;\n -webkit-user-select: none;\n max-width: 100%;\n position: relative;\n\n @mixin where-dark {\n background-color: var(--mantine-color-dark-7);\n color: var(--mantine-color-dark-0);\n }\n\n @mixin where-light {\n color: var(--mantine-color-black);\n }\n\n &:where([data-with-remove]:not(:has(button:disabled))) {\n padding-inline-end: 0;\n }\n\n &:where([data-disabled], :has(button:disabled)) {\n cursor: not-allowed;\n }\n\n &:where([draggable='true']) {\n cursor: grab;\n }\n\n &:where([draggable='true']):focus-visible {\n outline: 2px solid var(--mantine-primary-color-filled);\n outline-offset: 2px;\n }\n\n &:where([data-dragging]) {\n opacity: 0.4;\n cursor: grabbing;\n }\n\n &:where([data-drag-over='before'])::before,\n &:where([data-drag-over='after'])::after {\n content: '';\n position: absolute;\n top: 0;\n bottom: 0;\n width: rem(2px);\n background-color: var(--mantine-primary-color-filled);\n pointer-events: none;\n z-index: 1;\n }\n\n &:where([data-drag-over='before'])::before {\n inset-inline-start: rem(-4px);\n }\n\n &:where([data-drag-over='after'])::after {\n inset-inline-end: rem(-4px);\n }\n}\n\n.root--default {\n @mixin where-light {\n background-color: var(--mantine-color-gray-1);\n\n &:where([data-disabled], :has(button:disabled)) {\n background-color: var(--mantine-color-disabled);\n }\n }\n}\n\n.root--contrast {\n @mixin where-light {\n background-color: var(--mantine-color-white);\n\n &:where([data-disabled], :has(button:disabled)) {\n background-color: var(--mantine-color-disabled);\n }\n }\n}\n\n.label {\n cursor: inherit;\n overflow: hidden;\n text-overflow: ellipsis;\n display: flex;\n align-items: center;\n height: 100%;\n text-box-trim: trim-both;\n text-box-edge: cap alphabetic;\n}\n\n.remove {\n color: inherit;\n font-size: inherit;\n height: 100%;\n min-height: unset;\n min-width: 2em;\n width: unset;\n border-radius: 0;\n padding-inline-start: 0.1em;\n padding-inline-end: 0.3em;\n flex: 0;\n border-end-end-radius: var(--pill-radius, 50%);\n border-start-end-radius: var(--pill-radius, 50%);\n\n .root[data-disabled] > &,\n &:disabled {\n display: none;\n background-color: transparent;\n width: 0.8em;\n min-width: 0.8em;\n padding: 0;\n cursor: not-allowed;\n\n & > svg {\n display: none;\n }\n }\n\n & > svg {\n pointer-events: none;\n }\n}\n\n.group {\n --pg-gap-xs: 6px;\n --pg-gap-sm: 8px;\n --pg-gap-md: 10px;\n --pg-gap-lg: 12px;\n --pg-gap-xl: 12px;\n --pg-gap: var(--pg-gap-sm);\n\n display: flex;\n align-items: center;\n gap: var(--pg-gap);\n flex-wrap: wrap;\n}\n"],"mappings":""}

package/cjs/components/Pill/PillGroup/PillGroup.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PillGroup.cjs","names":["createVarsResolver","getSize","factory","useProps","PillsInputContext","useStyles","Box","classes"],"sources":["../../../../src/components/Pill/PillGroup/PillGroup.tsx"],"sourcesContent":["import { createContext, use } from 'react';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSize,\n MantineSize,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../../core';\nimport { PillsInputContext } from '../../PillsInput/PillsInput.context';\nimport classes from '../Pill.module.css';\n\nexport interface PillGroupContextValue {\n size: MantineSize \| (string & {}) \| undefined;\n disabled: boolean \| undefined;\n}\n\nexport const PillGroupContext = createContext<PillGroupContextValue \| null>(null);\n\nexport type PillGroupStylesNames = 'group';\nexport type PillGroupCssVariables = {\n group: '--pg-gap';\n};\n\nexport interface PillGroupProps\n extends BoxProps, StylesApiProps<PillGroupFactory>, ElementProps<'div'> {\n /** Controls spacing between pills, by default controlled by `size` /\n gap?: MantineSize \| (string & {}) \| number;\n\n /* Controls size of the child `Pill` components and gap between them @default 'sm' /\n size?: MantineSize \| (string & {});\n\n /* If set, adds disabled to all child `Pill` components */\n disabled?: boolean;\n}\n\nexport type PillGroupFactory = Factory<{\n props: PillGroupProps;\n ref: HTMLDivElement;\n stylesNames: PillGroupStylesNames;\n vars: PillGroupCssVariables;\n ctx: { size: MantineSize \| (string & {}) \| undefined };\n}>;\n\nconst varsResolver = createVarsResolver<PillGroupFactory>((_, { gap }, { size }) => ({\n group: {\n '--pg-gap': gap !== undefined ? getSize(gap) : getSize(size, 'pg-gap'),\n },\n}));\n\nexport const PillGroup = factory<PillGroupFactory>((_props) => {\n const props = useProps('PillGroup', null, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n size,\n disabled,\n attributes,\n ...others\n } = props;\n const pillsInputCtx = use(PillsInputContext);\n const _size = pillsInputCtx?.size \|\| size \|\| undefined;\n\n const getStyles = useStyles<PillGroupFactory>({\n name: 'PillGroup',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n stylesCtx: { size: _size },\n rootSelector: 'group',\n });\n\n return (\n <PillGroupContext value={{ size: _size, disabled }}>\n <Box size={_size} {...getStyles('group')} {...others} />\n </PillGroupContext>\n );\n});\n\nPillGroup.classes = classes;\nPillGroup.varsResolver = varsResolver;\nPillGroup.displayName = '@mantine/core/PillGroup';\n"],"mappings":";;;;;;;;;;;;;AAsBA,MAAa,oBAAA,GAAA,MAAA,eAA+D,~~KAAK~~;~~AA2BjF~~,MAAM,eAAeA,6BAAAA,oBAAsC,GAAG,EAAE,OAAO,EAAE,YAAY,EACnF,OAAO,EACL,YAAY,QAAQ,KAAA,IAAYC,iBAAAA,QAAQ,~~IAAI~~,~~GAAGA~~,iBAAAA,QAAQ,MAAM,~~SAAS~~,EACvE,EACF,EAAE;~~AAEH~~,MAAa,YAAYC,gBAAAA,SAA2B,WAAW;CAC7D,MAAM,QAAQC,kBAAAA,SAAS,aAAa,MAAM,~~OAAO~~;~~CACjD~~,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,MACA,UACA,YACA,GAAG,WACD;CAEJ,MAAM,SAAA,GAAA,MAAA,KADoBC,2BAAAA,~~kBAAkB~~,~~EACf~~,QAAQ,QAAQ,KAAA;CAE7C,MAAM,YAAYC,mBAAAA,UAA4B;EAC5C,MAAM;EACN,SAAA,oBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,WAAW,EAAE,MAAM,~~OAAO~~;~~EAC1B~~,cAAc;~~EACf~~,CAAC;~~AAEF~~,~~QACE~~,iBAAA,GAAA,kBAAA,KAAC,kBAAD;EAAkB,OAAO;GAAE,MAAM;GAAO;~~GAAU~~;~~YAChD~~,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;GAAK,MAAM;GAAO,GAAI,UAAU,~~QAAQ~~;~~GAAE~~,GAAI;~~GAAU~~,CAAA;~~EACvC~~,CAAA;~~EAErB~~;~~AAEF~~,UAAU,UAAUC,oBAAAA;AACpB,UAAU,eAAe;AACzB,UAAU,cAAc"}
1	+ {"version":3,"file":"PillGroup.cjs","names":["createVarsResolver","getSize","factory","useProps","PillsInputContext","useStyles","Box","classes"],"sources":["../../../../src/components/Pill/PillGroup/PillGroup.tsx"],"sourcesContent":["import { createContext, use } from 'react';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSize,\n MantineSize,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../../core';\nimport { PillsInputContext } from '../../PillsInput/PillsInput.context';\nimport classes from '../Pill.module.css';\n\nexport interface PillGroupContextValue {\n size: MantineSize \| (string & {}) \| undefined;\n disabled: boolean \| undefined;\n}\n\nexport const PillGroupContext = createContext<PillGroupContextValue \| null>(null);\n\nexport type PillGroupStylesNames = 'group';\nexport type PillGroupCssVariables = {\n group: '--pg-gap';\n};\n\nexport interface PillGroupProps\n extends BoxProps, StylesApiProps<PillGroupFactory>, ElementProps<'div'> {\n /** Controls spacing between pills, by default controlled by `size` /\n gap?: MantineSize \| (string & {}) \| number;\n\n /* Controls size of the child `Pill` components and gap between them @default 'sm' /\n size?: MantineSize \| (string & {});\n\n /* If set, adds disabled to all child `Pill` components */\n disabled?: boolean;\n}\n\nexport type PillGroupFactory = Factory<{\n props: PillGroupProps;\n ref: HTMLDivElement;\n stylesNames: PillGroupStylesNames;\n vars: PillGroupCssVariables;\n ctx: { size: MantineSize \| (string & {}) \| undefined };\n}>;\n\nconst varsResolver = createVarsResolver<PillGroupFactory>((_, { gap }, { size }) => ({\n group: {\n '--pg-gap': gap !== undefined ? getSize(gap) : getSize(size, 'pg-gap'),\n },\n}));\n\nexport const PillGroup = factory<PillGroupFactory>((_props) => {\n const props = useProps('PillGroup', null, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n size,\n disabled,\n attributes,\n ...others\n } = props;\n const pillsInputCtx = use(PillsInputContext);\n const _size = pillsInputCtx?.size \|\| size \|\| undefined;\n\n const getStyles = useStyles<PillGroupFactory>({\n name: 'PillGroup',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n stylesCtx: { size: _size },\n rootSelector: 'group',\n });\n\n return (\n <PillGroupContext value={{ size: _size, disabled }}>\n <Box size={_size} {...getStyles('group')} {...others} />\n </PillGroupContext>\n );\n});\n\nPillGroup.classes = classes;\nPillGroup.varsResolver = varsResolver;\nPillGroup.displayName = '@mantine/core/PillGroup';\n"],"mappings":";;;;;;;;;;;;;AAsBA,MAAa,oBAAA,GAAA,MAAA,eAA+D,IAAI;AA2BhF,MAAM,eAAeA,6BAAAA,oBAAsC,GAAG,EAAE,OAAO,EAAE,YAAY,EACnF,OAAO,EACL,YAAY,QAAQ,KAAA,IAAYC,iBAAAA,QAAQ,GAAG,IAAIA,iBAAAA,QAAQ,MAAM,QAAQ,EACvE,EACF,EAAE;AAEF,MAAa,YAAYC,gBAAAA,SAA2B,WAAW;CAC7D,MAAM,QAAQC,kBAAAA,SAAS,aAAa,MAAM,MAAM;CAChD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,MACA,UACA,YACA,GAAG,WACD;CAEJ,MAAM,SAAA,GAAA,MAAA,KADoBC,2BAAAA,iBACA,GAAG,QAAQ,QAAQ,KAAA;CAE7C,MAAM,YAAYC,mBAAAA,UAA4B;EAC5C,MAAM;EACN,SAAA,oBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,WAAW,EAAE,MAAM,MAAM;EACzB,cAAc;CAChB,CAAC;CAED,OACE,iBAAA,GAAA,kBAAA,KAAC,kBAAD;EAAkB,OAAO;GAAE,MAAM;GAAO;EAAS;YAC/C,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;GAAK,MAAM;GAAO,GAAI,UAAU,OAAO;GAAG,GAAI;EAAS,CAAA;CACvC,CAAA;AAEtB,CAAC;AAED,UAAU,UAAUC,oBAAAA;AACpB,UAAU,eAAe;AACzB,UAAU,cAAc"}

package/cjs/components/PillsInput/PillsInput.cjs CHANGED Viewed

@@ -10,7 +10,11 @@ let react_jsx_runtime = require("react/jsx-runtime");
 //#region packages/@mantine/core/src/components/PillsInput/PillsInput.tsx
 const defaultProps = { size: "sm" };
 const PillsInput = require_factory.factory((_props) => {
-	const { children, onMouseDown, onClick, size, disabled, __staticSelector, error, variant, ...others } = require_use_props.useProps("PillsInput", defaultProps, _props);
+	const { children, onMouseDown, onClick, size, disabled, __staticSelector, error, variant, ...others } = require_use_props.useProps([
+		"Input",
+		"InputWrapper",
+		"PillsInput"
+	], defaultProps, _props);
 	const fieldRef = (0, react.useRef)(null);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_PillsInput_context.PillsInputContext, {
 		value: {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"PillsInput.cjs","names":["factory","useProps","PillsInputContext","InputBase","PillsInputField"],"sources":["../../../src/components/PillsInput/PillsInput.tsx"],"sourcesContent":["import { useRef } from 'react';\nimport { BoxProps, ElementProps, factory, Factory, StylesApiProps, useProps } from '../../core';\nimport { __BaseInputProps, __InputStylesNames } from '../Input';\nimport { InputBase } from '../InputBase';\nimport { PillsInputContext, type PillsInputContextValue } from './PillsInput.context';\nimport {\n PillsInputField,\n type PillsInputFieldProps,\n type PillsInputFieldFactory,\n type PillsInputFieldStylesNames,\n} from './PillsInputField/PillsInputField';\nexport interface PillsInputProps\n extends\n BoxProps,\n __BaseInputProps,\n StylesApiProps<PillsInputFactory>,\n ElementProps<'div', 'size'> {\n __stylesApiProps?: Record<string, any>;\n __staticSelector?: string;\n}\n\nexport type PillsInputFactory = Factory<{\n props: PillsInputProps;\n ref: HTMLDivElement;\n stylesNames: __InputStylesNames;\n staticComponents: {\n Field: typeof PillsInputField;\n };\n}>;\n\nconst defaultProps = {\n size: 'sm',\n} satisfies Partial<PillsInputProps>;\n\nexport const PillsInput = factory<PillsInputFactory>((_props) => {\n const props = useProps('PillsInput', defaultProps, _props);\n const {\n children,\n onMouseDown,\n onClick,\n size,\n disabled,\n __staticSelector,\n error,\n variant,\n ...others\n } = props;\n\n const fieldRef = useRef<HTMLInputElement>(null);\n\n return (\n <PillsInputContext value={{ fieldRef, size, disabled, hasError: !!error, variant }}>\n <InputBase\n size={size}\n error={error}\n variant={variant}\n component=\"div\"\n data-no-overflow\n onMouseDown={(event) => {\n event.preventDefault();\n onMouseDown?.(event);\n fieldRef.current?.focus();\n }}\n onClick={(event) => {\n event.preventDefault();\n const fieldset = event.currentTarget.closest('fieldset');\n if (!fieldset?.disabled) {\n fieldRef.current?.focus();\n onClick?.(event);\n }\n }}\n {...others}\n multiline\n disabled={disabled}\n __staticSelector={__staticSelector \|\| 'PillsInput'}\n withAria={false}\n >\n {children}\n </InputBase>\n </PillsInputContext>\n );\n});\n\nPillsInput.displayName = '@mantine/core/PillsInput';\nPillsInput.classes = InputBase.classes;\nPillsInput.Field = PillsInputField;\n\nexport namespace PillsInput {\n export type Props = PillsInputProps;\n export type Factory = PillsInputFactory;\n export type ContextValue = PillsInputContextValue;\n\n export namespace Field {\n export type Props = PillsInputFieldProps;\n export type Factory = PillsInputFieldFactory;\n export type StylesNames = PillsInputFieldStylesNames;\n }\n}\n"],"mappings":";;;;;;;;;;AA8BA,MAAM,eAAe,EACnB,MAAM,~~MACP~~;~~AAED~~,MAAa,aAAaA,gBAAAA,SAA4B,WAAW;CAE/D,MAAM,EACJ,UACA,aACA,SACA,MACA,UACA,kBACA,OACA,SACA,GAAG,WAVSC,kBAAAA,SAAS,~~cAAc~~,cAAc,~~OAAO~~;~~CAa1D~~,MAAM,YAAA,GAAA,MAAA,QAAoC,~~KAAK~~;~~AAE/C~~,~~QACE~~,iBAAA,GAAA,kBAAA,KAACC,2BAAAA,mBAAD;EAAmB,OAAO;GAAE;GAAU;GAAM;GAAU,UAAU,CAAC,CAAC;GAAO;~~GAAS~~;~~YAChF~~,iBAAA,GAAA,kBAAA,KAACC,kBAAAA,WAAD;GACQ;GACC;GACE;GACT,WAAU;GACV,oBAAA;GACA,cAAc,UAAU;~~AACtB~~,~~UAAM~~,~~gBAAgB~~;~~AACtB~~,~~kBAAc~~,~~MAAM~~;~~AACpB~~,~~aAAS~~,SAAS,~~OAAO;;GAE3B~~,UAAU,UAAU;~~AAClB~~,~~UAAM~~,~~gBAAgB~~;~~AAEtB~~,~~QAAI~~,CADa,MAAM,cAAc,QAAQ,~~WAAW~~,~~EACzC~~,UAAU;~~AACvB~~,~~cAAS~~,SAAS,~~OAAO~~;~~AACzB~~,~~eAAU~~,~~MAAM;;;GAGpB~~,GAAI;GACJ,WAAA;GACU;GACV,kBAAkB,oBAAoB;GACtC,UAAU;GAET;~~GACS~~,CAAA;~~EACM~~,CAAA;~~EAEtB~~;~~AAEF~~,WAAW,cAAc;AACzB,WAAW,UAAUA,kBAAAA,UAAU;AAC/B,WAAW,QAAQC,wBAAAA"}
1	+ {"version":3,"file":"PillsInput.cjs","names":["factory","useProps","PillsInputContext","InputBase","PillsInputField"],"sources":["../../../src/components/PillsInput/PillsInput.tsx"],"sourcesContent":["import { useRef } from 'react';\nimport { BoxProps, ElementProps, factory, Factory, StylesApiProps, useProps } from '../../core';\nimport { __BaseInputProps, __InputStylesNames } from '../Input';\nimport { InputBase } from '../InputBase';\nimport { PillsInputContext, type PillsInputContextValue } from './PillsInput.context';\nimport {\n PillsInputField,\n type PillsInputFieldProps,\n type PillsInputFieldFactory,\n type PillsInputFieldStylesNames,\n} from './PillsInputField/PillsInputField';\nexport interface PillsInputProps\n extends\n BoxProps,\n __BaseInputProps,\n StylesApiProps<PillsInputFactory>,\n ElementProps<'div', 'size'> {\n __stylesApiProps?: Record<string, any>;\n __staticSelector?: string;\n}\n\nexport type PillsInputFactory = Factory<{\n props: PillsInputProps;\n ref: HTMLDivElement;\n stylesNames: __InputStylesNames;\n staticComponents: {\n Field: typeof PillsInputField;\n };\n}>;\n\nconst defaultProps = {\n size: 'sm',\n} satisfies Partial<PillsInputProps>;\n\nexport const PillsInput = factory<PillsInputFactory>((_props) => {\n const props = useProps(['Input', 'InputWrapper', 'PillsInput'], defaultProps, _props);\n const {\n children,\n onMouseDown,\n onClick,\n size,\n disabled,\n __staticSelector,\n error,\n variant,\n ...others\n } = props;\n\n const fieldRef = useRef<HTMLInputElement>(null);\n\n return (\n <PillsInputContext value={{ fieldRef, size, disabled, hasError: !!error, variant }}>\n <InputBase\n size={size}\n error={error}\n variant={variant}\n component=\"div\"\n data-no-overflow\n onMouseDown={(event) => {\n event.preventDefault();\n onMouseDown?.(event);\n fieldRef.current?.focus();\n }}\n onClick={(event) => {\n event.preventDefault();\n const fieldset = event.currentTarget.closest('fieldset');\n if (!fieldset?.disabled) {\n fieldRef.current?.focus();\n onClick?.(event);\n }\n }}\n {...others}\n multiline\n disabled={disabled}\n __staticSelector={__staticSelector \|\| 'PillsInput'}\n withAria={false}\n >\n {children}\n </InputBase>\n </PillsInputContext>\n );\n});\n\nPillsInput.displayName = '@mantine/core/PillsInput';\nPillsInput.classes = InputBase.classes;\nPillsInput.Field = PillsInputField;\n\nexport namespace PillsInput {\n export type Props = PillsInputProps;\n export type Factory = PillsInputFactory;\n export type ContextValue = PillsInputContextValue;\n\n export namespace Field {\n export type Props = PillsInputFieldProps;\n export type Factory = PillsInputFieldFactory;\n export type StylesNames = PillsInputFieldStylesNames;\n }\n}\n"],"mappings":";;;;;;;;;;AA8BA,MAAM,eAAe,EACnB,MAAM,KACR;AAEA,MAAa,aAAaA,gBAAAA,SAA4B,WAAW;CAE/D,MAAM,EACJ,UACA,aACA,SACA,MACA,UACA,kBACA,OACA,SACA,GAAG,WAVSC,kBAAAA,SAAS;EAAC;EAAS;EAAgB;CAAY,GAAG,cAAc,MAWtE;CAER,MAAM,YAAA,GAAA,MAAA,QAAoC,IAAI;CAE9C,OACE,iBAAA,GAAA,kBAAA,KAACC,2BAAAA,mBAAD;EAAmB,OAAO;GAAE;GAAU;GAAM;GAAU,UAAU,CAAC,CAAC;GAAO;EAAQ;YAC/E,iBAAA,GAAA,kBAAA,KAACC,kBAAAA,WAAD;GACQ;GACC;GACE;GACT,WAAU;GACV,oBAAA;GACA,cAAc,UAAU;IACtB,MAAM,eAAe;IACrB,cAAc,KAAK;IACnB,SAAS,SAAS,MAAM;GAC1B;GACA,UAAU,UAAU;IAClB,MAAM,eAAe;IAErB,IAAI,CADa,MAAM,cAAc,QAAQ,UACjC,GAAG,UAAU;KACvB,SAAS,SAAS,MAAM;KACxB,UAAU,KAAK;IACjB;GACF;GACA,GAAI;GACJ,WAAA;GACU;GACV,kBAAkB,oBAAoB;GACtC,UAAU;GAET;EACQ,CAAA;CACM,CAAA;AAEvB,CAAC;AAED,WAAW,cAAc;AACzB,WAAW,UAAUA,kBAAAA,UAAU;AAC/B,WAAW,QAAQC,wBAAAA"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"PillsInput.context.cjs","names":[],"sources":["../../../src/components/PillsInput/PillsInput.context.ts"],"sourcesContent":["import { createContext } from 'react';\nimport { MantineSize } from '../../core';\nimport { InputVariant } from '../Input';\n\nexport interface PillsInputContextValue {\n fieldRef: React.RefObject<HTMLInputElement \| null>;\n size: MantineSize \| (string & {});\n disabled: boolean \| undefined;\n hasError: boolean \| undefined;\n variant: InputVariant \| (string & {}) \| undefined;\n}\n\nexport const PillsInputContext = createContext<PillsInputContextValue \| null>(null);\n"],"mappings":";;;AAYA,MAAa,qBAAA,~~oBAAA~~,eAAiE,~~KAAK~~"}
1	+ {"version":3,"file":"PillsInput.context.cjs","names":[],"sources":["../../../src/components/PillsInput/PillsInput.context.ts"],"sourcesContent":["import { createContext } from 'react';\nimport { MantineSize } from '../../core';\nimport { InputVariant } from '../Input';\n\nexport interface PillsInputContextValue {\n fieldRef: React.RefObject<HTMLInputElement \| null>;\n size: MantineSize \| (string & {});\n disabled: boolean \| undefined;\n hasError: boolean \| undefined;\n variant: InputVariant \| (string & {}) \| undefined;\n}\n\nexport const PillsInputContext = createContext<PillsInputContextValue \| null>(null);\n"],"mappings":";;;AAYA,MAAa,qBAAA,kBAAA,EAAA,eAAiE,IAAI"}

package/cjs/components/PillsInput/PillsInputField/PillsInputField.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PillsInputField.cjs","names":["factory","useProps","PillsInputContext","InputWrapperContext","useStyles","Box","classes"],"sources":["../../../../src/components/PillsInput/PillsInputField/PillsInputField.tsx"],"sourcesContent":["import { use } from 'react';\nimport { useMergedRef } from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n ElementProps,\n factory,\n Factory,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../../core';\nimport { InputWrapperContext } from '../../Input';\nimport { PillsInputContext } from '../PillsInput.context';\nimport classes from '../PillsInput.module.css';\n\nexport type PillsInputFieldStylesNames = 'field';\n\nexport interface PillsInputFieldProps\n extends BoxProps, StylesApiProps<PillsInputFieldFactory>, ElementProps<'input', 'type'> {\n /** Controls input styles when focused. If `auto` the input is hidden when not focused. If `visible` the input will always remain visible. @default 'visible' /\n type?: 'auto' \| 'visible' \| 'hidden';\n\n /* If set, cursor is changed to pointer */\n pointer?: boolean;\n}\n\nexport type PillsInputFieldFactory = Factory<{\n props: PillsInputFieldProps;\n ref: HTMLInputElement;\n stylesNames: PillsInputFieldStylesNames;\n}>;\n\nconst defaultProps = {\n type: 'visible',\n} satisfies Partial<PillsInputFieldProps>;\n\nexport const PillsInputField = factory<PillsInputFieldFactory>((_props) => {\n const props = useProps('PillsInputField', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n type,\n disabled,\n id,\n pointer,\n mod,\n attributes,\n ref,\n ...others\n } = props;\n const ctx = use(PillsInputContext);\n const inputWrapperCtx = use(InputWrapperContext);\n\n const getStyles = useStyles<PillsInputFieldFactory>({\n name: 'PillsInputField',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n rootSelector: 'field',\n });\n\n const _disabled = disabled \|\| ctx?.disabled;\n\n return (\n <Box\n component=\"input\"\n ref={useMergedRef(ref, ctx?.fieldRef)}\n data-type={type}\n disabled={_disabled}\n mod={[{ disabled: _disabled, pointer }, mod]}\n {...getStyles('field')}\n {...others}\n id={inputWrapperCtx?.inputId \|\| id}\n aria-invalid={ctx?.hasError}\n aria-describedby={inputWrapperCtx?.describedBy}\n type=\"text\"\n onMouseDown={(event) => !pointer && event.stopPropagation()}\n />\n );\n});\n\nPillsInputField.classes = classes;\nPillsInputField.displayName = '@mantine/core/PillsInputField';\n"],"mappings":";;;;;;;;;;;;;AAiCA,MAAM,eAAe,EACnB,MAAM,~~WACP~~;~~AAED~~,MAAa,kBAAkBA,gBAAAA,SAAiC,WAAW;CACzE,MAAM,QAAQC,kBAAAA,SAAS,mBAAmB,cAAc,~~OAAO~~;~~CAC/D~~,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,MACA,UACA,IACA,SACA,KACA,YACA,KACA,GAAG,WACD;CACJ,MAAM,OAAA,GAAA,MAAA,KAAUC,2BAAAA,~~kBAAkB~~;~~CAClC~~,MAAM,mBAAA,GAAA,MAAA,KAAsBC,6BAAAA,~~oBAAoB~~;~~CAEhD~~,MAAM,YAAYC,mBAAAA,UAAkC;EAClD,MAAM;EACN,SAAA,0BAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;~~EACf~~,CAAC;~~CAEF~~,MAAM,YAAY,YAAY,KAAK;~~AAEnC~~,~~QACE~~,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EACE,WAAU;EACV,MAAA,GAAA,eAAA,cAAkB,KAAK,KAAK,~~SAAS~~;~~EACrC~~,aAAW;EACX,UAAU;EACV,KAAK,CAAC;GAAE,UAAU;GAAW;~~GAAS~~,~~EAAE~~,~~IAAI~~;~~EAC5C~~,GAAI,UAAU,~~QAAQ~~;~~EACtB~~,GAAI;EACJ,IAAI,iBAAiB,WAAW;EAChC,gBAAc,KAAK;EACnB,oBAAkB,iBAAiB;EACnC,MAAK;EACL,cAAc,UAAU,CAAC,WAAW,MAAM,~~iBAAiB~~;~~EAC3D~~,CAAA;~~EAEJ~~;~~AAEF~~,gBAAgB,UAAUC,0BAAAA;AAC1B,gBAAgB,cAAc"}
1	+ {"version":3,"file":"PillsInputField.cjs","names":["factory","useProps","PillsInputContext","InputWrapperContext","useStyles","Box","classes"],"sources":["../../../../src/components/PillsInput/PillsInputField/PillsInputField.tsx"],"sourcesContent":["import { use } from 'react';\nimport { useMergedRef } from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n ElementProps,\n factory,\n Factory,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../../core';\nimport { InputWrapperContext } from '../../Input';\nimport { PillsInputContext } from '../PillsInput.context';\nimport classes from '../PillsInput.module.css';\n\nexport type PillsInputFieldStylesNames = 'field';\n\nexport interface PillsInputFieldProps\n extends BoxProps, StylesApiProps<PillsInputFieldFactory>, ElementProps<'input', 'type'> {\n /** Controls input styles when focused. If `auto` the input is hidden when not focused. If `visible` the input will always remain visible. @default 'visible' /\n type?: 'auto' \| 'visible' \| 'hidden';\n\n /* If set, cursor is changed to pointer */\n pointer?: boolean;\n}\n\nexport type PillsInputFieldFactory = Factory<{\n props: PillsInputFieldProps;\n ref: HTMLInputElement;\n stylesNames: PillsInputFieldStylesNames;\n}>;\n\nconst defaultProps = {\n type: 'visible',\n} satisfies Partial<PillsInputFieldProps>;\n\nexport const PillsInputField = factory<PillsInputFieldFactory>((_props) => {\n const props = useProps('PillsInputField', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n type,\n disabled,\n id,\n pointer,\n mod,\n attributes,\n ref,\n ...others\n } = props;\n const ctx = use(PillsInputContext);\n const inputWrapperCtx = use(InputWrapperContext);\n\n const getStyles = useStyles<PillsInputFieldFactory>({\n name: 'PillsInputField',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n rootSelector: 'field',\n });\n\n const _disabled = disabled \|\| ctx?.disabled;\n\n return (\n <Box\n component=\"input\"\n ref={useMergedRef(ref, ctx?.fieldRef)}\n data-type={type}\n disabled={_disabled}\n mod={[{ disabled: _disabled, pointer }, mod]}\n {...getStyles('field')}\n {...others}\n id={inputWrapperCtx?.inputId \|\| id}\n aria-invalid={ctx?.hasError}\n aria-describedby={inputWrapperCtx?.describedBy}\n type=\"text\"\n onMouseDown={(event) => !pointer && event.stopPropagation()}\n />\n );\n});\n\nPillsInputField.classes = classes;\nPillsInputField.displayName = '@mantine/core/PillsInputField';\n"],"mappings":";;;;;;;;;;;;;AAiCA,MAAM,eAAe,EACnB,MAAM,UACR;AAEA,MAAa,kBAAkBA,gBAAAA,SAAiC,WAAW;CACzE,MAAM,QAAQC,kBAAAA,SAAS,mBAAmB,cAAc,MAAM;CAC9D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,MACA,UACA,IACA,SACA,KACA,YACA,KACA,GAAG,WACD;CACJ,MAAM,OAAA,GAAA,MAAA,KAAUC,2BAAAA,iBAAiB;CACjC,MAAM,mBAAA,GAAA,MAAA,KAAsBC,6BAAAA,mBAAmB;CAE/C,MAAM,YAAYC,mBAAAA,UAAkC;EAClD,MAAM;EACN,SAAA,0BAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;CAChB,CAAC;CAED,MAAM,YAAY,YAAY,KAAK;CAEnC,OACE,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EACE,WAAU;EACV,MAAA,GAAA,eAAA,cAAkB,KAAK,KAAK,QAAQ;EACpC,aAAW;EACX,UAAU;EACV,KAAK,CAAC;GAAE,UAAU;GAAW;EAAQ,GAAG,GAAG;EAC3C,GAAI,UAAU,OAAO;EACrB,GAAI;EACJ,IAAI,iBAAiB,WAAW;EAChC,gBAAc,KAAK;EACnB,oBAAkB,iBAAiB;EACnC,MAAK;EACL,cAAc,UAAU,CAAC,WAAW,MAAM,gBAAgB;CAC3D,CAAA;AAEL,CAAC;AAED,gBAAgB,UAAUC,0BAAAA;AAC1B,gBAAgB,cAAc"}

package/cjs/components/PinInput/PinInput.cjs CHANGED Viewed

@@ -31,7 +31,7 @@ const defaultProps = {
 };
 const varsResolver = require_create_vars_resolver.createVarsResolver((_, { size }) => ({ root: { "--pin-input-size": require_get_size.getSize(size ?? "sm", "pin-input-size") } }));
 const PinInput = require_factory.factory((props) => {
-	const { name, form, className, value, defaultValue, variant, gap, style, size, classNames, styles, unstyled, length, onChange, onComplete, manageFocus, autoFocus, error, radius, disabled, oneTimeCode, placeholder, type, mask, readOnly, inputType, inputMode, ariaLabel, vars, id, hiddenInputProps, rootRef, getInputProps, attributes, ref, ...others } = require_use_props.useProps("PinInput", defaultProps, props);
+	const { name, form, className, value, defaultValue, variant, gap, style, size, classNames, styles, unstyled, length, onChange, onComplete, manageFocus, autoFocus, error, radius, disabled, oneTimeCode, placeholder, type, mask, readOnly, inputType, inputMode, ariaLabel, vars, id, hiddenInputProps, rootRef, getInputProps, attributes, ref, ...others } = require_use_props.useProps(["Input", "PinInput"], defaultProps, props);
 	const uuid = (0, _mantine_hooks.useId)(id);
 	const getStyles = require_use_styles.useStyles({
 		name: "PinInput",
@@ -125,8 +125,8 @@ const PinInput = require_factory.factory((props) => {
 				"ArrowLeft",
 				"ArrowRight"
 			];
-			const isPasteShortcut = (ctrlKey || metaKey) && key === "v";
-			if (!(allowedKeys.includes(key) || isPasteShortcut || !Number.isNaN(Number(key)))) {
+			const isModifierShortcut = ctrlKey || metaKey;
+			if (!(allowedKeys.includes(key) || isModifierShortcut || !Number.isNaN(Number(key)))) {
 				event.preventDefault();
 				return;
 			}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"PinInput.cjs","names":["createVarsResolver","getSize","factory","useProps","useStyles","useResolvedStylesApi","createPinArray","Group","Input","classes","InputBase"],"sources":["../../../src/components/PinInput/PinInput.tsx"],"sourcesContent":["import { useRef, useState } from 'react';\nimport { assignRef, useId, useUncontrolled } from '@mantine/hooks';\nimport {\n BoxProps,\n createVarsResolver,\n DataAttributes,\n ElementProps,\n Factory,\n factory,\n getSize,\n MantineRadius,\n MantineSize,\n MantineSpacing,\n StylesApiProps,\n useProps,\n useResolvedStylesApi,\n useStyles,\n} from '../../core';\nimport { Group } from '../Group';\nimport { Input, InputProps } from '../Input';\nimport { InputBase } from '../InputBase';\nimport { createPinArray } from './create-pin-array/create-pin-array';\nimport classes from './PinInput.module.css';\n\nconst regex = {\n number: /^[0-9]+$/,\n alphanumeric: /^[a-zA-Z0-9]+$/i,\n};\n\nexport type PinInputStylesNames = 'root' \| 'pinInput' \| 'input';\n\nexport type PinInputCssVariables = {\n root: '--pin-input-size';\n};\n\nexport interface PinInputProps\n extends BoxProps, StylesApiProps<PinInputFactory>, ElementProps<'div', 'onChange' \| 'ref'> {\n ref?: React.Ref<HTMLInputElement>;\n\n /** Hidden input `name` attribute /\n name?: string;\n\n /* Hidden input `form` attribute /\n form?: string;\n\n /* Key of `theme.spacing` or any valid CSS value to set `gap` between inputs, numbers are converted to rem @default 'md' /\n gap?: MantineSpacing;\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 /* Controls inputs `width` and `height` @default 'sm' /\n size?: MantineSize;\n\n /* If set, the first input is focused when component is mounted @default false /\n autoFocus?: boolean;\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 all inputs have value /\n onComplete?: (value: string) => void;\n\n /* Inputs placeholder @default '○' /\n placeholder?: string;\n\n /* Determines whether focus should be moved automatically to the next input once filled @default true /\n manageFocus?: boolean;\n\n /* Determines whether `autocomplete=\"one-time-code\"` attribute should be set on all inputs @default true /\n oneTimeCode?: boolean;\n\n /* Base id used to generate unique ids for inputs /\n id?: string;\n\n /* Adds disabled attribute to all inputs /\n disabled?: boolean;\n\n /* Sets `aria-invalid` attribute and applies error styles to all inputs /\n error?: boolean;\n\n /* Determines which values can be entered @default 'alphanumeric' /\n type?: 'alphanumeric' \| 'number' \| RegExp;\n\n /* Changes input type to `\"password\"` @default false /\n mask?: boolean;\n\n /* Number of inputs @default 4 /\n length?: number;\n\n /* If set, the user cannot edit the value /\n readOnly?: boolean;\n\n /* Inputs `type` attribute, inferred from the `type` prop if not specified /\n inputType?: React.HTMLInputTypeAttribute;\n\n /* `inputmode` attribute, inferred from the `type` prop if not specified /\n inputMode?:\n \| 'none'\n \| 'text'\n \| 'tel'\n \| 'url'\n \| 'email'\n \| 'numeric'\n \| 'decimal'\n \| 'search'\n \| undefined;\n\n /* `aria-label` attribute /\n ariaLabel?: string;\n\n /* Props passed down to the hidden input /\n hiddenInputProps?: React.ComponentProps<'input'>;\n\n /* Assigns ref of the root element /\n rootRef?: React.Ref<HTMLDivElement>;\n\n /* Props added to the input element depending on its index */\n getInputProps?: (index: number) => InputProps & ElementProps<'input', 'size'> & DataAttributes;\n}\n\nexport type PinInputFactory = Factory<{\n props: PinInputProps;\n ref: HTMLDivElement;\n stylesNames: PinInputStylesNames;\n vars: PinInputCssVariables;\n}>;\n\nconst defaultProps = {\n gap: 'sm',\n length: 4,\n manageFocus: true,\n oneTimeCode: true,\n placeholder: '○',\n type: 'alphanumeric',\n ariaLabel: 'PinInput',\n size: 'sm',\n} satisfies Partial<PinInputProps>;\n\nconst varsResolver = createVarsResolver<PinInputFactory>((_, { size }) => ({\n root: {\n '--pin-input-size': getSize(size ?? 'sm', 'pin-input-size'),\n },\n}));\n\nexport const PinInput = factory<PinInputFactory>((props) => {\n const {\n name,\n form,\n className,\n value,\n defaultValue,\n variant,\n gap,\n style,\n size,\n classNames,\n styles,\n unstyled,\n length,\n onChange,\n onComplete,\n manageFocus,\n autoFocus,\n error,\n radius,\n disabled,\n oneTimeCode,\n placeholder,\n type,\n mask,\n readOnly,\n inputType,\n inputMode,\n ariaLabel,\n vars,\n id,\n hiddenInputProps,\n rootRef,\n getInputProps,\n attributes,\n ref,\n ...others\n } = useProps('PinInput', defaultProps, props);\n\n const uuid = useId(id);\n\n const getStyles = useStyles<PinInputFactory>({\n name: 'PinInput',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<PinInputFactory>({\n classNames,\n styles,\n props,\n });\n\n const [focusedIndex, setFocusedIndex] = useState(-1);\n const inputsRef = useRef<Array<HTMLInputElement>>([]);\n const currentLength = length ?? 4;\n\n const completedRef = useRef(false);\n\n const [_value, setValues] = useUncontrolled<string[]>({\n value: value !== undefined ? createPinArray(currentLength, value) : undefined,\n defaultValue: defaultValue?.split('').slice(0, currentLength),\n finalValue: createPinArray(currentLength, ''),\n onChange: (val) => {\n const stringValue = val.join('').trim();\n onChange?.(stringValue);\n if (stringValue.length === currentLength && !completedRef.current) {\n completedRef.current = true;\n onComplete?.(stringValue);\n } else if (stringValue.length < currentLength) {\n completedRef.current = false;\n }\n },\n });\n\n const currentValue =\n _value.length !== currentLength ? createPinArray(currentLength, _value.join('')) : _value;\n\n const _valueToString = currentValue.join('').trim();\n\n const validate = (code: string) => {\n const re = type instanceof RegExp ? type : type && type in regex ? regex[type] : null;\n return re?.test(code);\n };\n\n const focusInputField = (dir: 'next' \| 'prev', index: number) => {\n if (!manageFocus) {\n return;\n }\n\n if (dir === 'next') {\n const nextIndex = index + 1;\n if (nextIndex < currentLength) {\n inputsRef.current[nextIndex]?.focus();\n }\n } else if (dir === 'prev') {\n const prevIndex = index - 1;\n if (prevIndex >= 0) {\n inputsRef.current[prevIndex]?.focus();\n }\n }\n };\n\n const setFieldValue = (val: string, index: number) => {\n const values = [...currentValue];\n values[index] = val;\n setValues(values);\n return values;\n };\n\n const handleChange = (event: React.ChangeEvent<HTMLInputElement>, index: number) => {\n const inputValue = event.target.value;\n\n if (inputValue.length > 1) {\n const isPaste = inputValue.length > 2;\n if (isPaste) {\n const isValid = validate(inputValue);\n if (isValid) {\n setValues(createPinArray(currentLength, inputValue));\n const filledCount = Math.min(inputValue.length, currentLength);\n if (filledCount < currentLength) {\n focusInputField('next', filledCount - 1);\n }\n }\n return;\n }\n\n const newChar = inputValue.split('')[inputValue.length - 1];\n if (validate(newChar)) {\n setFieldValue(newChar, index);\n focusInputField('next', index);\n }\n return;\n }\n\n if (inputValue.length === 1) {\n if (validate(inputValue)) {\n setFieldValue(inputValue, index);\n focusInputField('next', index);\n } else {\n setFieldValue('', index);\n }\n } else if (inputValue.length === 0) {\n setFieldValue('', index);\n }\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>, index: number) => {\n const { ctrlKey, metaKey, key, shiftKey, target } = event;\n const inputValue = (target as HTMLInputElement).value;\n\n if (inputMode === 'numeric') {\n const allowedKeys = ['Backspace', 'Tab', 'Control', 'Delete', 'ArrowLeft', 'ArrowRight'];\n const isPasteShortcut = (ctrlKey \|\| metaKey) && key === 'v';\n const isAllowedKey =\n allowedKeys.includes(key) \|\| isPasteShortcut \|\| !Number.isNaN(Number(key));\n\n if (!isAllowedKey) {\n event.preventDefault();\n return;\n }\n }\n\n switch (key) {\n case 'ArrowLeft':\n event.preventDefault();\n focusInputField('prev', index);\n break;\n\n case 'ArrowRight':\n event.preventDefault();\n focusInputField('next', index);\n break;\n\n case 'Tab':\n if (shiftKey) {\n if (index > 0 && manageFocus) {\n event.preventDefault();\n focusInputField('prev', index);\n }\n }\n break;\n\n case ' ':\n event.preventDefault();\n focusInputField('next', index);\n break;\n\n case 'Delete':\n event.preventDefault();\n setFieldValue('', index);\n break;\n\n case 'Backspace':\n if (inputValue === '') {\n event.preventDefault();\n focusInputField('prev', index);\n } else {\n setFieldValue('', index);\n if (index < currentLength - 1) {\n event.preventDefault();\n focusInputField('prev', index);\n }\n }\n break;\n\n default:\n if (inputValue.length > 0 && key === currentValue[index]) {\n event.preventDefault();\n focusInputField('next', index);\n }\n }\n };\n\n const handleFocus = (event: React.FocusEvent<HTMLInputElement>, index: number) => {\n event.target.select();\n setFocusedIndex(index);\n };\n\n const handleBlur = () => {\n setFocusedIndex(-1);\n };\n\n const handlePaste = (event: React.ClipboardEvent<HTMLInputElement>) => {\n event.preventDefault();\n const pasteData = event.clipboardData.getData('text/plain').replace(/[\\n\\r\\s]+/g, '');\n const isValid = validate(pasteData.trim());\n\n if (isValid) {\n const pasteArray = createPinArray(currentLength, pasteData);\n setValues(pasteArray);\n const filledCount = pasteArray.filter((val) => val !== '').length;\n if (filledCount >= currentLength) {\n inputsRef.current[currentLength - 1]?.focus();\n } else {\n inputsRef.current[filledCount]?.focus();\n }\n }\n };\n\n return (\n <>\n <Group\n {...others}\n {...getStyles('root')}\n ref={rootRef}\n role=\"group\"\n id={uuid}\n gap={gap}\n unstyled={unstyled}\n wrap=\"nowrap\"\n variant={variant}\n __size={size}\n dir=\"ltr\"\n >\n {currentValue.map((char: string, index: number) => (\n <Input\n component=\"input\"\n {...getStyles('pinInput', {\n style: {\n '--input-padding': '0',\n '--input-text-align': 'center',\n } as React.CSSProperties,\n })}\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n size={size}\n __staticSelector=\"PinInput\"\n id={`${uuid}-${index + 1}`}\n key={`${uuid}-${index}`}\n inputMode={inputMode \|\| (type === 'number' ? 'numeric' : 'text')}\n onChange={(event) => handleChange(event, index)}\n onKeyDown={(event) => handleKeyDown(event, index)}\n onFocus={(event) => handleFocus(event, index)}\n onBlur={handleBlur}\n onPaste={handlePaste}\n type={inputType \|\| (mask ? 'password' : type === 'number' ? 'tel' : 'text')}\n radius={radius}\n error={error}\n variant={variant}\n disabled={disabled}\n ref={(node) => {\n if (node) {\n index === 0 && assignRef(ref, node);\n inputsRef.current[index] = node;\n }\n }}\n autoComplete={oneTimeCode ? 'one-time-code' : 'off'}\n placeholder={focusedIndex === index ? '' : placeholder}\n value={char}\n autoFocus={autoFocus && index === 0}\n unstyled={unstyled}\n aria-label={ariaLabel}\n readOnly={readOnly}\n {...getInputProps?.(index)}\n />\n ))}\n </Group>\n\n <input type=\"hidden\" name={name} form={form} value={_valueToString} {...hiddenInputProps} />\n </>\n );\n});\n\nPinInput.classes = { ...classes, ...InputBase.classes };\nPinInput.varsResolver = varsResolver;\nPinInput.displayName = '@mantine/core/PinInput';\n\nexport namespace PinInput {\n export type Props = PinInputProps;\n export type StylesNames = PinInputStylesNames;\n export type Factory = PinInputFactory;\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"PinInput.cjs","names":["createVarsResolver","getSize","factory","useProps","useStyles","useResolvedStylesApi","createPinArray","Group","Input","classes","InputBase"],"sources":["../../../src/components/PinInput/PinInput.tsx"],"sourcesContent":["import { useRef, useState } from 'react';\nimport { assignRef, useId, useUncontrolled } from '@mantine/hooks';\nimport {\n BoxProps,\n createVarsResolver,\n DataAttributes,\n ElementProps,\n Factory,\n factory,\n getSize,\n MantineRadius,\n MantineSize,\n MantineSpacing,\n StylesApiProps,\n useProps,\n useResolvedStylesApi,\n useStyles,\n} from '../../core';\nimport { Group } from '../Group';\nimport { Input, InputProps } from '../Input';\nimport { InputBase } from '../InputBase';\nimport { createPinArray } from './create-pin-array/create-pin-array';\nimport classes from './PinInput.module.css';\n\nconst regex = {\n number: /^[0-9]+$/,\n alphanumeric: /^[a-zA-Z0-9]+$/i,\n};\n\nexport type PinInputStylesNames = 'root' \| 'pinInput' \| 'input';\n\nexport type PinInputCssVariables = {\n root: '--pin-input-size';\n};\n\nexport interface PinInputProps\n extends BoxProps, StylesApiProps<PinInputFactory>, ElementProps<'div', 'onChange' \| 'ref'> {\n ref?: React.Ref<HTMLInputElement>;\n\n /** Hidden input `name` attribute /\n name?: string;\n\n /* Hidden input `form` attribute /\n form?: string;\n\n /* Key of `theme.spacing` or any valid CSS value to set `gap` between inputs, numbers are converted to rem @default 'md' /\n gap?: MantineSpacing;\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 /* Controls inputs `width` and `height` @default 'sm' /\n size?: MantineSize;\n\n /* If set, the first input is focused when component is mounted @default false /\n autoFocus?: boolean;\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 all inputs have value /\n onComplete?: (value: string) => void;\n\n /* Inputs placeholder @default '○' /\n placeholder?: string;\n\n /* Determines whether focus should be moved automatically to the next input once filled @default true /\n manageFocus?: boolean;\n\n /* Determines whether `autocomplete=\"one-time-code\"` attribute should be set on all inputs @default true /\n oneTimeCode?: boolean;\n\n /* Base id used to generate unique ids for inputs /\n id?: string;\n\n /* Adds disabled attribute to all inputs /\n disabled?: boolean;\n\n /* Sets `aria-invalid` attribute and applies error styles to all inputs /\n error?: boolean;\n\n /* Determines which values can be entered @default 'alphanumeric' /\n type?: 'alphanumeric' \| 'number' \| RegExp;\n\n /* Changes input type to `\"password\"` @default false /\n mask?: boolean;\n\n /* Number of inputs @default 4 /\n length?: number;\n\n /* If set, the user cannot edit the value /\n readOnly?: boolean;\n\n /* Inputs `type` attribute, inferred from the `type` prop if not specified /\n inputType?: React.HTMLInputTypeAttribute;\n\n /* `inputmode` attribute, inferred from the `type` prop if not specified /\n inputMode?:\n \| 'none'\n \| 'text'\n \| 'tel'\n \| 'url'\n \| 'email'\n \| 'numeric'\n \| 'decimal'\n \| 'search'\n \| undefined;\n\n /* `aria-label` attribute /\n ariaLabel?: string;\n\n /* Props passed down to the hidden input /\n hiddenInputProps?: React.ComponentProps<'input'>;\n\n /* Assigns ref of the root element /\n rootRef?: React.Ref<HTMLDivElement>;\n\n /* Props added to the input element depending on its index */\n getInputProps?: (index: number) => InputProps & ElementProps<'input', 'size'> & DataAttributes;\n}\n\nexport type PinInputFactory = Factory<{\n props: PinInputProps;\n ref: HTMLDivElement;\n stylesNames: PinInputStylesNames;\n vars: PinInputCssVariables;\n}>;\n\nconst defaultProps = {\n gap: 'sm',\n length: 4,\n manageFocus: true,\n oneTimeCode: true,\n placeholder: '○',\n type: 'alphanumeric',\n ariaLabel: 'PinInput',\n size: 'sm',\n} satisfies Partial<PinInputProps>;\n\nconst varsResolver = createVarsResolver<PinInputFactory>((_, { size }) => ({\n root: {\n '--pin-input-size': getSize(size ?? 'sm', 'pin-input-size'),\n },\n}));\n\nexport const PinInput = factory<PinInputFactory>((props) => {\n const {\n name,\n form,\n className,\n value,\n defaultValue,\n variant,\n gap,\n style,\n size,\n classNames,\n styles,\n unstyled,\n length,\n onChange,\n onComplete,\n manageFocus,\n autoFocus,\n error,\n radius,\n disabled,\n oneTimeCode,\n placeholder,\n type,\n mask,\n readOnly,\n inputType,\n inputMode,\n ariaLabel,\n vars,\n id,\n hiddenInputProps,\n rootRef,\n getInputProps,\n attributes,\n ref,\n ...others\n } = useProps(['Input', 'PinInput'], defaultProps, props);\n\n const uuid = useId(id);\n\n const getStyles = useStyles<PinInputFactory>({\n name: 'PinInput',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<PinInputFactory>({\n classNames,\n styles,\n props,\n });\n\n const [focusedIndex, setFocusedIndex] = useState(-1);\n const inputsRef = useRef<Array<HTMLInputElement>>([]);\n const currentLength = length ?? 4;\n\n const completedRef = useRef(false);\n\n const [_value, setValues] = useUncontrolled<string[]>({\n value: value !== undefined ? createPinArray(currentLength, value) : undefined,\n defaultValue: defaultValue?.split('').slice(0, currentLength),\n finalValue: createPinArray(currentLength, ''),\n onChange: (val) => {\n const stringValue = val.join('').trim();\n onChange?.(stringValue);\n if (stringValue.length === currentLength && !completedRef.current) {\n completedRef.current = true;\n onComplete?.(stringValue);\n } else if (stringValue.length < currentLength) {\n completedRef.current = false;\n }\n },\n });\n\n const currentValue =\n _value.length !== currentLength ? createPinArray(currentLength, _value.join('')) : _value;\n\n const _valueToString = currentValue.join('').trim();\n\n const validate = (code: string) => {\n const re = type instanceof RegExp ? type : type && type in regex ? regex[type] : null;\n return re?.test(code);\n };\n\n const focusInputField = (dir: 'next' \| 'prev', index: number) => {\n if (!manageFocus) {\n return;\n }\n\n if (dir === 'next') {\n const nextIndex = index + 1;\n if (nextIndex < currentLength) {\n inputsRef.current[nextIndex]?.focus();\n }\n } else if (dir === 'prev') {\n const prevIndex = index - 1;\n if (prevIndex >= 0) {\n inputsRef.current[prevIndex]?.focus();\n }\n }\n };\n\n const setFieldValue = (val: string, index: number) => {\n const values = [...currentValue];\n values[index] = val;\n setValues(values);\n return values;\n };\n\n const handleChange = (event: React.ChangeEvent<HTMLInputElement>, index: number) => {\n const inputValue = event.target.value;\n\n if (inputValue.length > 1) {\n const isPaste = inputValue.length > 2;\n if (isPaste) {\n const isValid = validate(inputValue);\n if (isValid) {\n setValues(createPinArray(currentLength, inputValue));\n const filledCount = Math.min(inputValue.length, currentLength);\n if (filledCount < currentLength) {\n focusInputField('next', filledCount - 1);\n }\n }\n return;\n }\n\n const newChar = inputValue.split('')[inputValue.length - 1];\n if (validate(newChar)) {\n setFieldValue(newChar, index);\n focusInputField('next', index);\n }\n return;\n }\n\n if (inputValue.length === 1) {\n if (validate(inputValue)) {\n setFieldValue(inputValue, index);\n focusInputField('next', index);\n } else {\n setFieldValue('', index);\n }\n } else if (inputValue.length === 0) {\n setFieldValue('', index);\n }\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>, index: number) => {\n const { ctrlKey, metaKey, key, shiftKey, target } = event;\n const inputValue = (target as HTMLInputElement).value;\n\n if (inputMode === 'numeric') {\n const allowedKeys = ['Backspace', 'Tab', 'Control', 'Delete', 'ArrowLeft', 'ArrowRight'];\n const isModifierShortcut = ctrlKey \|\| metaKey;\n const isAllowedKey =\n allowedKeys.includes(key) \|\| isModifierShortcut \|\| !Number.isNaN(Number(key));\n\n if (!isAllowedKey) {\n event.preventDefault();\n return;\n }\n }\n\n switch (key) {\n case 'ArrowLeft':\n event.preventDefault();\n focusInputField('prev', index);\n break;\n\n case 'ArrowRight':\n event.preventDefault();\n focusInputField('next', index);\n break;\n\n case 'Tab':\n if (shiftKey) {\n if (index > 0 && manageFocus) {\n event.preventDefault();\n focusInputField('prev', index);\n }\n }\n break;\n\n case ' ':\n event.preventDefault();\n focusInputField('next', index);\n break;\n\n case 'Delete':\n event.preventDefault();\n setFieldValue('', index);\n break;\n\n case 'Backspace':\n if (inputValue === '') {\n event.preventDefault();\n focusInputField('prev', index);\n } else {\n setFieldValue('', index);\n if (index < currentLength - 1) {\n event.preventDefault();\n focusInputField('prev', index);\n }\n }\n break;\n\n default:\n if (inputValue.length > 0 && key === currentValue[index]) {\n event.preventDefault();\n focusInputField('next', index);\n }\n }\n };\n\n const handleFocus = (event: React.FocusEvent<HTMLInputElement>, index: number) => {\n event.target.select();\n setFocusedIndex(index);\n };\n\n const handleBlur = () => {\n setFocusedIndex(-1);\n };\n\n const handlePaste = (event: React.ClipboardEvent<HTMLInputElement>) => {\n event.preventDefault();\n const pasteData = event.clipboardData.getData('text/plain').replace(/[\\n\\r\\s]+/g, '');\n const isValid = validate(pasteData.trim());\n\n if (isValid) {\n const pasteArray = createPinArray(currentLength, pasteData);\n setValues(pasteArray);\n const filledCount = pasteArray.filter((val) => val !== '').length;\n if (filledCount >= currentLength) {\n inputsRef.current[currentLength - 1]?.focus();\n } else {\n inputsRef.current[filledCount]?.focus();\n }\n }\n };\n\n return (\n <>\n <Group\n {...others}\n {...getStyles('root')}\n ref={rootRef}\n role=\"group\"\n id={uuid}\n gap={gap}\n unstyled={unstyled}\n wrap=\"nowrap\"\n variant={variant}\n __size={size}\n dir=\"ltr\"\n >\n {currentValue.map((char: string, index: number) => (\n <Input\n component=\"input\"\n {...getStyles('pinInput', {\n style: {\n '--input-padding': '0',\n '--input-text-align': 'center',\n } as React.CSSProperties,\n })}\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n size={size}\n __staticSelector=\"PinInput\"\n id={`${uuid}-${index + 1}`}\n key={`${uuid}-${index}`}\n inputMode={inputMode \|\| (type === 'number' ? 'numeric' : 'text')}\n onChange={(event) => handleChange(event, index)}\n onKeyDown={(event) => handleKeyDown(event, index)}\n onFocus={(event) => handleFocus(event, index)}\n onBlur={handleBlur}\n onPaste={handlePaste}\n type={inputType \|\| (mask ? 'password' : type === 'number' ? 'tel' : 'text')}\n radius={radius}\n error={error}\n variant={variant}\n disabled={disabled}\n ref={(node) => {\n if (node) {\n index === 0 && assignRef(ref, node);\n inputsRef.current[index] = node;\n }\n }}\n autoComplete={oneTimeCode ? 'one-time-code' : 'off'}\n placeholder={focusedIndex === index ? '' : placeholder}\n value={char}\n autoFocus={autoFocus && index === 0}\n unstyled={unstyled}\n aria-label={ariaLabel}\n readOnly={readOnly}\n {...getInputProps?.(index)}\n />\n ))}\n </Group>\n\n <input type=\"hidden\" name={name} form={form} value={_valueToString} {...hiddenInputProps} />\n </>\n );\n});\n\nPinInput.classes = { ...classes, ...InputBase.classes };\nPinInput.varsResolver = varsResolver;\nPinInput.displayName = '@mantine/core/PinInput';\n\nexport namespace PinInput {\n export type Props = PinInputProps;\n export type StylesNames = PinInputStylesNames;\n export type Factory = PinInputFactory;\n}\n"],"mappings":"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"}

package/cjs/components/PinInput/create-pin-array/create-pin-array.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"create-pin-array.cjs","names":[],"sources":["../../../../src/components/PinInput/create-pin-array/create-pin-array.ts"],"sourcesContent":["export function createPinArray(length: number, value: string): string[] {\n if (length < 1) {\n return [];\n }\n\n const values = new Array<string>(length).fill('');\n\n if (value) {\n const splitted = value.trim().split('');\n for (let i = 0; i < Math.min(length, splitted.length); i += 1) {\n values[i] = splitted[i] === ' ' ? '' : splitted[i];\n }\n }\n\n return values;\n}\n"],"mappings":";;AAAA,SAAgB,eAAe,QAAgB,OAAyB;~~AACtE~~,~~KAAI~~,SAAS,~~EACX~~,~~QAAO~~,~~EAAE~~;~~CAGX~~,MAAM,SAAS,IAAI,MAAc,~~OAAO~~,~~CAAC~~,KAAK,~~GAAG~~;~~AAEjD~~,~~KAAI~~,OAAO;EACT,MAAM,WAAW,MAAM,~~MAAM~~,~~CAAC~~,MAAM,~~GAAG~~;~~AACvC~~,~~OAAK~~,IAAI,IAAI,GAAG,IAAI,KAAK,IAAI,QAAQ,SAAS,~~OAAO~~,~~EAAE~~,KAAK,~~EAC1D~~,~~QAAO~~,KAAK,SAAS,OAAO,MAAM,KAAK,SAAS~~;;AAIpD~~,~~QAAO~~"}
1	+ {"version":3,"file":"create-pin-array.cjs","names":[],"sources":["../../../../src/components/PinInput/create-pin-array/create-pin-array.ts"],"sourcesContent":["export function createPinArray(length: number, value: string): string[] {\n if (length < 1) {\n return [];\n }\n\n const values = new Array<string>(length).fill('');\n\n if (value) {\n const splitted = value.trim().split('');\n for (let i = 0; i < Math.min(length, splitted.length); i += 1) {\n values[i] = splitted[i] === ' ' ? '' : splitted[i];\n }\n }\n\n return values;\n}\n"],"mappings":";;AAAA,SAAgB,eAAe,QAAgB,OAAyB;CACtE,IAAI,SAAS,GACX,OAAO,CAAC;CAGV,MAAM,SAAS,IAAI,MAAc,MAAM,EAAE,KAAK,EAAE;CAEhD,IAAI,OAAO;EACT,MAAM,WAAW,MAAM,KAAK,EAAE,MAAM,EAAE;EACtC,KAAK,IAAI,IAAI,GAAG,IAAI,KAAK,IAAI,QAAQ,SAAS,MAAM,GAAG,KAAK,GAC1D,OAAO,KAAK,SAAS,OAAO,MAAM,KAAK,SAAS;CAEpD;CAEA,OAAO;AACT"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Popover.cjs","names":["getDefaultZIndex","createVarsResolver","getRadius","getShadow","useProps","useStyles","useResolvedStylesApi","useDirection","useMantineEnv","usePopover","getFloatingPosition","PopoverContextProvider","Transition","OptionalPortal","Overlay","PopoverTarget","PopoverDropdown"],"sources":["../../../src/components/Popover/Popover.tsx"],"sourcesContent":["import { useCallback, useRef, useState } from 'react';\nimport { useClickOutside, useId } from '@mantine/hooks';\nimport {\n createVarsResolver,\n ElementProps,\n ExtendComponent,\n Factory,\n getDefaultZIndex,\n getRadius,\n getShadow,\n MantineRadius,\n MantineShadow,\n StylesApiProps,\n useDirection,\n useMantineEnv,\n useProps,\n useResolvedStylesApi,\n useStyles,\n} from '../../core';\nimport {\n ArrowPosition,\n FloatingAxesOffsets,\n FloatingPosition,\n FloatingStrategy,\n getFloatingPosition,\n} from '../../utils/Floating';\nimport { Overlay, OverlayProps } from '../Overlay';\nimport { BasePortalProps, OptionalPortal } from '../Portal';\nimport { Transition, TransitionOverride } from '../Transition';\nimport { PopoverContextProvider, PopoverContextValue } from './Popover.context';\nimport { PopoverMiddlewares, PopoverWidth } from './Popover.types';\nimport { PopoverDropdown, PopoverDropdownProps } from './PopoverDropdown/PopoverDropdown';\nimport { PopoverTarget, PopoverTargetProps } from './PopoverTarget/PopoverTarget';\nimport { usePopover } from './use-popover';\nimport classes from './Popover.module.css';\n\nexport type PopoverStylesNames = 'dropdown' \| 'arrow' \| 'overlay';\nexport type PopoverCssVariables = {\n dropdown: '--popover-radius' \| '--popover-shadow';\n};\n\nexport interface __PopoverProps {\n /** Dropdown position relative to the target element @default 'bottom' /\n position?: FloatingPosition;\n\n /* Offset of the dropdown element @default 8 /\n offset?: number \| FloatingAxesOffsets;\n\n /* Called when dropdown position changes /\n onPositionChange?: (position: FloatingPosition) => void;\n\n /* Called when dropdown closes /\n onClose?: () => void;\n\n /* Called when the popover is dismissed by clicking outside or by pressing escape /\n onDismiss?: () => void;\n\n /* Called when dropdown opens /\n onOpen?: () => void;\n\n /* If set, the dropdown is not unmounted from the DOM when hidden. `display: none` styles are added instead. /\n keepMounted?: boolean;\n\n /* Props passed down to the `Transition` component. Use to configure duration and animation type. @default { duration: 150, transition: 'fade' } /\n transitionProps?: TransitionOverride;\n\n /* Called when exit transition ends /\n onExitTransitionEnd?: () => void;\n\n /* Called when enter transition ends /\n onEnterTransitionEnd?: () => void;\n\n /* Dropdown width, or `'target'` to make dropdown width the same as target element @default 'max-content' /\n width?: PopoverWidth;\n\n /* Floating ui middlewares to configure position handling @default { flip: true, shift: true, inline: false } /\n middlewares?: PopoverMiddlewares;\n\n /* Determines whether component should have an arrow @default false /\n withArrow?: boolean;\n\n /* Determines whether the overlay should be displayed when the dropdown is opened @default false /\n withOverlay?: boolean;\n\n /* Props passed down to `Overlay` component /\n overlayProps?: OverlayProps & ElementProps<'div'>;\n\n /* Arrow size in px @default 7 /\n arrowSize?: number;\n\n /* Arrow offset in px @default 5 /\n arrowOffset?: number;\n\n /* Arrow `border-radius` in px @default 0 /\n arrowRadius?: number;\n\n /* Arrow position /\n arrowPosition?: ArrowPosition;\n\n /* Determines whether dropdown should be rendered within the `Portal` @default true /\n withinPortal?: boolean;\n\n /* Props to pass down to the `Portal` when `withinPortal` is true /\n portalProps?: BasePortalProps;\n\n /* Dropdown `z-index` @default 300 /\n zIndex?: string \| number;\n\n /* Key of `theme.radius` or any valid CSS value to set border-radius @default theme.defaultRadius /\n radius?: MantineRadius;\n\n /* Key of `theme.shadows` or any other valid CSS `box-shadow` value /\n shadow?: MantineShadow;\n\n /* If set, popover dropdown will not be rendered /\n disabled?: boolean;\n\n /* Determines whether focus should be automatically returned to control when dropdown closes @default false /\n returnFocus?: boolean;\n\n /* Changes floating ui [position strategy](https://floating-ui.com/docs/usefloating#strategy) @default 'absolute' /\n floatingStrategy?: FloatingStrategy;\n\n /* If set, the dropdown is hidden when the element is hidden with styles or not visible on the screen @default true /\n hideDetached?: boolean;\n\n /* Prevents popover from flipping/shifting when it the dropdown is visible /\n preventPositionChangeWhenVisible?: boolean;\n}\n\nexport interface PopoverProps extends __PopoverProps, StylesApiProps<PopoverFactory> {\n __staticSelector?: string;\n\n /* `Popover.Target` and `Popover.Dropdown` components /\n children?: React.ReactNode;\n\n /* Initial opened state for uncontrolled component /\n defaultOpened?: boolean;\n\n /* Controlled dropdown opened state /\n opened?: boolean;\n\n /* Called with current state when dropdown opens or closes /\n onChange?: (opened: boolean) => void;\n\n /* Determines whether dropdown should be closed on outside clicks @default true /\n closeOnClickOutside?: boolean;\n\n /* Events that trigger outside clicks /\n clickOutsideEvents?: string[];\n\n /* Determines whether focus should be trapped within dropdown @default false /\n trapFocus?: boolean;\n\n /* Determines whether dropdown should be closed when `Escape` key is pressed @default true /\n closeOnEscape?: boolean;\n\n /* Id base to create accessibility connections /\n id?: string;\n\n /* Determines whether dropdown and target elements should have accessible roles @default true */\n withRoles?: boolean;\n}\n\nexport type PopoverFactory = Factory<{\n props: PopoverProps;\n stylesNames: PopoverStylesNames;\n vars: PopoverCssVariables;\n}>;\n\nconst defaultProps = {\n position: 'bottom',\n offset: 8,\n transitionProps: { transition: 'fade', duration: 150 },\n middlewares: { flip: true, shift: true, inline: false },\n arrowSize: 7,\n arrowOffset: 5,\n arrowRadius: 0,\n arrowPosition: 'side',\n closeOnClickOutside: true,\n withinPortal: true,\n closeOnEscape: true,\n trapFocus: false,\n withRoles: true,\n returnFocus: false,\n withOverlay: false,\n hideDetached: true,\n clickOutsideEvents: ['mousedown', 'touchstart'],\n zIndex: getDefaultZIndex('popover'),\n __staticSelector: 'Popover',\n width: 'max-content',\n} satisfies Partial<PopoverProps>;\n\nconst varsResolver = createVarsResolver<PopoverFactory>((_, { radius, shadow }) => ({\n dropdown: {\n '--popover-radius': radius === undefined ? undefined : getRadius(radius),\n '--popover-shadow': getShadow(shadow),\n },\n}));\n\nexport function Popover(_props: PopoverProps) {\n const props = useProps('Popover', defaultProps, _props);\n const {\n children,\n position,\n offset,\n onPositionChange,\n opened,\n transitionProps,\n onExitTransitionEnd,\n onEnterTransitionEnd,\n width,\n middlewares,\n withArrow,\n arrowSize,\n arrowOffset,\n arrowRadius,\n arrowPosition,\n unstyled,\n classNames,\n styles,\n closeOnClickOutside,\n withinPortal,\n portalProps,\n closeOnEscape,\n clickOutsideEvents,\n trapFocus,\n onClose,\n onDismiss,\n onOpen,\n onChange,\n zIndex,\n radius,\n shadow,\n id,\n defaultOpened,\n __staticSelector,\n withRoles,\n disabled,\n returnFocus,\n variant,\n keepMounted,\n vars,\n floatingStrategy,\n withOverlay,\n overlayProps,\n hideDetached,\n attributes,\n preventPositionChangeWhenVisible,\n ...others\n } = props;\n\n const getStyles = useStyles<PopoverFactory>({\n name: __staticSelector,\n props,\n classes,\n classNames,\n styles,\n unstyled,\n attributes,\n rootSelector: 'dropdown',\n vars,\n varsResolver,\n });\n\n const { resolvedStyles } = useResolvedStylesApi<PopoverFactory>({ classNames, styles, props });\n\n const [dropdownVisible, setDropdownVisible] = useState(opened ?? defaultOpened ?? false);\n const positionRef = useRef<FloatingPosition>(position);\n const arrowRef = useRef<HTMLDivElement \| null>(null);\n const [targetNode, setTargetNode] = useState<HTMLElement \| null>(null);\n const [dropdownNode, setDropdownNode] = useState<HTMLElement \| null>(null);\n const { dir } = useDirection();\n const env = useMantineEnv();\n\n const uid = useId(id);\n const popover = usePopover({\n middlewares,\n width,\n position: getFloatingPosition(dir, position),\n offset: typeof offset === 'number' ? offset + (withArrow ? arrowSize / 2 : 0) : offset,\n arrowRef,\n arrowOffset,\n onPositionChange,\n opened,\n defaultOpened,\n onChange,\n onOpen,\n onClose,\n onDismiss,\n strategy: floatingStrategy,\n dropdownVisible,\n setDropdownVisible,\n positionRef,\n disabled,\n preventPositionChangeWhenVisible,\n keepMounted,\n });\n\n useClickOutside(\n () => {\n if (closeOnClickOutside) {\n popover.onClose();\n onDismiss?.();\n }\n },\n clickOutsideEvents,\n [targetNode, dropdownNode]\n );\n\n const reference = useCallback(\n (node: HTMLElement) => {\n setTargetNode(node);\n popover.floating.refs.setReference(node);\n },\n [popover.floating.refs.setReference]\n );\n\n const floating = useCallback(\n (node: HTMLElement) => {\n setDropdownNode(node);\n popover.floating.refs.setFloating(node);\n },\n [popover.floating.refs.setFloating]\n );\n\n const onExited = useCallback(() => {\n transitionProps?.onExited?.();\n onExitTransitionEnd?.();\n setDropdownVisible(false);\n // Only reset position if preventPositionChangeWhenVisible is false\n // to maintain the flipped position on subsequent opens\n if (!preventPositionChangeWhenVisible) {\n positionRef.current = position;\n }\n }, [transitionProps?.onExited, onExitTransitionEnd, preventPositionChangeWhenVisible, position]);\n\n const onEntered = useCallback(() => {\n transitionProps?.onEntered?.();\n onEnterTransitionEnd?.();\n }, [transitionProps?.onEntered, onEnterTransitionEnd]);\n\n return (\n <PopoverContextProvider\n value={{\n returnFocus,\n disabled,\n controlled: popover.controlled,\n reference,\n floating,\n x: popover.floating.x,\n y: popover.floating.y,\n arrowX: popover.floating?.middlewareData?.arrow?.x,\n arrowY: popover.floating?.middlewareData?.arrow?.y,\n opened: popover.opened,\n arrowRef,\n transitionProps: { ...transitionProps, onExited, onEntered },\n width,\n withArrow,\n arrowSize,\n arrowOffset,\n arrowRadius,\n arrowPosition,\n placement: popover.floating.placement,\n trapFocus,\n withinPortal,\n portalProps,\n zIndex,\n radius,\n shadow,\n closeOnEscape,\n onDismiss,\n onClose: popover.onClose,\n onToggle: popover.onToggle,\n getTargetId: () => uid,\n getDropdownId: () => `${uid}-dropdown`,\n withRoles,\n targetProps: others,\n __staticSelector,\n classNames,\n styles,\n unstyled,\n variant,\n keepMounted,\n getStyles,\n resolvedStyles,\n floatingStrategy,\n referenceHidden:\n hideDetached && env !== 'test'\n ? popover.floating.middlewareData.hide?.referenceHidden\n : false,\n }}\n >\n {children}\n {withOverlay && (\n <Transition\n transition=\"fade\"\n mounted={popover.opened}\n duration={transitionProps?.duration \|\| 250}\n exitDuration={transitionProps?.exitDuration \|\| 250}\n >\n {(transitionStyles) => (\n <OptionalPortal withinPortal={withinPortal}>\n <Overlay\n {...overlayProps}\n {...getStyles('overlay', {\n className: overlayProps?.className,\n style: [transitionStyles, overlayProps?.style],\n })}\n />\n </OptionalPortal>\n )}\n </Transition>\n )}\n </PopoverContextProvider>\n );\n}\n\nPopover.Target = PopoverTarget;\nPopover.Dropdown = PopoverDropdown;\nPopover.varsResolver = varsResolver;\nPopover.displayName = '@mantine/core/Popover';\nPopover.extend = (input: ExtendComponent<PopoverFactory>) => input;\nPopover.withProps = (fixedProps: Partial<PopoverProps>) => {\n const Extended = (props: PopoverProps) => <Popover {...fixedProps} {...props} />;\n Extended.extend = Popover.extend;\n Extended.displayName = `WithProps(${Popover.displayName})`;\n return Extended;\n};\n\nexport namespace Popover {\n export type Props = PopoverProps;\n export type __Props = __PopoverProps;\n export type Factory = PopoverFactory;\n export type StylesNames = PopoverStylesNames;\n export type TargetProps = PopoverTargetProps;\n export type DropdownProps = PopoverDropdownProps;\n export type Width = PopoverWidth;\n export type ContextValue = PopoverContextValue;\n\n export namespace Target {\n export type Props = PopoverTargetProps;\n }\n\n export namespace Dropdown {\n export type Props = PopoverDropdownProps;\n }\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"Popover.cjs","names":["getDefaultZIndex","createVarsResolver","getRadius","getShadow","useProps","useStyles","useResolvedStylesApi","useDirection","useMantineEnv","usePopover","getFloatingPosition","PopoverContextProvider","Transition","OptionalPortal","Overlay","PopoverTarget","PopoverDropdown"],"sources":["../../../src/components/Popover/Popover.tsx"],"sourcesContent":["import { useCallback, useRef, useState } from 'react';\nimport { useClickOutside, useId } from '@mantine/hooks';\nimport {\n createVarsResolver,\n ElementProps,\n ExtendComponent,\n Factory,\n getDefaultZIndex,\n getRadius,\n getShadow,\n MantineRadius,\n MantineShadow,\n StylesApiProps,\n useDirection,\n useMantineEnv,\n useProps,\n useResolvedStylesApi,\n useStyles,\n} from '../../core';\nimport {\n ArrowPosition,\n FloatingAxesOffsets,\n FloatingPosition,\n FloatingStrategy,\n getFloatingPosition,\n} from '../../utils/Floating';\nimport { Overlay, OverlayProps } from '../Overlay';\nimport { BasePortalProps, OptionalPortal } from '../Portal';\nimport { Transition, TransitionOverride } from '../Transition';\nimport { PopoverContextProvider, PopoverContextValue } from './Popover.context';\nimport { PopoverMiddlewares, PopoverWidth } from './Popover.types';\nimport { PopoverDropdown, PopoverDropdownProps } from './PopoverDropdown/PopoverDropdown';\nimport { PopoverTarget, PopoverTargetProps } from './PopoverTarget/PopoverTarget';\nimport { usePopover } from './use-popover';\nimport classes from './Popover.module.css';\n\nexport type PopoverStylesNames = 'dropdown' \| 'arrow' \| 'overlay';\nexport type PopoverCssVariables = {\n dropdown: '--popover-radius' \| '--popover-shadow';\n};\n\nexport interface __PopoverProps {\n /** Dropdown position relative to the target element @default 'bottom' /\n position?: FloatingPosition;\n\n /* Offset of the dropdown element @default 8 /\n offset?: number \| FloatingAxesOffsets;\n\n /* Called when dropdown position changes /\n onPositionChange?: (position: FloatingPosition) => void;\n\n /* Called when dropdown closes /\n onClose?: () => void;\n\n /* Called when the popover is dismissed by clicking outside or by pressing escape /\n onDismiss?: () => void;\n\n /* Called when dropdown opens /\n onOpen?: () => void;\n\n /* If set, the dropdown is not unmounted from the DOM when hidden. `display: none` styles are added instead. /\n keepMounted?: boolean;\n\n /* Props passed down to the `Transition` component. Use to configure duration and animation type. @default { duration: 150, transition: 'fade' } /\n transitionProps?: TransitionOverride;\n\n /* Called when exit transition ends /\n onExitTransitionEnd?: () => void;\n\n /* Called when enter transition ends /\n onEnterTransitionEnd?: () => void;\n\n /* Dropdown width, or `'target'` to make dropdown width the same as target element @default 'max-content' /\n width?: PopoverWidth;\n\n /* Floating ui middlewares to configure position handling @default { flip: true, shift: true, inline: false } /\n middlewares?: PopoverMiddlewares;\n\n /* Determines whether component should have an arrow @default false /\n withArrow?: boolean;\n\n /* Determines whether the overlay should be displayed when the dropdown is opened @default false /\n withOverlay?: boolean;\n\n /* Props passed down to `Overlay` component /\n overlayProps?: OverlayProps & ElementProps<'div'>;\n\n /* Arrow size in px @default 7 /\n arrowSize?: number;\n\n /* Arrow offset in px @default 5 /\n arrowOffset?: number;\n\n /* Arrow `border-radius` in px @default 0 /\n arrowRadius?: number;\n\n /* Arrow position /\n arrowPosition?: ArrowPosition;\n\n /* Determines whether dropdown should be rendered within the `Portal` @default true /\n withinPortal?: boolean;\n\n /* Props to pass down to the `Portal` when `withinPortal` is true /\n portalProps?: BasePortalProps;\n\n /* Dropdown `z-index` @default 300 /\n zIndex?: string \| number;\n\n /* Key of `theme.radius` or any valid CSS value to set border-radius @default theme.defaultRadius /\n radius?: MantineRadius;\n\n /* Key of `theme.shadows` or any other valid CSS `box-shadow` value /\n shadow?: MantineShadow;\n\n /* If set, popover dropdown will not be rendered /\n disabled?: boolean;\n\n /* Determines whether focus should be automatically returned to control when dropdown closes @default false /\n returnFocus?: boolean;\n\n /* Changes floating ui [position strategy](https://floating-ui.com/docs/usefloating#strategy) @default 'absolute' /\n floatingStrategy?: FloatingStrategy;\n\n /* If set, the dropdown is hidden when the element is hidden with styles or not visible on the screen @default true /\n hideDetached?: boolean;\n\n /* Prevents popover from flipping/shifting when it the dropdown is visible /\n preventPositionChangeWhenVisible?: boolean;\n}\n\nexport interface PopoverProps extends __PopoverProps, StylesApiProps<PopoverFactory> {\n __staticSelector?: string;\n\n /* `Popover.Target` and `Popover.Dropdown` components /\n children?: React.ReactNode;\n\n /* Initial opened state for uncontrolled component /\n defaultOpened?: boolean;\n\n /* Controlled dropdown opened state /\n opened?: boolean;\n\n /* Called with current state when dropdown opens or closes /\n onChange?: (opened: boolean) => void;\n\n /* Determines whether dropdown should be closed on outside clicks @default true /\n closeOnClickOutside?: boolean;\n\n /* Events that trigger outside clicks /\n clickOutsideEvents?: string[];\n\n /* Determines whether focus should be trapped within dropdown @default false /\n trapFocus?: boolean;\n\n /* Determines whether dropdown should be closed when `Escape` key is pressed @default true /\n closeOnEscape?: boolean;\n\n /* Id base to create accessibility connections /\n id?: string;\n\n /* Determines whether dropdown and target elements should have accessible roles @default true */\n withRoles?: boolean;\n}\n\nexport type PopoverFactory = Factory<{\n props: PopoverProps;\n stylesNames: PopoverStylesNames;\n vars: PopoverCssVariables;\n}>;\n\nconst defaultProps = {\n position: 'bottom',\n offset: 8,\n transitionProps: { transition: 'fade', duration: 150 },\n middlewares: { flip: true, shift: true, inline: false },\n arrowSize: 7,\n arrowOffset: 5,\n arrowRadius: 0,\n arrowPosition: 'side',\n closeOnClickOutside: true,\n withinPortal: true,\n closeOnEscape: true,\n trapFocus: false,\n withRoles: true,\n returnFocus: false,\n withOverlay: false,\n hideDetached: true,\n clickOutsideEvents: ['mousedown', 'touchstart'],\n zIndex: getDefaultZIndex('popover'),\n __staticSelector: 'Popover',\n width: 'max-content',\n} satisfies Partial<PopoverProps>;\n\nconst varsResolver = createVarsResolver<PopoverFactory>((_, { radius, shadow }) => ({\n dropdown: {\n '--popover-radius': radius === undefined ? undefined : getRadius(radius),\n '--popover-shadow': getShadow(shadow),\n },\n}));\n\nexport function Popover(_props: PopoverProps) {\n const props = useProps('Popover', defaultProps, _props);\n const {\n children,\n position,\n offset,\n onPositionChange,\n opened,\n transitionProps,\n onExitTransitionEnd,\n onEnterTransitionEnd,\n width,\n middlewares,\n withArrow,\n arrowSize,\n arrowOffset,\n arrowRadius,\n arrowPosition,\n unstyled,\n classNames,\n styles,\n closeOnClickOutside,\n withinPortal,\n portalProps,\n closeOnEscape,\n clickOutsideEvents,\n trapFocus,\n onClose,\n onDismiss,\n onOpen,\n onChange,\n zIndex,\n radius,\n shadow,\n id,\n defaultOpened,\n __staticSelector,\n withRoles,\n disabled,\n returnFocus,\n variant,\n keepMounted,\n vars,\n floatingStrategy,\n withOverlay,\n overlayProps,\n hideDetached,\n attributes,\n preventPositionChangeWhenVisible,\n ...others\n } = props;\n\n const getStyles = useStyles<PopoverFactory>({\n name: __staticSelector,\n props,\n classes,\n classNames,\n styles,\n unstyled,\n attributes,\n rootSelector: 'dropdown',\n vars,\n varsResolver,\n });\n\n const { resolvedStyles } = useResolvedStylesApi<PopoverFactory>({ classNames, styles, props });\n\n const [dropdownVisible, setDropdownVisible] = useState(opened ?? defaultOpened ?? false);\n const positionRef = useRef<FloatingPosition>(position);\n const arrowRef = useRef<HTMLDivElement \| null>(null);\n const [targetNode, setTargetNode] = useState<HTMLElement \| null>(null);\n const [dropdownNode, setDropdownNode] = useState<HTMLElement \| null>(null);\n const { dir } = useDirection();\n const env = useMantineEnv();\n\n const uid = useId(id);\n const popover = usePopover({\n middlewares,\n width,\n position: getFloatingPosition(dir, position),\n offset: typeof offset === 'number' ? offset + (withArrow ? arrowSize / 2 : 0) : offset,\n arrowRef,\n arrowOffset,\n onPositionChange,\n opened,\n defaultOpened,\n onChange,\n onOpen,\n onClose,\n onDismiss,\n strategy: floatingStrategy,\n dropdownVisible,\n setDropdownVisible,\n positionRef,\n disabled,\n preventPositionChangeWhenVisible,\n keepMounted,\n });\n\n useClickOutside(\n () => {\n if (closeOnClickOutside) {\n popover.onClose();\n onDismiss?.();\n }\n },\n clickOutsideEvents,\n [targetNode, dropdownNode]\n );\n\n const reference = useCallback(\n (node: HTMLElement) => {\n setTargetNode(node);\n popover.floating.refs.setReference(node);\n },\n [popover.floating.refs.setReference]\n );\n\n const floating = useCallback(\n (node: HTMLElement) => {\n setDropdownNode(node);\n popover.floating.refs.setFloating(node);\n },\n [popover.floating.refs.setFloating]\n );\n\n const onExited = useCallback(() => {\n transitionProps?.onExited?.();\n onExitTransitionEnd?.();\n setDropdownVisible(false);\n // Only reset position if preventPositionChangeWhenVisible is false\n // to maintain the flipped position on subsequent opens\n if (!preventPositionChangeWhenVisible) {\n positionRef.current = position;\n }\n }, [transitionProps?.onExited, onExitTransitionEnd, preventPositionChangeWhenVisible, position]);\n\n const onEntered = useCallback(() => {\n transitionProps?.onEntered?.();\n onEnterTransitionEnd?.();\n }, [transitionProps?.onEntered, onEnterTransitionEnd]);\n\n return (\n <PopoverContextProvider\n value={{\n returnFocus,\n disabled,\n controlled: popover.controlled,\n reference,\n floating,\n x: popover.floating.x,\n y: popover.floating.y,\n arrowX: popover.floating?.middlewareData?.arrow?.x,\n arrowY: popover.floating?.middlewareData?.arrow?.y,\n opened: popover.opened,\n arrowRef,\n transitionProps: { ...transitionProps, onExited, onEntered },\n width,\n withArrow,\n arrowSize,\n arrowOffset,\n arrowRadius,\n arrowPosition,\n placement: popover.floating.placement,\n trapFocus,\n withinPortal,\n portalProps,\n zIndex,\n radius,\n shadow,\n closeOnEscape,\n onDismiss,\n onClose: popover.onClose,\n onToggle: popover.onToggle,\n getTargetId: () => uid,\n getDropdownId: () => `${uid}-dropdown`,\n withRoles,\n targetProps: others,\n __staticSelector,\n classNames,\n styles,\n unstyled,\n variant,\n keepMounted,\n getStyles,\n resolvedStyles,\n floatingStrategy,\n referenceHidden:\n hideDetached && env !== 'test'\n ? popover.floating.middlewareData.hide?.referenceHidden\n : false,\n }}\n >\n {children}\n {withOverlay && (\n <Transition\n transition=\"fade\"\n mounted={popover.opened}\n duration={transitionProps?.duration \|\| 250}\n exitDuration={transitionProps?.exitDuration \|\| 250}\n >\n {(transitionStyles) => (\n <OptionalPortal withinPortal={withinPortal}>\n <Overlay\n {...overlayProps}\n {...getStyles('overlay', {\n className: overlayProps?.className,\n style: [transitionStyles, overlayProps?.style],\n })}\n />\n </OptionalPortal>\n )}\n </Transition>\n )}\n </PopoverContextProvider>\n );\n}\n\nPopover.Target = PopoverTarget;\nPopover.Dropdown = PopoverDropdown;\nPopover.varsResolver = varsResolver;\nPopover.displayName = '@mantine/core/Popover';\nPopover.extend = (input: ExtendComponent<PopoverFactory>) => input;\nPopover.withProps = (fixedProps: Partial<PopoverProps>) => {\n const Extended = (props: PopoverProps) => <Popover {...fixedProps} {...props} />;\n Extended.extend = Popover.extend;\n Extended.displayName = `WithProps(${Popover.displayName})`;\n return Extended;\n};\n\nexport namespace Popover {\n export type Props = PopoverProps;\n export type __Props = __PopoverProps;\n export type Factory = PopoverFactory;\n export type StylesNames = PopoverStylesNames;\n export type TargetProps = PopoverTargetProps;\n export type DropdownProps = PopoverDropdownProps;\n export type Width = PopoverWidth;\n export type ContextValue = PopoverContextValue;\n\n export namespace Target {\n export type Props = PopoverTargetProps;\n }\n\n export namespace Dropdown {\n export type Props = PopoverDropdownProps;\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AA0KA,MAAM,eAAe;CACnB,UAAU;CACV,QAAQ;CACR,iBAAiB;EAAE,YAAY;EAAQ,UAAU;CAAI;CACrD,aAAa;EAAE,MAAM;EAAM,OAAO;EAAM,QAAQ;CAAM;CACtD,WAAW;CACX,aAAa;CACb,aAAa;CACb,eAAe;CACf,qBAAqB;CACrB,cAAc;CACd,eAAe;CACf,WAAW;CACX,WAAW;CACX,aAAa;CACb,aAAa;CACb,cAAc;CACd,oBAAoB,CAAC,aAAa,YAAY;CAC9C,QAAQA,4BAAAA,iBAAiB,SAAS;CAClC,kBAAkB;CAClB,OAAO;AACT;AAEA,MAAM,eAAeC,6BAAAA,oBAAoC,GAAG,EAAE,QAAQ,cAAc,EAClF,UAAU;CACR,oBAAoB,WAAW,KAAA,IAAY,KAAA,IAAYC,iBAAAA,UAAU,MAAM;CACvE,oBAAoBC,iBAAAA,UAAU,MAAM;AACtC,EACF,EAAE;AAEF,SAAgB,QAAQ,QAAsB;CAC5C,MAAM,QAAQC,kBAAAA,SAAS,WAAW,cAAc,MAAM;CACtD,MAAM,EACJ,UACA,UACA,QACA,kBACA,QACA,iBACA,qBACA,sBACA,OACA,aACA,WACA,WACA,aACA,aACA,eACA,UACA,YACA,QACA,qBACA,cACA,aACA,eACA,oBACA,WACA,SACA,WACA,QACA,UACA,QACA,QACA,QACA,IACA,eACA,kBACA,WACA,UACA,aACA,SACA,aACA,MACA,kBACA,aACA,cACA,cACA,YACA,kCACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAA0B;EAC1C,MAAM;EACN;EACA,SAAA,uBAAA;EACA;EACA;EACA;EACA;EACA,cAAc;EACd;EACA;CACF,CAAC;CAED,MAAM,EAAE,mBAAmBC,gCAAAA,qBAAqC;EAAE;EAAY;EAAQ;CAAM,CAAC;CAE7F,MAAM,CAAC,iBAAiB,uBAAA,GAAA,MAAA,UAA+B,UAAU,iBAAiB,KAAK;CACvF,MAAM,eAAA,GAAA,MAAA,QAAuC,QAAQ;CACrD,MAAM,YAAA,GAAA,MAAA,QAAyC,IAAI;CACnD,MAAM,CAAC,YAAY,kBAAA,GAAA,MAAA,UAA8C,IAAI;CACrE,MAAM,CAAC,cAAc,oBAAA,GAAA,MAAA,UAAgD,IAAI;CACzE,MAAM,EAAE,QAAQC,0BAAAA,aAAa;CAC7B,MAAM,MAAMC,wBAAAA,cAAc;CAE1B,MAAM,OAAA,GAAA,eAAA,OAAY,EAAE;CACpB,MAAM,UAAUC,oBAAAA,WAAW;EACzB;EACA;EACA,UAAUC,8BAAAA,oBAAoB,KAAK,QAAQ;EAC3C,QAAQ,OAAO,WAAW,WAAW,UAAU,YAAY,YAAY,IAAI,KAAK;EAChF;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,UAAU;EACV;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,CAAA,GAAA,eAAA,uBACQ;EACJ,IAAI,qBAAqB;GACvB,QAAQ,QAAQ;GAChB,YAAY;EACd;CACF,GACA,oBACA,CAAC,YAAY,YAAY,CAC3B;CAEA,MAAM,aAAA,GAAA,MAAA,cACH,SAAsB;EACrB,cAAc,IAAI;EAClB,QAAQ,SAAS,KAAK,aAAa,IAAI;CACzC,GACA,CAAC,QAAQ,SAAS,KAAK,YAAY,CACrC;CAEA,MAAM,YAAA,GAAA,MAAA,cACH,SAAsB;EACrB,gBAAgB,IAAI;EACpB,QAAQ,SAAS,KAAK,YAAY,IAAI;CACxC,GACA,CAAC,QAAQ,SAAS,KAAK,WAAW,CACpC;CAEA,MAAM,YAAA,GAAA,MAAA,mBAA6B;EACjC,iBAAiB,WAAW;EAC5B,sBAAsB;EACtB,mBAAmB,KAAK;EAGxB,IAAI,CAAC,kCACH,YAAY,UAAU;CAE1B,GAAG;EAAC,iBAAiB;EAAU;EAAqB;EAAkC;CAAQ,CAAC;CAE/F,MAAM,aAAA,GAAA,MAAA,mBAA8B;EAClC,iBAAiB,YAAY;EAC7B,uBAAuB;CACzB,GAAG,CAAC,iBAAiB,WAAW,oBAAoB,CAAC;CAErD,OACE,iBAAA,GAAA,kBAAA,MAACC,wBAAAA,wBAAD;EACE,OAAO;GACL;GACA;GACA,YAAY,QAAQ;GACpB;GACA;GACA,GAAG,QAAQ,SAAS;GACpB,GAAG,QAAQ,SAAS;GACpB,QAAQ,QAAQ,UAAU,gBAAgB,OAAO;GACjD,QAAQ,QAAQ,UAAU,gBAAgB,OAAO;GACjD,QAAQ,QAAQ;GAChB;GACA,iBAAiB;IAAE,GAAG;IAAiB;IAAU;GAAU;GAC3D;GACA;GACA;GACA;GACA;GACA;GACA,WAAW,QAAQ,SAAS;GAC5B;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA,SAAS,QAAQ;GACjB,UAAU,QAAQ;GAClB,mBAAmB;GACnB,qBAAqB,GAAG,IAAI;GAC5B;GACA,aAAa;GACb;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA,iBACE,gBAAgB,QAAQ,SACpB,QAAQ,SAAS,eAAe,MAAM,kBACtC;EACR;YAhDF,CAkDG,UACA,eACC,iBAAA,GAAA,kBAAA,KAACC,mBAAAA,YAAD;GACE,YAAW;GACX,SAAS,QAAQ;GACjB,UAAU,iBAAiB,YAAY;GACvC,cAAc,iBAAiB,gBAAgB;cAE7C,qBACA,iBAAA,GAAA,kBAAA,KAACC,uBAAAA,gBAAD;IAA8B;cAC5B,iBAAA,GAAA,kBAAA,KAACC,gBAAAA,SAAD;KACE,GAAI;KACJ,GAAI,UAAU,WAAW;MACvB,WAAW,cAAc;MACzB,OAAO,CAAC,kBAAkB,cAAc,KAAK;KAC/C,CAAC;IACF,CAAA;GACa,CAAA;EAER,CAAA,CAEQ;;AAE5B;AAEA,QAAQ,SAASC,sBAAAA;AACjB,QAAQ,WAAWC,wBAAAA;AACnB,QAAQ,eAAe;AACvB,QAAQ,cAAc;AACtB,QAAQ,UAAU,UAA2C;AAC7D,QAAQ,aAAa,eAAsC;CACzD,MAAM,YAAY,UAAwB,iBAAA,GAAA,kBAAA,KAAC,SAAD;EAAS,GAAI;EAAY,GAAI;CAAQ,CAAA;CAC/E,SAAS,SAAS,QAAQ;CAC1B,SAAS,cAAc,aAAa,QAAQ,YAAY;CACxD,OAAO;AACT"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Popover.context.cjs","names":["createSafeContext"],"sources":["../../../src/components/Popover/Popover.context.ts"],"sourcesContent":["import {\n ClassNames,\n createSafeContext,\n GetStylesApi,\n MantineRadius,\n MantineShadow,\n Styles,\n} from '../../core';\nimport { ArrowPosition, FloatingPosition, FloatingStrategy } from '../../utils/Floating';\nimport { BasePortalProps } from '../Portal';\nimport { TransitionOverride } from '../Transition';\nimport type { PopoverFactory } from './Popover';\nimport { PopoverWidth } from './Popover.types';\n\nexport interface PopoverContextValue {\n x: number;\n y: number;\n arrowX: number \| undefined;\n arrowY: number \| undefined;\n arrowRef: React.RefObject<HTMLDivElement \| null>;\n opened: boolean;\n transitionProps?: TransitionOverride;\n reference: (node: HTMLElement) => void;\n floating: (node: HTMLElement) => void;\n width?: PopoverWidth;\n withArrow: boolean \| undefined;\n arrowSize: number;\n arrowOffset: number;\n arrowRadius: number;\n arrowPosition: ArrowPosition;\n trapFocus: boolean \| undefined;\n placement: FloatingPosition;\n withinPortal: boolean \| undefined;\n portalProps?: BasePortalProps;\n closeOnEscape: boolean \| undefined;\n zIndex: string \| number \| undefined;\n radius?: MantineRadius \| undefined;\n shadow?: MantineShadow \| undefined;\n onClose?: () => void;\n onDismiss?: () => void;\n getDropdownId: () => string;\n getTargetId: () => string;\n controlled: boolean;\n onToggle: () => void;\n withRoles: boolean \| undefined;\n targetProps: Record<string, any>;\n disabled: boolean \| undefined;\n returnFocus: boolean \| undefined;\n classNames: ClassNames<PopoverFactory> \| undefined;\n styles: Styles<PopoverFactory> \| undefined;\n unstyled: boolean \| undefined;\n __staticSelector: string;\n variant: string \| undefined;\n keepMounted: boolean \| undefined;\n getStyles: GetStylesApi<PopoverFactory>;\n resolvedStyles: Record<string, any> \| undefined;\n floatingStrategy: FloatingStrategy \| undefined;\n referenceHidden: boolean \| undefined;\n}\n\nexport const [PopoverContextProvider, usePopoverContext] = createSafeContext<PopoverContextValue>(\n 'Popover component was not found in the tree'\n);\n"],"mappings":";;AA4DA,MAAa,CAAC,wBAAwB,~~6FAAqBA~~,kBACzD,~~8CACD~~"}
1	+ {"version":3,"file":"Popover.context.cjs","names":["createSafeContext"],"sources":["../../../src/components/Popover/Popover.context.ts"],"sourcesContent":["import {\n ClassNames,\n createSafeContext,\n GetStylesApi,\n MantineRadius,\n MantineShadow,\n Styles,\n} from '../../core';\nimport { ArrowPosition, FloatingPosition, FloatingStrategy } from '../../utils/Floating';\nimport { BasePortalProps } from '../Portal';\nimport { TransitionOverride } from '../Transition';\nimport type { PopoverFactory } from './Popover';\nimport { PopoverWidth } from './Popover.types';\n\nexport interface PopoverContextValue {\n x: number;\n y: number;\n arrowX: number \| undefined;\n arrowY: number \| undefined;\n arrowRef: React.RefObject<HTMLDivElement \| null>;\n opened: boolean;\n transitionProps?: TransitionOverride;\n reference: (node: HTMLElement) => void;\n floating: (node: HTMLElement) => void;\n width?: PopoverWidth;\n withArrow: boolean \| undefined;\n arrowSize: number;\n arrowOffset: number;\n arrowRadius: number;\n arrowPosition: ArrowPosition;\n trapFocus: boolean \| undefined;\n placement: FloatingPosition;\n withinPortal: boolean \| undefined;\n portalProps?: BasePortalProps;\n closeOnEscape: boolean \| undefined;\n zIndex: string \| number \| undefined;\n radius?: MantineRadius \| undefined;\n shadow?: MantineShadow \| undefined;\n onClose?: () => void;\n onDismiss?: () => void;\n getDropdownId: () => string;\n getTargetId: () => string;\n controlled: boolean;\n onToggle: () => void;\n withRoles: boolean \| undefined;\n targetProps: Record<string, any>;\n disabled: boolean \| undefined;\n returnFocus: boolean \| undefined;\n classNames: ClassNames<PopoverFactory> \| undefined;\n styles: Styles<PopoverFactory> \| undefined;\n unstyled: boolean \| undefined;\n __staticSelector: string;\n variant: string \| undefined;\n keepMounted: boolean \| undefined;\n getStyles: GetStylesApi<PopoverFactory>;\n resolvedStyles: Record<string, any> \| undefined;\n floatingStrategy: FloatingStrategy \| undefined;\n referenceHidden: boolean \| undefined;\n}\n\nexport const [PopoverContextProvider, usePopoverContext] = createSafeContext<PopoverContextValue>(\n 'Popover component was not found in the tree'\n);\n"],"mappings":";;AA4DA,MAAa,CAAC,wBAAwB,2FAAqBA,EAAAA,kBACzD,6CACF"}

package/cjs/components/Popover/PopoverDropdown/PopoverDropdown.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PopoverDropdown.cjs","names":["factory","useProps","usePopoverContext","OptionalPortal","Transition","FocusTrap","Box","closeOnEscape","rem","FloatingArrow","classes"],"sources":["../../../../src/components/Popover/PopoverDropdown/PopoverDropdown.tsx"],"sourcesContent":["import { useFocusReturn, useMergedRef } from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n closeOnEscape,\n CompoundStylesApiProps,\n ElementProps,\n factory,\n Factory,\n rem,\n useProps,\n} from '../../../core';\nimport { FloatingArrow } from '../../../utils/Floating';\nimport { FocusTrap } from '../../FocusTrap';\nimport { OptionalPortal } from '../../Portal';\nimport { Transition } from '../../Transition';\nimport type { PopoverStylesNames } from '../Popover';\nimport { usePopoverContext } from '../Popover.context';\nimport classes from '../Popover.module.css';\n\nexport interface PopoverDropdownProps\n extends BoxProps, CompoundStylesApiProps<PopoverDropdownFactory>, ElementProps<'div'> {}\n\nexport type PopoverDropdownFactory = Factory<{\n props: PopoverDropdownProps;\n ref: HTMLDivElement;\n stylesNames: PopoverStylesNames;\n compound: true;\n}>;\n\nexport const PopoverDropdown = factory<PopoverDropdownFactory>((_props) => {\n const props = useProps('PopoverDropdown', null, _props);\n const {\n className,\n style,\n vars,\n children,\n onKeyDownCapture,\n variant,\n classNames,\n styles,\n ref,\n ...others\n } = props;\n\n const ctx = usePopoverContext();\n\n const returnFocus = useFocusReturn({\n opened: ctx.opened,\n shouldReturnFocus: ctx.returnFocus,\n });\n\n const accessibleProps = ctx.withRoles\n ? {\n 'aria-labelledby': ctx.getTargetId(),\n id: ctx.getDropdownId(),\n role: 'dialog',\n tabIndex: -1,\n }\n : {};\n\n const mergedRef = useMergedRef(ref, ctx.floating);\n\n if (ctx.disabled) {\n return null;\n }\n\n return (\n <OptionalPortal {...ctx.portalProps} withinPortal={ctx.withinPortal}>\n <Transition\n mounted={ctx.opened}\n {...ctx.transitionProps}\n transition={ctx.transitionProps?.transition \|\| 'fade'}\n duration={ctx.transitionProps?.duration ?? 150}\n keepMounted={ctx.keepMounted}\n exitDuration={\n typeof ctx.transitionProps?.exitDuration === 'number'\n ? ctx.transitionProps.exitDuration\n : ctx.transitionProps?.duration\n }\n >\n {(transitionStyles) => (\n <FocusTrap active={ctx.trapFocus && ctx.opened} innerRef={mergedRef}>\n <Box\n {...accessibleProps}\n {...others}\n variant={variant}\n onKeyDownCapture={closeOnEscape(\n () => {\n ctx.onClose?.();\n ctx.onDismiss?.();\n },\n {\n active: ctx.closeOnEscape,\n onTrigger: returnFocus,\n onKeyDown: onKeyDownCapture,\n }\n )}\n data-position={ctx.placement}\n data-fixed={ctx.floatingStrategy === 'fixed' \|\| undefined}\n {...ctx.getStyles('dropdown', {\n className,\n props,\n classNames,\n styles,\n style: [\n {\n ...transitionStyles,\n zIndex: ctx.zIndex as React.CSSProperties['zIndex'],\n top: ctx.y ?? 0,\n left: ctx.x ?? 0,\n width: ctx.width === 'target' ? undefined : rem(ctx.width),\n ...(ctx.referenceHidden ? { display: 'none' } : null),\n },\n ctx.resolvedStyles?.dropdown,\n styles?.dropdown,\n style,\n ],\n })}\n >\n {children}\n\n <FloatingArrow\n ref={ctx.arrowRef}\n arrowX={ctx.arrowX}\n arrowY={ctx.arrowY}\n visible={ctx.withArrow}\n position={ctx.placement}\n arrowSize={ctx.arrowSize}\n arrowRadius={ctx.arrowRadius}\n arrowOffset={ctx.arrowOffset}\n arrowPosition={ctx.arrowPosition}\n {...ctx.getStyles('arrow', {\n props,\n classNames,\n styles,\n })}\n />\n </Box>\n </FocusTrap>\n )}\n </Transition>\n </OptionalPortal>\n );\n});\n\nPopoverDropdown.classes = classes;\nPopoverDropdown.displayName = '@mantine/core/PopoverDropdown';\n"],"mappings":";;;;;;;;;;;;;;;;AA8BA,MAAa,kBAAkBA,gBAAAA,SAAiC,WAAW;CACzE,MAAM,QAAQC,kBAAAA,SAAS,mBAAmB,MAAM,~~OAAO~~;~~CACvD~~,MAAM,EACJ,WACA,OACA,MACA,UACA,kBACA,SACA,YACA,QACA,KACA,GAAG,WACD;CAEJ,MAAM,MAAMC,wBAAAA,~~mBAAmB~~;~~CAE/B~~,MAAM,eAAA,GAAA,eAAA,gBAA6B;EACjC,QAAQ,IAAI;EACZ,mBAAmB,IAAI;~~EACxB~~,CAAC;~~CAEF~~,MAAM,kBAAkB,IAAI,YACxB;EACE,mBAAmB,IAAI,~~aAAa~~;~~EACpC~~,IAAI,IAAI,~~eAAe~~;~~EACvB~~,MAAM;EACN,UAAU;~~EACX~~,~~GACD~~,~~EAAE~~;~~CAEN~~,MAAM,aAAA,GAAA,eAAA,cAAyB,KAAK,IAAI,~~SAAS~~;~~AAEjD~~,~~KAAI~~,IAAI,~~SACN~~,~~QAAO~~;~~AAGT~~,~~QACE~~,iBAAA,GAAA,kBAAA,KAACC,uBAAAA,gBAAD;EAAgB,GAAI,IAAI;EAAa,cAAc,IAAI;YACrD,iBAAA,GAAA,kBAAA,KAACC,mBAAAA,YAAD;GACE,SAAS,IAAI;GACb,GAAI,IAAI;GACR,YAAY,IAAI,iBAAiB,cAAc;GAC/C,UAAU,IAAI,iBAAiB,YAAY;GAC3C,aAAa,IAAI;GACjB,cACE,OAAO,IAAI,iBAAiB,iBAAiB,WACzC,IAAI,gBAAgB,eACpB,IAAI,iBAAiB;cAGzB,qBACA,iBAAA,GAAA,kBAAA,KAACC,kBAAAA,WAAD;IAAW,QAAQ,IAAI,aAAa,IAAI;IAAQ,UAAU;cACxD,iBAAA,GAAA,kBAAA,MAACC,YAAAA,KAAD;KACE,GAAI;KACJ,GAAI;KACK;KACT,kBAAkBC,wBAAAA,oBACV;~~AACJ~~,~~UAAI~~,~~WAAW~~;~~AACf~~,~~UAAI~~,~~aAAa~~;~~QAEnB~~;MACE,QAAQ,IAAI;MACZ,WAAW;MACX,WAAW;~~MACZ~~,CACF;~~KACD~~,iBAAe,IAAI;KACnB,cAAY,IAAI,qBAAqB,WAAW,KAAA;KAChD,GAAI,IAAI,UAAU,YAAY;MAC5B;MACA;MACA;MACA;MACA,OAAO;OACL;QACE,GAAG;QACH,QAAQ,IAAI;QACZ,KAAK,IAAI,KAAK;QACd,MAAM,IAAI,KAAK;QACf,OAAO,IAAI,UAAU,WAAW,KAAA,IAAYC,YAAAA,IAAI,IAAI,~~MAAM~~;~~QAC1D~~,GAAI,IAAI,kBAAkB,EAAE,SAAS,~~QAAQ~~,~~GAAG~~;~~QACjD~~;~~OACD~~,IAAI,gBAAgB;OACpB,QAAQ;OACR;~~OACD~~;~~MACF~~,CAAC;~~eAnCJ~~,CAqCG,UAED,iBAAA,GAAA,kBAAA,KAACC,sBAAAA,eAAD;MACE,KAAK,IAAI;MACT,QAAQ,IAAI;MACZ,QAAQ,IAAI;MACZ,SAAS,IAAI;MACb,UAAU,IAAI;MACd,WAAW,IAAI;MACf,aAAa,IAAI;MACjB,aAAa,IAAI;MACjB,eAAe,IAAI;MACnB,GAAI,IAAI,UAAU,SAAS;OACzB;OACA;OACA;~~OACD~~,CAAC;~~MACF~~,CAAA,CACE;;~~IACI~~,CAAA;~~GAEH~~,CAAA;~~EACE~~,CAAA;~~EAEnB~~;~~AAEF~~,gBAAgB,UAAUC,uBAAAA;AAC1B,gBAAgB,cAAc"}
1	+ {"version":3,"file":"PopoverDropdown.cjs","names":["factory","useProps","usePopoverContext","OptionalPortal","Transition","FocusTrap","Box","closeOnEscape","rem","FloatingArrow","classes"],"sources":["../../../../src/components/Popover/PopoverDropdown/PopoverDropdown.tsx"],"sourcesContent":["import { useFocusReturn, useMergedRef } from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n closeOnEscape,\n CompoundStylesApiProps,\n ElementProps,\n factory,\n Factory,\n rem,\n useProps,\n} from '../../../core';\nimport { FloatingArrow } from '../../../utils/Floating';\nimport { FocusTrap } from '../../FocusTrap';\nimport { OptionalPortal } from '../../Portal';\nimport { Transition } from '../../Transition';\nimport type { PopoverStylesNames } from '../Popover';\nimport { usePopoverContext } from '../Popover.context';\nimport classes from '../Popover.module.css';\n\nexport interface PopoverDropdownProps\n extends BoxProps, CompoundStylesApiProps<PopoverDropdownFactory>, ElementProps<'div'> {}\n\nexport type PopoverDropdownFactory = Factory<{\n props: PopoverDropdownProps;\n ref: HTMLDivElement;\n stylesNames: PopoverStylesNames;\n compound: true;\n}>;\n\nexport const PopoverDropdown = factory<PopoverDropdownFactory>((_props) => {\n const props = useProps('PopoverDropdown', null, _props);\n const {\n className,\n style,\n vars,\n children,\n onKeyDownCapture,\n variant,\n classNames,\n styles,\n ref,\n ...others\n } = props;\n\n const ctx = usePopoverContext();\n\n const returnFocus = useFocusReturn({\n opened: ctx.opened,\n shouldReturnFocus: ctx.returnFocus,\n });\n\n const accessibleProps = ctx.withRoles\n ? {\n 'aria-labelledby': ctx.getTargetId(),\n id: ctx.getDropdownId(),\n role: 'dialog',\n tabIndex: -1,\n }\n : {};\n\n const mergedRef = useMergedRef(ref, ctx.floating);\n\n if (ctx.disabled) {\n return null;\n }\n\n return (\n <OptionalPortal {...ctx.portalProps} withinPortal={ctx.withinPortal}>\n <Transition\n mounted={ctx.opened}\n {...ctx.transitionProps}\n transition={ctx.transitionProps?.transition \|\| 'fade'}\n duration={ctx.transitionProps?.duration ?? 150}\n keepMounted={ctx.keepMounted}\n exitDuration={\n typeof ctx.transitionProps?.exitDuration === 'number'\n ? ctx.transitionProps.exitDuration\n : ctx.transitionProps?.duration\n }\n >\n {(transitionStyles) => (\n <FocusTrap active={ctx.trapFocus && ctx.opened} innerRef={mergedRef}>\n <Box\n {...accessibleProps}\n {...others}\n variant={variant}\n onKeyDownCapture={closeOnEscape(\n () => {\n ctx.onClose?.();\n ctx.onDismiss?.();\n },\n {\n active: ctx.closeOnEscape,\n onTrigger: returnFocus,\n onKeyDown: onKeyDownCapture,\n }\n )}\n data-position={ctx.placement}\n data-fixed={ctx.floatingStrategy === 'fixed' \|\| undefined}\n {...ctx.getStyles('dropdown', {\n className,\n props,\n classNames,\n styles,\n style: [\n {\n ...transitionStyles,\n zIndex: ctx.zIndex as React.CSSProperties['zIndex'],\n top: ctx.y ?? 0,\n left: ctx.x ?? 0,\n width: ctx.width === 'target' ? undefined : rem(ctx.width),\n ...(ctx.referenceHidden ? { display: 'none' } : null),\n },\n ctx.resolvedStyles?.dropdown,\n styles?.dropdown,\n style,\n ],\n })}\n >\n {children}\n\n <FloatingArrow\n ref={ctx.arrowRef}\n arrowX={ctx.arrowX}\n arrowY={ctx.arrowY}\n visible={ctx.withArrow}\n position={ctx.placement}\n arrowSize={ctx.arrowSize}\n arrowRadius={ctx.arrowRadius}\n arrowOffset={ctx.arrowOffset}\n arrowPosition={ctx.arrowPosition}\n {...ctx.getStyles('arrow', {\n props,\n classNames,\n styles,\n })}\n />\n </Box>\n </FocusTrap>\n )}\n </Transition>\n </OptionalPortal>\n );\n});\n\nPopoverDropdown.classes = classes;\nPopoverDropdown.displayName = '@mantine/core/PopoverDropdown';\n"],"mappings":";;;;;;;;;;;;;;;;AA8BA,MAAa,kBAAkBA,gBAAAA,SAAiC,WAAW;CACzE,MAAM,QAAQC,kBAAAA,SAAS,mBAAmB,MAAM,MAAM;CACtD,MAAM,EACJ,WACA,OACA,MACA,UACA,kBACA,SACA,YACA,QACA,KACA,GAAG,WACD;CAEJ,MAAM,MAAMC,wBAAAA,kBAAkB;CAE9B,MAAM,eAAA,GAAA,eAAA,gBAA6B;EACjC,QAAQ,IAAI;EACZ,mBAAmB,IAAI;CACzB,CAAC;CAED,MAAM,kBAAkB,IAAI,YACxB;EACE,mBAAmB,IAAI,YAAY;EACnC,IAAI,IAAI,cAAc;EACtB,MAAM;EACN,UAAU;CACZ,IACA,CAAC;CAEL,MAAM,aAAA,GAAA,eAAA,cAAyB,KAAK,IAAI,QAAQ;CAEhD,IAAI,IAAI,UACN,OAAO;CAGT,OACE,iBAAA,GAAA,kBAAA,KAACC,uBAAAA,gBAAD;EAAgB,GAAI,IAAI;EAAa,cAAc,IAAI;YACrD,iBAAA,GAAA,kBAAA,KAACC,mBAAAA,YAAD;GACE,SAAS,IAAI;GACb,GAAI,IAAI;GACR,YAAY,IAAI,iBAAiB,cAAc;GAC/C,UAAU,IAAI,iBAAiB,YAAY;GAC3C,aAAa,IAAI;GACjB,cACE,OAAO,IAAI,iBAAiB,iBAAiB,WACzC,IAAI,gBAAgB,eACpB,IAAI,iBAAiB;cAGzB,qBACA,iBAAA,GAAA,kBAAA,KAACC,kBAAAA,WAAD;IAAW,QAAQ,IAAI,aAAa,IAAI;IAAQ,UAAU;cACxD,iBAAA,GAAA,kBAAA,MAACC,YAAAA,KAAD;KACE,GAAI;KACJ,GAAI;KACK;KACT,kBAAkBC,wBAAAA,oBACV;MACJ,IAAI,UAAU;MACd,IAAI,YAAY;KAClB,GACA;MACE,QAAQ,IAAI;MACZ,WAAW;MACX,WAAW;KACb,CACF;KACA,iBAAe,IAAI;KACnB,cAAY,IAAI,qBAAqB,WAAW,KAAA;KAChD,GAAI,IAAI,UAAU,YAAY;MAC5B;MACA;MACA;MACA;MACA,OAAO;OACL;QACE,GAAG;QACH,QAAQ,IAAI;QACZ,KAAK,IAAI,KAAK;QACd,MAAM,IAAI,KAAK;QACf,OAAO,IAAI,UAAU,WAAW,KAAA,IAAYC,YAAAA,IAAI,IAAI,KAAK;QACzD,GAAI,IAAI,kBAAkB,EAAE,SAAS,OAAO,IAAI;OAClD;OACA,IAAI,gBAAgB;OACpB,QAAQ;OACR;MACF;KACF,CAAC;eAnCH,CAqCG,UAED,iBAAA,GAAA,kBAAA,KAACC,sBAAAA,eAAD;MACE,KAAK,IAAI;MACT,QAAQ,IAAI;MACZ,QAAQ,IAAI;MACZ,SAAS,IAAI;MACb,UAAU,IAAI;MACd,WAAW,IAAI;MACf,aAAa,IAAI;MACjB,aAAa,IAAI;MACjB,eAAe,IAAI;MACnB,GAAI,IAAI,UAAU,SAAS;OACzB;OACA;OACA;MACF,CAAC;KACF,CAAA,CACE;;GACI,CAAA;EAEH,CAAA;CACE,CAAA;AAEpB,CAAC;AAED,gBAAgB,UAAUC,uBAAAA;AAC1B,gBAAgB,cAAc"}

package/cjs/components/Popover/PopoverTarget/PopoverTarget.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PopoverTarget.cjs","names":["factory","useProps","getSingleElementChild","usePopoverContext","getRefProp"],"sources":["../../../../src/components/Popover/PopoverTarget/PopoverTarget.tsx"],"sourcesContent":["import { cloneElement } from 'react';\nimport cx from 'clsx';\nimport { useMergedRef } from '@mantine/hooks';\nimport { factory, Factory, getRefProp, getSingleElementChild, useProps } from '../../../core';\nimport { usePopoverContext } from '../Popover.context';\n\nexport interface PopoverTargetProps {\n /** Target element /\n children: React.ReactNode;\n\n /* Key of the prop that should be used to access element ref /\n refProp?: string;\n\n /* Popup accessible type @default 'dialog' */\n popupType?: string;\n}\n\nconst defaultProps = {\n refProp: 'ref',\n popupType: 'dialog',\n} satisfies Partial<PopoverTargetProps>;\n\nexport type PopoverTargetFactory = Factory<{\n props: PopoverTargetProps;\n ref: HTMLElement;\n compound: true;\n}>;\n\nexport const PopoverTarget = factory<PopoverTargetFactory>((props) => {\n const { children, refProp, popupType, ref, ...others } = useProps(\n 'PopoverTarget',\n defaultProps,\n props\n );\n\n const child = getSingleElementChild(children);\n if (!child) {\n throw new Error(\n 'Popover.Target component children should be an element or a component that accepts ref. Fragments, strings, numbers and other primitive values are not supported'\n );\n }\n\n const forwardedProps: any = others;\n const ctx = usePopoverContext();\n const targetRef = useMergedRef(ctx.reference, getRefProp(child), ref);\n\n const accessibleProps = ctx.withRoles\n ? {\n 'aria-haspopup': popupType,\n 'aria-expanded': ctx.opened,\n 'aria-controls': ctx.opened ? ctx.getDropdownId() : undefined,\n id: ctx.getTargetId(),\n }\n : {};\n\n const childProps = child.props as any;\n return cloneElement(child, {\n ...forwardedProps,\n ...accessibleProps,\n ...ctx.targetProps,\n className: cx(ctx.targetProps.className, forwardedProps.className, childProps.className),\n [refProp]: targetRef,\n ...(!ctx.controlled\n ? {\n onClick: (event: React.MouseEvent<HTMLElement>) => {\n ctx.onToggle();\n childProps.onClick?.(event);\n },\n }\n : null),\n });\n});\n\nPopoverTarget.displayName = '@mantine/core/PopoverTarget';\n"],"mappings":";;;;;;;;;;;;AAiBA,MAAM,eAAe;CACnB,SAAS;CACT,WAAW;~~CACZ~~;~~AAQD~~,MAAa,gBAAgBA,gBAAAA,SAA+B,UAAU;CACpE,MAAM,EAAE,UAAU,SAAS,WAAW,KAAK,GAAG,WAAWC,kBAAAA,SACvD,iBACA,cACA,~~MACD~~;~~CAED~~,MAAM,QAAQC,iCAAAA,sBAAsB,~~SAAS~~;~~AAC7C~~,~~KAAI~~,CAAC,~~MACH~~,~~OAAM~~,IAAI,MACR,~~mKACD~~;~~CAGH~~,MAAM,iBAAsB;CAC5B,MAAM,MAAMC,wBAAAA,~~mBAAmB~~;~~CAC/B~~,MAAM,aAAA,GAAA,eAAA,cAAyB,IAAI,WAAWC,qBAAAA,WAAW,~~MAAM~~,~~EAAE~~,~~IAAI~~;~~CAErE~~,MAAM,kBAAkB,IAAI,YACxB;EACE,iBAAiB;EACjB,iBAAiB,IAAI;EACrB,iBAAiB,IAAI,SAAS,IAAI,~~eAAe~~,~~GAAG~~,KAAA;EACpD,IAAI,IAAI,~~aAAa~~;~~EACtB~~,~~GACD~~,~~EAAE~~;~~CAEN~~,MAAM,aAAa,MAAM;~~AACzB~~,~~SAAA~~,GAAA,MAAA,cAAoB,OAAO;EACzB,GAAG;EACH,GAAG;EACH,GAAG,IAAI;EACP,YAAA,GAAA,KAAA,SAAc,IAAI,YAAY,WAAW,eAAe,WAAW,WAAW,~~UAAU~~;~~GACvF~~,UAAU;EACX,GAAI,CAAC,IAAI,aACL,EACE,UAAU,UAAyC;~~AACjD~~,~~OAAI~~,~~UAAU~~;~~AACd~~,~~cAAW~~,UAAU,~~MAAM~~;~~KAE9B~~,~~GACD~~;~~EACL~~,CAAC;~~EACF~~;~~AAEF~~,cAAc,cAAc"}
1	+ {"version":3,"file":"PopoverTarget.cjs","names":["factory","useProps","getSingleElementChild","usePopoverContext","getRefProp"],"sources":["../../../../src/components/Popover/PopoverTarget/PopoverTarget.tsx"],"sourcesContent":["import { cloneElement } from 'react';\nimport cx from 'clsx';\nimport { useMergedRef } from '@mantine/hooks';\nimport { factory, Factory, getRefProp, getSingleElementChild, useProps } from '../../../core';\nimport { usePopoverContext } from '../Popover.context';\n\nexport interface PopoverTargetProps {\n /** Target element /\n children: React.ReactNode;\n\n /* Key of the prop that should be used to access element ref /\n refProp?: string;\n\n /* Popup accessible type @default 'dialog' */\n popupType?: string;\n}\n\nconst defaultProps = {\n refProp: 'ref',\n popupType: 'dialog',\n} satisfies Partial<PopoverTargetProps>;\n\nexport type PopoverTargetFactory = Factory<{\n props: PopoverTargetProps;\n ref: HTMLElement;\n compound: true;\n}>;\n\nexport const PopoverTarget = factory<PopoverTargetFactory>((props) => {\n const { children, refProp, popupType, ref, ...others } = useProps(\n 'PopoverTarget',\n defaultProps,\n props\n );\n\n const child = getSingleElementChild(children);\n if (!child) {\n throw new Error(\n 'Popover.Target component children should be an element or a component that accepts ref. Fragments, strings, numbers and other primitive values are not supported'\n );\n }\n\n const forwardedProps: any = others;\n const ctx = usePopoverContext();\n const targetRef = useMergedRef(ctx.reference, getRefProp(child), ref);\n\n const accessibleProps = ctx.withRoles\n ? {\n 'aria-haspopup': popupType,\n 'aria-expanded': ctx.opened,\n 'aria-controls': ctx.opened ? ctx.getDropdownId() : undefined,\n id: ctx.getTargetId(),\n }\n : {};\n\n const childProps = child.props as any;\n return cloneElement(child, {\n ...forwardedProps,\n ...accessibleProps,\n ...ctx.targetProps,\n className: cx(ctx.targetProps.className, forwardedProps.className, childProps.className),\n [refProp]: targetRef,\n ...(!ctx.controlled\n ? {\n onClick: (event: React.MouseEvent<HTMLElement>) => {\n ctx.onToggle();\n childProps.onClick?.(event);\n },\n }\n : null),\n });\n});\n\nPopoverTarget.displayName = '@mantine/core/PopoverTarget';\n"],"mappings":";;;;;;;;;;;;AAiBA,MAAM,eAAe;CACnB,SAAS;CACT,WAAW;AACb;AAQA,MAAa,gBAAgBA,gBAAAA,SAA+B,UAAU;CACpE,MAAM,EAAE,UAAU,SAAS,WAAW,KAAK,GAAG,WAAWC,kBAAAA,SACvD,iBACA,cACA,KACF;CAEA,MAAM,QAAQC,iCAAAA,sBAAsB,QAAQ;CAC5C,IAAI,CAAC,OACH,MAAM,IAAI,MACR,kKACF;CAGF,MAAM,iBAAsB;CAC5B,MAAM,MAAMC,wBAAAA,kBAAkB;CAC9B,MAAM,aAAA,GAAA,eAAA,cAAyB,IAAI,WAAWC,qBAAAA,WAAW,KAAK,GAAG,GAAG;CAEpE,MAAM,kBAAkB,IAAI,YACxB;EACE,iBAAiB;EACjB,iBAAiB,IAAI;EACrB,iBAAiB,IAAI,SAAS,IAAI,cAAc,IAAI,KAAA;EACpD,IAAI,IAAI,YAAY;CACtB,IACA,CAAC;CAEL,MAAM,aAAa,MAAM;CACzB,QAAA,GAAA,MAAA,cAAoB,OAAO;EACzB,GAAG;EACH,GAAG;EACH,GAAG,IAAI;EACP,YAAA,GAAA,KAAA,SAAc,IAAI,YAAY,WAAW,eAAe,WAAW,WAAW,SAAS;GACtF,UAAU;EACX,GAAI,CAAC,IAAI,aACL,EACE,UAAU,UAAyC;GACjD,IAAI,SAAS;GACb,WAAW,UAAU,KAAK;EAC5B,EACF,IACA;CACN,CAAC;AACH,CAAC;AAED,cAAc,cAAc"}

package/cjs/components/Popover/use-popover.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"use-popover.cjs","names":["useMantineEnv","autoUpdate"],"sources":["../../../src/components/Popover/use-popover.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport {\n arrow,\n autoUpdate,\n flip,\n hide,\n inline,\n limitShift,\n Middleware,\n offset,\n shift,\n size,\n useFloating,\n UseFloatingReturn,\n} from '@floating-ui/react';\nimport { useDidUpdate, useIsomorphicEffect, useUncontrolled } from '@mantine/hooks';\nimport { useMantineEnv } from '../../core';\nimport { FloatingAxesOffsets, FloatingPosition, FloatingStrategy } from '../../utils/Floating';\nimport { PopoverMiddlewares, PopoverWidth } from './Popover.types';\n\ninterface UsePopoverOptions {\n offset: number \| FloatingAxesOffsets;\n position: FloatingPosition;\n onPositionChange?: (position: FloatingPosition) => void;\n opened: boolean \| undefined;\n defaultOpened: boolean \| undefined;\n onChange?: (opened: boolean) => void;\n onClose?: () => void;\n onDismiss?: () => void;\n onOpen?: () => void;\n width: PopoverWidth;\n middlewares: PopoverMiddlewares \| undefined;\n arrowRef: React.RefObject<HTMLDivElement \| null>;\n arrowOffset: number;\n strategy?: FloatingStrategy;\n dropdownVisible: boolean;\n setDropdownVisible: (visible: boolean) => void;\n positionRef: React.RefObject<FloatingPosition>;\n disabled: boolean \| undefined;\n preventPositionChangeWhenVisible: boolean \| undefined;\n keepMounted: boolean \| undefined;\n}\n\nfunction getDefaultMiddlewares(middlewares: PopoverMiddlewares \| undefined): PopoverMiddlewares {\n if (middlewares === undefined) {\n return { shift: true, flip: true };\n }\n\n const result = { ...middlewares };\n if (middlewares.shift === undefined) {\n result.shift = true;\n }\n\n if (middlewares.flip === undefined) {\n result.flip = true;\n }\n\n return result;\n}\n\nfunction getPopoverMiddlewares(\n options: UsePopoverOptions,\n getFloating: () => UseFloatingReturn<Element>,\n env: 'test' \| 'default'\n) {\n const middlewaresOptions = getDefaultMiddlewares(options.middlewares);\n const middlewares: Middleware[] = [offset(options.offset), hide()];\n\n if (options.dropdownVisible && env !== 'test' && options.preventPositionChangeWhenVisible) {\n middlewaresOptions.flip = false;\n }\n\n if (middlewaresOptions.flip) {\n middlewares.push(\n typeof middlewaresOptions.flip === 'boolean' ? flip() : flip(middlewaresOptions.flip)\n );\n }\n\n if (middlewaresOptions.shift) {\n middlewares.push(\n shift(\n typeof middlewaresOptions.shift === 'boolean'\n ? { limiter: limitShift(), padding: 5 }\n : { limiter: limitShift(), padding: 5, ...middlewaresOptions.shift }\n )\n );\n }\n\n if (middlewaresOptions.inline) {\n middlewares.push(\n typeof middlewaresOptions.inline === 'boolean' ? inline() : inline(middlewaresOptions.inline)\n );\n }\n\n middlewares.push(arrow({ element: options.arrowRef, padding: options.arrowOffset }));\n\n if (middlewaresOptions.size \|\| options.width === 'target') {\n middlewares.push(\n size({\n ...(typeof middlewaresOptions.size === 'boolean' ? {} : middlewaresOptions.size),\n apply({ rects, availableWidth, availableHeight, ...rest }) {\n const floating = getFloating();\n const styles = floating.refs.floating.current?.style ?? {};\n\n if (middlewaresOptions.size) {\n // If custom apply function is given use that else set defaults\n if (typeof middlewaresOptions.size === 'object' && !!middlewaresOptions.size.apply) {\n middlewaresOptions.size.apply({ rects, availableWidth, availableHeight, ...rest });\n } else {\n Object.assign(styles, {\n maxWidth: `${availableWidth}px`,\n maxHeight: `${availableHeight}px`,\n });\n }\n }\n\n if (options.width === 'target') {\n Object.assign(styles, {\n width: `${rects.reference.width}px`,\n });\n }\n },\n })\n );\n }\n\n return middlewares;\n}\n\nexport function usePopover(options: UsePopoverOptions) {\n const env = useMantineEnv();\n const [_opened, setOpened] = useUncontrolled({\n value: options.opened,\n defaultValue: options.defaultOpened,\n finalValue: false,\n onChange: options.onChange,\n });\n\n const previouslyOpened = useRef(_opened);\n\n const onClose = () => {\n if (_opened && !options.disabled) {\n setOpened(false);\n }\n };\n\n const onToggle = () => {\n if (!options.disabled) {\n setOpened(!_opened);\n }\n };\n\n const floating: UseFloatingReturn<Element> = useFloating({\n strategy: options.strategy,\n placement: options.preventPositionChangeWhenVisible\n ? options.positionRef.current\n : options.position,\n middleware: getPopoverMiddlewares(options, () => floating, env),\n whileElementsMounted: !options.keepMounted ? autoUpdate : undefined,\n });\n\n useEffect(() => {\n if (!floating.refs.reference.current \|\| !floating.refs.floating.current) {\n return;\n }\n\n if (_opened) {\n return autoUpdate(\n floating.refs.reference.current,\n floating.refs.floating.current,\n floating.update\n );\n }\n }, [_opened, floating.update]);\n\n useDidUpdate(() => {\n options.onPositionChange?.(floating.placement);\n options.positionRef.current = floating.placement;\n }, [floating.placement, options.preventPositionChangeWhenVisible]);\n\n useDidUpdate(() => {\n if (_opened !== previouslyOpened.current) {\n if (!_opened) {\n options.onClose?.();\n } else {\n options.onOpen?.();\n }\n }\n\n previouslyOpened.current = _opened;\n }, [_opened, options.onClose, options.onOpen]);\n\n useIsomorphicEffect(() => {\n let timeout: number = -1;\n\n if (_opened) {\n // Required to be in timeout to give floating ui render time to flip/shift popover\n timeout = window.setTimeout(() => options.setDropdownVisible(true), 4);\n }\n\n return () => {\n window.clearTimeout(timeout);\n };\n }, [_opened, options.position]);\n\n return {\n floating,\n controlled: typeof options.opened === 'boolean',\n opened: _opened,\n onClose,\n onToggle,\n };\n}\n"],"mappings":";;;;;;;AA2CA,SAAS,sBAAsB,aAAiE;~~AAC9F~~,~~KAAI~~,gBAAgB,KAAA,~~EAClB~~,~~QAAO~~;EAAE,OAAO;EAAM,MAAM;~~EAAM~~;~~CAGpC~~,MAAM,SAAS,EAAE,GAAG,~~aAAa~~;~~AACjC~~,~~KAAI~~,YAAY,UAAU,KAAA,~~EACxB~~,~~QAAO~~,QAAQ;~~AAGjB~~,~~KAAI~~,YAAY,SAAS,KAAA,~~EACvB~~,~~QAAO~~,OAAO;~~AAGhB~~,~~QAAO;;AAGT~~,SAAS,sBACP,SACA,aACA,KACA;CACA,MAAM,qBAAqB,sBAAsB,QAAQ,~~YAAY~~;~~CACrE~~,MAAM,cAA4B,EAAA,GAAA,mBAAA,QAAQ,QAAQ,~~OAAO~~,~~GAAA~~,GAAA,mBAAA,~~OAAQ~~,CAAC;~~AAElE~~,~~KAAI~~,QAAQ,mBAAmB,QAAQ,UAAU,QAAQ,~~iCACvD~~,~~oBAAmB~~,OAAO;~~AAG5B~~,~~KAAI~~,mBAAmB,~~KACrB~~,~~aAAY~~,KACV,OAAO,mBAAmB,SAAS,aAAA,GAAA,mBAAA,~~OAAkB~~,~~IAAA~~,GAAA,mBAAA,~~MAAQ~~,mBAAmB,~~KAAK~~,CACtF;~~AAGH~~,~~KAAI~~,mBAAmB,~~MACrB~~,~~aAAY~~,MAAA,GAAA,mBAAA,OAER,OAAO,mBAAmB,UAAU,YAChC;EAAE,UAAA,GAAA,mBAAA,~~aAAqB~~;~~EAAE~~,SAAS;~~EAAG~~,~~GACrC~~;EAAE,UAAA,GAAA,mBAAA,~~aAAqB~~;~~EAAE~~,SAAS;EAAG,GAAG,mBAAmB;~~EAAO~~,CACvE,CACF;~~AAGH~~,~~KAAI~~,mBAAmB,~~OACrB~~,~~aAAY~~,KACV,OAAO,mBAAmB,WAAW,aAAA,GAAA,mBAAA,~~SAAoB~~,~~IAAA~~,GAAA,mBAAA,~~QAAU~~,mBAAmB,~~OAAO~~,CAC9F;~~AAGH~~,~~aAAY~~,MAAA,GAAA,mBAAA,OAAW;EAAE,SAAS,QAAQ;EAAU,SAAS,QAAQ;~~EAAa~~,CAAC,CAAC;~~AAEpF~~,~~KAAI~~,mBAAmB,QAAQ,QAAQ,UAAU,~~SAC~~/C,~~aAAY~~,MAAA,GAAA,mBAAA,MACL;EACH,GAAI,OAAO,mBAAmB,SAAS,YAAY,~~EAAE~~,~~GAAG~~,mBAAmB;EAC3E,MAAM,EAAE,OAAO,gBAAgB,iBAAiB,GAAG,QAAQ;GAEzD,MAAM,SADW,~~aAAa~~,~~CACN~~,KAAK,SAAS,SAAS,SAAS,~~EAAE~~;~~AAE1D~~,~~OAAI~~,mBAAmB,~~KAErB~~,~~KAAI~~,OAAO,mBAAmB,SAAS,YAAY,CAAC,CAAC,mBAAmB,KAAK,~~MAC3E~~,~~oBAAmB~~,KAAK,MAAM;IAAE;IAAO;IAAgB;IAAiB,GAAG;~~IAAM~~,CAAC;~~OAElF~~,~~QAAO~~,OAAO,QAAQ;IACpB,UAAU,GAAG,eAAe;IAC5B,WAAW,GAAG,gBAAgB;~~IAC/B~~,CAAC;~~AAIN~~,~~OAAI~~,QAAQ,UAAU,~~SACpB~~,~~QAAO~~,OAAO,QAAQ,EACpB,OAAO,GAAG,MAAM,UAAU,MAAM,~~KACjC~~,CAAC~~;;EAGP~~,CAAC,CACH;~~AAGH~~,~~QAAO;;AAGT~~,SAAgB,WAAW,SAA4B;CACrD,MAAM,MAAMA,wBAAAA,~~eAAe~~;~~CAC3B~~,MAAM,CAAC,SAAS,cAAA,GAAA,eAAA,iBAA6B;EAC3C,OAAO,QAAQ;EACf,cAAc,QAAQ;EACtB,YAAY;EACZ,UAAU,QAAQ;~~EACnB~~,CAAC;~~CAEF~~,MAAM,oBAAA,GAAA,MAAA,QAA0B,~~QAAQ~~;~~CAExC~~,MAAM,gBAAgB;~~AACpB~~,~~MAAI~~,WAAW,CAAC,QAAQ,~~SACtB~~,~~WAAU~~,~~MAAM;;CAIpB~~,MAAM,iBAAiB;~~AACrB~~,~~MAAI~~,CAAC,QAAQ,~~SACX~~,~~WAAU~~,CAAC,~~QAAQ;;CAIvB~~,MAAM,YAAA,GAAA,mBAAA,aAAmD;EACvD,UAAU,QAAQ;EAClB,WAAW,QAAQ,mCACf,QAAQ,YAAY,UACpB,QAAQ;EACZ,YAAY,sBAAsB,eAAe,UAAU,~~IAAI~~;~~EAC/D~~,sBAAsB,CAAC,QAAQ,cAAcC,mBAAAA,aAAa,KAAA;~~EAC3D~~,CAAC;~~AAEF~~,~~EAAA~~,GAAA,MAAA,iBAAgB;~~AACd~~,~~MAAI~~,CAAC,SAAS,KAAK,UAAU,WAAW,CAAC,SAAS,KAAK,SAAS,~~QAC9D~~;~~AAGF~~,~~MAAI~~,~~QACF~~,~~SAAA~~,GAAA,mBAAA,YACE,SAAS,KAAK,UAAU,SACxB,SAAS,KAAK,SAAS,SACvB,SAAS,~~OACV~~;~~IAEF~~,CAAC,SAAS,SAAS,~~OAAO~~,CAAC;~~AAE9B~~,~~EAAA~~,GAAA,eAAA,oBAAmB;~~AACjB~~,~~UAAQ~~,mBAAmB,SAAS,~~UAAU~~;~~AAC9C~~,~~UAAQ~~,YAAY,UAAU,SAAS;~~IACtC~~,CAAC,SAAS,WAAW,QAAQ,~~iCAAiC~~,CAAC;~~AAElE~~,~~EAAA~~,GAAA,eAAA,oBAAmB;~~AACjB~~,~~MAAI~~,YAAY,iBAAiB,~~QAC~~/B,~~KAAI~~,CAAC,~~QACH~~,~~SAAQ~~,~~WAAW~~;~~MAEnB~~,~~SAAQ~~,~~UAAU~~;~~AAItB~~,~~mBAAiB~~,UAAU;~~IAC1B~~;EAAC;EAAS,QAAQ;EAAS,QAAQ;~~EAAO~~,CAAC;~~AAE9C~~,~~EAAA~~,GAAA,eAAA,2BAA0B;EACxB,IAAI,UAAkB;~~AAEtB~~,~~MAAI~~,~~QAEF~~,~~WAAU~~,OAAO,iBAAiB,QAAQ,mBAAmB,~~KAAK~~,~~EAAE~~,~~EAAE~~;~~AAGxE~~,~~eAAa~~;~~AACX~~,~~UAAO~~,aAAa,~~QAAQ;;IAE7B~~,CAAC,SAAS,QAAQ,~~SAAS~~,CAAC;~~AAE/B~~,~~QAAO~~;EACL;EACA,YAAY,OAAO,QAAQ,WAAW;EACtC,QAAQ;EACR;EACA;~~EACD~~"}
1	+ {"version":3,"file":"use-popover.cjs","names":["useMantineEnv","autoUpdate"],"sources":["../../../src/components/Popover/use-popover.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport {\n arrow,\n autoUpdate,\n flip,\n hide,\n inline,\n limitShift,\n Middleware,\n offset,\n shift,\n size,\n useFloating,\n UseFloatingReturn,\n} from '@floating-ui/react';\nimport { useDidUpdate, useIsomorphicEffect, useUncontrolled } from '@mantine/hooks';\nimport { useMantineEnv } from '../../core';\nimport { FloatingAxesOffsets, FloatingPosition, FloatingStrategy } from '../../utils/Floating';\nimport { PopoverMiddlewares, PopoverWidth } from './Popover.types';\n\ninterface UsePopoverOptions {\n offset: number \| FloatingAxesOffsets;\n position: FloatingPosition;\n onPositionChange?: (position: FloatingPosition) => void;\n opened: boolean \| undefined;\n defaultOpened: boolean \| undefined;\n onChange?: (opened: boolean) => void;\n onClose?: () => void;\n onDismiss?: () => void;\n onOpen?: () => void;\n width: PopoverWidth;\n middlewares: PopoverMiddlewares \| undefined;\n arrowRef: React.RefObject<HTMLDivElement \| null>;\n arrowOffset: number;\n strategy?: FloatingStrategy;\n dropdownVisible: boolean;\n setDropdownVisible: (visible: boolean) => void;\n positionRef: React.RefObject<FloatingPosition>;\n disabled: boolean \| undefined;\n preventPositionChangeWhenVisible: boolean \| undefined;\n keepMounted: boolean \| undefined;\n}\n\nfunction getDefaultMiddlewares(middlewares: PopoverMiddlewares \| undefined): PopoverMiddlewares {\n if (middlewares === undefined) {\n return { shift: true, flip: true };\n }\n\n const result = { ...middlewares };\n if (middlewares.shift === undefined) {\n result.shift = true;\n }\n\n if (middlewares.flip === undefined) {\n result.flip = true;\n }\n\n return result;\n}\n\nfunction getPopoverMiddlewares(\n options: UsePopoverOptions,\n getFloating: () => UseFloatingReturn<Element>,\n env: 'test' \| 'default'\n) {\n const middlewaresOptions = getDefaultMiddlewares(options.middlewares);\n const middlewares: Middleware[] = [offset(options.offset), hide()];\n\n if (options.dropdownVisible && env !== 'test' && options.preventPositionChangeWhenVisible) {\n middlewaresOptions.flip = false;\n }\n\n if (middlewaresOptions.flip) {\n middlewares.push(\n typeof middlewaresOptions.flip === 'boolean' ? flip() : flip(middlewaresOptions.flip)\n );\n }\n\n if (middlewaresOptions.shift) {\n middlewares.push(\n shift(\n typeof middlewaresOptions.shift === 'boolean'\n ? { limiter: limitShift(), padding: 5 }\n : { limiter: limitShift(), padding: 5, ...middlewaresOptions.shift }\n )\n );\n }\n\n if (middlewaresOptions.inline) {\n middlewares.push(\n typeof middlewaresOptions.inline === 'boolean' ? inline() : inline(middlewaresOptions.inline)\n );\n }\n\n middlewares.push(arrow({ element: options.arrowRef, padding: options.arrowOffset }));\n\n if (middlewaresOptions.size \|\| options.width === 'target') {\n middlewares.push(\n size({\n ...(typeof middlewaresOptions.size === 'boolean' ? {} : middlewaresOptions.size),\n apply({ rects, availableWidth, availableHeight, ...rest }) {\n const floating = getFloating();\n const styles = floating.refs.floating.current?.style ?? {};\n\n if (middlewaresOptions.size) {\n // If custom apply function is given use that else set defaults\n if (typeof middlewaresOptions.size === 'object' && !!middlewaresOptions.size.apply) {\n middlewaresOptions.size.apply({ rects, availableWidth, availableHeight, ...rest });\n } else {\n Object.assign(styles, {\n maxWidth: `${availableWidth}px`,\n maxHeight: `${availableHeight}px`,\n });\n }\n }\n\n if (options.width === 'target') {\n Object.assign(styles, {\n width: `${rects.reference.width}px`,\n });\n }\n },\n })\n );\n }\n\n return middlewares;\n}\n\nexport function usePopover(options: UsePopoverOptions) {\n const env = useMantineEnv();\n const [_opened, setOpened] = useUncontrolled({\n value: options.opened,\n defaultValue: options.defaultOpened,\n finalValue: false,\n onChange: options.onChange,\n });\n\n const previouslyOpened = useRef(_opened);\n\n const onClose = () => {\n if (_opened && !options.disabled) {\n setOpened(false);\n }\n };\n\n const onToggle = () => {\n if (!options.disabled) {\n setOpened(!_opened);\n }\n };\n\n const floating: UseFloatingReturn<Element> = useFloating({\n strategy: options.strategy,\n placement: options.preventPositionChangeWhenVisible\n ? options.positionRef.current\n : options.position,\n middleware: getPopoverMiddlewares(options, () => floating, env),\n whileElementsMounted: !options.keepMounted ? autoUpdate : undefined,\n });\n\n useEffect(() => {\n if (!floating.refs.reference.current \|\| !floating.refs.floating.current) {\n return;\n }\n\n if (_opened) {\n return autoUpdate(\n floating.refs.reference.current,\n floating.refs.floating.current,\n floating.update\n );\n }\n }, [_opened, floating.update]);\n\n useDidUpdate(() => {\n options.onPositionChange?.(floating.placement);\n options.positionRef.current = floating.placement;\n }, [floating.placement, options.preventPositionChangeWhenVisible]);\n\n useDidUpdate(() => {\n if (_opened !== previouslyOpened.current) {\n if (!_opened) {\n options.onClose?.();\n } else {\n options.onOpen?.();\n }\n }\n\n previouslyOpened.current = _opened;\n }, [_opened, options.onClose, options.onOpen]);\n\n useIsomorphicEffect(() => {\n let timeout: number = -1;\n\n if (_opened) {\n // Required to be in timeout to give floating ui render time to flip/shift popover\n timeout = window.setTimeout(() => options.setDropdownVisible(true), 4);\n }\n\n return () => {\n window.clearTimeout(timeout);\n };\n }, [_opened, options.position]);\n\n return {\n floating,\n controlled: typeof options.opened === 'boolean',\n opened: _opened,\n onClose,\n onToggle,\n };\n}\n"],"mappings":"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"}