@mantine/core 5.0.0 → 5.0.3
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.
- package/cjs/ActionIcon/ActionIcon.js +2 -2
- package/cjs/ActionIcon/ActionIcon.js.map +1 -1
- package/cjs/ActionIcon/ActionIcon.styles.js +2 -2
- package/cjs/ActionIcon/ActionIcon.styles.js.map +1 -1
- package/cjs/AppShell/HorizontalSection/HorizontalSection.js +4 -1
- package/cjs/AppShell/HorizontalSection/HorizontalSection.js.map +1 -1
- package/cjs/AppShell/HorizontalSection/HorizontalSection.styles.js +11 -2
- package/cjs/AppShell/HorizontalSection/HorizontalSection.styles.js.map +1 -1
- package/cjs/AppShell/VerticalSection/VerticalSection.js +3 -1
- package/cjs/AppShell/VerticalSection/VerticalSection.js.map +1 -1
- package/cjs/Burger/Burger.js.map +1 -1
- package/cjs/Burger/Burger.styles.js +6 -6
- package/cjs/Burger/Burger.styles.js.map +1 -1
- package/cjs/Button/Button.styles.js +0 -1
- package/cjs/Button/Button.styles.js.map +1 -1
- package/cjs/Checkbox/CheckboxGroup/CheckboxGroup.js +8 -4
- package/cjs/Checkbox/CheckboxGroup/CheckboxGroup.js.map +1 -1
- package/cjs/Checkbox/CheckboxGroup/InputsGroup.js +10 -3
- package/cjs/Checkbox/CheckboxGroup/InputsGroup.js.map +1 -1
- package/cjs/ColorPicker/ColorPicker.js +2 -2
- package/cjs/ColorPicker/ColorPicker.js.map +1 -1
- package/cjs/ColorPicker/Swatches/Swatches.js +5 -6
- package/cjs/ColorPicker/Swatches/Swatches.js.map +1 -1
- package/cjs/Divider/Divider.js +2 -1
- package/cjs/Divider/Divider.js.map +1 -1
- package/cjs/Divider/Divider.styles.js +1 -1
- package/cjs/Divider/Divider.styles.js.map +1 -1
- package/cjs/FileButton/FileButton.js +1 -1
- package/cjs/FileButton/FileButton.js.map +1 -1
- package/cjs/FileInput/FileInput.js +1 -0
- package/cjs/FileInput/FileInput.js.map +1 -1
- package/cjs/Image/Image.js +6 -3
- package/cjs/Image/Image.js.map +1 -1
- package/cjs/Input/InputDescription/InputDescription.js +2 -1
- package/cjs/Input/InputDescription/InputDescription.js.map +1 -1
- package/cjs/Menu/Menu.js +8 -4
- package/cjs/Menu/Menu.js.map +1 -1
- package/cjs/Menu/Menu.styles.js +12 -0
- package/cjs/Menu/Menu.styles.js.map +1 -0
- package/cjs/Menu/MenuDropdown/MenuDropdown.js +0 -1
- package/cjs/Menu/MenuDropdown/MenuDropdown.js.map +1 -1
- package/cjs/MultiSelect/MultiSelect.js +14 -3
- package/cjs/MultiSelect/MultiSelect.js.map +1 -1
- package/cjs/MultiSelect/MultiSelect.styles.js +1 -0
- package/cjs/MultiSelect/MultiSelect.styles.js.map +1 -1
- package/cjs/Notification/Notification.styles.js +1 -1
- package/cjs/Notification/Notification.styles.js.map +1 -1
- package/cjs/NumberInput/NumberInput.js +1 -1
- package/cjs/NumberInput/NumberInput.js.map +1 -1
- package/cjs/PasswordInput/PasswordInput.js +6 -3
- package/cjs/PasswordInput/PasswordInput.js.map +1 -1
- package/cjs/Radio/Radio.js +1 -1
- package/cjs/Radio/Radio.js.map +1 -1
- package/cjs/Radio/RadioGroup/RadioGroup.js +7 -3
- package/cjs/Radio/RadioGroup/RadioGroup.js.map +1 -1
- package/cjs/Select/Select.js +4 -2
- package/cjs/Select/Select.js.map +1 -1
- package/cjs/Skeleton/Skeleton.styles.js +2 -1
- package/cjs/Skeleton/Skeleton.styles.js.map +1 -1
- package/cjs/Slider/Thumb/Thumb.styles.js +4 -2
- package/cjs/Slider/Thumb/Thumb.styles.js.map +1 -1
- package/cjs/Spoiler/Spoiler.js +6 -2
- package/cjs/Spoiler/Spoiler.js.map +1 -1
- package/cjs/Spoiler/Spoiler.styles.js +2 -0
- package/cjs/Spoiler/Spoiler.styles.js.map +1 -1
- package/cjs/Switch/Switch.js +5 -1
- package/cjs/Switch/Switch.js.map +1 -1
- package/cjs/Switch/Switch.styles.js +1 -1
- package/cjs/Switch/Switch.styles.js.map +1 -1
- package/cjs/Tooltip/Tooltip.js +5 -2
- package/cjs/Tooltip/Tooltip.js.map +1 -1
- package/cjs/Tooltip/Tooltip.styles.js +1 -1
- package/cjs/Tooltip/Tooltip.styles.js.map +1 -1
- package/cjs/Tooltip/TooltipFloating/TooltipFloating.js +1 -1
- package/cjs/Tooltip/TooltipFloating/TooltipFloating.js.map +1 -1
- package/esm/ActionIcon/ActionIcon.js +2 -2
- package/esm/ActionIcon/ActionIcon.js.map +1 -1
- package/esm/ActionIcon/ActionIcon.styles.js +2 -2
- package/esm/ActionIcon/ActionIcon.styles.js.map +1 -1
- package/esm/AppShell/HorizontalSection/HorizontalSection.js +4 -1
- package/esm/AppShell/HorizontalSection/HorizontalSection.js.map +1 -1
- package/esm/AppShell/HorizontalSection/HorizontalSection.styles.js +11 -2
- package/esm/AppShell/HorizontalSection/HorizontalSection.styles.js.map +1 -1
- package/esm/AppShell/VerticalSection/VerticalSection.js +3 -1
- package/esm/AppShell/VerticalSection/VerticalSection.js.map +1 -1
- package/esm/Burger/Burger.js.map +1 -1
- package/esm/Burger/Burger.styles.js +6 -6
- package/esm/Burger/Burger.styles.js.map +1 -1
- package/esm/Button/Button.styles.js +0 -1
- package/esm/Button/Button.styles.js.map +1 -1
- package/esm/Checkbox/CheckboxGroup/CheckboxGroup.js +8 -4
- package/esm/Checkbox/CheckboxGroup/CheckboxGroup.js.map +1 -1
- package/esm/Checkbox/CheckboxGroup/InputsGroup.js +10 -3
- package/esm/Checkbox/CheckboxGroup/InputsGroup.js.map +1 -1
- package/esm/ColorPicker/ColorPicker.js +2 -2
- package/esm/ColorPicker/ColorPicker.js.map +1 -1
- package/esm/ColorPicker/Swatches/Swatches.js +5 -6
- package/esm/ColorPicker/Swatches/Swatches.js.map +1 -1
- package/esm/Divider/Divider.js +2 -1
- package/esm/Divider/Divider.js.map +1 -1
- package/esm/Divider/Divider.styles.js +1 -1
- package/esm/Divider/Divider.styles.js.map +1 -1
- package/esm/FileButton/FileButton.js +1 -1
- package/esm/FileButton/FileButton.js.map +1 -1
- package/esm/FileInput/FileInput.js +1 -0
- package/esm/FileInput/FileInput.js.map +1 -1
- package/esm/Image/Image.js +6 -3
- package/esm/Image/Image.js.map +1 -1
- package/esm/Input/InputDescription/InputDescription.js +2 -1
- package/esm/Input/InputDescription/InputDescription.js.map +1 -1
- package/esm/Menu/Menu.js +8 -4
- package/esm/Menu/Menu.js.map +1 -1
- package/esm/Menu/Menu.styles.js +8 -0
- package/esm/Menu/Menu.styles.js.map +1 -0
- package/esm/Menu/MenuDropdown/MenuDropdown.js +0 -1
- package/esm/Menu/MenuDropdown/MenuDropdown.js.map +1 -1
- package/esm/MultiSelect/MultiSelect.js +14 -3
- package/esm/MultiSelect/MultiSelect.js.map +1 -1
- package/esm/MultiSelect/MultiSelect.styles.js +1 -0
- package/esm/MultiSelect/MultiSelect.styles.js.map +1 -1
- package/esm/Notification/Notification.styles.js +1 -1
- package/esm/Notification/Notification.styles.js.map +1 -1
- package/esm/NumberInput/NumberInput.js +1 -1
- package/esm/NumberInput/NumberInput.js.map +1 -1
- package/esm/PasswordInput/PasswordInput.js +6 -3
- package/esm/PasswordInput/PasswordInput.js.map +1 -1
- package/esm/Radio/Radio.js +1 -1
- package/esm/Radio/Radio.js.map +1 -1
- package/esm/Radio/RadioGroup/RadioGroup.js +7 -3
- package/esm/Radio/RadioGroup/RadioGroup.js.map +1 -1
- package/esm/Select/Select.js +4 -2
- package/esm/Select/Select.js.map +1 -1
- package/esm/Skeleton/Skeleton.styles.js +2 -1
- package/esm/Skeleton/Skeleton.styles.js.map +1 -1
- package/esm/Slider/Thumb/Thumb.styles.js +4 -2
- package/esm/Slider/Thumb/Thumb.styles.js.map +1 -1
- package/esm/Spoiler/Spoiler.js +6 -2
- package/esm/Spoiler/Spoiler.js.map +1 -1
- package/esm/Spoiler/Spoiler.styles.js +2 -0
- package/esm/Spoiler/Spoiler.styles.js.map +1 -1
- package/esm/Switch/Switch.js +5 -1
- package/esm/Switch/Switch.js.map +1 -1
- package/esm/Switch/Switch.styles.js +1 -1
- package/esm/Switch/Switch.styles.js.map +1 -1
- package/esm/Tooltip/Tooltip.js +5 -2
- package/esm/Tooltip/Tooltip.js.map +1 -1
- package/esm/Tooltip/Tooltip.styles.js +1 -1
- package/esm/Tooltip/Tooltip.styles.js.map +1 -1
- package/esm/Tooltip/TooltipFloating/TooltipFloating.js +1 -1
- package/esm/Tooltip/TooltipFloating/TooltipFloating.js.map +1 -1
- package/lib/Accordion/AccordionControl/AccordionControl.styles.d.ts +2 -2
- package/lib/ActionIcon/ActionIcon.styles.d.ts.map +1 -1
- package/lib/Alert/Alert.styles.d.ts +2 -2
- package/lib/AppShell/HorizontalSection/HorizontalSection.d.ts +3 -1
- package/lib/AppShell/HorizontalSection/HorizontalSection.d.ts.map +1 -1
- package/lib/AppShell/HorizontalSection/HorizontalSection.styles.d.ts +1 -0
- package/lib/AppShell/HorizontalSection/HorizontalSection.styles.d.ts.map +1 -1
- package/lib/AppShell/VerticalSection/VerticalSection.d.ts +2 -0
- package/lib/AppShell/VerticalSection/VerticalSection.d.ts.map +1 -1
- package/lib/Blockquote/Blockquote.styles.d.ts +2 -2
- package/lib/Burger/Burger.d.ts +2 -2
- package/lib/Burger/Burger.d.ts.map +1 -1
- package/lib/Button/Button.styles.d.ts +2 -2
- package/lib/Button/Button.styles.d.ts.map +1 -1
- package/lib/Checkbox/Checkbox.styles.d.ts +2 -2
- package/lib/Checkbox/CheckboxGroup/CheckboxGroup.d.ts +2 -0
- package/lib/Checkbox/CheckboxGroup/CheckboxGroup.d.ts.map +1 -1
- package/lib/Checkbox/CheckboxGroup/InputsGroup.d.ts +2 -1
- package/lib/Checkbox/CheckboxGroup/InputsGroup.d.ts.map +1 -1
- package/lib/Code/Code.styles.d.ts +2 -2
- package/lib/ColorPicker/Swatches/Swatches.d.ts +2 -3
- package/lib/ColorPicker/Swatches/Swatches.d.ts.map +1 -1
- package/lib/ColorSwatch/ColorSwatch.styles.d.ts +2 -2
- package/lib/Divider/Divider.d.ts.map +1 -1
- package/lib/Divider/Divider.styles.d.ts +2 -2
- package/lib/Drawer/Drawer.styles.d.ts +2 -2
- package/lib/FileButton/FileButton.d.ts +1 -1
- package/lib/FileButton/FileButton.d.ts.map +1 -1
- package/lib/FileInput/FileInput.d.ts.map +1 -1
- package/lib/Group/Group.styles.d.ts +2 -2
- package/lib/Image/Image.d.ts.map +1 -1
- package/lib/Input/Input.styles.d.ts +2 -2
- package/lib/Input/InputDescription/InputDescription.d.ts.map +1 -1
- package/lib/Input/use-input-props.d.ts +1 -1
- package/lib/Menu/Menu.d.ts.map +1 -1
- package/lib/Menu/Menu.styles.d.ts +7 -0
- package/lib/Menu/Menu.styles.d.ts.map +1 -0
- package/lib/Menu/MenuDropdown/MenuDropdown.d.ts.map +1 -1
- package/lib/Modal/Modal.styles.d.ts +2 -2
- package/lib/MultiSelect/MultiSelect.d.ts.map +1 -1
- package/lib/MultiSelect/MultiSelect.styles.d.ts.map +1 -1
- package/lib/NavLink/NavLink.styles.d.ts +2 -2
- package/lib/Notification/Notification.styles.d.ts +2 -2
- package/lib/NumberInput/NumberInput.d.ts.map +1 -1
- package/lib/PasswordInput/PasswordInput.d.ts +2 -0
- package/lib/PasswordInput/PasswordInput.d.ts.map +1 -1
- package/lib/Radio/Radio.styles.d.ts +2 -2
- package/lib/Radio/RadioGroup/RadioGroup.d.ts +2 -0
- package/lib/Radio/RadioGroup/RadioGroup.d.ts.map +1 -1
- package/lib/SegmentedControl/SegmentedControl.styles.d.ts +2 -2
- package/lib/Select/Select.d.ts.map +1 -1
- package/lib/Select/SelectItems/SelectItems.styles.d.ts +2 -2
- package/lib/Skeleton/Skeleton.styles.d.ts +2 -2
- package/lib/Skeleton/Skeleton.styles.d.ts.map +1 -1
- package/lib/Slider/Thumb/Thumb.styles.d.ts.map +1 -1
- package/lib/Spoiler/Spoiler.d.ts.map +1 -1
- package/lib/Spoiler/Spoiler.styles.d.ts.map +1 -1
- package/lib/Switch/Switch.d.ts.map +1 -1
- package/lib/Tooltip/Tooltip.d.ts.map +1 -1
- package/lib/Tooltip/Tooltip.styles.d.ts +2 -2
- package/package.json +4 -4
|
@@ -81,8 +81,8 @@ const _ActionIcon = React.forwardRef((props, ref) => {
|
|
|
81
81
|
className: cx(classes.root, className),
|
|
82
82
|
ref,
|
|
83
83
|
disabled: disabled || loading,
|
|
84
|
-
"data-disabled": disabled
|
|
85
|
-
"data-loading": loading
|
|
84
|
+
"data-disabled": disabled || void 0,
|
|
85
|
+
"data-loading": loading || void 0,
|
|
86
86
|
unstyled
|
|
87
87
|
}, others), loading ? loader : children);
|
|
88
88
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActionIcon.js","sources":["../../src/ActionIcon/ActionIcon.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport {\n DefaultProps,\n MantineNumberSize,\n MantineColor,\n Selectors,\n useComponentDefaultProps,\n} from '@mantine/styles';\nimport { createPolymorphicComponent } from '@mantine/utils';\nimport { UnstyledButton } from '../UnstyledButton';\nimport useStyles, { sizes, ActionIconVariant, ActionIconStylesParams } from './ActionIcon.styles';\nimport { Loader, LoaderProps } from '../Loader';\n\nexport type ActionIconStylesNames = Selectors<typeof useStyles>;\n\nexport interface ActionIconProps\n extends DefaultProps<ActionIconStylesNames, ActionIconStylesParams> {\n /** Icon */\n children?: React.ReactNode;\n\n /** Controls appearance */\n variant?: ActionIconVariant;\n\n /** Key of theme.colors */\n color?: MantineColor;\n\n /** Button border-radius from theme or number to set border-radius in px */\n radius?: MantineNumberSize;\n\n /** Predefined icon size or number to set width and height in px */\n size?: MantineNumberSize;\n\n /** Props spread to Loader component */\n loaderProps?: LoaderProps;\n\n /** Indicates loading state */\n loading?: boolean;\n\n /** Indicates disabled state */\n disabled?: boolean;\n}\n\nconst defaultProps: Partial<ActionIconProps> = {\n color: 'gray',\n size: 'md',\n variant: 'subtle',\n loading: false,\n};\n\nexport const _ActionIcon = forwardRef<HTMLButtonElement, ActionIconProps>((props, ref) => {\n const {\n className,\n color,\n children,\n radius,\n size,\n variant,\n disabled,\n loaderProps,\n loading,\n unstyled,\n ...others\n } = useComponentDefaultProps('ActionIcon', defaultProps, props);\n\n const { classes, cx, theme } = useStyles(\n { size, radius, color, variant },\n { name: 'ActionIcon', unstyled }\n );\n const colors = theme.fn.variant({ color, variant: 'light' });\n\n const loader = (\n <Loader color={colors.color} size={theme.fn.size({ size, sizes }) - 12} {...loaderProps} />\n );\n\n return (\n <UnstyledButton\n className={cx(classes.root, className)}\n ref={ref}\n disabled={disabled || loading}\n data-disabled={disabled
|
|
1
|
+
{"version":3,"file":"ActionIcon.js","sources":["../../src/ActionIcon/ActionIcon.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport {\n DefaultProps,\n MantineNumberSize,\n MantineColor,\n Selectors,\n useComponentDefaultProps,\n} from '@mantine/styles';\nimport { createPolymorphicComponent } from '@mantine/utils';\nimport { UnstyledButton } from '../UnstyledButton';\nimport useStyles, { sizes, ActionIconVariant, ActionIconStylesParams } from './ActionIcon.styles';\nimport { Loader, LoaderProps } from '../Loader';\n\nexport type ActionIconStylesNames = Selectors<typeof useStyles>;\n\nexport interface ActionIconProps\n extends DefaultProps<ActionIconStylesNames, ActionIconStylesParams> {\n /** Icon */\n children?: React.ReactNode;\n\n /** Controls appearance */\n variant?: ActionIconVariant;\n\n /** Key of theme.colors */\n color?: MantineColor;\n\n /** Button border-radius from theme or number to set border-radius in px */\n radius?: MantineNumberSize;\n\n /** Predefined icon size or number to set width and height in px */\n size?: MantineNumberSize;\n\n /** Props spread to Loader component */\n loaderProps?: LoaderProps;\n\n /** Indicates loading state */\n loading?: boolean;\n\n /** Indicates disabled state */\n disabled?: boolean;\n}\n\nconst defaultProps: Partial<ActionIconProps> = {\n color: 'gray',\n size: 'md',\n variant: 'subtle',\n loading: false,\n};\n\nexport const _ActionIcon = forwardRef<HTMLButtonElement, ActionIconProps>((props, ref) => {\n const {\n className,\n color,\n children,\n radius,\n size,\n variant,\n disabled,\n loaderProps,\n loading,\n unstyled,\n ...others\n } = useComponentDefaultProps('ActionIcon', defaultProps, props);\n\n const { classes, cx, theme } = useStyles(\n { size, radius, color, variant },\n { name: 'ActionIcon', unstyled }\n );\n const colors = theme.fn.variant({ color, variant: 'light' });\n\n const loader = (\n <Loader color={colors.color} size={theme.fn.size({ size, sizes }) - 12} {...loaderProps} />\n );\n\n return (\n <UnstyledButton\n className={cx(classes.root, className)}\n ref={ref}\n disabled={disabled || loading}\n data-disabled={disabled || undefined}\n data-loading={loading || undefined}\n unstyled={unstyled}\n {...others}\n >\n {loading ? loader : children}\n </UnstyledButton>\n );\n});\n\n_ActionIcon.displayName = '@mantine/core/ActionIcon';\n\nexport const ActionIcon = createPolymorphicComponent<'button', ActionIconProps>(_ActionIcon);\n"],"names":["forwardRef","useComponentDefaultProps","useStyles","React","Loader","sizes","UnstyledButton","createPolymorphicComponent"],"mappings":"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"}
|
|
@@ -62,8 +62,8 @@ var useStyles = styles.createStyles((theme, { color, size, radius, variant }) =>
|
|
|
62
62
|
"&[data-disabled]": {
|
|
63
63
|
color: theme.colors.gray[theme.colorScheme === "dark" ? 6 : 4],
|
|
64
64
|
cursor: "not-allowed",
|
|
65
|
-
backgroundColor: theme.fn.themeColor("gray", theme.colorScheme === "dark" ? 8 : 1),
|
|
66
|
-
borderColor: theme.fn.themeColor("gray", theme.colorScheme === "dark" ? 8 : 1),
|
|
65
|
+
backgroundColor: variant === "transparent" ? void 0 : theme.fn.themeColor("gray", theme.colorScheme === "dark" ? 8 : 1),
|
|
66
|
+
borderColor: variant === "transparent" ? void 0 : theme.fn.themeColor("gray", theme.colorScheme === "dark" ? 8 : 1),
|
|
67
67
|
"&:active": {
|
|
68
68
|
transform: "none"
|
|
69
69
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActionIcon.styles.js","sources":["../../src/ActionIcon/ActionIcon.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize, MantineColor, MantineTheme } from '@mantine/styles';\n\nexport type ActionIconVariant =\n | 'subtle'\n | 'filled'\n | 'outline'\n | 'light'\n | 'default'\n | 'transparent';\n\nexport interface ActionIconStylesParams {\n color: MantineColor;\n size: MantineNumberSize;\n radius: MantineNumberSize;\n variant: ActionIconVariant;\n}\n\nexport const sizes = {\n xs: 18,\n sm: 22,\n md: 28,\n lg: 34,\n xl: 44,\n};\n\ninterface GetVariantStyles {\n variant: ActionIconVariant;\n theme: MantineTheme;\n color: MantineColor;\n}\n\nfunction getVariantStyles({ variant, theme, color }: GetVariantStyles) {\n if (variant === 'transparent') {\n return {\n border: '1px solid transparent',\n color: theme.fn.themeColor(color, theme.colorScheme === 'dark' ? 4 : 7),\n backgroundColor: 'transparent',\n };\n }\n\n const colors = theme.fn.variant({ color, variant });\n\n return {\n backgroundColor: colors.background,\n color: colors.color,\n border: `1px solid ${colors.border}`,\n ...theme.fn.hover({ backgroundColor: colors.hover }),\n };\n}\n\nexport default createStyles((theme, { color, size, radius, variant }: ActionIconStylesParams) => ({\n root: {\n ...getVariantStyles({ variant, theme, color }),\n position: 'relative',\n height: theme.fn.size({ size, sizes }),\n minHeight: theme.fn.size({ size, sizes }),\n width: theme.fn.size({ size, sizes }),\n minWidth: theme.fn.size({ size, sizes }),\n borderRadius: theme.fn.radius(radius),\n padding: 0,\n lineHeight: 1,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n\n '&:active': theme.activeStyles,\n\n '&[data-disabled]': {\n color: theme.colors.gray[theme.colorScheme === 'dark' ? 6 : 4],\n cursor: 'not-allowed',\n backgroundColor: theme.fn.themeColor('gray', theme.colorScheme === 'dark' ? 8 : 1),\n borderColor: theme.fn.themeColor('gray', theme.colorScheme === 'dark' ? 8 : 1),\n\n '&:active': {\n transform: 'none',\n },\n },\n\n '&[data-loading]': {\n pointerEvents: 'none',\n\n '&::before': {\n content: '\"\"',\n position: 'absolute',\n top: -1,\n left: -1,\n right: -1,\n bottom: -1,\n backgroundColor:\n theme.colorScheme === 'dark'\n ? theme.fn.rgba(theme.colors.dark[7], 0.5)\n : 'rgba(255, 255, 255, .5)',\n borderRadius: theme.fn.radius(radius),\n cursor: 'not-allowed',\n },\n },\n },\n}));\n"],"names":["createStyles"],"mappings":"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
|
|
1
|
+
{"version":3,"file":"ActionIcon.styles.js","sources":["../../src/ActionIcon/ActionIcon.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize, MantineColor, MantineTheme } from '@mantine/styles';\n\nexport type ActionIconVariant =\n | 'subtle'\n | 'filled'\n | 'outline'\n | 'light'\n | 'default'\n | 'transparent';\n\nexport interface ActionIconStylesParams {\n color: MantineColor;\n size: MantineNumberSize;\n radius: MantineNumberSize;\n variant: ActionIconVariant;\n}\n\nexport const sizes = {\n xs: 18,\n sm: 22,\n md: 28,\n lg: 34,\n xl: 44,\n};\n\ninterface GetVariantStyles {\n variant: ActionIconVariant;\n theme: MantineTheme;\n color: MantineColor;\n}\n\nfunction getVariantStyles({ variant, theme, color }: GetVariantStyles) {\n if (variant === 'transparent') {\n return {\n border: '1px solid transparent',\n color: theme.fn.themeColor(color, theme.colorScheme === 'dark' ? 4 : 7),\n backgroundColor: 'transparent',\n };\n }\n\n const colors = theme.fn.variant({ color, variant });\n\n return {\n backgroundColor: colors.background,\n color: colors.color,\n border: `1px solid ${colors.border}`,\n ...theme.fn.hover({ backgroundColor: colors.hover }),\n };\n}\n\nexport default createStyles((theme, { color, size, radius, variant }: ActionIconStylesParams) => ({\n root: {\n ...getVariantStyles({ variant, theme, color }),\n position: 'relative',\n height: theme.fn.size({ size, sizes }),\n minHeight: theme.fn.size({ size, sizes }),\n width: theme.fn.size({ size, sizes }),\n minWidth: theme.fn.size({ size, sizes }),\n borderRadius: theme.fn.radius(radius),\n padding: 0,\n lineHeight: 1,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n\n '&:active': theme.activeStyles,\n\n '&[data-disabled]': {\n color: theme.colors.gray[theme.colorScheme === 'dark' ? 6 : 4],\n cursor: 'not-allowed',\n backgroundColor:\n variant === 'transparent'\n ? undefined\n : theme.fn.themeColor('gray', theme.colorScheme === 'dark' ? 8 : 1),\n borderColor:\n variant === 'transparent'\n ? undefined\n : theme.fn.themeColor('gray', theme.colorScheme === 'dark' ? 8 : 1),\n\n '&:active': {\n transform: 'none',\n },\n },\n\n '&[data-loading]': {\n pointerEvents: 'none',\n\n '&::before': {\n content: '\"\"',\n position: 'absolute',\n top: -1,\n left: -1,\n right: -1,\n bottom: -1,\n backgroundColor:\n theme.colorScheme === 'dark'\n ? theme.fn.rgba(theme.colors.dark[7], 0.5)\n : 'rgba(255, 255, 255, .5)',\n borderRadius: theme.fn.radius(radius),\n cursor: 'not-allowed',\n },\n },\n },\n}));\n"],"names":["createStyles"],"mappings":"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"}
|
|
@@ -50,6 +50,7 @@ const HorizontalSection = React.forwardRef((_a, ref) => {
|
|
|
50
50
|
zIndex = styles.getDefaultZIndex("app"),
|
|
51
51
|
hiddenBreakpoint = "md",
|
|
52
52
|
hidden = false,
|
|
53
|
+
withBorder = true,
|
|
53
54
|
className,
|
|
54
55
|
classNames,
|
|
55
56
|
styles: styles$1,
|
|
@@ -65,6 +66,7 @@ const HorizontalSection = React.forwardRef((_a, ref) => {
|
|
|
65
66
|
"zIndex",
|
|
66
67
|
"hiddenBreakpoint",
|
|
67
68
|
"hidden",
|
|
69
|
+
"withBorder",
|
|
68
70
|
"className",
|
|
69
71
|
"classNames",
|
|
70
72
|
"styles",
|
|
@@ -81,7 +83,8 @@ const HorizontalSection = React.forwardRef((_a, ref) => {
|
|
|
81
83
|
position,
|
|
82
84
|
hiddenBreakpoint,
|
|
83
85
|
zIndex: ctx.zIndex || zIndex,
|
|
84
|
-
section
|
|
86
|
+
section,
|
|
87
|
+
withBorder
|
|
85
88
|
}, { classNames, styles: styles$1, name: __staticSelector, unstyled });
|
|
86
89
|
const breakpoints = getSortedBreakpoints.getSortedBreakpoints(width, theme).reduce((acc, [breakpoint, breakpointSize]) => {
|
|
87
90
|
acc[`@media (min-width: ${breakpoint + 1}px)`] = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HorizontalSection.js","sources":["../../../src/AppShell/HorizontalSection/HorizontalSection.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { DefaultProps, MantineNumberSize, getDefaultZIndex, Global } from '@mantine/styles';\nimport { Box } from '../../Box';\nimport { useAppShellContext } from '../AppShell.context';\nimport { getSortedBreakpoints } from './get-sorted-breakpoints/get-sorted-breakpoints';\nimport useStyles, {\n HorizontalSectionPosition,\n HorizontalSectionWidth,\n} from './HorizontalSection.styles';\n\nexport interface HorizontalSectionSharedProps extends DefaultProps {\n /** Component width with breakpoints */\n width?: HorizontalSectionWidth;\n\n /** Component height */\n height?: string | number;\n\n /** HorizontalSection content */\n children: React.ReactNode;\n\n /** Set position to fixed */\n fixed?: boolean;\n\n /** Position for fixed variant */\n position?: HorizontalSectionPosition;\n\n /** Breakpoint at which component will be hidden if hidden prop is true */\n hiddenBreakpoint?: MantineNumberSize;\n\n /** Set to true to hide component at hiddenBreakpoint */\n hidden?: boolean;\n\n /** z-index */\n zIndex?: React.CSSProperties['zIndex'];\n}\n\nexport interface HorizontalSectionProps\n extends HorizontalSectionSharedProps,\n Omit<React.ComponentPropsWithRef<'nav'>, 'children'> {\n section: 'navbar' | 'aside';\n __staticSelector: string;\n}\n\nexport const HorizontalSection = forwardRef<HTMLElement, HorizontalSectionProps>(\n (\n {\n width,\n height,\n fixed = false,\n position,\n zIndex = getDefaultZIndex('app'),\n hiddenBreakpoint = 'md',\n hidden = false,\n className,\n classNames,\n styles,\n children,\n section,\n __staticSelector,\n unstyled,\n ...others\n }: HorizontalSectionProps,\n ref\n ) => {\n const ctx = useAppShellContext();\n\n const { classes, cx, theme } = useStyles(\n {\n width,\n height,\n fixed: ctx.fixed || fixed,\n position,\n hiddenBreakpoint,\n zIndex: ctx.zIndex || zIndex,\n section,\n },\n { classNames, styles, name: __staticSelector, unstyled }\n );\n\n const breakpoints = getSortedBreakpoints(width, theme).reduce(\n (acc, [breakpoint, breakpointSize]) => {\n acc[`@media (min-width: ${breakpoint + 1}px)`] = {\n [`--mantine-${section}-width`]: `${breakpointSize}px`,\n };\n\n return acc;\n },\n {}\n );\n\n return (\n <Box\n component={section === 'navbar' ? 'nav' : 'aside'}\n ref={ref}\n data-hidden={hidden || undefined}\n className={cx(classes.root, className)}\n {...others}\n >\n {children}\n\n <Global\n styles={() => ({\n ':root': {\n [`--mantine-${section}-width`]: width?.base ? `${width.base}px` : '0px',\n ...breakpoints,\n },\n })}\n />\n </Box>\n );\n }\n);\n\nHorizontalSection.displayName = '@mantine/core/HorizontalSection';\n"],"names":["forwardRef","getDefaultZIndex","styles","useAppShellContext","useStyles","getSortedBreakpoints","React","Box","Global"],"mappings":";;;;;;;;;;;;;;;AAAA,IAAI,SAAS,GAAG,MAAM,CAAC,cAAc,CAAC;AACtC,IAAI,mBAAmB,GAAG,MAAM,CAAC,qBAAqB,CAAC;AACvD,IAAI,YAAY,GAAG,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC;AACnD,IAAI,YAAY,GAAG,MAAM,CAAC,SAAS,CAAC,oBAAoB,CAAC;AACzD,IAAI,eAAe,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,KAAK,KAAK,GAAG,IAAI,GAAG,GAAG,SAAS,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,GAAG,GAAG,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;AAChK,IAAI,cAAc,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK;AAC/B,EAAE,KAAK,IAAI,IAAI,IAAI,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC;AAChC,IAAI,IAAI,YAAY,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC;AAClC,MAAM,eAAe,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;AACxC,EAAE,IAAI,mBAAmB;AACzB,IAAI,KAAK,IAAI,IAAI,IAAI,mBAAmB,CAAC,CAAC,CAAC,EAAE;AAC7C,MAAM,IAAI,YAAY,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC;AACpC,QAAQ,eAAe,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;AAC1C,KAAK;AACL,EAAE,OAAO,CAAC,CAAC;AACX,CAAC,CAAC;AACF,IAAI,SAAS,GAAG,CAAC,MAAM,EAAE,OAAO,KAAK;AACrC,EAAE,IAAI,MAAM,GAAG,EAAE,CAAC;AAClB,EAAE,KAAK,IAAI,IAAI,IAAI,MAAM;AACzB,IAAI,IAAI,YAAY,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,IAAI,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;AACpE,MAAM,MAAM,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;AAClC,EAAE,IAAI,MAAM,IAAI,IAAI,IAAI,mBAAmB;AAC3C,IAAI,KAAK,IAAI,IAAI,IAAI,mBAAmB,CAAC,MAAM,CAAC,EAAE;AAClD,MAAM,IAAI,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,YAAY,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC;AACtE,QAAQ,MAAM,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;AACpC,KAAK;AACL,EAAE,OAAO,MAAM,CAAC;AAChB,CAAC,CAAC;AAOU,MAAC,iBAAiB,GAAGA,gBAAU,CAAC,CAAC,EAAE,EAAE,GAAG,KAAK;AACzD,EAAE,IAAI,EAAE,GAAG,EAAE,EAAE;AACf,IAAI,KAAK;AACT,IAAI,MAAM;AACV,IAAI,KAAK,GAAG,KAAK;AACjB,IAAI,QAAQ;AACZ,IAAI,MAAM,GAAGC,uBAAgB,CAAC,KAAK,CAAC;AACpC,IAAI,gBAAgB,GAAG,IAAI;AAC3B,IAAI,MAAM,GAAG,KAAK;AAClB,IAAI,SAAS;AACb,IAAI,UAAU;AACd,YAAIC,QAAM;AACV,IAAI,QAAQ;AACZ,IAAI,OAAO;AACX,IAAI,gBAAgB;AACpB,IAAI,QAAQ;AACZ,GAAG,GAAG,EAAE,EAAE,MAAM,GAAG,SAAS,CAAC,EAAE,EAAE;AACjC,IAAI,OAAO;AACX,IAAI,QAAQ;AACZ,IAAI,OAAO;AACX,IAAI,UAAU;AACd,IAAI,QAAQ;AACZ,IAAI,kBAAkB;AACtB,IAAI,QAAQ;AACZ,IAAI,WAAW;AACf,IAAI,YAAY;AAChB,IAAI,QAAQ;AACZ,IAAI,UAAU;AACd,IAAI,SAAS;AACb,IAAI,kBAAkB;AACtB,IAAI,UAAU;AACd,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,GAAG,GAAGC,mCAAkB,EAAE,CAAC;AACnC,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,EAAE,KAAK,EAAE,GAAGC,mCAAS,CAAC;AAC3C,IAAI,KAAK;AACT,IAAI,MAAM;AACV,IAAI,KAAK,EAAE,GAAG,CAAC,KAAK,IAAI,KAAK;AAC7B,IAAI,QAAQ;AACZ,IAAI,gBAAgB;AACpB,IAAI,MAAM,EAAE,GAAG,CAAC,MAAM,IAAI,MAAM;AAChC,IAAI,OAAO;AACX,GAAG,EAAE,EAAE,UAAU,UAAEF,QAAM,EAAE,IAAI,EAAE,gBAAgB,EAAE,QAAQ,EAAE,CAAC,CAAC;AAC/D,EAAE,MAAM,WAAW,GAAGG,yCAAoB,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,CAAC,UAAU,EAAE,cAAc,CAAC,KAAK;AACvG,IAAI,GAAG,CAAC,CAAC,mBAAmB,EAAE,UAAU,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG;AACrD,MAAM,CAAC,CAAC,UAAU,EAAE,OAAO,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE,cAAc,CAAC,EAAE,CAAC;AAC3D,KAAK,CAAC;AACN,IAAI,OAAO,GAAG,CAAC;AACf,GAAG,EAAE,EAAE,CAAC,CAAC;AACT,EAAE,uBAAuBC,cAAK,CAAC,aAAa,CAACC,OAAG,EAAE,cAAc,CAAC;AACjE,IAAI,SAAS,EAAE,OAAO,KAAK,QAAQ,GAAG,KAAK,GAAG,OAAO;AACrD,IAAI,GAAG;AACP,IAAI,aAAa,EAAE,MAAM,IAAI,KAAK,CAAC;AACnC,IAAI,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,SAAS,CAAC;AAC1C,GAAG,EAAE,MAAM,CAAC,EAAE,QAAQ,kBAAkBD,cAAK,CAAC,aAAa,CAACE,aAAM,EAAE;AACpE,IAAI,MAAM,EAAE,OAAO;AACnB,MAAM,OAAO,EAAE,cAAc,CAAC;AAC9B,QAAQ,CAAC,CAAC,UAAU,EAAE,OAAO,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,KAAK,CAAC,IAAI,IAAI,CAAC,EAAE,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,GAAG,KAAK;AACzG,OAAO,EAAE,WAAW,CAAC;AACrB,KAAK,CAAC;AACN,GAAG,CAAC,CAAC,CAAC;AACN,CAAC,EAAE;AACH,iBAAiB,CAAC,WAAW,GAAG,iCAAiC;;;;"}
|
|
1
|
+
{"version":3,"file":"HorizontalSection.js","sources":["../../../src/AppShell/HorizontalSection/HorizontalSection.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { DefaultProps, MantineNumberSize, getDefaultZIndex, Global } from '@mantine/styles';\nimport { Box } from '../../Box';\nimport { useAppShellContext } from '../AppShell.context';\nimport { getSortedBreakpoints } from './get-sorted-breakpoints/get-sorted-breakpoints';\nimport useStyles, {\n HorizontalSectionPosition,\n HorizontalSectionWidth,\n} from './HorizontalSection.styles';\n\nexport interface HorizontalSectionSharedProps extends DefaultProps {\n /** Component width with breakpoints */\n width?: HorizontalSectionWidth;\n\n /** Component height */\n height?: string | number;\n\n /** HorizontalSection content */\n children: React.ReactNode;\n\n /** Border */\n withBorder?: boolean;\n\n /** Set position to fixed */\n fixed?: boolean;\n\n /** Position for fixed variant */\n position?: HorizontalSectionPosition;\n\n /** Breakpoint at which component will be hidden if hidden prop is true */\n hiddenBreakpoint?: MantineNumberSize;\n\n /** Set to true to hide component at hiddenBreakpoint */\n hidden?: boolean;\n\n /** z-index */\n zIndex?: React.CSSProperties['zIndex'];\n}\n\nexport interface HorizontalSectionProps\n extends HorizontalSectionSharedProps,\n Omit<React.ComponentPropsWithRef<'nav'>, 'children'> {\n section: 'navbar' | 'aside';\n __staticSelector: string;\n}\n\nexport const HorizontalSection = forwardRef<HTMLElement, HorizontalSectionProps>(\n (\n {\n width,\n height,\n fixed = false,\n position,\n zIndex = getDefaultZIndex('app'),\n hiddenBreakpoint = 'md',\n hidden = false,\n withBorder = true,\n className,\n classNames,\n styles,\n children,\n section,\n __staticSelector,\n unstyled,\n ...others\n }: HorizontalSectionProps,\n ref\n ) => {\n const ctx = useAppShellContext();\n\n const { classes, cx, theme } = useStyles(\n {\n width,\n height,\n fixed: ctx.fixed || fixed,\n position,\n hiddenBreakpoint,\n zIndex: ctx.zIndex || zIndex,\n section,\n withBorder,\n },\n { classNames, styles, name: __staticSelector, unstyled }\n );\n\n const breakpoints = getSortedBreakpoints(width, theme).reduce(\n (acc, [breakpoint, breakpointSize]) => {\n acc[`@media (min-width: ${breakpoint + 1}px)`] = {\n [`--mantine-${section}-width`]: `${breakpointSize}px`,\n };\n\n return acc;\n },\n {}\n );\n\n return (\n <Box\n component={section === 'navbar' ? 'nav' : 'aside'}\n ref={ref}\n data-hidden={hidden || undefined}\n className={cx(classes.root, className)}\n {...others}\n >\n {children}\n\n <Global\n styles={() => ({\n ':root': {\n [`--mantine-${section}-width`]: width?.base ? `${width.base}px` : '0px',\n ...breakpoints,\n },\n })}\n />\n </Box>\n );\n }\n);\n\nHorizontalSection.displayName = '@mantine/core/HorizontalSection';\n"],"names":["forwardRef","getDefaultZIndex","styles","useAppShellContext","useStyles","getSortedBreakpoints","React","Box","Global"],"mappings":"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"}
|
|
@@ -24,7 +24,16 @@ var __spreadValues = (a, b) => {
|
|
|
24
24
|
return a;
|
|
25
25
|
};
|
|
26
26
|
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
27
|
-
var useStyles = styles.createStyles((theme, {
|
|
27
|
+
var useStyles = styles.createStyles((theme, {
|
|
28
|
+
height,
|
|
29
|
+
width,
|
|
30
|
+
fixed,
|
|
31
|
+
position,
|
|
32
|
+
hiddenBreakpoint,
|
|
33
|
+
zIndex,
|
|
34
|
+
section,
|
|
35
|
+
withBorder
|
|
36
|
+
}) => {
|
|
28
37
|
const breakpoints = typeof width === "object" && width !== null ? getSortedBreakpoints.getSortedBreakpoints(width, theme).reduce((acc, [breakpoint, breakpointSize]) => {
|
|
29
38
|
acc[`@media (min-width: ${breakpoint + 1}px)`] = {
|
|
30
39
|
width: breakpointSize,
|
|
@@ -43,7 +52,7 @@ var useStyles = styles.createStyles((theme, { height, width, fixed, position, hi
|
|
|
43
52
|
display: "flex",
|
|
44
53
|
flexDirection: "column",
|
|
45
54
|
backgroundColor: theme.colorScheme === "dark" ? theme.colors.dark[7] : theme.white,
|
|
46
|
-
[section === "navbar" ? "borderRight" : "borderLeft"]: `1px solid ${theme.colorScheme === "dark" ? theme.colors.dark[5] : theme.colors.gray[2]}`
|
|
55
|
+
[withBorder && section === "navbar" ? "borderRight" : "borderLeft"]: `1px solid ${theme.colorScheme === "dark" ? theme.colors.dark[5] : theme.colors.gray[2]}`
|
|
47
56
|
}), breakpoints), {
|
|
48
57
|
"&[data-hidden]": {
|
|
49
58
|
[`@media (max-width: ${theme.fn.size({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HorizontalSection.styles.js","sources":["../../../src/AppShell/HorizontalSection/HorizontalSection.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize } from '@mantine/styles';\nimport { getSortedBreakpoints } from './get-sorted-breakpoints/get-sorted-breakpoints';\n\nexport type HorizontalSectionWidth = Partial<Record<string, string | number>>;\n\nexport interface HorizontalSectionPosition {\n top?: number;\n left?: number;\n bottom?: number;\n right?: number;\n}\n\ninterface HorizontalSectionStyles {\n width: Partial<Record<string, string | number>>;\n height: string | number;\n position: HorizontalSectionPosition;\n hiddenBreakpoint: MantineNumberSize;\n fixed: boolean;\n zIndex: React.CSSProperties['zIndex'];\n section: 'navbar' | 'aside';\n}\n\nexport default createStyles(\n (\n theme,\n {
|
|
1
|
+
{"version":3,"file":"HorizontalSection.styles.js","sources":["../../../src/AppShell/HorizontalSection/HorizontalSection.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize } from '@mantine/styles';\nimport { getSortedBreakpoints } from './get-sorted-breakpoints/get-sorted-breakpoints';\n\nexport type HorizontalSectionWidth = Partial<Record<string, string | number>>;\n\nexport interface HorizontalSectionPosition {\n top?: number;\n left?: number;\n bottom?: number;\n right?: number;\n}\n\ninterface HorizontalSectionStyles {\n width: Partial<Record<string, string | number>>;\n height: string | number;\n position: HorizontalSectionPosition;\n hiddenBreakpoint: MantineNumberSize;\n fixed: boolean;\n zIndex: React.CSSProperties['zIndex'];\n section: 'navbar' | 'aside';\n withBorder: boolean;\n}\n\nexport default createStyles(\n (\n theme,\n {\n height,\n width,\n fixed,\n position,\n hiddenBreakpoint,\n zIndex,\n section,\n withBorder,\n }: HorizontalSectionStyles\n ) => {\n const breakpoints =\n typeof width === 'object' && width !== null\n ? getSortedBreakpoints(width, theme).reduce((acc, [breakpoint, breakpointSize]) => {\n acc[`@media (min-width: ${breakpoint + 1}px)`] = {\n width: breakpointSize,\n minWidth: breakpointSize,\n };\n\n return acc;\n }, {})\n : null;\n\n return {\n root: {\n ...theme.fn.fontStyles(),\n ...position,\n top: position?.top || 'var(--mantine-header-height)',\n zIndex,\n height:\n height ||\n 'calc(100vh - var(--mantine-header-height, 0px) - var(--mantine-footer-height, 0px))',\n width: width?.base || '100%',\n position: fixed ? 'fixed' : 'static',\n boxSizing: 'border-box',\n display: 'flex',\n flexDirection: 'column',\n backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[7] : theme.white,\n [withBorder && section === 'navbar' ? 'borderRight' : 'borderLeft']: `1px solid ${\n theme.colorScheme === 'dark' ? theme.colors.dark[5] : theme.colors.gray[2]\n }`,\n ...breakpoints,\n\n '&[data-hidden]': {\n [`@media (max-width: ${theme.fn.size({\n size: hiddenBreakpoint,\n sizes: theme.breakpoints,\n })}px)`]: {\n display: 'none',\n },\n },\n },\n };\n }\n);\n"],"names":["createStyles","getSortedBreakpoints"],"mappings":";;;;;;;AAAA,IAAI,SAAS,GAAG,MAAM,CAAC,cAAc,CAAC;AACtC,IAAI,UAAU,GAAG,MAAM,CAAC,gBAAgB,CAAC;AACzC,IAAI,iBAAiB,GAAG,MAAM,CAAC,yBAAyB,CAAC;AACzD,IAAI,mBAAmB,GAAG,MAAM,CAAC,qBAAqB,CAAC;AACvD,IAAI,YAAY,GAAG,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC;AACnD,IAAI,YAAY,GAAG,MAAM,CAAC,SAAS,CAAC,oBAAoB,CAAC;AACzD,IAAI,eAAe,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,KAAK,KAAK,GAAG,IAAI,GAAG,GAAG,SAAS,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,GAAG,GAAG,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;AAChK,IAAI,cAAc,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK;AAC/B,EAAE,KAAK,IAAI,IAAI,IAAI,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC;AAChC,IAAI,IAAI,YAAY,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC;AAClC,MAAM,eAAe,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;AACxC,EAAE,IAAI,mBAAmB;AACzB,IAAI,KAAK,IAAI,IAAI,IAAI,mBAAmB,CAAC,CAAC,CAAC,EAAE;AAC7C,MAAM,IAAI,YAAY,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC;AACpC,QAAQ,eAAe,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;AAC1C,KAAK;AACL,EAAE,OAAO,CAAC,CAAC;AACX,CAAC,CAAC;AACF,IAAI,aAAa,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK,UAAU,CAAC,CAAC,EAAE,iBAAiB,CAAC,CAAC,CAAC,CAAC,CAAC;AAGlE,gBAAeA,mBAAY,CAAC,CAAC,KAAK,EAAE;AACpC,EAAE,MAAM;AACR,EAAE,KAAK;AACP,EAAE,KAAK;AACP,EAAE,QAAQ;AACV,EAAE,gBAAgB;AAClB,EAAE,MAAM;AACR,EAAE,OAAO;AACT,EAAE,UAAU;AACZ,CAAC,KAAK;AACN,EAAE,MAAM,WAAW,GAAG,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAK,KAAK,IAAI,GAAGC,yCAAoB,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,CAAC,UAAU,EAAE,cAAc,CAAC,KAAK;AACrJ,IAAI,GAAG,CAAC,CAAC,mBAAmB,EAAE,UAAU,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG;AACrD,MAAM,KAAK,EAAE,cAAc;AAC3B,MAAM,QAAQ,EAAE,cAAc;AAC9B,KAAK,CAAC;AACN,IAAI,OAAO,GAAG,CAAC;AACf,GAAG,EAAE,EAAE,CAAC,GAAG,IAAI,CAAC;AAChB,EAAE,OAAO;AACT,IAAI,IAAI,EAAE,aAAa,CAAC,cAAc,CAAC,aAAa,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,EAAE,CAAC,EAAE,QAAQ,CAAC,EAAE;AAC1H,MAAM,GAAG,EAAE,CAAC,QAAQ,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,QAAQ,CAAC,GAAG,KAAK,8BAA8B;AACvF,MAAM,MAAM;AACZ,MAAM,MAAM,EAAE,MAAM,IAAI,qFAAqF;AAC7G,MAAM,KAAK,EAAE,CAAC,KAAK,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,KAAK,CAAC,IAAI,KAAK,MAAM;AAC5D,MAAM,QAAQ,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ;AAC1C,MAAM,SAAS,EAAE,YAAY;AAC7B,MAAM,OAAO,EAAE,MAAM;AACrB,MAAM,aAAa,EAAE,QAAQ;AAC7B,MAAM,eAAe,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,KAAK;AACxF,MAAM,CAAC,UAAU,IAAI,OAAO,KAAK,QAAQ,GAAG,aAAa,GAAG,YAAY,GAAG,CAAC,UAAU,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;AACpK,KAAK,CAAC,EAAE,WAAW,CAAC,EAAE;AACtB,MAAM,gBAAgB,EAAE;AACxB,QAAQ,CAAC,CAAC,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC;AAC7C,UAAU,IAAI,EAAE,gBAAgB;AAChC,UAAU,KAAK,EAAE,KAAK,CAAC,WAAW;AAClC,SAAS,CAAC,CAAC,GAAG,CAAC,GAAG;AAClB,UAAU,OAAO,EAAE,MAAM;AACzB,SAAS;AACT,OAAO;AACP,KAAK,CAAC;AACN,GAAG,CAAC;AACJ,CAAC,CAAC;;;;"}
|
|
@@ -48,6 +48,7 @@ const VerticalSection = React.forwardRef((_a, ref) => {
|
|
|
48
48
|
styles: styles$1,
|
|
49
49
|
height,
|
|
50
50
|
fixed = false,
|
|
51
|
+
withBorder = true,
|
|
51
52
|
position,
|
|
52
53
|
zIndex = styles.getDefaultZIndex("app"),
|
|
53
54
|
section,
|
|
@@ -60,6 +61,7 @@ const VerticalSection = React.forwardRef((_a, ref) => {
|
|
|
60
61
|
"styles",
|
|
61
62
|
"height",
|
|
62
63
|
"fixed",
|
|
64
|
+
"withBorder",
|
|
63
65
|
"position",
|
|
64
66
|
"zIndex",
|
|
65
67
|
"section",
|
|
@@ -72,7 +74,7 @@ const VerticalSection = React.forwardRef((_a, ref) => {
|
|
|
72
74
|
fixed: ctx.fixed || fixed,
|
|
73
75
|
position,
|
|
74
76
|
zIndex: ctx.zIndex || zIndex,
|
|
75
|
-
borderPosition: section === "header" ? "bottom" : "top"
|
|
77
|
+
borderPosition: withBorder && section === "header" ? "bottom" : "top"
|
|
76
78
|
}, { name: __staticSelector, classNames, styles: styles$1, unstyled });
|
|
77
79
|
return /* @__PURE__ */ React__default.createElement(Box.Box, __spreadValues({
|
|
78
80
|
component: section === "header" ? "header" : "footer",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VerticalSection.js","sources":["../../../src/AppShell/VerticalSection/VerticalSection.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { DefaultProps, getDefaultZIndex, Global } from '@mantine/styles';\nimport { Box } from '../../Box';\nimport { useAppShellContext } from '../AppShell.context';\nimport useStyles, { VerticalSectionPosition } from './VerticalSection.styles';\n\nexport interface VerticalSectionSharedProps extends DefaultProps {\n /** Section content */\n children: React.ReactNode;\n\n /** Section height */\n height: number | string;\n\n /** Changes position to fixed, controlled by AppShell component if rendered inside */\n fixed?: boolean;\n\n /** Control top, left, right or bottom position values, controlled by AppShell component if rendered inside */\n position?: VerticalSectionPosition;\n\n /** z-index */\n zIndex?: React.CSSProperties['zIndex'];\n}\n\ninterface VerticalSectionProps\n extends VerticalSectionSharedProps,\n Omit<React.ComponentPropsWithoutRef<'div'>, 'children'> {\n section: 'header' | 'footer';\n __staticSelector: string;\n}\n\nexport const VerticalSection = forwardRef<HTMLElement, VerticalSectionProps>(\n (\n {\n children,\n className,\n classNames,\n styles,\n height,\n fixed = false,\n position,\n zIndex = getDefaultZIndex('app'),\n section,\n unstyled,\n __staticSelector,\n ...others\n }: VerticalSectionProps,\n ref\n ) => {\n const ctx = useAppShellContext();\n\n const { classes, cx } = useStyles(\n {\n height,\n fixed: ctx.fixed || fixed,\n position,\n zIndex: ctx.zIndex || zIndex,\n borderPosition: section === 'header' ? 'bottom' : 'top',\n },\n { name: __staticSelector, classNames, styles, unstyled }\n );\n\n return (\n <Box\n component={section === 'header' ? 'header' : 'footer'}\n className={cx(classes.root, className)}\n ref={ref}\n {...others}\n >\n {children}\n <Global\n styles={() => ({\n ':root': {\n [`--mantine-${section}-height`]: `${height}px`,\n },\n })}\n />\n </Box>\n );\n }\n);\n\nVerticalSection.displayName = '@mantine/core/VerticalSection';\n"],"names":["forwardRef","styles","getDefaultZIndex","useAppShellContext","useStyles","React","Box","Global"],"mappings":"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
|
|
1
|
+
{"version":3,"file":"VerticalSection.js","sources":["../../../src/AppShell/VerticalSection/VerticalSection.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { DefaultProps, getDefaultZIndex, Global } from '@mantine/styles';\nimport { Box } from '../../Box';\nimport { useAppShellContext } from '../AppShell.context';\nimport useStyles, { VerticalSectionPosition } from './VerticalSection.styles';\n\nexport interface VerticalSectionSharedProps extends DefaultProps {\n /** Section content */\n children: React.ReactNode;\n\n /** Section height */\n height: number | string;\n\n /** Border */\n withBorder?: boolean;\n\n /** Changes position to fixed, controlled by AppShell component if rendered inside */\n fixed?: boolean;\n\n /** Control top, left, right or bottom position values, controlled by AppShell component if rendered inside */\n position?: VerticalSectionPosition;\n\n /** z-index */\n zIndex?: React.CSSProperties['zIndex'];\n}\n\ninterface VerticalSectionProps\n extends VerticalSectionSharedProps,\n Omit<React.ComponentPropsWithoutRef<'div'>, 'children'> {\n section: 'header' | 'footer';\n __staticSelector: string;\n}\n\nexport const VerticalSection = forwardRef<HTMLElement, VerticalSectionProps>(\n (\n {\n children,\n className,\n classNames,\n styles,\n height,\n fixed = false,\n withBorder = true,\n position,\n zIndex = getDefaultZIndex('app'),\n section,\n unstyled,\n __staticSelector,\n ...others\n }: VerticalSectionProps,\n ref\n ) => {\n const ctx = useAppShellContext();\n\n const { classes, cx } = useStyles(\n {\n height,\n fixed: ctx.fixed || fixed,\n position,\n zIndex: ctx.zIndex || zIndex,\n borderPosition: withBorder && section === 'header' ? 'bottom' : 'top',\n },\n { name: __staticSelector, classNames, styles, unstyled }\n );\n\n return (\n <Box\n component={section === 'header' ? 'header' : 'footer'}\n className={cx(classes.root, className)}\n ref={ref}\n {...others}\n >\n {children}\n <Global\n styles={() => ({\n ':root': {\n [`--mantine-${section}-height`]: `${height}px`,\n },\n })}\n />\n </Box>\n );\n }\n);\n\nVerticalSection.displayName = '@mantine/core/VerticalSection';\n"],"names":["forwardRef","styles","getDefaultZIndex","useAppShellContext","useStyles","React","Box","Global"],"mappings":"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"}
|
package/cjs/Burger/Burger.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Burger.js","sources":["../../src/Burger/Burger.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport {\n DefaultProps,\n MantineNumberSize,\n
|
|
1
|
+
{"version":3,"file":"Burger.js","sources":["../../src/Burger/Burger.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport {\n DefaultProps,\n MantineNumberSize,\n Selectors,\n useComponentDefaultProps,\n} from '@mantine/styles';\nimport { UnstyledButton } from '../UnstyledButton';\nimport useStyles, { BurgerStylesParams } from './Burger.styles';\n\nexport type BurgerStylesNames = Selectors<typeof useStyles>;\n\nexport interface BurgerProps\n extends DefaultProps<BurgerStylesNames, BurgerStylesParams>,\n React.ComponentPropsWithoutRef<'button'> {\n /** Burger state: true for cross, false for burger */\n opened: boolean;\n\n /** Burger color value, not connected to theme.colors, defaults to theme.black with light color scheme and theme.white with dark */\n color?: string;\n\n /** Predefined burger size or number to set width and height in px */\n size?: MantineNumberSize;\n\n /** Transition duration in ms */\n transitionDuration?: number;\n}\n\nconst defaultProps: Partial<BurgerProps> = {\n size: 'md',\n transitionDuration: 300,\n};\n\nexport const Burger = forwardRef<HTMLButtonElement, BurgerProps>((props: BurgerProps, ref) => {\n const { className, opened, color, size, classNames, styles, transitionDuration, ...others } =\n useComponentDefaultProps('Burger', defaultProps, props);\n\n const { classes, cx } = useStyles(\n { color, size, transitionDuration },\n { classNames, styles, name: 'Burger' }\n );\n\n return (\n <UnstyledButton className={cx(classes.root, className)} ref={ref} {...others}>\n <div data-opened={opened || undefined} className={classes.burger} />\n </UnstyledButton>\n );\n});\n\nBurger.displayName = '@mantine/core/Burger';\n"],"names":["forwardRef","useComponentDefaultProps","styles","useStyles","React","UnstyledButton"],"mappings":";;;;;;;;;;;;;AAAA,IAAI,SAAS,GAAG,MAAM,CAAC,cAAc,CAAC;AACtC,IAAI,mBAAmB,GAAG,MAAM,CAAC,qBAAqB,CAAC;AACvD,IAAI,YAAY,GAAG,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC;AACnD,IAAI,YAAY,GAAG,MAAM,CAAC,SAAS,CAAC,oBAAoB,CAAC;AACzD,IAAI,eAAe,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,KAAK,KAAK,GAAG,IAAI,GAAG,GAAG,SAAS,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,GAAG,GAAG,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;AAChK,IAAI,cAAc,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK;AAC/B,EAAE,KAAK,IAAI,IAAI,IAAI,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC;AAChC,IAAI,IAAI,YAAY,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC;AAClC,MAAM,eAAe,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;AACxC,EAAE,IAAI,mBAAmB;AACzB,IAAI,KAAK,IAAI,IAAI,IAAI,mBAAmB,CAAC,CAAC,CAAC,EAAE;AAC7C,MAAM,IAAI,YAAY,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC;AACpC,QAAQ,eAAe,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;AAC1C,KAAK;AACL,EAAE,OAAO,CAAC,CAAC;AACX,CAAC,CAAC;AACF,IAAI,SAAS,GAAG,CAAC,MAAM,EAAE,OAAO,KAAK;AACrC,EAAE,IAAI,MAAM,GAAG,EAAE,CAAC;AAClB,EAAE,KAAK,IAAI,IAAI,IAAI,MAAM;AACzB,IAAI,IAAI,YAAY,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,IAAI,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;AACpE,MAAM,MAAM,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;AAClC,EAAE,IAAI,MAAM,IAAI,IAAI,IAAI,mBAAmB;AAC3C,IAAI,KAAK,IAAI,IAAI,IAAI,mBAAmB,CAAC,MAAM,CAAC,EAAE;AAClD,MAAM,IAAI,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,YAAY,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC;AACtE,QAAQ,MAAM,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;AACpC,KAAK;AACL,EAAE,OAAO,MAAM,CAAC;AAChB,CAAC,CAAC;AAOF,MAAM,YAAY,GAAG;AACrB,EAAE,IAAI,EAAE,IAAI;AACZ,EAAE,kBAAkB,EAAE,GAAG;AACzB,CAAC,CAAC;AACU,MAAC,MAAM,GAAGA,gBAAU,CAAC,CAAC,KAAK,EAAE,GAAG,KAAK;AACjD,EAAE,MAAM,EAAE,GAAGC,+BAAwB,CAAC,QAAQ,EAAE,YAAY,EAAE,KAAK,CAAC,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,UAAU,UAAEC,QAAM,EAAE,kBAAkB,EAAE,GAAG,EAAE,EAAE,MAAM,GAAG,SAAS,CAAC,EAAE,EAAE,CAAC,WAAW,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,QAAQ,EAAE,oBAAoB,CAAC,CAAC,CAAC;AACtQ,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,EAAE,GAAGC,wBAAS,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,kBAAkB,EAAE,EAAE,EAAE,UAAU,UAAED,QAAM,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC;AACjH,EAAE,uBAAuBE,cAAK,CAAC,aAAa,CAACC,6BAAc,EAAE,cAAc,CAAC;AAC5E,IAAI,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,SAAS,CAAC;AAC1C,IAAI,GAAG;AACP,GAAG,EAAE,MAAM,CAAC,kBAAkBD,cAAK,CAAC,aAAa,CAAC,KAAK,EAAE;AACzD,IAAI,aAAa,EAAE,MAAM,IAAI,KAAK,CAAC;AACnC,IAAI,SAAS,EAAE,OAAO,CAAC,MAAM;AAC7B,GAAG,CAAC,CAAC,CAAC;AACN,CAAC,EAAE;AACH,MAAM,CAAC,WAAW,GAAG,sBAAsB;;;;"}
|
|
@@ -26,7 +26,7 @@ var useStyles = styles.createStyles((theme, { size, color, transitionDuration })
|
|
|
26
26
|
position: "relative",
|
|
27
27
|
userSelect: "none",
|
|
28
28
|
boxSizing: "border-box",
|
|
29
|
-
"&,
|
|
29
|
+
"&, &::before, &::after": {
|
|
30
30
|
display: "block",
|
|
31
31
|
width: sizeValue,
|
|
32
32
|
height: Math.ceil(sizeValue / 12),
|
|
@@ -38,23 +38,23 @@ var useStyles = styles.createStyles((theme, { size, color, transitionDuration })
|
|
|
38
38
|
transitionDuration: theme.respectReducedMotion ? "0ms" : void 0
|
|
39
39
|
}
|
|
40
40
|
},
|
|
41
|
-
"
|
|
41
|
+
"&::before, &::after": {
|
|
42
42
|
position: "absolute",
|
|
43
43
|
content: '""',
|
|
44
44
|
left: 0
|
|
45
45
|
},
|
|
46
|
-
"
|
|
46
|
+
"&::before": {
|
|
47
47
|
top: sizeValue / 3 * -1
|
|
48
48
|
},
|
|
49
|
-
"
|
|
49
|
+
"&::after": {
|
|
50
50
|
top: sizeValue / 3
|
|
51
51
|
},
|
|
52
52
|
"&[data-opened]": {
|
|
53
53
|
backgroundColor: "transparent",
|
|
54
|
-
"
|
|
54
|
+
"&::before": {
|
|
55
55
|
transform: `translateY(${sizeValue / 3}px) rotate(45deg)`
|
|
56
56
|
},
|
|
57
|
-
"
|
|
57
|
+
"&::after": {
|
|
58
58
|
transform: `translateY(-${sizeValue / 3}px) rotate(-45deg)`
|
|
59
59
|
}
|
|
60
60
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Burger.styles.js","sources":["../../src/Burger/Burger.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize, MantineColor } from '@mantine/styles';\n\nexport interface BurgerStylesParams {\n size: MantineNumberSize;\n color: MantineColor;\n transitionDuration: number;\n}\n\nconst sizes = {\n xs: 12,\n sm: 18,\n md: 24,\n lg: 34,\n xl: 42,\n};\n\nexport default createStyles((theme, { size, color, transitionDuration }: BurgerStylesParams) => {\n const sizeValue = theme.fn.size({ size, sizes });\n const _color = color || (theme.colorScheme === 'dark' ? theme.white : theme.black);\n\n return {\n root: {\n borderRadius: theme.radius.sm,\n width: sizeValue + theme.spacing.xs,\n height: sizeValue + theme.spacing.xs,\n padding: theme.spacing.xs / 2,\n cursor: 'pointer',\n },\n\n burger: {\n position: 'relative',\n userSelect: 'none',\n boxSizing: 'border-box',\n\n '&,
|
|
1
|
+
{"version":3,"file":"Burger.styles.js","sources":["../../src/Burger/Burger.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize, MantineColor } from '@mantine/styles';\n\nexport interface BurgerStylesParams {\n size: MantineNumberSize;\n color: MantineColor;\n transitionDuration: number;\n}\n\nconst sizes = {\n xs: 12,\n sm: 18,\n md: 24,\n lg: 34,\n xl: 42,\n};\n\nexport default createStyles((theme, { size, color, transitionDuration }: BurgerStylesParams) => {\n const sizeValue = theme.fn.size({ size, sizes });\n const _color = color || (theme.colorScheme === 'dark' ? theme.white : theme.black);\n\n return {\n root: {\n borderRadius: theme.radius.sm,\n width: sizeValue + theme.spacing.xs,\n height: sizeValue + theme.spacing.xs,\n padding: theme.spacing.xs / 2,\n cursor: 'pointer',\n },\n\n burger: {\n position: 'relative',\n userSelect: 'none',\n boxSizing: 'border-box',\n\n '&, &::before, &::after': {\n display: 'block',\n width: sizeValue,\n height: Math.ceil(sizeValue / 12),\n backgroundColor: _color,\n outline: '1px solid transparent',\n transitionProperty: 'background-color, transform',\n transitionDuration: `${transitionDuration}ms`,\n\n '@media (prefers-reduced-motion)': {\n transitionDuration: theme.respectReducedMotion ? '0ms' : undefined,\n },\n },\n\n '&::before, &::after': {\n position: 'absolute',\n content: '\"\"',\n left: 0,\n },\n\n '&::before': {\n top: (sizeValue / 3) * -1,\n },\n\n '&::after': {\n top: sizeValue / 3,\n },\n\n '&[data-opened]': {\n backgroundColor: 'transparent',\n\n '&::before': {\n transform: `translateY(${sizeValue / 3}px) rotate(45deg)`,\n },\n\n '&::after': {\n transform: `translateY(-${sizeValue / 3}px) rotate(-45deg)`,\n },\n },\n },\n };\n});\n"],"names":["createStyles"],"mappings":";;;;;;AACA,MAAM,KAAK,GAAG;AACd,EAAE,EAAE,EAAE,EAAE;AACR,EAAE,EAAE,EAAE,EAAE;AACR,EAAE,EAAE,EAAE,EAAE;AACR,EAAE,EAAE,EAAE,EAAE;AACR,EAAE,EAAE,EAAE,EAAE;AACR,CAAC,CAAC;AACF,gBAAeA,mBAAY,CAAC,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,kBAAkB,EAAE,KAAK;AAC5E,EAAE,MAAM,SAAS,GAAG,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,CAAC;AACnD,EAAE,MAAM,MAAM,GAAG,KAAK,KAAK,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC;AACrF,EAAE,OAAO;AACT,IAAI,IAAI,EAAE;AACV,MAAM,YAAY,EAAE,KAAK,CAAC,MAAM,CAAC,EAAE;AACnC,MAAM,KAAK,EAAE,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,EAAE;AACzC,MAAM,MAAM,EAAE,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,EAAE;AAC1C,MAAM,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC;AACnC,MAAM,MAAM,EAAE,SAAS;AACvB,KAAK;AACL,IAAI,MAAM,EAAE;AACZ,MAAM,QAAQ,EAAE,UAAU;AAC1B,MAAM,UAAU,EAAE,MAAM;AACxB,MAAM,SAAS,EAAE,YAAY;AAC7B,MAAM,wBAAwB,EAAE;AAChC,QAAQ,OAAO,EAAE,OAAO;AACxB,QAAQ,KAAK,EAAE,SAAS;AACxB,QAAQ,MAAM,EAAE,IAAI,CAAC,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;AACzC,QAAQ,eAAe,EAAE,MAAM;AAC/B,QAAQ,OAAO,EAAE,uBAAuB;AACxC,QAAQ,kBAAkB,EAAE,6BAA6B;AACzD,QAAQ,kBAAkB,EAAE,CAAC,EAAE,kBAAkB,CAAC,EAAE,CAAC;AACrD,QAAQ,iCAAiC,EAAE;AAC3C,UAAU,kBAAkB,EAAE,KAAK,CAAC,oBAAoB,GAAG,KAAK,GAAG,KAAK,CAAC;AACzE,SAAS;AACT,OAAO;AACP,MAAM,qBAAqB,EAAE;AAC7B,QAAQ,QAAQ,EAAE,UAAU;AAC5B,QAAQ,OAAO,EAAE,IAAI;AACrB,QAAQ,IAAI,EAAE,CAAC;AACf,OAAO;AACP,MAAM,WAAW,EAAE;AACnB,QAAQ,GAAG,EAAE,SAAS,GAAG,CAAC,GAAG,CAAC,CAAC;AAC/B,OAAO;AACP,MAAM,UAAU,EAAE;AAClB,QAAQ,GAAG,EAAE,SAAS,GAAG,CAAC;AAC1B,OAAO;AACP,MAAM,gBAAgB,EAAE;AACxB,QAAQ,eAAe,EAAE,aAAa;AACtC,QAAQ,WAAW,EAAE;AACrB,UAAU,SAAS,EAAE,CAAC,WAAW,EAAE,SAAS,GAAG,CAAC,CAAC,iBAAiB,CAAC;AACnE,SAAS;AACT,QAAQ,UAAU,EAAE;AACpB,UAAU,SAAS,EAAE,CAAC,YAAY,EAAE,SAAS,GAAG,CAAC,CAAC,kBAAkB,CAAC;AACrE,SAAS;AACT,OAAO;AACP,KAAK;AACL,GAAG,CAAC;AACJ,CAAC,CAAC;;;;"}
|
|
@@ -65,7 +65,6 @@ function getVariantStyles({ variant, theme, color, gradient }) {
|
|
|
65
65
|
return __spreadValues({
|
|
66
66
|
border: `1px solid ${colors.border}`,
|
|
67
67
|
backgroundColor: colors.background,
|
|
68
|
-
backgroundImage: colors.background,
|
|
69
68
|
color: colors.color
|
|
70
69
|
}, theme.fn.hover({
|
|
71
70
|
backgroundColor: colors.hover
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.styles.js","sources":["../../src/Button/Button.styles.ts"],"sourcesContent":["import {\n createStyles,\n MantineSize,\n MantineNumberSize,\n MantineColor,\n MantineTheme,\n MantineGradient,\n CSSObject,\n} from '@mantine/styles';\nimport { INPUT_SIZES } from '../Input';\n\nexport type ButtonVariant =\n | 'filled'\n | 'outline'\n | 'light'\n | 'gradient'\n | 'white'\n | 'default'\n | 'subtle';\n\nexport interface ButtonStylesParams {\n color: MantineColor;\n size: MantineSize;\n radius: MantineNumberSize;\n fullWidth: boolean;\n compact: boolean;\n gradient: MantineGradient;\n variant: ButtonVariant;\n withRightIcon: boolean;\n withLeftIcon: boolean;\n}\n\nexport const sizes = {\n xs: { height: INPUT_SIZES.xs, paddingLeft: 14, paddingRight: 14 },\n sm: { height: INPUT_SIZES.sm, paddingLeft: 18, paddingRight: 18 },\n md: { height: INPUT_SIZES.md, paddingLeft: 22, paddingRight: 22 },\n lg: { height: INPUT_SIZES.lg, paddingLeft: 26, paddingRight: 26 },\n xl: { height: INPUT_SIZES.xl, paddingLeft: 32, paddingRight: 32 },\n 'compact-xs': { height: 22, paddingLeft: 7, paddingRight: 7 },\n 'compact-sm': { height: 26, paddingLeft: 8, paddingRight: 8 },\n 'compact-md': { height: 30, paddingLeft: 10, paddingRight: 10 },\n 'compact-lg': { height: 34, paddingLeft: 12, paddingRight: 12 },\n 'compact-xl': { height: 40, paddingLeft: 14, paddingRight: 14 },\n};\n\ninterface GetSizeStyles {\n compact: boolean;\n size: MantineSize;\n withLeftIcon: boolean;\n withRightIcon: boolean;\n}\n\nfunction getSizeStyles({ compact, size, withLeftIcon, withRightIcon }: GetSizeStyles): CSSObject {\n if (compact) {\n return sizes[`compact-${size}`];\n }\n\n const _sizes = sizes[size];\n\n return {\n ..._sizes,\n paddingLeft: withLeftIcon ? _sizes.paddingLeft / 1.5 : _sizes.paddingLeft,\n paddingRight: withRightIcon ? _sizes.paddingRight / 1.5 : _sizes.paddingRight,\n };\n}\n\nconst getWidthStyles = (fullWidth: boolean) => ({\n display: fullWidth ? 'block' : 'inline-block',\n width: fullWidth ? '100%' : 'auto',\n});\n\ninterface GetVariantStyles {\n theme: MantineTheme;\n color: MantineColor;\n variant: ButtonVariant;\n gradient: MantineGradient;\n}\n\nfunction getVariantStyles({ variant, theme, color, gradient }: GetVariantStyles) {\n const colors = theme.fn.variant({ color, variant, gradient });\n\n if (variant === 'gradient') {\n return {\n border: 0,\n backgroundImage: colors.background,\n color: colors.color,\n\n '&:hover': theme.fn.hover({\n backgroundSize: '200%',\n }),\n };\n }\n\n return {\n border: `1px solid ${colors.border}`,\n backgroundColor: colors.background,\n backgroundImage: colors.background,\n color: colors.color,\n ...theme.fn.hover({\n backgroundColor: colors.hover,\n }),\n };\n}\n\nexport default createStyles(\n (\n theme,\n {\n color,\n size,\n radius,\n fullWidth,\n compact,\n gradient,\n variant,\n withLeftIcon,\n withRightIcon,\n }: ButtonStylesParams\n ) => ({\n root: {\n ...getSizeStyles({ compact, size, withLeftIcon, withRightIcon }),\n ...theme.fn.fontStyles(),\n ...theme.fn.focusStyles(),\n ...getWidthStyles(fullWidth),\n borderRadius: theme.fn.radius(radius),\n fontWeight: 600,\n position: 'relative',\n lineHeight: 1,\n fontSize: theme.fn.size({ size, sizes: theme.fontSizes }),\n userSelect: 'none',\n cursor: 'pointer',\n ...getVariantStyles({ variant, theme, color, gradient }),\n\n '&:active': theme.activeStyles,\n\n '&[data-disabled]': {\n borderColor: 'transparent',\n backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[4] : theme.colors.gray[2],\n color: theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[5],\n cursor: 'not-allowed',\n\n '&:active': {\n transform: 'none',\n },\n },\n\n '&[data-loading]': {\n pointerEvents: 'none',\n\n '&::before': {\n content: '\"\"',\n position: 'absolute',\n top: -1,\n left: -1,\n right: -1,\n bottom: -1,\n backgroundColor:\n theme.colorScheme === 'dark'\n ? theme.fn.rgba(theme.colors.dark[7], 0.5)\n : 'rgba(255, 255, 255, .5)',\n borderRadius: theme.fn.radius(radius),\n cursor: 'not-allowed',\n },\n },\n },\n\n icon: {\n display: 'flex',\n alignItems: 'center',\n },\n\n leftIcon: {\n marginRight: 10,\n },\n\n rightIcon: {\n marginLeft: 10,\n },\n\n inner: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n height: '100%',\n overflow: 'visible',\n },\n\n label: {\n whiteSpace: 'nowrap',\n height: '100%',\n overflow: 'hidden',\n display: 'flex',\n alignItems: 'center',\n },\n })\n);\n"],"names":["INPUT_SIZES","createStyles"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Button.styles.js","sources":["../../src/Button/Button.styles.ts"],"sourcesContent":["import {\n createStyles,\n MantineSize,\n MantineNumberSize,\n MantineColor,\n MantineTheme,\n MantineGradient,\n CSSObject,\n} from '@mantine/styles';\nimport { INPUT_SIZES } from '../Input';\n\nexport type ButtonVariant =\n | 'filled'\n | 'outline'\n | 'light'\n | 'gradient'\n | 'white'\n | 'default'\n | 'subtle';\n\nexport interface ButtonStylesParams {\n color: MantineColor;\n size: MantineSize;\n radius: MantineNumberSize;\n fullWidth: boolean;\n compact: boolean;\n gradient: MantineGradient;\n variant: ButtonVariant;\n withRightIcon: boolean;\n withLeftIcon: boolean;\n}\n\nexport const sizes = {\n xs: { height: INPUT_SIZES.xs, paddingLeft: 14, paddingRight: 14 },\n sm: { height: INPUT_SIZES.sm, paddingLeft: 18, paddingRight: 18 },\n md: { height: INPUT_SIZES.md, paddingLeft: 22, paddingRight: 22 },\n lg: { height: INPUT_SIZES.lg, paddingLeft: 26, paddingRight: 26 },\n xl: { height: INPUT_SIZES.xl, paddingLeft: 32, paddingRight: 32 },\n 'compact-xs': { height: 22, paddingLeft: 7, paddingRight: 7 },\n 'compact-sm': { height: 26, paddingLeft: 8, paddingRight: 8 },\n 'compact-md': { height: 30, paddingLeft: 10, paddingRight: 10 },\n 'compact-lg': { height: 34, paddingLeft: 12, paddingRight: 12 },\n 'compact-xl': { height: 40, paddingLeft: 14, paddingRight: 14 },\n};\n\ninterface GetSizeStyles {\n compact: boolean;\n size: MantineSize;\n withLeftIcon: boolean;\n withRightIcon: boolean;\n}\n\nfunction getSizeStyles({ compact, size, withLeftIcon, withRightIcon }: GetSizeStyles): CSSObject {\n if (compact) {\n return sizes[`compact-${size}`];\n }\n\n const _sizes = sizes[size];\n\n return {\n ..._sizes,\n paddingLeft: withLeftIcon ? _sizes.paddingLeft / 1.5 : _sizes.paddingLeft,\n paddingRight: withRightIcon ? _sizes.paddingRight / 1.5 : _sizes.paddingRight,\n };\n}\n\nconst getWidthStyles = (fullWidth: boolean) => ({\n display: fullWidth ? 'block' : 'inline-block',\n width: fullWidth ? '100%' : 'auto',\n});\n\ninterface GetVariantStyles {\n theme: MantineTheme;\n color: MantineColor;\n variant: ButtonVariant;\n gradient: MantineGradient;\n}\n\nfunction getVariantStyles({ variant, theme, color, gradient }: GetVariantStyles) {\n const colors = theme.fn.variant({ color, variant, gradient });\n\n if (variant === 'gradient') {\n return {\n border: 0,\n backgroundImage: colors.background,\n color: colors.color,\n\n '&:hover': theme.fn.hover({\n backgroundSize: '200%',\n }),\n };\n }\n\n return {\n border: `1px solid ${colors.border}`,\n backgroundColor: colors.background,\n color: colors.color,\n ...theme.fn.hover({\n backgroundColor: colors.hover,\n }),\n };\n}\n\nexport default createStyles(\n (\n theme,\n {\n color,\n size,\n radius,\n fullWidth,\n compact,\n gradient,\n variant,\n withLeftIcon,\n withRightIcon,\n }: ButtonStylesParams\n ) => ({\n root: {\n ...getSizeStyles({ compact, size, withLeftIcon, withRightIcon }),\n ...theme.fn.fontStyles(),\n ...theme.fn.focusStyles(),\n ...getWidthStyles(fullWidth),\n borderRadius: theme.fn.radius(radius),\n fontWeight: 600,\n position: 'relative',\n lineHeight: 1,\n fontSize: theme.fn.size({ size, sizes: theme.fontSizes }),\n userSelect: 'none',\n cursor: 'pointer',\n ...getVariantStyles({ variant, theme, color, gradient }),\n\n '&:active': theme.activeStyles,\n\n '&[data-disabled]': {\n borderColor: 'transparent',\n backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[4] : theme.colors.gray[2],\n color: theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[5],\n cursor: 'not-allowed',\n\n '&:active': {\n transform: 'none',\n },\n },\n\n '&[data-loading]': {\n pointerEvents: 'none',\n\n '&::before': {\n content: '\"\"',\n position: 'absolute',\n top: -1,\n left: -1,\n right: -1,\n bottom: -1,\n backgroundColor:\n theme.colorScheme === 'dark'\n ? theme.fn.rgba(theme.colors.dark[7], 0.5)\n : 'rgba(255, 255, 255, .5)',\n borderRadius: theme.fn.radius(radius),\n cursor: 'not-allowed',\n },\n },\n },\n\n icon: {\n display: 'flex',\n alignItems: 'center',\n },\n\n leftIcon: {\n marginRight: 10,\n },\n\n rightIcon: {\n marginLeft: 10,\n },\n\n inner: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n height: '100%',\n overflow: 'visible',\n },\n\n label: {\n whiteSpace: 'nowrap',\n height: '100%',\n overflow: 'hidden',\n display: 'flex',\n alignItems: 'center',\n },\n })\n);\n"],"names":["INPUT_SIZES","createStyles"],"mappings":"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"}
|
|
@@ -44,7 +44,8 @@ var __objRest = (source, exclude) => {
|
|
|
44
44
|
const defaultProps = {
|
|
45
45
|
orientation: "horizontal",
|
|
46
46
|
spacing: "lg",
|
|
47
|
-
size: "sm"
|
|
47
|
+
size: "sm",
|
|
48
|
+
offset: "xs"
|
|
48
49
|
};
|
|
49
50
|
const CheckboxGroup = React.forwardRef((props, ref) => {
|
|
50
51
|
const _a = styles.useComponentDefaultProps("CheckboxGroup", defaultProps, props), {
|
|
@@ -62,7 +63,8 @@ const CheckboxGroup = React.forwardRef((props, ref) => {
|
|
|
62
63
|
labelProps,
|
|
63
64
|
descriptionProps,
|
|
64
65
|
inputContainer,
|
|
65
|
-
inputWrapperOrder
|
|
66
|
+
inputWrapperOrder,
|
|
67
|
+
offset
|
|
66
68
|
} = _a, others = __objRest(_a, [
|
|
67
69
|
"children",
|
|
68
70
|
"value",
|
|
@@ -78,7 +80,8 @@ const CheckboxGroup = React.forwardRef((props, ref) => {
|
|
|
78
80
|
"labelProps",
|
|
79
81
|
"descriptionProps",
|
|
80
82
|
"inputContainer",
|
|
81
|
-
"inputWrapperOrder"
|
|
83
|
+
"inputWrapperOrder",
|
|
84
|
+
"offset"
|
|
82
85
|
]);
|
|
83
86
|
const [_value, setValue] = hooks.useUncontrolled({
|
|
84
87
|
value,
|
|
@@ -106,7 +109,8 @@ const CheckboxGroup = React.forwardRef((props, ref) => {
|
|
|
106
109
|
inputWrapperOrder
|
|
107
110
|
}, wrapperProps), others), /* @__PURE__ */ React__default.createElement(InputsGroup.InputsGroup, {
|
|
108
111
|
spacing,
|
|
109
|
-
orientation
|
|
112
|
+
orientation,
|
|
113
|
+
offset
|
|
110
114
|
}, children)));
|
|
111
115
|
});
|
|
112
116
|
CheckboxGroup.displayName = "@mantine/core/CheckboxGroup";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxGroup.js","sources":["../../../src/Checkbox/CheckboxGroup/CheckboxGroup.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { useUncontrolled } from '@mantine/hooks';\nimport {\n DefaultProps,\n MantineNumberSize,\n MantineSize,\n useComponentDefaultProps,\n} from '@mantine/styles';\nimport { Input, InputWrapperBaseProps, InputWrapperStylesNames } from '../../Input';\nimport { InputsGroup } from './InputsGroup';\nimport { CheckboxGroupProvider } from '../CheckboxGroup.context';\n\nexport type CheckboxGroupStylesNames = InputWrapperStylesNames;\n\nexport interface CheckboxGroupProps\n extends DefaultProps<CheckboxGroupStylesNames>,\n InputWrapperBaseProps,\n Omit<React.ComponentPropsWithoutRef<'div'>, 'onChange'> {\n /** <Checkbox /> components only */\n children: React.ReactNode;\n\n /** Value of currently selected checkbox */\n value?: string[];\n\n /** Initial value for uncontrolled component */\n defaultValue?: string[];\n\n /** Called when value changes */\n onChange?(value: string[]): void;\n\n /** Horizontal or vertical orientation */\n orientation?: 'horizontal' | 'vertical';\n\n /** Spacing between checkboxes in horizontal orientation */\n spacing?: MantineNumberSize;\n\n /** Predefined label fontSize, checkbox width, height and border-radius */\n size?: MantineSize;\n\n /** Props spread to InputWrapper */\n wrapperProps?: Record<string, any>;\n}\n\nconst defaultProps: Partial<CheckboxGroupProps> = {\n orientation: 'horizontal',\n spacing: 'lg',\n size: 'sm',\n};\n\nexport const CheckboxGroup = forwardRef<HTMLDivElement, CheckboxGroupProps>(\n (props: CheckboxGroupProps, ref) => {\n const {\n children,\n value,\n defaultValue,\n onChange,\n orientation,\n spacing,\n size,\n classNames,\n styles,\n wrapperProps,\n errorProps,\n labelProps,\n descriptionProps,\n inputContainer,\n inputWrapperOrder,\n ...others\n } = useComponentDefaultProps('CheckboxGroup', defaultProps, props);\n\n const [_value, setValue] = useUncontrolled({\n value,\n defaultValue,\n finalValue: [],\n onChange,\n });\n\n const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n const itemValue = event.currentTarget.value;\n setValue(\n _value.includes(itemValue)\n ? _value.filter((item) => item !== itemValue)\n : [..._value, itemValue]\n );\n };\n\n return (\n <CheckboxGroupProvider value={{ value: _value, onChange: handleChange, size }}>\n <Input.Wrapper\n labelElement=\"div\"\n size={size}\n __staticSelector=\"CheckboxGroup\"\n classNames={classNames}\n styles={styles}\n ref={ref}\n errorProps={errorProps}\n descriptionProps={descriptionProps}\n labelProps={labelProps}\n inputContainer={inputContainer}\n inputWrapperOrder={inputWrapperOrder}\n {...wrapperProps}\n {...others}\n >\n <InputsGroup spacing={spacing} orientation={orientation}>\n {children}\n </InputsGroup>\n </Input.Wrapper>\n </CheckboxGroupProvider>\n );\n }\n);\n\nCheckboxGroup.displayName = '@mantine/core/CheckboxGroup';\n"],"names":["forwardRef","useComponentDefaultProps","styles","useUncontrolled","React","CheckboxGroupProvider","Input","InputsGroup"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"CheckboxGroup.js","sources":["../../../src/Checkbox/CheckboxGroup/CheckboxGroup.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { useUncontrolled } from '@mantine/hooks';\nimport {\n DefaultProps,\n MantineNumberSize,\n MantineSize,\n useComponentDefaultProps,\n} from '@mantine/styles';\nimport { Input, InputWrapperBaseProps, InputWrapperStylesNames } from '../../Input';\nimport { InputsGroup } from './InputsGroup';\nimport { CheckboxGroupProvider } from '../CheckboxGroup.context';\n\nexport type CheckboxGroupStylesNames = InputWrapperStylesNames;\n\nexport interface CheckboxGroupProps\n extends DefaultProps<CheckboxGroupStylesNames>,\n InputWrapperBaseProps,\n Omit<React.ComponentPropsWithoutRef<'div'>, 'onChange'> {\n /** <Checkbox /> components only */\n children: React.ReactNode;\n\n /** Value of currently selected checkbox */\n value?: string[];\n\n /** Initial value for uncontrolled component */\n defaultValue?: string[];\n\n /** Called when value changes */\n onChange?(value: string[]): void;\n\n /** Horizontal or vertical orientation */\n orientation?: 'horizontal' | 'vertical';\n\n /** Spacing between checkboxes in horizontal orientation */\n spacing?: MantineNumberSize;\n\n /** Space between label and inputs */\n offset?: MantineNumberSize;\n\n /** Predefined label fontSize, checkbox width, height and border-radius */\n size?: MantineSize;\n\n /** Props spread to InputWrapper */\n wrapperProps?: Record<string, any>;\n}\n\nconst defaultProps: Partial<CheckboxGroupProps> = {\n orientation: 'horizontal',\n spacing: 'lg',\n size: 'sm',\n offset: 'xs',\n};\n\nexport const CheckboxGroup = forwardRef<HTMLDivElement, CheckboxGroupProps>(\n (props: CheckboxGroupProps, ref) => {\n const {\n children,\n value,\n defaultValue,\n onChange,\n orientation,\n spacing,\n size,\n classNames,\n styles,\n wrapperProps,\n errorProps,\n labelProps,\n descriptionProps,\n inputContainer,\n inputWrapperOrder,\n offset,\n ...others\n } = useComponentDefaultProps('CheckboxGroup', defaultProps, props);\n\n const [_value, setValue] = useUncontrolled({\n value,\n defaultValue,\n finalValue: [],\n onChange,\n });\n\n const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n const itemValue = event.currentTarget.value;\n setValue(\n _value.includes(itemValue)\n ? _value.filter((item) => item !== itemValue)\n : [..._value, itemValue]\n );\n };\n\n return (\n <CheckboxGroupProvider value={{ value: _value, onChange: handleChange, size }}>\n <Input.Wrapper\n labelElement=\"div\"\n size={size}\n __staticSelector=\"CheckboxGroup\"\n classNames={classNames}\n styles={styles}\n ref={ref}\n errorProps={errorProps}\n descriptionProps={descriptionProps}\n labelProps={labelProps}\n inputContainer={inputContainer}\n inputWrapperOrder={inputWrapperOrder}\n {...wrapperProps}\n {...others}\n >\n <InputsGroup spacing={spacing} orientation={orientation} offset={offset}>\n {children}\n </InputsGroup>\n </Input.Wrapper>\n </CheckboxGroupProvider>\n );\n }\n);\n\nCheckboxGroup.displayName = '@mantine/core/CheckboxGroup';\n"],"names":["forwardRef","useComponentDefaultProps","styles","useUncontrolled","React","CheckboxGroupProvider","Input","InputsGroup"],"mappings":"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"}
|
|
@@ -10,17 +10,24 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
10
10
|
|
|
11
11
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
12
12
|
|
|
13
|
-
function InputsGroup({
|
|
13
|
+
function InputsGroup({
|
|
14
|
+
spacing,
|
|
15
|
+
offset,
|
|
16
|
+
orientation,
|
|
17
|
+
children,
|
|
18
|
+
role,
|
|
19
|
+
unstyled
|
|
20
|
+
}) {
|
|
14
21
|
if (orientation === "horizontal") {
|
|
15
22
|
return /* @__PURE__ */ React__default.createElement(Group.Group, {
|
|
16
|
-
pt:
|
|
23
|
+
pt: offset,
|
|
17
24
|
spacing,
|
|
18
25
|
role,
|
|
19
26
|
unstyled
|
|
20
27
|
}, children);
|
|
21
28
|
}
|
|
22
29
|
return /* @__PURE__ */ React__default.createElement(Stack.Stack, {
|
|
23
|
-
pt:
|
|
30
|
+
pt: offset,
|
|
24
31
|
spacing,
|
|
25
32
|
role,
|
|
26
33
|
unstyled
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputsGroup.js","sources":["../../../src/Checkbox/CheckboxGroup/InputsGroup.tsx"],"sourcesContent":["import React from 'react';\nimport { MantineNumberSize } from '@mantine/styles';\nimport { Group } from '../../Group/Group';\nimport { Stack } from '../../Stack/Stack';\n\ninterface InputsGroupProps {\n spacing: MantineNumberSize;\n orientation: 'horizontal' | 'vertical';\n role?: string;\n children: React.ReactNode;\n unstyled?: boolean;\n}\n\nexport function InputsGroup({
|
|
1
|
+
{"version":3,"file":"InputsGroup.js","sources":["../../../src/Checkbox/CheckboxGroup/InputsGroup.tsx"],"sourcesContent":["import React from 'react';\nimport { MantineNumberSize } from '@mantine/styles';\nimport { Group } from '../../Group/Group';\nimport { Stack } from '../../Stack/Stack';\n\ninterface InputsGroupProps {\n spacing: MantineNumberSize;\n offset: MantineNumberSize;\n orientation: 'horizontal' | 'vertical';\n role?: string;\n children: React.ReactNode;\n unstyled?: boolean;\n}\n\nexport function InputsGroup({\n spacing,\n offset,\n orientation,\n children,\n role,\n unstyled,\n}: InputsGroupProps) {\n if (orientation === 'horizontal') {\n return (\n <Group pt={offset} spacing={spacing} role={role} unstyled={unstyled}>\n {children}\n </Group>\n );\n }\n\n return (\n <Stack pt={offset} spacing={spacing} role={role} unstyled={unstyled}>\n {children}\n </Stack>\n );\n}\n"],"names":["React","Group","Stack"],"mappings":";;;;;;;;;;;;AAGO,SAAS,WAAW,CAAC;AAC5B,EAAE,OAAO;AACT,EAAE,MAAM;AACR,EAAE,WAAW;AACb,EAAE,QAAQ;AACV,EAAE,IAAI;AACN,EAAE,QAAQ;AACV,CAAC,EAAE;AACH,EAAE,IAAI,WAAW,KAAK,YAAY,EAAE;AACpC,IAAI,uBAAuBA,cAAK,CAAC,aAAa,CAACC,WAAK,EAAE;AACtD,MAAM,EAAE,EAAE,MAAM;AAChB,MAAM,OAAO;AACb,MAAM,IAAI;AACV,MAAM,QAAQ;AACd,KAAK,EAAE,QAAQ,CAAC,CAAC;AACjB,GAAG;AACH,EAAE,uBAAuBD,cAAK,CAAC,aAAa,CAACE,WAAK,EAAE;AACpD,IAAI,EAAE,EAAE,MAAM;AACd,IAAI,OAAO;AACX,IAAI,IAAI;AACR,IAAI,QAAQ;AACZ,GAAG,EAAE,QAAQ,CAAC,CAAC;AACf;;;;"}
|
|
@@ -179,13 +179,13 @@ const ColorPicker = React.forwardRef((props, ref) => {
|
|
|
179
179
|
className: classes.preview
|
|
180
180
|
}))), Array.isArray(swatches) && /* @__PURE__ */ React__default.createElement(Swatches.Swatches, {
|
|
181
181
|
data: swatches,
|
|
182
|
-
onSelect: handleChange,
|
|
183
182
|
style: { marginTop: 5 },
|
|
184
183
|
swatchesPerRow,
|
|
185
184
|
focusable,
|
|
186
185
|
classNames,
|
|
187
186
|
styles: styles$1,
|
|
188
|
-
__staticSelector
|
|
187
|
+
__staticSelector,
|
|
188
|
+
setValue
|
|
189
189
|
}));
|
|
190
190
|
});
|
|
191
191
|
ColorPicker.displayName = "@mantine/core/ColorPicker";
|