@mantine/core 5.8.4 → 5.9.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.
- package/cjs/Accordion/AccordionControl/AccordionControl.js +3 -18
- package/cjs/Accordion/AccordionControl/AccordionControl.js.map +1 -1
- package/cjs/Accordion/AccordionItem/AccordionItem.js +3 -2
- package/cjs/Accordion/AccordionItem/AccordionItem.js.map +1 -1
- package/cjs/Accordion/AccordionPanel/AccordionPanel.js +3 -2
- package/cjs/Accordion/AccordionPanel/AccordionPanel.js.map +1 -1
- package/cjs/AppShell/AppShell.context.js +5 -1
- package/cjs/AppShell/AppShell.context.js.map +1 -1
- package/cjs/AppShell/AppShell.js +5 -3
- package/cjs/AppShell/AppShell.js.map +1 -1
- package/cjs/AppShell/HorizontalSection/HorizontalSection.js +2 -1
- package/cjs/AppShell/HorizontalSection/HorizontalSection.js.map +1 -1
- package/cjs/AppShell/HorizontalSection/HorizontalSection.styles.js +4 -3
- 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/AppShell/VerticalSection/VerticalSection.styles.js +3 -1
- package/cjs/AppShell/VerticalSection/VerticalSection.styles.js.map +1 -1
- package/cjs/Card/CardSection/CardSection.js +7 -2
- package/cjs/Card/CardSection/CardSection.js.map +1 -1
- package/cjs/ColorInput/ColorInput.js +41 -5
- package/cjs/ColorInput/ColorInput.js.map +1 -1
- package/cjs/ColorInput/EyeDropperIcon.js +68 -0
- package/cjs/ColorInput/EyeDropperIcon.js.map +1 -0
- package/cjs/FileInput/FileInput.js +1 -1
- package/cjs/FileInput/FileInput.js.map +1 -1
- package/cjs/FileInput/FileInput.styles.js +2 -4
- package/cjs/FileInput/FileInput.styles.js.map +1 -1
- package/cjs/Floating/FloatingArrow/FloatingArrow.js +26 -1
- package/cjs/Floating/FloatingArrow/FloatingArrow.js.map +1 -1
- package/cjs/Floating/FloatingArrow/get-arrow-position-styles.js +38 -15
- package/cjs/Floating/FloatingArrow/get-arrow-position-styles.js.map +1 -1
- package/cjs/Grid/Col/Col.js +8 -6
- package/cjs/Grid/Col/Col.js.map +1 -1
- package/cjs/Grid/Col/Col.styles.js +11 -2
- package/cjs/Grid/Col/Col.styles.js.map +1 -1
- package/cjs/Grid/Grid.context.js +2 -4
- package/cjs/Grid/Grid.context.js.map +1 -1
- package/cjs/Grid/Grid.js +33 -3
- package/cjs/Grid/Grid.js.map +1 -1
- package/cjs/Grid/Grid.styles.js +29 -3
- package/cjs/Grid/Grid.styles.js.map +1 -1
- package/cjs/HoverCard/HoverCardDropdown/HoverCardDropdown.js +4 -10
- package/cjs/HoverCard/HoverCardDropdown/HoverCardDropdown.js.map +1 -1
- package/cjs/HoverCard/HoverCardTarget/HoverCardTarget.js +6 -2
- package/cjs/HoverCard/HoverCardTarget/HoverCardTarget.js.map +1 -1
- package/cjs/Input/Input.js +2 -0
- package/cjs/Input/Input.js.map +1 -1
- package/cjs/Input/Input.styles.js +3 -5
- package/cjs/Input/Input.styles.js.map +1 -1
- package/cjs/Input/InputDescription/InputDescription.js +7 -3
- package/cjs/Input/InputDescription/InputDescription.js.map +1 -1
- package/cjs/Input/InputError/InputError.js +7 -3
- package/cjs/Input/InputError/InputError.js.map +1 -1
- package/cjs/Input/InputLabel/InputLabel.js +12 -7
- package/cjs/Input/InputLabel/InputLabel.js.map +1 -1
- package/cjs/Input/InputPlaceholder/InputPlaceholder.js +54 -0
- package/cjs/Input/InputPlaceholder/InputPlaceholder.js.map +1 -0
- package/cjs/List/List.context.js +3 -6
- package/cjs/List/List.context.js.map +1 -1
- package/cjs/List/List.js +1 -1
- package/cjs/List/List.js.map +1 -1
- package/cjs/List/ListItem/ListItem.js +6 -4
- package/cjs/List/ListItem/ListItem.js.map +1 -1
- package/cjs/Menu/MenuDivider/MenuDivider.js +6 -4
- package/cjs/Menu/MenuDivider/MenuDivider.js.map +1 -1
- package/cjs/Menu/MenuDropdown/MenuDropdown.js +4 -10
- package/cjs/Menu/MenuDropdown/MenuDropdown.js.map +1 -1
- package/cjs/Menu/MenuItem/MenuItem.js +3 -2
- package/cjs/Menu/MenuItem/MenuItem.js.map +1 -1
- package/cjs/Menu/MenuLabel/MenuLabel.js +6 -4
- package/cjs/Menu/MenuLabel/MenuLabel.js.map +1 -1
- package/cjs/Menu/MenuTarget/MenuTarget.js +6 -2
- package/cjs/Menu/MenuTarget/MenuTarget.js.map +1 -1
- package/cjs/PasswordInput/PasswordInput.styles.js +3 -5
- package/cjs/PasswordInput/PasswordInput.styles.js.map +1 -1
- package/cjs/Popover/Popover.context.js.map +1 -1
- package/cjs/Popover/Popover.js +5 -0
- package/cjs/Popover/Popover.js.map +1 -1
- package/cjs/Popover/PopoverDropdown/PopoverDropdown.js +7 -14
- package/cjs/Popover/PopoverDropdown/PopoverDropdown.js.map +1 -1
- package/cjs/Popover/PopoverTarget/PopoverTarget.js +6 -2
- package/cjs/Popover/PopoverTarget/PopoverTarget.js.map +1 -1
- package/cjs/Radio/RadioGroup/RadioGroup.js +2 -1
- package/cjs/Radio/RadioGroup/RadioGroup.js.map +1 -1
- package/cjs/Select/SelectItems/SelectItems.styles.js +1 -1
- package/cjs/Select/SelectItems/SelectItems.styles.js.map +1 -1
- package/cjs/Select/SelectRightSection/get-select-right-section-props.js.map +1 -1
- package/cjs/Select/filter-data/filter-data.js +12 -0
- package/cjs/Select/filter-data/filter-data.js.map +1 -1
- package/cjs/Slider/RangeSlider/RangeSlider.js +8 -0
- package/cjs/Slider/RangeSlider/RangeSlider.js.map +1 -1
- package/cjs/Stepper/Step/Step.js +20 -11
- package/cjs/Stepper/Step/Step.js.map +1 -1
- package/cjs/Stepper/Step/Step.styles.js +5 -1
- package/cjs/Stepper/Step/Step.styles.js.map +1 -1
- package/cjs/Stepper/Stepper.styles.js +5 -1
- package/cjs/Stepper/Stepper.styles.js.map +1 -1
- package/cjs/Table/Table.styles.js +9 -5
- package/cjs/Table/Table.styles.js.map +1 -1
- package/cjs/Tabs/Tab/Tab.js +3 -2
- package/cjs/Tabs/Tab/Tab.js.map +1 -1
- package/cjs/Tabs/TabsList/TabsList.js +6 -2
- package/cjs/Tabs/TabsList/TabsList.js.map +1 -1
- package/cjs/Tabs/TabsPanel/TabsPanel.js +3 -2
- package/cjs/Tabs/TabsPanel/TabsPanel.js.map +1 -1
- package/cjs/Timeline/TimelineItem/TimelineItem.js +19 -11
- package/cjs/Timeline/TimelineItem/TimelineItem.js.map +1 -1
- package/cjs/Tooltip/Tooltip.js +5 -0
- package/cjs/Tooltip/Tooltip.js.map +1 -1
- package/cjs/TypographyStylesProvider/TypographyStylesProvider.styles.js +1 -0
- package/cjs/TypographyStylesProvider/TypographyStylesProvider.styles.js.map +1 -1
- package/esm/Accordion/AccordionControl/AccordionControl.js +4 -19
- package/esm/Accordion/AccordionControl/AccordionControl.js.map +1 -1
- package/esm/Accordion/AccordionItem/AccordionItem.js +4 -3
- package/esm/Accordion/AccordionItem/AccordionItem.js.map +1 -1
- package/esm/Accordion/AccordionPanel/AccordionPanel.js +4 -3
- package/esm/Accordion/AccordionPanel/AccordionPanel.js.map +1 -1
- package/esm/AppShell/AppShell.context.js +5 -1
- package/esm/AppShell/AppShell.context.js.map +1 -1
- package/esm/AppShell/AppShell.js +5 -3
- package/esm/AppShell/AppShell.js.map +1 -1
- package/esm/AppShell/HorizontalSection/HorizontalSection.js +2 -1
- package/esm/AppShell/HorizontalSection/HorizontalSection.js.map +1 -1
- package/esm/AppShell/HorizontalSection/HorizontalSection.styles.js +4 -3
- 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/AppShell/VerticalSection/VerticalSection.styles.js +3 -1
- package/esm/AppShell/VerticalSection/VerticalSection.styles.js.map +1 -1
- package/esm/Card/CardSection/CardSection.js +7 -2
- package/esm/Card/CardSection/CardSection.js.map +1 -1
- package/esm/ColorInput/ColorInput.js +42 -6
- package/esm/ColorInput/ColorInput.js.map +1 -1
- package/esm/ColorInput/EyeDropperIcon.js +60 -0
- package/esm/ColorInput/EyeDropperIcon.js.map +1 -0
- package/esm/FileInput/FileInput.js +1 -1
- package/esm/FileInput/FileInput.js.map +1 -1
- package/esm/FileInput/FileInput.styles.js +2 -4
- package/esm/FileInput/FileInput.styles.js.map +1 -1
- package/esm/Floating/FloatingArrow/FloatingArrow.js +26 -1
- package/esm/Floating/FloatingArrow/FloatingArrow.js.map +1 -1
- package/esm/Floating/FloatingArrow/get-arrow-position-styles.js +38 -15
- package/esm/Floating/FloatingArrow/get-arrow-position-styles.js.map +1 -1
- package/esm/Grid/Col/Col.js +8 -6
- package/esm/Grid/Col/Col.js.map +1 -1
- package/esm/Grid/Col/Col.styles.js +11 -2
- package/esm/Grid/Col/Col.styles.js.map +1 -1
- package/esm/Grid/Grid.context.js +2 -4
- package/esm/Grid/Grid.context.js.map +1 -1
- package/esm/Grid/Grid.js +33 -3
- package/esm/Grid/Grid.js.map +1 -1
- package/esm/Grid/Grid.styles.js +30 -4
- package/esm/Grid/Grid.styles.js.map +1 -1
- package/esm/HoverCard/HoverCardDropdown/HoverCardDropdown.js +4 -10
- package/esm/HoverCard/HoverCardDropdown/HoverCardDropdown.js.map +1 -1
- package/esm/HoverCard/HoverCardTarget/HoverCardTarget.js +6 -2
- package/esm/HoverCard/HoverCardTarget/HoverCardTarget.js.map +1 -1
- package/esm/Input/Input.js +2 -0
- package/esm/Input/Input.js.map +1 -1
- package/esm/Input/Input.styles.js +3 -5
- package/esm/Input/Input.styles.js.map +1 -1
- package/esm/Input/InputDescription/InputDescription.js +6 -2
- package/esm/Input/InputDescription/InputDescription.js.map +1 -1
- package/esm/Input/InputError/InputError.js +6 -2
- package/esm/Input/InputError/InputError.js.map +1 -1
- package/esm/Input/InputLabel/InputLabel.js +10 -5
- package/esm/Input/InputLabel/InputLabel.js.map +1 -1
- package/esm/Input/InputPlaceholder/InputPlaceholder.js +46 -0
- package/esm/Input/InputPlaceholder/InputPlaceholder.js.map +1 -0
- package/esm/List/List.context.js +3 -6
- package/esm/List/List.context.js.map +1 -1
- package/esm/List/List.js +2 -2
- package/esm/List/List.js.map +1 -1
- package/esm/List/ListItem/ListItem.js +8 -6
- package/esm/List/ListItem/ListItem.js.map +1 -1
- package/esm/Menu/MenuDivider/MenuDivider.js +8 -6
- package/esm/Menu/MenuDivider/MenuDivider.js.map +1 -1
- package/esm/Menu/MenuDropdown/MenuDropdown.js +4 -10
- package/esm/Menu/MenuDropdown/MenuDropdown.js.map +1 -1
- package/esm/Menu/MenuItem/MenuItem.js +4 -3
- package/esm/Menu/MenuItem/MenuItem.js.map +1 -1
- package/esm/Menu/MenuLabel/MenuLabel.js +8 -6
- package/esm/Menu/MenuLabel/MenuLabel.js.map +1 -1
- package/esm/Menu/MenuTarget/MenuTarget.js +6 -2
- package/esm/Menu/MenuTarget/MenuTarget.js.map +1 -1
- package/esm/PasswordInput/PasswordInput.styles.js +3 -5
- package/esm/PasswordInput/PasswordInput.styles.js.map +1 -1
- package/esm/Popover/Popover.context.js.map +1 -1
- package/esm/Popover/Popover.js +5 -0
- package/esm/Popover/Popover.js.map +1 -1
- package/esm/Popover/PopoverDropdown/PopoverDropdown.js +8 -15
- package/esm/Popover/PopoverDropdown/PopoverDropdown.js.map +1 -1
- package/esm/Popover/PopoverTarget/PopoverTarget.js +7 -3
- package/esm/Popover/PopoverTarget/PopoverTarget.js.map +1 -1
- package/esm/Radio/RadioGroup/RadioGroup.js +3 -2
- package/esm/Radio/RadioGroup/RadioGroup.js.map +1 -1
- package/esm/Select/SelectItems/SelectItems.styles.js +1 -1
- package/esm/Select/SelectItems/SelectItems.styles.js.map +1 -1
- package/esm/Select/SelectRightSection/get-select-right-section-props.js.map +1 -1
- package/esm/Select/filter-data/filter-data.js +12 -0
- package/esm/Select/filter-data/filter-data.js.map +1 -1
- package/esm/Slider/RangeSlider/RangeSlider.js +8 -0
- package/esm/Slider/RangeSlider/RangeSlider.js.map +1 -1
- package/esm/Stepper/Step/Step.js +18 -9
- package/esm/Stepper/Step/Step.js.map +1 -1
- package/esm/Stepper/Step/Step.styles.js +5 -1
- package/esm/Stepper/Step/Step.styles.js.map +1 -1
- package/esm/Stepper/Stepper.styles.js +5 -1
- package/esm/Stepper/Stepper.styles.js.map +1 -1
- package/esm/Table/Table.styles.js +9 -5
- package/esm/Table/Table.styles.js.map +1 -1
- package/esm/Tabs/Tab/Tab.js +4 -3
- package/esm/Tabs/Tab/Tab.js.map +1 -1
- package/esm/Tabs/TabsList/TabsList.js +7 -3
- package/esm/Tabs/TabsList/TabsList.js.map +1 -1
- package/esm/Tabs/TabsPanel/TabsPanel.js +4 -3
- package/esm/Tabs/TabsPanel/TabsPanel.js.map +1 -1
- package/esm/Timeline/TimelineItem/TimelineItem.js +18 -10
- package/esm/Timeline/TimelineItem/TimelineItem.js.map +1 -1
- package/esm/Tooltip/Tooltip.js +5 -0
- package/esm/Tooltip/Tooltip.js.map +1 -1
- package/esm/TypographyStylesProvider/TypographyStylesProvider.styles.js +1 -0
- package/esm/TypographyStylesProvider/TypographyStylesProvider.styles.js.map +1 -1
- package/lib/Accordion/AccordionControl/AccordionControl.d.ts.map +1 -1
- package/lib/Accordion/AccordionItem/AccordionItem.d.ts.map +1 -1
- package/lib/Accordion/AccordionPanel/AccordionPanel.d.ts +1 -1
- package/lib/Accordion/AccordionPanel/AccordionPanel.d.ts.map +1 -1
- package/lib/AppShell/AppShell.context.d.ts +3 -2
- package/lib/AppShell/AppShell.context.d.ts.map +1 -1
- package/lib/AppShell/AppShell.d.ts +2 -0
- package/lib/AppShell/AppShell.d.ts.map +1 -1
- package/lib/AppShell/HorizontalSection/HorizontalSection.d.ts +1 -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 +1 -1
- package/lib/AppShell/VerticalSection/VerticalSection.d.ts.map +1 -1
- package/lib/AppShell/VerticalSection/VerticalSection.styles.d.ts +1 -0
- package/lib/AppShell/VerticalSection/VerticalSection.styles.d.ts.map +1 -1
- package/lib/Card/CardSection/CardSection.d.ts.map +1 -1
- package/lib/ColorInput/ColorInput.d.ts +4 -0
- package/lib/ColorInput/ColorInput.d.ts.map +1 -1
- package/lib/ColorInput/EyeDropperIcon.d.ts +5 -0
- package/lib/ColorInput/EyeDropperIcon.d.ts.map +1 -0
- package/lib/FileInput/FileInput.styles.d.ts.map +1 -1
- package/lib/Floating/FloatingArrow/FloatingArrow.d.ts +3 -1
- package/lib/Floating/FloatingArrow/FloatingArrow.d.ts.map +1 -1
- package/lib/Floating/FloatingArrow/get-arrow-position-styles.d.ts +5 -2
- package/lib/Floating/FloatingArrow/get-arrow-position-styles.d.ts.map +1 -1
- package/lib/Floating/index.d.ts +1 -1
- package/lib/Floating/index.d.ts.map +1 -1
- package/lib/Floating/types.d.ts +1 -0
- package/lib/Floating/types.d.ts.map +1 -1
- package/lib/Grid/Col/Col.d.ts.map +1 -1
- package/lib/Grid/Col/Col.styles.d.ts +7 -2
- package/lib/Grid/Col/Col.styles.d.ts.map +1 -1
- package/lib/Grid/Grid.context.d.ts +9 -3
- package/lib/Grid/Grid.context.d.ts.map +1 -1
- package/lib/Grid/Grid.d.ts +11 -1
- package/lib/Grid/Grid.d.ts.map +1 -1
- package/lib/Grid/Grid.styles.d.ts +7 -2
- package/lib/Grid/Grid.styles.d.ts.map +1 -1
- package/lib/HoverCard/HoverCardDropdown/HoverCardDropdown.d.ts +1 -1
- package/lib/HoverCard/HoverCardDropdown/HoverCardDropdown.d.ts.map +1 -1
- package/lib/HoverCard/HoverCardTarget/HoverCardTarget.d.ts.map +1 -1
- package/lib/InlineInput/InlineInput.styles.d.ts +2 -2
- package/lib/Input/Input.d.ts +4 -2
- package/lib/Input/Input.d.ts.map +1 -1
- package/lib/Input/Input.styles.d.ts +2 -2
- package/lib/Input/Input.styles.d.ts.map +1 -1
- package/lib/Input/InputDescription/InputDescription.d.ts.map +1 -1
- package/lib/Input/InputError/InputError.d.ts.map +1 -1
- package/lib/Input/InputLabel/InputLabel.d.ts.map +1 -1
- package/lib/Input/InputPlaceholder/InputPlaceholder.d.ts +6 -0
- package/lib/Input/InputPlaceholder/InputPlaceholder.d.ts.map +1 -0
- package/lib/List/List.context.d.ts +4 -2
- package/lib/List/List.context.d.ts.map +1 -1
- package/lib/List/ListItem/ListItem.d.ts +1 -4
- package/lib/List/ListItem/ListItem.d.ts.map +1 -1
- package/lib/Menu/Menu.d.ts +4 -4
- package/lib/Menu/Menu.d.ts.map +1 -1
- package/lib/Menu/MenuDivider/MenuDivider.d.ts +1 -4
- package/lib/Menu/MenuDivider/MenuDivider.d.ts.map +1 -1
- package/lib/Menu/MenuDropdown/MenuDropdown.d.ts +1 -1
- package/lib/Menu/MenuDropdown/MenuDropdown.d.ts.map +1 -1
- package/lib/Menu/MenuItem/MenuItem.d.ts.map +1 -1
- package/lib/Menu/MenuLabel/MenuLabel.d.ts +1 -4
- package/lib/Menu/MenuLabel/MenuLabel.d.ts.map +1 -1
- package/lib/Menu/MenuTarget/MenuTarget.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/PasswordInput/PasswordInput.styles.d.ts.map +1 -1
- package/lib/Popover/Popover.context.d.ts +3 -1
- package/lib/Popover/Popover.context.d.ts.map +1 -1
- package/lib/Popover/Popover.d.ts +3 -1
- package/lib/Popover/Popover.d.ts.map +1 -1
- package/lib/Popover/PopoverDropdown/PopoverDropdown.d.ts +1 -1
- package/lib/Popover/PopoverDropdown/PopoverDropdown.d.ts.map +1 -1
- package/lib/Popover/PopoverTarget/PopoverTarget.d.ts.map +1 -1
- package/lib/Radio/RadioGroup/RadioGroup.d.ts.map +1 -1
- package/lib/Select/SelectRightSection/get-select-right-section-props.d.ts +3 -3
- package/lib/Select/SelectRightSection/get-select-right-section-props.d.ts.map +1 -1
- package/lib/Select/filter-data/filter-data.d.ts.map +1 -1
- package/lib/Slider/RangeSlider/RangeSlider.d.ts +2 -0
- package/lib/Slider/RangeSlider/RangeSlider.d.ts.map +1 -1
- package/lib/Stepper/Step/Step.d.ts.map +1 -1
- package/lib/Stepper/Step/Step.styles.d.ts.map +1 -1
- package/lib/Stepper/Stepper.styles.d.ts.map +1 -1
- package/lib/Table/Table.styles.d.ts.map +1 -1
- package/lib/Tabs/Tab/Tab.d.ts.map +1 -1
- package/lib/Tabs/TabsList/TabsList.d.ts.map +1 -1
- package/lib/Tabs/TabsPanel/TabsPanel.d.ts.map +1 -1
- package/lib/Timeline/TimelineItem/TimelineItem.d.ts +1 -4
- package/lib/Timeline/TimelineItem/TimelineItem.d.ts.map +1 -1
- package/lib/Tooltip/Tooltip.d.ts +3 -1
- package/lib/Tooltip/Tooltip.d.ts.map +1 -1
- package/lib/TypographyStylesProvider/TypographyStylesProvider.styles.d.ts.map +1 -1
- package/package.json +4 -4
|
@@ -45,24 +45,9 @@ var __objRest = (source, exclude) => {
|
|
|
45
45
|
}
|
|
46
46
|
return target;
|
|
47
47
|
};
|
|
48
|
-
const
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
onKeyDown,
|
|
52
|
-
onClick,
|
|
53
|
-
chevron,
|
|
54
|
-
children,
|
|
55
|
-
className,
|
|
56
|
-
icon
|
|
57
|
-
} = _b, others = __objRest(_b, [
|
|
58
|
-
"disabled",
|
|
59
|
-
"onKeyDown",
|
|
60
|
-
"onClick",
|
|
61
|
-
"chevron",
|
|
62
|
-
"children",
|
|
63
|
-
"className",
|
|
64
|
-
"icon"
|
|
65
|
-
]);
|
|
48
|
+
const defaultProps = {};
|
|
49
|
+
const AccordionControl = React.forwardRef((props, ref) => {
|
|
50
|
+
const _a = styles.useComponentDefaultProps("AccordionControl", defaultProps, props), { disabled, onKeyDown, onClick, chevron, children, className, icon } = _a, others = __objRest(_a, ["disabled", "onKeyDown", "onClick", "chevron", "children", "className", "icon"]);
|
|
66
51
|
const ctx = Accordion_context.useAccordionContext();
|
|
67
52
|
const { value } = AccordionItem_context.useAccordionItemContext();
|
|
68
53
|
const { classNames, styles: styles$1, unstyled } = styles.useContextStylesApi();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AccordionControl.js","sources":["../../../src/Accordion/AccordionControl/AccordionControl.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport {
|
|
1
|
+
{"version":3,"file":"AccordionControl.js","sources":["../../../src/Accordion/AccordionControl/AccordionControl.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport {\n useContextStylesApi,\n DefaultProps,\n Selectors,\n useComponentDefaultProps,\n} from '@mantine/styles';\nimport { createScopedKeydownHandler } from '@mantine/utils';\nimport { UnstyledButton } from '../../UnstyledButton';\nimport { useAccordionContext } from '../Accordion.context';\nimport { useAccordionItemContext } from '../AccordionItem.context';\nimport useStyles from './AccordionControl.styles';\n\nexport type AccordionControlStylesNames = Selectors<typeof useStyles>;\n\nexport interface AccordionControlProps\n extends DefaultProps,\n React.ComponentPropsWithoutRef<'button'> {\n /** Disables control button */\n disabled?: boolean;\n\n /** Custom chevron icon */\n chevron?: React.ReactNode;\n\n /** Control label */\n children?: React.ReactNode;\n\n /** Icon rendered next to label */\n icon?: React.ReactNode;\n}\n\nconst defaultProps: Partial<AccordionControlProps> = {};\n\nexport const AccordionControl = forwardRef<HTMLButtonElement, AccordionControlProps>(\n (props: AccordionControlProps, ref) => {\n const { disabled, onKeyDown, onClick, chevron, children, className, icon, ...others } =\n useComponentDefaultProps('AccordionControl', defaultProps, props);\n const ctx = useAccordionContext();\n const { value } = useAccordionItemContext();\n const { classNames, styles, unstyled } = useContextStylesApi();\n const { classes, cx } = useStyles(\n {\n transitionDuration: ctx.transitionDuration,\n chevronPosition: ctx.chevronPosition,\n chevronSize: ctx.chevronSize,\n variant: ctx.variant,\n radius: ctx.radius,\n },\n { name: 'Accordion', classNames, styles, unstyled }\n );\n\n const isActive = ctx.isItemActive(value);\n const shouldWrapWithHeading = typeof ctx.order === 'number';\n const Heading = `h${ctx.order}` as const;\n\n const content = (\n <UnstyledButton<'button'>\n {...others}\n ref={ref}\n data-accordion-control\n disabled={disabled}\n className={cx(classes.control, className)}\n onClick={(event) => {\n onClick?.(event);\n ctx.onChange(value);\n }}\n type=\"button\"\n data-active={isActive || undefined}\n aria-expanded={isActive}\n aria-controls={ctx.getRegionId(value)}\n id={ctx.getControlId(value)}\n unstyled={unstyled}\n onKeyDown={createScopedKeydownHandler({\n siblingSelector: '[data-accordion-control]',\n parentSelector: '[data-accordion]',\n activateOnFocus: false,\n loop: ctx.loop,\n orientation: 'vertical',\n onKeyDown,\n })}\n >\n <div\n className={classes.chevron}\n data-rotate={(!ctx.disableChevronRotation && isActive) || undefined}\n >\n {chevron || ctx.chevron}\n </div>\n <div className={classes.label}>{children}</div>\n {icon && <div className={classes.icon}>{icon}</div>}\n </UnstyledButton>\n );\n\n return shouldWrapWithHeading ? (\n <Heading className={classes.itemTitle}>{content}</Heading>\n ) : (\n content\n );\n }\n);\n\nAccordionControl.displayName = '@mantine/core/AccordionControl';\n"],"names":["forwardRef","useComponentDefaultProps","useAccordionContext","useAccordionItemContext","styles","useContextStylesApi","useStyles","React","UnstyledButton","createScopedKeydownHandler"],"mappings":"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"}
|
|
@@ -41,8 +41,9 @@ var __objRest = (source, exclude) => {
|
|
|
41
41
|
}
|
|
42
42
|
return target;
|
|
43
43
|
};
|
|
44
|
-
const
|
|
45
|
-
|
|
44
|
+
const defaultProps = {};
|
|
45
|
+
const AccordionItem = React.forwardRef((props, ref) => {
|
|
46
|
+
const _a = styles.useComponentDefaultProps("AccordionItem", defaultProps, props), { children, className, value } = _a, others = __objRest(_a, ["children", "className", "value"]);
|
|
46
47
|
const { classNames, styles: styles$1, unstyled } = styles.useContextStylesApi();
|
|
47
48
|
const ctx = Accordion_context.useAccordionContext();
|
|
48
49
|
const { classes, cx } = AccordionItem_styles['default']({ variant: ctx.variant, radius: ctx.radius }, { name: "Accordion", classNames, styles: styles$1, unstyled });
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AccordionItem.js","sources":["../../../src/Accordion/AccordionItem/AccordionItem.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport {
|
|
1
|
+
{"version":3,"file":"AccordionItem.js","sources":["../../../src/Accordion/AccordionItem/AccordionItem.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport {\n DefaultProps,\n Selectors,\n useContextStylesApi,\n useComponentDefaultProps,\n} from '@mantine/styles';\nimport { Box } from '../../Box';\nimport { AccordionItemContextProvider } from '../AccordionItem.context';\nimport useStyles from './AccordionItem.styles';\nimport { useAccordionContext } from '../Accordion.context';\n\nexport type AccordionItemStylesNames = Selectors<typeof useStyles>;\n\nexport interface AccordionItemProps\n extends DefaultProps<AccordionItemStylesNames>,\n React.ComponentPropsWithoutRef<'div'> {\n /** Value that is used to manage accordion state */\n value: string;\n}\n\nconst defaultProps: Partial<DefaultProps> = {};\n\nexport const AccordionItem = forwardRef<HTMLDivElement, AccordionItemProps>((props, ref) => {\n const { children, className, value, ...others } = useComponentDefaultProps(\n 'AccordionItem',\n defaultProps,\n props\n );\n\n const { classNames, styles, unstyled } = useContextStylesApi();\n const ctx = useAccordionContext();\n const { classes, cx } = useStyles(\n { variant: ctx.variant, radius: ctx.radius },\n { name: 'Accordion', classNames, styles, unstyled }\n );\n\n return (\n <AccordionItemContextProvider value={{ value }}>\n <Box\n ref={ref}\n className={cx(classes.item, className)}\n data-active={ctx.isItemActive(value) || undefined}\n {...others}\n >\n {children}\n </Box>\n </AccordionItemContextProvider>\n );\n});\n\nAccordionItem.displayName = '@mantine/core/AccordionItem';\n"],"names":["forwardRef","useComponentDefaultProps","styles","useContextStylesApi","useAccordionContext","useStyles","React","AccordionItemContextProvider","Box"],"mappings":"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"}
|
|
@@ -44,8 +44,9 @@ var __objRest = (source, exclude) => {
|
|
|
44
44
|
}
|
|
45
45
|
return target;
|
|
46
46
|
};
|
|
47
|
-
|
|
48
|
-
|
|
47
|
+
const defaultProps = {};
|
|
48
|
+
function AccordionPanel(props) {
|
|
49
|
+
const _a = styles.useComponentDefaultProps("AccordionPanel", defaultProps, props), { children, className } = _a, others = __objRest(_a, ["children", "className"]);
|
|
49
50
|
const ctx = Accordion_context.useAccordionContext();
|
|
50
51
|
const { value } = AccordionItem_context.useAccordionItemContext();
|
|
51
52
|
const { classNames, styles: styles$1, unstyled } = styles.useContextStylesApi();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AccordionPanel.js","sources":["../../../src/Accordion/AccordionPanel/AccordionPanel.tsx"],"sourcesContent":["import React from 'react';\nimport {
|
|
1
|
+
{"version":3,"file":"AccordionPanel.js","sources":["../../../src/Accordion/AccordionPanel/AccordionPanel.tsx"],"sourcesContent":["import React from 'react';\nimport {\n Selectors,\n DefaultProps,\n useContextStylesApi,\n useComponentDefaultProps,\n} from '@mantine/styles';\nimport { Collapse } from '../../Collapse';\nimport { useAccordionContext } from '../Accordion.context';\nimport { useAccordionItemContext } from '../AccordionItem.context';\nimport useStyles from './AccordionPanel.styles';\n\nexport type AccordionPanelStylesNames = Selectors<typeof useStyles>;\n\nexport interface AccordionPanelProps\n extends DefaultProps,\n Omit<React.ComponentPropsWithoutRef<'div'>, 'onTransitionEnd'> {\n /** Panel content */\n children?: React.ReactNode;\n}\n\nconst defaultProps: Partial<AccordionPanelProps> = {};\n\nexport function AccordionPanel(props: AccordionPanelProps) {\n const { children, className, ...others } = useComponentDefaultProps(\n 'AccordionPanel',\n defaultProps,\n props\n );\n\n const ctx = useAccordionContext();\n const { value } = useAccordionItemContext();\n const { classNames, styles, unstyled } = useContextStylesApi();\n const { classes, cx } = useStyles(\n { variant: ctx.variant, radius: ctx.radius },\n { name: 'Accordion', classNames, styles, unstyled }\n );\n\n return (\n <Collapse\n {...others}\n className={cx(classes.panel, className)}\n in={ctx.isItemActive(value)}\n transitionDuration={ctx.transitionDuration}\n role=\"region\"\n id={ctx.getRegionId(value)}\n aria-labelledby={ctx.getControlId(value)}\n >\n <div className={classes.content}>{children}</div>\n </Collapse>\n );\n}\n\nAccordionPanel.displayName = '@mantine/core/AccordionPanel';\n"],"names":["useComponentDefaultProps","useAccordionContext","useAccordionItemContext","styles","useContextStylesApi","useStyles","React","Collapse"],"mappings":"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"}
|
|
@@ -4,7 +4,11 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
var React = require('react');
|
|
6
6
|
|
|
7
|
-
const AppShellContext = React.createContext({
|
|
7
|
+
const AppShellContext = React.createContext({
|
|
8
|
+
zIndex: 1e3,
|
|
9
|
+
fixed: false,
|
|
10
|
+
layout: "default"
|
|
11
|
+
});
|
|
8
12
|
const AppShellProvider = AppShellContext.Provider;
|
|
9
13
|
function useAppShellContext() {
|
|
10
14
|
return React.useContext(AppShellContext);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AppShell.context.js","sources":["../../src/AppShell/AppShell.context.ts"],"sourcesContent":["import { createContext, useContext } from 'react';\n\ninterface AppShellContextValue {\n zIndex
|
|
1
|
+
{"version":3,"file":"AppShell.context.js","sources":["../../src/AppShell/AppShell.context.ts"],"sourcesContent":["import { createContext, useContext } from 'react';\n\ninterface AppShellContextValue {\n zIndex: React.CSSProperties['zIndex'];\n fixed: boolean;\n layout: 'default' | 'alt';\n}\n\nconst AppShellContext = createContext<AppShellContextValue>({\n zIndex: 1000,\n fixed: false,\n layout: 'default',\n});\n\nexport const AppShellProvider = AppShellContext.Provider;\n\nexport function useAppShellContext() {\n return useContext(AppShellContext);\n}\n"],"names":["createContext","useContext"],"mappings":";;;;;;AACA,MAAM,eAAe,GAAGA,mBAAa,CAAC;AACtC,EAAE,MAAM,EAAE,GAAG;AACb,EAAE,KAAK,EAAE,KAAK;AACd,EAAE,MAAM,EAAE,SAAS;AACnB,CAAC,CAAC,CAAC;AACS,MAAC,gBAAgB,GAAG,eAAe,CAAC,SAAS;AAClD,SAAS,kBAAkB,GAAG;AACrC,EAAE,OAAOC,gBAAU,CAAC,eAAe,CAAC,CAAC;AACrC;;;;;"}
|
package/cjs/AppShell/AppShell.js
CHANGED
|
@@ -61,7 +61,8 @@ const AppShell = React.forwardRef((props, ref) => {
|
|
|
61
61
|
styles: styles$1,
|
|
62
62
|
classNames,
|
|
63
63
|
unstyled,
|
|
64
|
-
hidden
|
|
64
|
+
hidden,
|
|
65
|
+
layout
|
|
65
66
|
} = _a, others = __objRest(_a, [
|
|
66
67
|
"children",
|
|
67
68
|
"navbar",
|
|
@@ -77,14 +78,15 @@ const AppShell = React.forwardRef((props, ref) => {
|
|
|
77
78
|
"styles",
|
|
78
79
|
"classNames",
|
|
79
80
|
"unstyled",
|
|
80
|
-
"hidden"
|
|
81
|
+
"hidden",
|
|
82
|
+
"layout"
|
|
81
83
|
]);
|
|
82
84
|
const { classes, cx } = AppShell_styles['default']({ padding, fixed, navbarOffsetBreakpoint, asideOffsetBreakpoint }, { styles: styles$1, classNames, unstyled, name: "AppShell" });
|
|
83
85
|
if (hidden) {
|
|
84
86
|
return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, children);
|
|
85
87
|
}
|
|
86
88
|
return /* @__PURE__ */ React__default.createElement(AppShell_context.AppShellProvider, {
|
|
87
|
-
value: { fixed, zIndex }
|
|
89
|
+
value: { fixed, zIndex, layout }
|
|
88
90
|
}, /* @__PURE__ */ React__default.createElement(Box.Box, __spreadValues({
|
|
89
91
|
className: cx(classes.root, className),
|
|
90
92
|
ref
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AppShell.js","sources":["../../src/AppShell/AppShell.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport {\n MantineNumberSize,\n DefaultProps,\n Selectors,\n MantineStyleSystemSize,\n getDefaultZIndex,\n useComponentDefaultProps,\n} from '@mantine/styles';\nimport { Box } from '../Box';\nimport { AppShellProvider } from './AppShell.context';\nimport useStyles from './AppShell.styles';\n\nexport type AppShellStylesNames = Selectors<typeof useStyles>;\n\nexport interface AppShellProps\n extends Omit<DefaultProps<AppShellStylesNames>, MantineStyleSystemSize> {\n /** <Navbar /> component */\n navbar?: React.ReactElement;\n\n /** <Aside /> component */\n aside?: React.ReactElement;\n\n /** <Header /> component */\n header?: React.ReactElement;\n\n /** <Footer /> component */\n footer?: React.ReactElement;\n\n /** zIndex prop passed to Navbar and Header components */\n zIndex?: React.CSSProperties['zIndex'];\n\n /** true to switch from static layout to fixed */\n fixed?: boolean;\n\n /** true to hide all AppShell parts and render only children */\n hidden?: boolean;\n\n /** AppShell content */\n children: React.ReactNode;\n\n /** Content padding */\n padding?: MantineNumberSize;\n\n /** Breakpoint at which Navbar component should no longer be offset with padding-left, applicable only for fixed position */\n navbarOffsetBreakpoint?: MantineNumberSize;\n\n /** Breakpoint at which Aside component should no longer be offset with padding-right, applicable only for fixed position */\n asideOffsetBreakpoint?: MantineNumberSize;\n}\n\nconst defaultProps: Partial<AppShellProps> = {\n fixed: true,\n zIndex: getDefaultZIndex('app'),\n padding: 'md',\n};\n\nexport const AppShell = forwardRef<HTMLDivElement, AppShellProps>((props: AppShellProps, ref) => {\n const {\n children,\n navbar,\n header,\n footer,\n aside,\n fixed,\n zIndex,\n padding,\n navbarOffsetBreakpoint,\n asideOffsetBreakpoint,\n className,\n styles,\n classNames,\n unstyled,\n hidden,\n ...others\n } = useComponentDefaultProps('AppShell', defaultProps, props);\n const { classes, cx } = useStyles(\n { padding, fixed, navbarOffsetBreakpoint, asideOffsetBreakpoint },\n { styles, classNames, unstyled, name: 'AppShell' }\n );\n\n if (hidden) {\n return <>{children}</>;\n }\n\n return (\n <AppShellProvider value={{ fixed, zIndex }}>\n <Box className={cx(classes.root, className)} ref={ref} {...others}>\n {header}\n\n <div className={classes.body}>\n {navbar}\n <main className={classes.main}>{children}</main>\n {aside}\n </div>\n\n {footer}\n </Box>\n </AppShellProvider>\n );\n});\n\nAppShell.displayName = '@mantine/core/AppShell';\n"],"names":["getDefaultZIndex","forwardRef","useComponentDefaultProps","styles","useStyles","React","AppShellProvider","Box"],"mappings":"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
|
|
1
|
+
{"version":3,"file":"AppShell.js","sources":["../../src/AppShell/AppShell.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport {\n MantineNumberSize,\n DefaultProps,\n Selectors,\n MantineStyleSystemSize,\n getDefaultZIndex,\n useComponentDefaultProps,\n} from '@mantine/styles';\nimport { Box } from '../Box';\nimport { AppShellProvider } from './AppShell.context';\nimport useStyles from './AppShell.styles';\n\nexport type AppShellStylesNames = Selectors<typeof useStyles>;\n\nexport interface AppShellProps\n extends Omit<DefaultProps<AppShellStylesNames>, MantineStyleSystemSize> {\n /** Determines how Navbar and Aside components are positioned relative to Header and Footer components */\n layout?: 'default' | 'alt';\n\n /** <Navbar /> component */\n navbar?: React.ReactElement;\n\n /** <Aside /> component */\n aside?: React.ReactElement;\n\n /** <Header /> component */\n header?: React.ReactElement;\n\n /** <Footer /> component */\n footer?: React.ReactElement;\n\n /** zIndex prop passed to Navbar and Header components */\n zIndex?: React.CSSProperties['zIndex'];\n\n /** true to switch from static layout to fixed */\n fixed?: boolean;\n\n /** true to hide all AppShell parts and render only children */\n hidden?: boolean;\n\n /** AppShell content */\n children: React.ReactNode;\n\n /** Content padding */\n padding?: MantineNumberSize;\n\n /** Breakpoint at which Navbar component should no longer be offset with padding-left, applicable only for fixed position */\n navbarOffsetBreakpoint?: MantineNumberSize;\n\n /** Breakpoint at which Aside component should no longer be offset with padding-right, applicable only for fixed position */\n asideOffsetBreakpoint?: MantineNumberSize;\n}\n\nconst defaultProps: Partial<AppShellProps> = {\n fixed: true,\n zIndex: getDefaultZIndex('app'),\n padding: 'md',\n};\n\nexport const AppShell = forwardRef<HTMLDivElement, AppShellProps>((props: AppShellProps, ref) => {\n const {\n children,\n navbar,\n header,\n footer,\n aside,\n fixed,\n zIndex,\n padding,\n navbarOffsetBreakpoint,\n asideOffsetBreakpoint,\n className,\n styles,\n classNames,\n unstyled,\n hidden,\n layout,\n ...others\n } = useComponentDefaultProps('AppShell', defaultProps, props);\n\n const { classes, cx } = useStyles(\n { padding, fixed, navbarOffsetBreakpoint, asideOffsetBreakpoint },\n { styles, classNames, unstyled, name: 'AppShell' }\n );\n\n if (hidden) {\n return <>{children}</>;\n }\n\n return (\n <AppShellProvider value={{ fixed, zIndex, layout }}>\n <Box className={cx(classes.root, className)} ref={ref} {...others}>\n {header}\n\n <div className={classes.body}>\n {navbar}\n <main className={classes.main}>{children}</main>\n {aside}\n </div>\n\n {footer}\n </Box>\n </AppShellProvider>\n );\n});\n\nAppShell.displayName = '@mantine/core/AppShell';\n"],"names":["getDefaultZIndex","forwardRef","useComponentDefaultProps","styles","useStyles","React","AppShellProvider","Box"],"mappings":"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"}
|
|
@@ -84,7 +84,8 @@ const HorizontalSection = React.forwardRef((_a, ref) => {
|
|
|
84
84
|
hiddenBreakpoint,
|
|
85
85
|
zIndex: ctx.zIndex || zIndex,
|
|
86
86
|
section,
|
|
87
|
-
withBorder
|
|
87
|
+
withBorder,
|
|
88
|
+
layout: ctx.layout
|
|
88
89
|
}, { classNames, styles: styles$1, name: __staticSelector, unstyled });
|
|
89
90
|
const breakpoints = getSortedBreakpoints.getSortedBreakpoints(width, theme).reduce((acc, [breakpoint, breakpointSize]) => {
|
|
90
91
|
acc[`@media (min-width: ${breakpoint}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 /**
|
|
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 /** Determines whether the element should have 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 layout: ctx.layout,\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}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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"}
|
|
@@ -32,7 +32,8 @@ var useStyles = styles.createStyles((theme, {
|
|
|
32
32
|
hiddenBreakpoint,
|
|
33
33
|
zIndex,
|
|
34
34
|
section,
|
|
35
|
-
withBorder
|
|
35
|
+
withBorder,
|
|
36
|
+
layout
|
|
36
37
|
}) => {
|
|
37
38
|
const breakpoints = typeof width === "object" && width !== null ? getSortedBreakpoints.getSortedBreakpoints(width, theme).reduce((acc, [breakpoint, breakpointSize]) => {
|
|
38
39
|
acc[`@media (min-width: ${breakpoint}px)`] = {
|
|
@@ -46,10 +47,10 @@ var useStyles = styles.createStyles((theme, {
|
|
|
46
47
|
} : {};
|
|
47
48
|
return {
|
|
48
49
|
root: __spreadProps(__spreadValues(__spreadValues(__spreadProps(__spreadValues(__spreadValues({}, theme.fn.fontStyles()), position), {
|
|
49
|
-
top: (position == null ? void 0 : position.top) || "var(--mantine-header-height)",
|
|
50
|
+
top: layout === "alt" ? 0 : (position == null ? void 0 : position.top) || "var(--mantine-header-height)",
|
|
50
51
|
bottom: 0,
|
|
51
52
|
zIndex,
|
|
52
|
-
height: height || "calc(100vh - var(--mantine-header-height, 0px) - var(--mantine-footer-height, 0px))",
|
|
53
|
+
height: height || (layout === "alt" ? "auto" : "calc(100vh - var(--mantine-header-height, 0px) - var(--mantine-footer-height, 0px))"),
|
|
53
54
|
width: (width == null ? void 0 : width.base) || "100%",
|
|
54
55
|
position: fixed ? "fixed" : "static",
|
|
55
56
|
boxSizing: "border-box",
|
|
@@ -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 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}px)`] = {\n width: breakpointSize,\n minWidth: breakpointSize,\n };\n\n return acc;\n }, {})\n : null;\n\n const borderStyles = withBorder\n ? {\n [section === 'navbar' ? 'borderRight' : 'borderLeft']: `1px solid ${\n theme.colorScheme === 'dark' ? theme.colors.dark[5] : theme.colors.gray[2]\n }`,\n }\n : {};\n\n return {\n root: {\n ...theme.fn.fontStyles(),\n ...position,\n top: position?.top || 'var(--mantine-header-height)',\n bottom: 0,\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 ...borderStyles,\n ...breakpoints,\n\n '&[data-hidden]': {\n [`@media (max-width: ${\n theme.fn.size({\n size: hiddenBreakpoint,\n sizes: theme.breakpoints,\n }) - 1\n }px)`]: {\n display: 'none',\n },\n },\n },\n };\n }\n);\n"],"names":["createStyles","getSortedBreakpoints"],"mappings":"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
|
|
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 layout: 'default' | 'alt';\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 layout,\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}px)`] = {\n width: breakpointSize,\n minWidth: breakpointSize,\n };\n\n return acc;\n }, {})\n : null;\n\n const borderStyles = withBorder\n ? {\n [section === 'navbar' ? 'borderRight' : 'borderLeft']: `1px solid ${\n theme.colorScheme === 'dark' ? theme.colors.dark[5] : theme.colors.gray[2]\n }`,\n }\n : {};\n\n return {\n root: {\n ...theme.fn.fontStyles(),\n ...position,\n top: layout === 'alt' ? 0 : position?.top || 'var(--mantine-header-height)',\n bottom: 0,\n zIndex,\n height:\n height ||\n (layout === 'alt'\n ? 'auto'\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 ...borderStyles,\n ...breakpoints,\n\n '&[data-hidden]': {\n [`@media (max-width: ${\n theme.fn.size({\n size: hiddenBreakpoint,\n sizes: theme.breakpoints,\n }) - 1\n }px)`]: {\n display: 'none',\n },\n },\n },\n };\n }\n);\n"],"names":["createStyles","getSortedBreakpoints"],"mappings":"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"}
|
|
@@ -70,11 +70,13 @@ const VerticalSection = React.forwardRef((_a, ref) => {
|
|
|
70
70
|
"__staticSelector"
|
|
71
71
|
]);
|
|
72
72
|
const ctx = AppShell_context.useAppShellContext();
|
|
73
|
+
const _zIndex = ctx.zIndex || zIndex;
|
|
73
74
|
const { classes, cx, theme } = VerticalSection_styles['default']({
|
|
74
75
|
height,
|
|
75
76
|
fixed: ctx.fixed || fixed,
|
|
76
77
|
position,
|
|
77
|
-
zIndex: ctx.
|
|
78
|
+
zIndex: typeof _zIndex === "number" && ctx.layout === "default" ? _zIndex + 1 : _zIndex,
|
|
79
|
+
layout: ctx.layout,
|
|
78
80
|
borderPosition: withBorder ? section === "header" ? "bottom" : "top" : "none"
|
|
79
81
|
}, { name: __staticSelector, classNames, styles: styles$1, unstyled });
|
|
80
82
|
const breakpoints = typeof height === "object" && height !== null ? getSortedBreakpoints.getSortedBreakpoints(height, theme).reduce((acc, [breakpoint, breakpointSize]) => {
|
|
@@ -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, {\n VerticalSectionHeight,\n VerticalSectionPosition,\n} from './VerticalSection.styles';\nimport { getSortedBreakpoints } from '../HorizontalSection/get-sorted-breakpoints/get-sorted-breakpoints';\n\nexport interface VerticalSectionSharedProps extends DefaultProps {\n /** Section content */\n children: React.ReactNode;\n\n /** Component height with breakpoints */\n height: VerticalSectionHeight;\n\n /**
|
|
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, {\n VerticalSectionHeight,\n VerticalSectionPosition,\n} from './VerticalSection.styles';\nimport { getSortedBreakpoints } from '../HorizontalSection/get-sorted-breakpoints/get-sorted-breakpoints';\n\nexport interface VerticalSectionSharedProps extends DefaultProps {\n /** Section content */\n children: React.ReactNode;\n\n /** Component height with breakpoints */\n height: VerticalSectionHeight;\n\n /** Determines whether the element should have 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 const _zIndex = ctx.zIndex || zIndex;\n\n const { classes, cx, theme } = useStyles(\n {\n height,\n fixed: ctx.fixed || fixed,\n position,\n zIndex: typeof _zIndex === 'number' && ctx.layout === 'default' ? _zIndex + 1 : _zIndex,\n layout: ctx.layout,\n borderPosition: withBorder ? (section === 'header' ? 'bottom' : 'top') : 'none',\n },\n { name: __staticSelector, classNames, styles, unstyled }\n );\n const breakpoints =\n typeof height === 'object' && height !== null\n ? getSortedBreakpoints(height, theme).reduce((acc, [breakpoint, breakpointSize]) => {\n acc[`@media (min-width: ${breakpoint}px)`] = {\n [`--mantine-${section}-height`]: `${breakpointSize}px`,\n };\n\n return acc;\n }, {})\n : null;\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`]:\n typeof height === 'object' ? `${height?.base}px` || '100%' : `${height}px`,\n ...breakpoints,\n },\n })}\n />\n </Box>\n );\n }\n);\n\nVerticalSection.displayName = '@mantine/core/VerticalSection';\n"],"names":["forwardRef","styles","getDefaultZIndex","useAppShellContext","useStyles","getSortedBreakpoints","React","Box","Global"],"mappings":"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"}
|
|
@@ -24,7 +24,7 @@ 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, { height, fixed, position, zIndex, borderPosition }) => {
|
|
27
|
+
var useStyles = styles.createStyles((theme, { height, fixed, position, zIndex, borderPosition, layout }) => {
|
|
28
28
|
const breakpoints = typeof height === "object" && height !== null ? getSortedBreakpoints.getSortedBreakpoints(height, theme).reduce((acc, [breakpoint, breakpointSize]) => {
|
|
29
29
|
acc[`@media (min-width: ${breakpoint}px)`] = {
|
|
30
30
|
height: breakpointSize,
|
|
@@ -35,6 +35,8 @@ var useStyles = styles.createStyles((theme, { height, fixed, position, zIndex, b
|
|
|
35
35
|
return {
|
|
36
36
|
root: __spreadProps(__spreadValues(__spreadProps(__spreadValues(__spreadValues({}, theme.fn.fontStyles()), position), {
|
|
37
37
|
zIndex,
|
|
38
|
+
left: layout === "alt" ? "var(--mantine-navbar-width, 0)" : 0,
|
|
39
|
+
right: layout === "alt" ? "var(--mantine-aside-width, 0)" : 0,
|
|
38
40
|
height: typeof height === "object" ? (height == null ? void 0 : height.base) || "100%" : height,
|
|
39
41
|
maxHeight: typeof height === "object" ? (height == null ? void 0 : height.base) || "100%" : height,
|
|
40
42
|
position: fixed ? "fixed" : "static",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VerticalSection.styles.js","sources":["../../../src/AppShell/VerticalSection/VerticalSection.styles.ts"],"sourcesContent":["import { createStyles } from '@mantine/styles';\nimport { getSortedBreakpoints } from '../HorizontalSection/get-sorted-breakpoints/get-sorted-breakpoints';\n\nexport type VerticalSectionHeight = number | string | Partial<Record<string, string | number>>;\n\nexport interface VerticalSectionPosition {\n top?: number;\n left?: number;\n bottom?: number;\n right?: number;\n}\n\ninterface VerticalSectionStyles {\n height: VerticalSectionHeight;\n fixed: boolean;\n position: VerticalSectionPosition;\n zIndex: React.CSSProperties['zIndex'];\n borderPosition: 'top' | 'bottom' | 'none';\n}\n\nexport default createStyles(\n (theme, { height, fixed, position, zIndex, borderPosition }: VerticalSectionStyles) => {\n const breakpoints =\n typeof height === 'object' && height !== null\n ? getSortedBreakpoints(height, theme).reduce((acc, [breakpoint, breakpointSize]) => {\n acc[`@media (min-width: ${breakpoint}px)`] = {\n height: breakpointSize,\n minHeight: breakpointSize,\n };\n\n return acc;\n }, {})\n : null;\n return {\n root: {\n ...theme.fn.fontStyles(),\n ...position,\n zIndex,\n height: typeof height === 'object' ? height?.base || '100%' : height,\n maxHeight: typeof height === 'object' ? height?.base || '100%' : height,\n position: fixed ? 'fixed' : 'static',\n boxSizing: 'border-box',\n backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[7] : theme.white,\n ...breakpoints,\n borderBottom:\n borderPosition === 'bottom'\n ? `1px solid ${\n theme.colorScheme === 'dark' ? theme.colors.dark[5] : theme.colors.gray[2]\n }`\n : undefined,\n borderTop:\n borderPosition === 'top'\n ? `1px solid ${\n theme.colorScheme === 'dark' ? theme.colors.dark[5] : theme.colors.gray[2]\n }`\n : undefined,\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,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,cAAc,EAAE,KAAK;
|
|
1
|
+
{"version":3,"file":"VerticalSection.styles.js","sources":["../../../src/AppShell/VerticalSection/VerticalSection.styles.ts"],"sourcesContent":["import { createStyles } from '@mantine/styles';\nimport { getSortedBreakpoints } from '../HorizontalSection/get-sorted-breakpoints/get-sorted-breakpoints';\n\nexport type VerticalSectionHeight = number | string | Partial<Record<string, string | number>>;\n\nexport interface VerticalSectionPosition {\n top?: number;\n left?: number;\n bottom?: number;\n right?: number;\n}\n\ninterface VerticalSectionStyles {\n height: VerticalSectionHeight;\n fixed: boolean;\n position: VerticalSectionPosition;\n zIndex: React.CSSProperties['zIndex'];\n borderPosition: 'top' | 'bottom' | 'none';\n layout: 'default' | 'alt';\n}\n\nexport default createStyles(\n (theme, { height, fixed, position, zIndex, borderPosition, layout }: VerticalSectionStyles) => {\n const breakpoints =\n typeof height === 'object' && height !== null\n ? getSortedBreakpoints(height, theme).reduce((acc, [breakpoint, breakpointSize]) => {\n acc[`@media (min-width: ${breakpoint}px)`] = {\n height: breakpointSize,\n minHeight: breakpointSize,\n };\n\n return acc;\n }, {})\n : null;\n return {\n root: {\n ...theme.fn.fontStyles(),\n ...position,\n zIndex,\n left: layout === 'alt' ? 'var(--mantine-navbar-width, 0)' : 0,\n right: layout === 'alt' ? 'var(--mantine-aside-width, 0)' : 0,\n height: typeof height === 'object' ? height?.base || '100%' : height,\n maxHeight: typeof height === 'object' ? height?.base || '100%' : height,\n position: fixed ? 'fixed' : 'static',\n boxSizing: 'border-box',\n backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[7] : theme.white,\n ...breakpoints,\n borderBottom:\n borderPosition === 'bottom'\n ? `1px solid ${\n theme.colorScheme === 'dark' ? theme.colors.dark[5] : theme.colors.gray[2]\n }`\n : undefined,\n borderTop:\n borderPosition === 'top'\n ? `1px solid ${\n theme.colorScheme === 'dark' ? theme.colors.dark[5] : theme.colors.gray[2]\n }`\n : undefined,\n },\n };\n }\n);\n"],"names":["createStyles","getSortedBreakpoints"],"mappings":"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"}
|
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var React = require('react');
|
|
6
|
+
var styles = require('@mantine/styles');
|
|
6
7
|
var utils = require('@mantine/utils');
|
|
7
8
|
var Card_context = require('../Card.context.js');
|
|
8
9
|
var CardSection_styles = require('./CardSection.styles.js');
|
|
@@ -40,8 +41,12 @@ var __objRest = (source, exclude) => {
|
|
|
40
41
|
}
|
|
41
42
|
return target;
|
|
42
43
|
};
|
|
43
|
-
const
|
|
44
|
-
|
|
44
|
+
const defaultProps = {
|
|
45
|
+
withBorder: false,
|
|
46
|
+
inheritPadding: false
|
|
47
|
+
};
|
|
48
|
+
const _CardSection = React.forwardRef((props, ref) => {
|
|
49
|
+
const _a = styles.useComponentDefaultProps("CardSection", defaultProps, props), { className, withBorder, inheritPadding, unstyled } = _a, others = __objRest(_a, ["className", "withBorder", "inheritPadding", "unstyled"]);
|
|
45
50
|
const { classes, cx } = CardSection_styles['default']({ padding: Card_context.useCardPadding(), withBorder, inheritPadding }, { name: "Card", unstyled });
|
|
46
51
|
return /* @__PURE__ */ React__default.createElement(Box.Box, __spreadValues({
|
|
47
52
|
className: cx(classes.cardSection, className),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CardSection.js","sources":["../../../src/Card/CardSection/CardSection.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { DefaultProps } from '@mantine/styles';\nimport { createPolymorphicComponent } from '@mantine/utils';\nimport { useCardPadding } from '../Card.context';\nimport { Box } from '../../Box';\nimport useStyles from './CardSection.styles';\n\nexport interface CardSectionProps extends DefaultProps {\n /** Determines whether section should have border */\n withBorder?: boolean;\n\n /** Determines whether section from inherit padding from Card */\n inheritPadding?: boolean;\n}\n\nexport const _CardSection = forwardRef<HTMLDivElement, CardSectionProps>(\n
|
|
1
|
+
{"version":3,"file":"CardSection.js","sources":["../../../src/Card/CardSection/CardSection.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { DefaultProps, useComponentDefaultProps } from '@mantine/styles';\nimport { createPolymorphicComponent } from '@mantine/utils';\nimport { useCardPadding } from '../Card.context';\nimport { Box } from '../../Box';\nimport useStyles from './CardSection.styles';\n\nexport interface CardSectionProps extends DefaultProps {\n /** Determines whether section should have border */\n withBorder?: boolean;\n\n /** Determines whether section from inherit padding from Card */\n inheritPadding?: boolean;\n}\n\nconst defaultProps: Partial<CardSectionProps> = {\n withBorder: false,\n inheritPadding: false,\n};\n\nexport const _CardSection = forwardRef<HTMLDivElement, CardSectionProps>((props, ref) => {\n const { className, withBorder, inheritPadding, unstyled, ...others } = useComponentDefaultProps(\n 'CardSection',\n defaultProps,\n props\n );\n\n const { classes, cx } = useStyles(\n { padding: useCardPadding(), withBorder, inheritPadding },\n { name: 'Card', unstyled }\n );\n\n return <Box className={cx(classes.cardSection, className)} ref={ref} {...others} />;\n});\n\n_CardSection.displayName = '@mantine/core/CardSection';\n\nexport const CardSection = createPolymorphicComponent<'div', CardSectionProps>(_CardSection);\n"],"names":["forwardRef","useComponentDefaultProps","useStyles","useCardPadding","React","Box","createPolymorphicComponent"],"mappings":"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"}
|
|
@@ -5,10 +5,13 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
var React = require('react');
|
|
6
6
|
var hooks = require('@mantine/hooks');
|
|
7
7
|
var styles = require('@mantine/styles');
|
|
8
|
+
var utils = require('@mantine/utils');
|
|
8
9
|
var ColorPicker = require('../ColorPicker/ColorPicker.js');
|
|
10
|
+
var EyeDropperIcon = require('./EyeDropperIcon.js');
|
|
9
11
|
var useInputProps = require('../Input/use-input-props.js');
|
|
10
|
-
var
|
|
12
|
+
var ActionIcon = require('../ActionIcon/ActionIcon.js');
|
|
11
13
|
var converters = require('../ColorPicker/converters/converters.js');
|
|
14
|
+
var parsers = require('../ColorPicker/converters/parsers.js');
|
|
12
15
|
var Input = require('../Input/Input.js');
|
|
13
16
|
var Popover = require('../Popover/Popover.js');
|
|
14
17
|
var ColorSwatch = require('../ColorSwatch/ColorSwatch.js');
|
|
@@ -55,6 +58,20 @@ const SWATCH_SIZES = {
|
|
|
55
58
|
lg: 28,
|
|
56
59
|
xl: 36
|
|
57
60
|
};
|
|
61
|
+
const EYE_DROPPER_SIZES = {
|
|
62
|
+
xs: 14,
|
|
63
|
+
sm: 16,
|
|
64
|
+
md: 18,
|
|
65
|
+
lg: 20,
|
|
66
|
+
xl: 22
|
|
67
|
+
};
|
|
68
|
+
const RIGHT_SECTION_WIDTH = {
|
|
69
|
+
xs: 28,
|
|
70
|
+
sm: 32,
|
|
71
|
+
md: 38,
|
|
72
|
+
lg: 44,
|
|
73
|
+
xl: 58
|
|
74
|
+
};
|
|
58
75
|
const defaultProps = {
|
|
59
76
|
size: "sm",
|
|
60
77
|
format: "hex",
|
|
@@ -66,7 +83,8 @@ const defaultProps = {
|
|
|
66
83
|
dropdownZIndex: styles.getDefaultZIndex("popover"),
|
|
67
84
|
transitionDuration: 0,
|
|
68
85
|
withinPortal: true,
|
|
69
|
-
shadow: "md"
|
|
86
|
+
shadow: "md",
|
|
87
|
+
withEyeDropper: false
|
|
70
88
|
};
|
|
71
89
|
const ColorInput = React.forwardRef((props, ref) => {
|
|
72
90
|
const _a = useInputProps.useInputProps("ColorInput", defaultProps, props), {
|
|
@@ -95,7 +113,11 @@ const ColorInput = React.forwardRef((props, ref) => {
|
|
|
95
113
|
classNames,
|
|
96
114
|
styles: styles$1,
|
|
97
115
|
unstyled,
|
|
98
|
-
readOnly
|
|
116
|
+
readOnly,
|
|
117
|
+
withEyeDropper,
|
|
118
|
+
eyeDropperIcon,
|
|
119
|
+
rightSection,
|
|
120
|
+
rightSectionWidth
|
|
99
121
|
} = _a, others = __objRest(_a, [
|
|
100
122
|
"wrapperProps",
|
|
101
123
|
"inputProps",
|
|
@@ -122,7 +144,11 @@ const ColorInput = React.forwardRef((props, ref) => {
|
|
|
122
144
|
"classNames",
|
|
123
145
|
"styles",
|
|
124
146
|
"unstyled",
|
|
125
|
-
"readOnly"
|
|
147
|
+
"readOnly",
|
|
148
|
+
"withEyeDropper",
|
|
149
|
+
"eyeDropperIcon",
|
|
150
|
+
"rightSection",
|
|
151
|
+
"rightSectionWidth"
|
|
126
152
|
]);
|
|
127
153
|
const theme = styles.useMantineTheme();
|
|
128
154
|
const [dropdownOpened, setDropdownOpened] = React.useState(false);
|
|
@@ -133,6 +159,14 @@ const ColorInput = React.forwardRef((props, ref) => {
|
|
|
133
159
|
finalValue: "",
|
|
134
160
|
onChange
|
|
135
161
|
});
|
|
162
|
+
const { supported: eyeDropperSupported, open: openEyeDropper } = hooks.useEyeDropper();
|
|
163
|
+
const eyeDropper = /* @__PURE__ */ React__default.createElement(ActionIcon.ActionIcon, {
|
|
164
|
+
sx: { color: theme.colorScheme === "dark" ? theme.colors.dark[0] : theme.black },
|
|
165
|
+
size: inputProps.size,
|
|
166
|
+
onClick: () => openEyeDropper().then(({ sRGBHex }) => setValue(converters.convertHsvaTo(format, parsers.parseColor(sRGBHex)))).catch(utils.noop)
|
|
167
|
+
}, eyeDropperIcon || /* @__PURE__ */ React__default.createElement(EyeDropperIcon.EyeDropperIcon, {
|
|
168
|
+
size: theme.fn.size({ size: inputProps.size, sizes: EYE_DROPPER_SIZES })
|
|
169
|
+
}));
|
|
136
170
|
const handleInputFocus = (event) => {
|
|
137
171
|
typeof onFocus === "function" && onFocus(event);
|
|
138
172
|
setDropdownOpened(true);
|
|
@@ -192,7 +226,9 @@ const ColorInput = React.forwardRef((props, ref) => {
|
|
|
192
226
|
sx: { cursor: disallowInput ? "pointer" : void 0 },
|
|
193
227
|
unstyled,
|
|
194
228
|
classNames,
|
|
195
|
-
styles: styles$1
|
|
229
|
+
styles: styles$1,
|
|
230
|
+
rightSection: rightSection || (eyeDropperSupported ? eyeDropper : null),
|
|
231
|
+
rightSectionWidth: rightSectionWidth != null ? rightSectionWidth : theme.fn.size({ size: inputProps.size, sizes: RIGHT_SECTION_WIDTH })
|
|
196
232
|
})))), /* @__PURE__ */ React__default.createElement(Popover.Popover.Dropdown, {
|
|
197
233
|
onMouseDown: (event) => event.preventDefault(),
|
|
198
234
|
p: inputProps.size
|