{"version":3,"file":"Button.cjs","names":["rem","createVarsResolver","getSize","getFontSize","getRadius","polymorphicFactory","useProps","useStyles","UnstyledButton","Transition","Box","Loader","classes","ButtonGroup","ButtonGroupSection"],"sources":["../../../src/components/Button/Button.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n getFontSize,\n getRadius,\n getSize,\n MantineColor,\n MantineGradient,\n MantineRadius,\n MantineSize,\n polymorphicFactory,\n PolymorphicFactory,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { Loader, LoaderProps } from '../Loader';\nimport { MantineTransition, Transition } from '../Transition';\nimport { UnstyledButton } from '../UnstyledButton';\nimport { ButtonGroup } from './ButtonGroup/ButtonGroup';\nimport { ButtonGroupSection } from './ButtonGroupSection/ButtonGroupSection';\nimport classes from './Button.module.css';\n\nexport type ButtonSize = MantineSize | `compact-${MantineSize}` | (string & {});\n\nexport type ButtonStylesNames = 'root' | 'inner' | 'loader' | 'section' | 'label';\nexport type ButtonVariant =\n | 'filled'\n | 'light'\n | 'outline'\n | 'transparent'\n | 'white'\n | 'subtle'\n | 'default'\n | 'gradient';\n\nexport type ButtonCssVariables = {\n root:\n | '--button-justify'\n | '--button-height'\n | '--button-padding-x'\n | '--button-fz'\n | '--button-radius'\n | '--button-bg'\n | '--button-hover'\n | '--button-hover-color'\n | '--button-color'\n | '--button-bd';\n};\n\nexport interface ButtonProps extends BoxProps, StylesApiProps {\n 'data-disabled'?: boolean;\n\n /** Controls button `height`, `font-size` and horizontal `padding` @default 'sm' */\n size?: ButtonSize;\n\n /** Key of `theme.colors` or any valid CSS color @default theme.primaryColor */\n color?: MantineColor;\n\n /** Sets `justify-content` of `inner` element, can be used to change distribution of sections and label @default 'center' */\n justify?: React.CSSProperties['justifyContent'];\n\n /** Content on the left side of the button label */\n leftSection?: React.ReactNode;\n\n /** Content on the right side of the button label */\n rightSection?: React.ReactNode;\n\n /** Sets `width: 100%` @default false */\n fullWidth?: boolean;\n\n /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius */\n radius?: MantineRadius;\n\n /** Gradient configuration used for `variant=\"gradient\"` @default theme.defaultGradient */\n gradient?: MantineGradient;\n\n /** Sets `disabled` attribute, applies disabled styles */\n disabled?: boolean;\n\n /** Button content */\n children?: React.ReactNode;\n\n /** If set, the `Loader` component is displayed over the button */\n loading?: boolean;\n\n /** Props added to the `Loader` component (only visible when `loading` prop is set) */\n loaderProps?: LoaderProps;\n\n /** If set, adjusts text color based on background color for `filled` variant */\n autoContrast?: boolean;\n}\n\nexport type ButtonFactory = PolymorphicFactory<{\n props: ButtonProps;\n defaultRef: HTMLButtonElement;\n defaultComponent: 'button';\n stylesNames: ButtonStylesNames;\n vars: ButtonCssVariables;\n variant: ButtonVariant;\n staticComponents: {\n Group: typeof ButtonGroup;\n GroupSection: typeof ButtonGroupSection;\n };\n}>;\n\nconst loaderTransition: MantineTransition = {\n in: { opacity: 1, transform: `translate(-50%, calc(-50% + ${rem(1)}))` },\n out: { opacity: 0, transform: 'translate(-50%, -200%)' },\n common: { transformOrigin: 'center' },\n transitionProperty: 'transform, opacity',\n};\n\nconst varsResolver = createVarsResolver(\n (theme, { radius, color, gradient, variant, size, justify, autoContrast }) => {\n const colors = theme.variantColorResolver({\n color: color || theme.primaryColor,\n theme,\n gradient,\n variant: variant || 'filled',\n autoContrast,\n });\n\n return {\n root: {\n '--button-justify': justify,\n '--button-height': getSize(size, 'button-height'),\n '--button-padding-x': getSize(size, 'button-padding-x'),\n '--button-fz': size?.includes('compact')\n ? getFontSize(size.replace('compact-', ''))\n : getFontSize(size),\n '--button-radius': radius === undefined ? undefined : getRadius(radius),\n '--button-bg': color || variant ? colors.background : undefined,\n '--button-hover': color || variant ? colors.hover : undefined,\n '--button-color': colors.color,\n '--button-bd': color || variant ? colors.border : undefined,\n '--button-hover-color': color || variant ? colors.hoverColor : undefined,\n },\n };\n }\n);\n\nexport const Button = polymorphicFactory((_props) => {\n const props = useProps('Button', null, _props);\n const {\n style,\n vars,\n className,\n color,\n disabled,\n children,\n leftSection,\n rightSection,\n fullWidth,\n variant,\n radius,\n loading,\n loaderProps,\n gradient,\n classNames,\n styles,\n unstyled,\n 'data-disabled': dataDisabled,\n autoContrast,\n mod,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles({\n name: 'Button',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const hasLeftSection = !!leftSection;\n const hasRightSection = !!rightSection;\n\n return (\n \n {typeof loading === 'boolean' && (\n \n {(transitionStyles) => (\n \n \n \n )}\n \n )}\n\n \n {leftSection && (\n \n {leftSection}\n \n )}\n\n \n {children}\n \n\n {rightSection && (\n \n {rightSection}\n \n )}\n \n \n );\n});\n\nButton.classes = classes;\nButton.varsResolver = varsResolver;\nButton.displayName = '@mantine/core/Button';\nButton.Group = ButtonGroup;\nButton.GroupSection = ButtonGroupSection;\n"],"mappings":"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"}