@mantine/core 3.5.0 → 3.5.4
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/components/AppShell/AppShell.styles.js +1 -0
- package/cjs/components/AppShell/AppShell.styles.js.map +1 -1
- package/cjs/components/Drawer/Drawer.js +10 -5
- package/cjs/components/Drawer/Drawer.js.map +1 -1
- package/cjs/components/Image/Image.js +15 -6
- package/cjs/components/Image/Image.js.map +1 -1
- package/cjs/components/Modal/Modal.js +10 -5
- package/cjs/components/Modal/Modal.js.map +1 -1
- package/cjs/components/Portal/Portal.js +1 -1
- package/cjs/components/Portal/Portal.js.map +1 -1
- package/cjs/components/SegmentedControl/SegmentedControl.js +16 -19
- package/cjs/components/SegmentedControl/SegmentedControl.js.map +1 -1
- package/esm/components/AppShell/AppShell.styles.js +1 -0
- package/esm/components/AppShell/AppShell.styles.js.map +1 -1
- package/esm/components/Drawer/Drawer.js +10 -5
- package/esm/components/Drawer/Drawer.js.map +1 -1
- package/esm/components/Image/Image.js +17 -8
- package/esm/components/Image/Image.js.map +1 -1
- package/esm/components/Modal/Modal.js +10 -5
- package/esm/components/Modal/Modal.js.map +1 -1
- package/esm/components/Portal/Portal.js +1 -1
- package/esm/components/Portal/Portal.js.map +1 -1
- package/esm/components/SegmentedControl/SegmentedControl.js +17 -20
- package/esm/components/SegmentedControl/SegmentedControl.js.map +1 -1
- package/lib/components/AppShell/AppShell.styles.d.ts.map +1 -1
- package/lib/components/Drawer/Drawer.d.ts +4 -2
- package/lib/components/Drawer/Drawer.d.ts.map +1 -1
- package/lib/components/Image/Image.d.ts.map +1 -1
- package/lib/components/Modal/Modal.d.ts +4 -2
- package/lib/components/Modal/Modal.d.ts.map +1 -1
- package/lib/components/Portal/Portal.d.ts +1 -1
- package/lib/components/Portal/Portal.d.ts.map +1 -1
- package/lib/components/SegmentedControl/SegmentedControl.d.ts.map +1 -1
- package/package.json +3 -3
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AppShell.styles.js","sources":["../../../src/components/AppShell/AppShell.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize, MantineTheme, CSSObject } from '@mantine/styles';\n\ninterface AppShellStyles {\n padding: MantineNumberSize;\n fixed: boolean;\n headerHeight: string;\n navbarBreakpoints: [number, { width: string | number }][];\n navbarWidth: string;\n navbarOffsetBreakpoint: MantineNumberSize;\n}\n\nfunction getPositionStyles(props: AppShellStyles, theme: MantineTheme): CSSObject {\n const padding = theme.fn.size({ size: props.padding, sizes: theme.spacing });\n const offset = props.navbarOffsetBreakpoint\n ? theme.fn.size({ size: props.navbarOffsetBreakpoint, sizes: theme.breakpoints })\n : null;\n\n if (!props.fixed) {\n return { padding };\n }\n\n const queries = props.navbarBreakpoints.reduce((acc, [breakpoint, breakpointSize]) => {\n acc[`@media (min-width: ${breakpoint + 1}px)`] = {\n paddingLeft: `calc(${breakpointSize}px + ${padding}px)`,\n };\n\n return acc;\n }, {});\n\n if (offset) {\n queries[`@media (max-width: ${offset}px)`] = {\n paddingLeft: padding,\n };\n }\n\n return {\n minHeight: '100vh',\n paddingTop: `calc(${props.headerHeight} + ${padding}px)`,\n paddingLeft: `calc(${props.navbarWidth} + ${padding}px)`,\n ...queries,\n };\n}\n\nexport default createStyles((theme, props: AppShellStyles) => ({\n root: {\n boxSizing: 'border-box',\n },\n\n body: {\n display: 'flex',\n boxSizing: 'border-box',\n },\n\n main: {\n flex: 1,\n boxSizing: 'border-box',\n ...getPositionStyles(props, theme),\n },\n}));\n"],"names":["createStyles"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"AppShell.styles.js","sources":["../../../src/components/AppShell/AppShell.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize, MantineTheme, CSSObject } from '@mantine/styles';\n\ninterface AppShellStyles {\n padding: MantineNumberSize;\n fixed: boolean;\n headerHeight: string;\n navbarBreakpoints: [number, { width: string | number }][];\n navbarWidth: string;\n navbarOffsetBreakpoint: MantineNumberSize;\n}\n\nfunction getPositionStyles(props: AppShellStyles, theme: MantineTheme): CSSObject {\n const padding = theme.fn.size({ size: props.padding, sizes: theme.spacing });\n const offset = props.navbarOffsetBreakpoint\n ? theme.fn.size({ size: props.navbarOffsetBreakpoint, sizes: theme.breakpoints })\n : null;\n\n if (!props.fixed) {\n return { padding };\n }\n\n const queries = props.navbarBreakpoints.reduce((acc, [breakpoint, breakpointSize]) => {\n acc[`@media (min-width: ${breakpoint + 1}px)`] = {\n paddingLeft: `calc(${breakpointSize}px + ${padding}px)`,\n };\n\n return acc;\n }, {});\n\n if (offset) {\n queries[`@media (max-width: ${offset}px)`] = {\n paddingLeft: padding,\n };\n }\n\n return {\n minHeight: '100vh',\n paddingTop: `calc(${props.headerHeight} + ${padding}px)`,\n paddingLeft: `calc(${props.navbarWidth} + ${padding}px)`,\n ...queries,\n };\n}\n\nexport default createStyles((theme, props: AppShellStyles) => ({\n root: {\n boxSizing: 'border-box',\n },\n\n body: {\n display: 'flex',\n boxSizing: 'border-box',\n },\n\n main: {\n flex: 1,\n width: '100vw',\n boxSizing: 'border-box',\n ...getPositionStyles(props, theme),\n },\n}));\n"],"names":["createStyles"],"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;AAEF,SAAS,iBAAiB,CAAC,KAAK,EAAE,KAAK,EAAE;AACzC,EAAE,MAAM,OAAO,GAAG,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,KAAK,CAAC,OAAO,EAAE,KAAK,EAAE,KAAK,CAAC,OAAO,EAAE,CAAC,CAAC;AAC/E,EAAE,MAAM,MAAM,GAAG,KAAK,CAAC,sBAAsB,GAAG,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,KAAK,CAAC,sBAAsB,EAAE,KAAK,EAAE,KAAK,CAAC,WAAW,EAAE,CAAC,GAAG,IAAI,CAAC;AACvI,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE;AACpB,IAAI,OAAO,EAAE,OAAO,EAAE,CAAC;AACvB,GAAG;AACH,EAAE,MAAM,OAAO,GAAG,KAAK,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,CAAC,UAAU,EAAE,cAAc,CAAC,KAAK;AACxF,IAAI,GAAG,CAAC,CAAC,mBAAmB,EAAE,UAAU,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG;AACrD,MAAM,WAAW,EAAE,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,EAAE,OAAO,CAAC,GAAG,CAAC;AAC7D,KAAK,CAAC;AACN,IAAI,OAAO,GAAG,CAAC;AACf,GAAG,EAAE,EAAE,CAAC,CAAC;AACT,EAAE,IAAI,MAAM,EAAE;AACd,IAAI,OAAO,CAAC,CAAC,mBAAmB,EAAE,MAAM,CAAC,GAAG,CAAC,CAAC,GAAG;AACjD,MAAM,WAAW,EAAE,OAAO;AAC1B,KAAK,CAAC;AACN,GAAG;AACH,EAAE,OAAO,cAAc,CAAC;AACxB,IAAI,SAAS,EAAE,OAAO;AACtB,IAAI,UAAU,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,YAAY,CAAC,GAAG,EAAE,OAAO,CAAC,GAAG,CAAC;AAC5D,IAAI,WAAW,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE,OAAO,CAAC,GAAG,CAAC;AAC5D,GAAG,EAAE,OAAO,CAAC,CAAC;AACd,CAAC;AACD,gBAAeA,mBAAY,CAAC,CAAC,KAAK,EAAE,KAAK,MAAM;AAC/C,EAAE,IAAI,EAAE;AACR,IAAI,SAAS,EAAE,YAAY;AAC3B,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,OAAO,EAAE,MAAM;AACnB,IAAI,SAAS,EAAE,YAAY;AAC3B,GAAG;AACH,EAAE,IAAI,EAAE,cAAc,CAAC;AACvB,IAAI,IAAI,EAAE,CAAC;AACX,IAAI,KAAK,EAAE,OAAO;AAClB,IAAI,SAAS,EAAE,YAAY;AAC3B,GAAG,EAAE,iBAAiB,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;AACrC,CAAC,CAAC,CAAC;;;;"}
|
|
@@ -80,7 +80,8 @@ function MantineDrawer(_a) {
|
|
|
80
80
|
hideCloseButton,
|
|
81
81
|
closeButtonLabel,
|
|
82
82
|
classNames,
|
|
83
|
-
styles: styles$1
|
|
83
|
+
styles: styles$1,
|
|
84
|
+
target
|
|
84
85
|
} = _b, others = __objRest(_b, [
|
|
85
86
|
"className",
|
|
86
87
|
"opened",
|
|
@@ -105,7 +106,8 @@ function MantineDrawer(_a) {
|
|
|
105
106
|
"hideCloseButton",
|
|
106
107
|
"closeButtonLabel",
|
|
107
108
|
"classNames",
|
|
108
|
-
"styles"
|
|
109
|
+
"styles",
|
|
110
|
+
"target"
|
|
109
111
|
]);
|
|
110
112
|
const { classes, cx, theme } = Drawer_styles['default']({ size, position }, { classNames, styles: styles$1, name: "Drawer" });
|
|
111
113
|
const focusTrapRef = hooks.useFocusTrap(!noFocusTrap && opened);
|
|
@@ -175,12 +177,15 @@ function MantineDrawer(_a) {
|
|
|
175
177
|
}
|
|
176
178
|
function Drawer(_c) {
|
|
177
179
|
var _d = _c, {
|
|
178
|
-
zIndex = styles.getDefaultZIndex("modal")
|
|
180
|
+
zIndex = styles.getDefaultZIndex("modal"),
|
|
181
|
+
target
|
|
179
182
|
} = _d, props = __objRest(_d, [
|
|
180
|
-
"zIndex"
|
|
183
|
+
"zIndex",
|
|
184
|
+
"target"
|
|
181
185
|
]);
|
|
182
186
|
return /* @__PURE__ */ React__default.createElement(Portal.Portal, {
|
|
183
|
-
zIndex
|
|
187
|
+
zIndex,
|
|
188
|
+
target
|
|
184
189
|
}, /* @__PURE__ */ React__default.createElement(MantineDrawer, __spreadValues({}, props)));
|
|
185
190
|
}
|
|
186
191
|
Drawer.displayName = "@mantine/core/Drawer";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Drawer.js","sources":["../../../src/components/Drawer/Drawer.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\nimport { useScrollLock, useFocusTrap, useFocusReturn } from '@mantine/hooks';\nimport {\n DefaultProps,\n MantineNumberSize,\n MantineShadow,\n ClassNames,\n MantineMargin,\n getDefaultZIndex,\n} from '@mantine/styles';\nimport { Paper } from '../Paper';\nimport { Overlay } from '../Overlay';\nimport { Portal } from '../Portal';\nimport { Text } from '../Text';\nimport { Box } from '../Box';\nimport { CloseButton } from '../ActionIcon';\nimport { GroupedTransition, MantineTransition } from '../Transition';\nimport useStyles, { DrawerPosition } from './Drawer.styles';\n\nexport type DrawerStylesNames = Exclude<ClassNames<typeof useStyles>, 'noOverlay'>;\n\nexport interface DrawerProps\n extends Omit<DefaultProps<DrawerStylesNames>, MantineMargin>,\n Omit<React.ComponentPropsWithoutRef<'div'>, 'title'> {\n /** If true drawer is mounted to the dom */\n opened: boolean;\n\n /** Called when drawer is closed (Escape key and click outside, depending on options) */\n onClose(): void;\n\n /** Drawer body position */\n position?: DrawerPosition;\n\n /** Drawer body width (right | left position) or height (top | bottom position), cannot exceed 100vh for height and 100% for width */\n size?: string | number;\n\n /** Drawer body shadow from theme or any css shadow value */\n shadow?: MantineShadow;\n\n /** Drawer body padding from theme or number for padding in px */\n padding?: MantineNumberSize;\n\n /** Drawer z-index property */\n zIndex?: number;\n\n /** Disables focus trap */\n noFocusTrap?: boolean;\n\n /** Disables scroll lock */\n noScrollLock?: boolean;\n\n /** Disable onClock trigger for outside events */\n noCloseOnClickOutside?: boolean;\n\n /** Disable onClock trigger for escape key press */\n noCloseOnEscape?: boolean;\n\n /** Drawer appear and disappear transition, see Transition component for full documentation */\n transition?: MantineTransition;\n\n /** Transition duration in ms */\n transitionDuration?: number;\n\n /** Drawer transitionTimingFunction css property */\n transitionTimingFunction?: string;\n\n /** Removes overlay entirely */\n noOverlay?: boolean;\n\n /** Sets overlay opacity, defaults to 0.75 in light theme and to 0.85 in dark theme */\n overlayOpacity?: number;\n\n /** Sets overlay color, defaults to theme.black in light theme and to theme.colors.dark[9] in dark theme */\n overlayColor?: string;\n\n /** Drawer title, displayed in header before close button */\n title?: React.ReactNode;\n\n /** Hides close button, modal still can be closed with escape key and by clicking outside */\n hideCloseButton?: boolean;\n\n /** Close button aria-label */\n closeButtonLabel?: string;\n}\n\nconst transitions: Record<DrawerPosition, MantineTransition> = {\n top: 'slide-down',\n bottom: 'slide-up',\n left: 'slide-right',\n right: 'slide-left',\n};\n\nexport function MantineDrawer({\n className,\n opened,\n onClose,\n position = 'left',\n size = 'md',\n noFocusTrap = false,\n noScrollLock = false,\n noCloseOnClickOutside = false,\n noCloseOnEscape = false,\n transition,\n transitionDuration = 250,\n transitionTimingFunction = 'ease',\n zIndex = getDefaultZIndex('modal'),\n overlayColor,\n overlayOpacity,\n children,\n noOverlay = false,\n shadow = 'md',\n padding = 0,\n title,\n hideCloseButton,\n closeButtonLabel,\n classNames,\n styles,\n ...others\n}: DrawerProps) {\n const { classes, cx, theme } = useStyles(\n { size, position },\n { classNames, styles, name: 'Drawer' }\n );\n const focusTrapRef = useFocusTrap(!noFocusTrap && opened);\n\n const [, lockScroll] = useScrollLock();\n\n const drawerTransition = transition || transitions[position];\n const _overlayOpacity =\n typeof overlayOpacity === 'number'\n ? overlayOpacity\n : theme.colorScheme === 'dark'\n ? 0.85\n : 0.75;\n\n const closeOnEscape = (event: KeyboardEvent) => {\n if (noFocusTrap && event.code === 'Escape' && !noCloseOnEscape) {\n onClose();\n }\n };\n\n // eslint-disable-next-line consistent-return\n useEffect(() => {\n // onKeyDownCapture event will not fire when focus trap is not active\n if (noFocusTrap) {\n window.addEventListener('keydown', closeOnEscape);\n return () => window.removeEventListener('keydown', closeOnEscape);\n }\n }, [noFocusTrap]);\n\n useFocusReturn({ opened, transitionDuration });\n\n return (\n <GroupedTransition\n onExited={() => lockScroll(false)}\n onEntered={() => lockScroll(!noScrollLock && true)}\n mounted={opened}\n transitions={{\n overlay: { duration: transitionDuration / 2, transition: 'fade', timingFunction: 'ease' },\n drawer: {\n duration: transitionDuration,\n transition: drawerTransition,\n timingFunction: transitionTimingFunction,\n },\n }}\n >\n {(transitionStyles) => (\n <Box\n className={cx(classes.root, { [classes.noOverlay]: noOverlay }, className)}\n role=\"dialog\"\n aria-modal\n onMouseDown={() => !noCloseOnClickOutside && onClose()}\n {...others}\n >\n <Paper<'div'>\n onMouseDown={(event) => event.stopPropagation()}\n className={cx(classes.drawer, className)}\n ref={focusTrapRef}\n style={{ ...transitionStyles.drawer, zIndex: zIndex + 2 }}\n radius={0}\n tabIndex={-1}\n onKeyDownCapture={(event) => {\n const shouldTrigger =\n (event.target as any)?.getAttribute('data-mantine-stop-propagation') !== 'true';\n\n shouldTrigger && event.nativeEvent.code === 'Escape' && !noCloseOnEscape && onClose();\n }}\n shadow={shadow}\n padding={padding}\n >\n {(title || !hideCloseButton) && (\n <div className={classes.header}>\n <Text className={classes.title}>{title}</Text>\n\n {!hideCloseButton && (\n <CloseButton\n iconSize={16}\n onClick={onClose}\n aria-label={closeButtonLabel}\n className={classes.closeButton}\n />\n )}\n </div>\n )}\n {children}\n </Paper>\n\n {!noOverlay && (\n <div style={transitionStyles.overlay}>\n <Overlay\n className={classes.overlay}\n opacity={_overlayOpacity}\n zIndex={zIndex}\n color={\n overlayColor ||\n (theme.colorScheme === 'dark' ? theme.colors.dark[9] : theme.black)\n }\n />\n </div>\n )}\n </Box>\n )}\n </GroupedTransition>\n );\n}\n\nexport function Drawer({\n zIndex = getDefaultZIndex('modal'),\n ...props\n}: React.ComponentPropsWithoutRef<typeof MantineDrawer>) {\n return (\n <Portal zIndex={zIndex}>\n <MantineDrawer {...props} />\n </Portal>\n );\n}\n\nDrawer.displayName = '@mantine/core/Drawer';\n"],"names":["getDefaultZIndex","styles","useStyles","useFocusTrap","useScrollLock","useEffect","useFocusReturn","React","GroupedTransition","Box","Paper","Text","CloseButton","Overlay","Portal"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Drawer.js","sources":["../../../src/components/Drawer/Drawer.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\nimport { useScrollLock, useFocusTrap, useFocusReturn } from '@mantine/hooks';\nimport {\n DefaultProps,\n MantineNumberSize,\n MantineShadow,\n ClassNames,\n MantineMargin,\n getDefaultZIndex,\n} from '@mantine/styles';\nimport { Paper } from '../Paper';\nimport { Overlay } from '../Overlay';\nimport { Portal } from '../Portal';\nimport { Text } from '../Text';\nimport { Box } from '../Box';\nimport { CloseButton } from '../ActionIcon';\nimport { GroupedTransition, MantineTransition } from '../Transition';\nimport useStyles, { DrawerPosition } from './Drawer.styles';\n\nexport type DrawerStylesNames = Exclude<ClassNames<typeof useStyles>, 'noOverlay'>;\n\nexport interface DrawerProps\n extends Omit<DefaultProps<DrawerStylesNames>, MantineMargin>,\n Omit<React.ComponentPropsWithoutRef<'div'>, 'title'> {\n /** If true drawer is mounted to the dom */\n opened: boolean;\n\n /** Called when drawer is closed (Escape key and click outside, depending on options) */\n onClose(): void;\n\n /** Drawer body position */\n position?: DrawerPosition;\n\n /** Drawer body width (right | left position) or height (top | bottom position), cannot exceed 100vh for height and 100% for width */\n size?: string | number;\n\n /** Drawer body shadow from theme or any css shadow value */\n shadow?: MantineShadow;\n\n /** Drawer body padding from theme or number for padding in px */\n padding?: MantineNumberSize;\n\n /** Drawer z-index property */\n zIndex?: number;\n\n /** Disables focus trap */\n noFocusTrap?: boolean;\n\n /** Disables scroll lock */\n noScrollLock?: boolean;\n\n /** Disable onClock trigger for outside events */\n noCloseOnClickOutside?: boolean;\n\n /** Disable onClock trigger for escape key press */\n noCloseOnEscape?: boolean;\n\n /** Drawer appear and disappear transition, see Transition component for full documentation */\n transition?: MantineTransition;\n\n /** Transition duration in ms */\n transitionDuration?: number;\n\n /** Drawer transitionTimingFunction css property */\n transitionTimingFunction?: string;\n\n /** Removes overlay entirely */\n noOverlay?: boolean;\n\n /** Sets overlay opacity, defaults to 0.75 in light theme and to 0.85 in dark theme */\n overlayOpacity?: number;\n\n /** Sets overlay color, defaults to theme.black in light theme and to theme.colors.dark[9] in dark theme */\n overlayColor?: string;\n\n /** Drawer title, displayed in header before close button */\n title?: React.ReactNode;\n\n /** Hides close button, modal still can be closed with escape key and by clicking outside */\n hideCloseButton?: boolean;\n\n /** Close button aria-label */\n closeButtonLabel?: string;\n\n /** Target element or selector where drawer portal should be rendered */\n target?: HTMLElement | string;\n}\n\nconst transitions: Record<DrawerPosition, MantineTransition> = {\n top: 'slide-down',\n bottom: 'slide-up',\n left: 'slide-right',\n right: 'slide-left',\n};\n\nexport function MantineDrawer({\n className,\n opened,\n onClose,\n position = 'left',\n size = 'md',\n noFocusTrap = false,\n noScrollLock = false,\n noCloseOnClickOutside = false,\n noCloseOnEscape = false,\n transition,\n transitionDuration = 250,\n transitionTimingFunction = 'ease',\n zIndex = getDefaultZIndex('modal'),\n overlayColor,\n overlayOpacity,\n children,\n noOverlay = false,\n shadow = 'md',\n padding = 0,\n title,\n hideCloseButton,\n closeButtonLabel,\n classNames,\n styles,\n target,\n ...others\n}: DrawerProps) {\n const { classes, cx, theme } = useStyles(\n { size, position },\n { classNames, styles, name: 'Drawer' }\n );\n const focusTrapRef = useFocusTrap(!noFocusTrap && opened);\n\n const [, lockScroll] = useScrollLock();\n\n const drawerTransition = transition || transitions[position];\n const _overlayOpacity =\n typeof overlayOpacity === 'number'\n ? overlayOpacity\n : theme.colorScheme === 'dark'\n ? 0.85\n : 0.75;\n\n const closeOnEscape = (event: KeyboardEvent) => {\n if (noFocusTrap && event.code === 'Escape' && !noCloseOnEscape) {\n onClose();\n }\n };\n\n // eslint-disable-next-line consistent-return\n useEffect(() => {\n // onKeyDownCapture event will not fire when focus trap is not active\n if (noFocusTrap) {\n window.addEventListener('keydown', closeOnEscape);\n return () => window.removeEventListener('keydown', closeOnEscape);\n }\n }, [noFocusTrap]);\n\n useFocusReturn({ opened, transitionDuration });\n\n return (\n <GroupedTransition\n onExited={() => lockScroll(false)}\n onEntered={() => lockScroll(!noScrollLock && true)}\n mounted={opened}\n transitions={{\n overlay: { duration: transitionDuration / 2, transition: 'fade', timingFunction: 'ease' },\n drawer: {\n duration: transitionDuration,\n transition: drawerTransition,\n timingFunction: transitionTimingFunction,\n },\n }}\n >\n {(transitionStyles) => (\n <Box\n className={cx(classes.root, { [classes.noOverlay]: noOverlay }, className)}\n role=\"dialog\"\n aria-modal\n onMouseDown={() => !noCloseOnClickOutside && onClose()}\n {...others}\n >\n <Paper<'div'>\n onMouseDown={(event) => event.stopPropagation()}\n className={cx(classes.drawer, className)}\n ref={focusTrapRef}\n style={{ ...transitionStyles.drawer, zIndex: zIndex + 2 }}\n radius={0}\n tabIndex={-1}\n onKeyDownCapture={(event) => {\n const shouldTrigger =\n (event.target as any)?.getAttribute('data-mantine-stop-propagation') !== 'true';\n\n shouldTrigger && event.nativeEvent.code === 'Escape' && !noCloseOnEscape && onClose();\n }}\n shadow={shadow}\n padding={padding}\n >\n {(title || !hideCloseButton) && (\n <div className={classes.header}>\n <Text className={classes.title}>{title}</Text>\n\n {!hideCloseButton && (\n <CloseButton\n iconSize={16}\n onClick={onClose}\n aria-label={closeButtonLabel}\n className={classes.closeButton}\n />\n )}\n </div>\n )}\n {children}\n </Paper>\n\n {!noOverlay && (\n <div style={transitionStyles.overlay}>\n <Overlay\n className={classes.overlay}\n opacity={_overlayOpacity}\n zIndex={zIndex}\n color={\n overlayColor ||\n (theme.colorScheme === 'dark' ? theme.colors.dark[9] : theme.black)\n }\n />\n </div>\n )}\n </Box>\n )}\n </GroupedTransition>\n );\n}\n\nexport function Drawer({\n zIndex = getDefaultZIndex('modal'),\n target,\n ...props\n}: React.ComponentPropsWithoutRef<typeof MantineDrawer>) {\n return (\n <Portal zIndex={zIndex} target={target}>\n <MantineDrawer {...props} />\n </Portal>\n );\n}\n\nDrawer.displayName = '@mantine/core/Drawer';\n"],"names":["getDefaultZIndex","styles","useStyles","useFocusTrap","useScrollLock","useEffect","useFocusReturn","React","GroupedTransition","Box","Paper","Text","CloseButton","Overlay","Portal"],"mappings":"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"}
|
|
@@ -14,6 +14,8 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
14
14
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
15
15
|
|
|
16
16
|
var __defProp = Object.defineProperty;
|
|
17
|
+
var __defProps = Object.defineProperties;
|
|
18
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
17
19
|
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
18
20
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
19
21
|
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
@@ -29,6 +31,7 @@ var __spreadValues = (a, b) => {
|
|
|
29
31
|
}
|
|
30
32
|
return a;
|
|
31
33
|
};
|
|
34
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
32
35
|
var __objRest = (source, exclude) => {
|
|
33
36
|
var target = {};
|
|
34
37
|
for (var prop in source)
|
|
@@ -77,9 +80,14 @@ const Image = React.forwardRef((_a, ref) => {
|
|
|
77
80
|
const [loaded, setLoaded] = React.useState(false);
|
|
78
81
|
const [error, setError] = React.useState(!src);
|
|
79
82
|
const isPlaceholder = withPlaceholder && (!loaded || error);
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
+
const internalImgRef = React.useRef(null);
|
|
84
|
+
const mergedImgRef = hooks.useMergedRef(imageRef, internalImgRef);
|
|
85
|
+
React.useEffect(() => {
|
|
86
|
+
const { current } = internalImgRef;
|
|
87
|
+
if (current == null ? void 0 : current.complete) {
|
|
88
|
+
setError(current.naturalHeight === 0);
|
|
89
|
+
setLoaded(current.naturalHeight !== 0);
|
|
90
|
+
}
|
|
83
91
|
}, [src]);
|
|
84
92
|
return /* @__PURE__ */ React__default.createElement(Box.Box, __spreadValues({
|
|
85
93
|
className: cx(classes.root, className),
|
|
@@ -88,12 +96,13 @@ const Image = React.forwardRef((_a, ref) => {
|
|
|
88
96
|
className: classes.figure
|
|
89
97
|
}, /* @__PURE__ */ React__default.createElement("div", {
|
|
90
98
|
className: classes.imageWrapper
|
|
91
|
-
}, /* @__PURE__ */ React__default.createElement("img", __spreadValues({
|
|
99
|
+
}, /* @__PURE__ */ React__default.createElement("img", __spreadProps(__spreadValues({
|
|
92
100
|
className: classes.image,
|
|
93
101
|
src,
|
|
94
102
|
alt,
|
|
95
103
|
style: { objectFit: fit, width, height },
|
|
96
|
-
ref:
|
|
104
|
+
ref: mergedImgRef
|
|
105
|
+
}, imageProps), {
|
|
97
106
|
onLoad: (event) => {
|
|
98
107
|
setLoaded(true);
|
|
99
108
|
typeof (imageProps == null ? void 0 : imageProps.onLoad) === "function" && imageProps.onLoad(event);
|
|
@@ -102,7 +111,7 @@ const Image = React.forwardRef((_a, ref) => {
|
|
|
102
111
|
setError(true);
|
|
103
112
|
typeof (imageProps == null ? void 0 : imageProps.onError) === "function" && imageProps.onError(event);
|
|
104
113
|
}
|
|
105
|
-
}
|
|
114
|
+
})), isPlaceholder && /* @__PURE__ */ React__default.createElement("div", {
|
|
106
115
|
className: classes.placeholder,
|
|
107
116
|
title: alt
|
|
108
117
|
}, placeholder || /* @__PURE__ */ React__default.createElement(ImageIcon.ImageIcon, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Image.js","sources":["../../../src/components/Image/Image.tsx"],"sourcesContent":["import React, { useState, forwardRef } from 'react';\nimport { DefaultProps, MantineNumberSize, ClassNames } from '@mantine/styles';\nimport {
|
|
1
|
+
{"version":3,"file":"Image.js","sources":["../../../src/components/Image/Image.tsx"],"sourcesContent":["import React, { useState, forwardRef, useEffect, useRef } from 'react';\nimport { DefaultProps, MantineNumberSize, ClassNames } from '@mantine/styles';\nimport { useMergedRef } from '@mantine/hooks';\nimport { Text } from '../Text';\nimport { Box } from '../Box';\nimport { ImageIcon } from './ImageIcon';\nimport useStyles from './Image.styles';\n\nexport type ImageStylesNames = ClassNames<typeof useStyles>;\n\nexport interface ImageProps\n extends DefaultProps<ImageStylesNames>,\n Omit<React.ComponentPropsWithoutRef<'div'>, 'placeholder'> {\n /** Image src */\n src?: string;\n\n /** Image alt text, used as title for placeholder if image was not loaded */\n alt?: string;\n\n /** Image object-fit property */\n fit?: 'contain' | 'cover';\n\n /** Image width, defaults to 100%, cannot exceed 100% */\n width?: number | string;\n\n /** Image height, defaults to original image height adjusted to given width */\n height?: number | string;\n\n /** Predefined border-radius value from theme.radius or number for border-radius in px */\n radius?: MantineNumberSize;\n\n /** Enable placeholder when image is loading and when image fails to load */\n withPlaceholder?: boolean;\n\n /** Customize placeholder content */\n placeholder?: React.ReactNode;\n\n /** Props spread to img element */\n imageProps?: React.ComponentPropsWithoutRef<'img'>;\n\n /** Get image element ref */\n imageRef?: React.ForwardedRef<HTMLImageElement>;\n\n /** Image figcaption, displayed bellow image */\n caption?: React.ReactNode;\n}\n\nexport const Image = forwardRef<HTMLDivElement, ImageProps>(\n (\n {\n className,\n alt,\n src,\n fit = 'cover',\n width = '100%',\n height = 'auto',\n radius = 0,\n imageProps,\n withPlaceholder = false,\n placeholder,\n imageRef,\n classNames,\n styles,\n caption,\n ...others\n }: ImageProps,\n ref\n ) => {\n const { classes, cx } = useStyles({ radius }, { classNames, styles, name: 'Image' });\n const [loaded, setLoaded] = useState(false);\n const [error, setError] = useState(!src);\n const isPlaceholder = withPlaceholder && (!loaded || error);\n const internalImgRef = useRef<HTMLImageElement>(null);\n const mergedImgRef = useMergedRef(imageRef, internalImgRef);\n\n useEffect(() => {\n const { current } = internalImgRef;\n if (current?.complete) {\n setError(current.naturalHeight === 0);\n setLoaded(current.naturalHeight !== 0);\n }\n }, [src]);\n\n return (\n <Box className={cx(classes.root, className)} ref={ref} {...others}>\n <figure className={classes.figure}>\n <div className={classes.imageWrapper}>\n <img\n className={classes.image}\n src={src}\n alt={alt}\n style={{ objectFit: fit, width, height }}\n ref={mergedImgRef}\n {...imageProps}\n onLoad={(event) => {\n setLoaded(true);\n typeof imageProps?.onLoad === 'function' && imageProps.onLoad(event);\n }}\n onError={(event) => {\n setError(true);\n typeof imageProps?.onError === 'function' && imageProps.onError(event);\n }}\n />\n\n {isPlaceholder && (\n <div className={classes.placeholder} title={alt}>\n {placeholder || <ImageIcon style={{ width: 40, height: 40 }} />}\n </div>\n )}\n </div>\n\n {!!caption && (\n <Text component=\"figcaption\" size=\"sm\" align=\"center\" className={classes.caption}>\n {caption}\n </Text>\n )}\n </figure>\n </Box>\n );\n }\n);\n\nImage.displayName = '@mantine/core/Image';\n"],"names":["forwardRef","useStyles","useState","useRef","useMergedRef","useEffect","React","Box","ImageIcon","Text"],"mappings":"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"}
|
|
@@ -73,7 +73,8 @@ function MantineModal(_a) {
|
|
|
73
73
|
closeOnClickOutside = true,
|
|
74
74
|
noFocusTrap = false,
|
|
75
75
|
closeOnEscape = true,
|
|
76
|
-
centered = false
|
|
76
|
+
centered = false,
|
|
77
|
+
target
|
|
77
78
|
} = _b, others = __objRest(_b, [
|
|
78
79
|
"className",
|
|
79
80
|
"opened",
|
|
@@ -97,7 +98,8 @@ function MantineModal(_a) {
|
|
|
97
98
|
"closeOnClickOutside",
|
|
98
99
|
"noFocusTrap",
|
|
99
100
|
"closeOnEscape",
|
|
100
|
-
"centered"
|
|
101
|
+
"centered",
|
|
102
|
+
"target"
|
|
101
103
|
]);
|
|
102
104
|
const baseId = hooks.useUuid(id);
|
|
103
105
|
const titleId = `${baseId}-title`;
|
|
@@ -179,12 +181,15 @@ function MantineModal(_a) {
|
|
|
179
181
|
}
|
|
180
182
|
function Modal(_c) {
|
|
181
183
|
var _d = _c, {
|
|
182
|
-
zIndex = styles.getDefaultZIndex("modal")
|
|
184
|
+
zIndex = styles.getDefaultZIndex("modal"),
|
|
185
|
+
target
|
|
183
186
|
} = _d, props = __objRest(_d, [
|
|
184
|
-
"zIndex"
|
|
187
|
+
"zIndex",
|
|
188
|
+
"target"
|
|
185
189
|
]);
|
|
186
190
|
return /* @__PURE__ */ React__default.createElement(Portal.Portal, {
|
|
187
|
-
zIndex
|
|
191
|
+
zIndex,
|
|
192
|
+
target
|
|
188
193
|
}, /* @__PURE__ */ React__default.createElement(MantineModal, __spreadValues({}, props)));
|
|
189
194
|
}
|
|
190
195
|
Modal.displayName = "@mantine/core/Modal";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.js","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["/* eslint-disable jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */\nimport React, { useEffect } from 'react';\nimport { useScrollLock, useFocusTrap, useFocusReturn, useUuid } from '@mantine/hooks';\nimport {\n DefaultProps,\n MantineNumberSize,\n MantineShadow,\n ClassNames,\n MantineMargin,\n getDefaultZIndex,\n} from '@mantine/styles';\nimport { CloseButton } from '../ActionIcon';\nimport { Text } from '../Text';\nimport { Paper } from '../Paper';\nimport { Overlay } from '../Overlay';\nimport { Portal } from '../Portal';\nimport { Box } from '../Box';\nimport { GroupedTransition, MantineTransition } from '../Transition';\nimport useStyles from './Modal.styles';\n\nexport type ModalStylesNames = ClassNames<typeof useStyles>;\n\nexport interface ModalProps\n extends Omit<DefaultProps<ModalStylesNames>, MantineMargin>,\n Omit<React.ComponentPropsWithoutRef<'div'>, 'title'> {\n /** Mounts modal if true */\n opened: boolean;\n\n /** Called when close button clicked and when escape key is pressed */\n onClose(): void;\n\n /** Modal title, displayed in header before close button */\n title?: React.ReactNode;\n\n /** Modal z-index property */\n zIndex?: number;\n\n /** Control vertical overflow behavior */\n overflow?: 'outside' | 'inside';\n\n /** Hides close button, modal still can be closed with escape key and by clicking outside */\n hideCloseButton?: boolean;\n\n /** Overlay below modal opacity, defaults to 0.75 in light theme and to 0.85 in dark theme */\n overlayOpacity?: number;\n\n /** Overlay below modal color, defaults to theme.black in light theme and to theme.colors.dark[9] in dark theme */\n overlayColor?: string;\n\n /** Modal radius */\n radius?: MantineNumberSize;\n\n /** Modal body width */\n size?: string | number;\n\n /** Modal body transition */\n transition?: MantineTransition;\n\n /** Duration in ms of modal transitions, set to 0 to disable all animations */\n transitionDuration?: number;\n\n /** Modal body transitionTimingFunction, defaults to theme.transitionTimingFunction */\n transitionTimingFunction?: string;\n\n /** Close button aria-label */\n closeButtonLabel?: string;\n\n /** id base, used to generate ids to connect modal title and body with aria- attributes, defaults to random id */\n id?: string;\n\n /** Modal shadow from theme or css value */\n shadow?: MantineShadow;\n\n /** Modal padding from theme or number value for padding in px */\n padding?: MantineNumberSize;\n\n /** Should modal be closed when outside click was registered? */\n closeOnClickOutside?: boolean;\n\n /** Should modal be closed when escape is pressed? */\n closeOnEscape?: boolean;\n\n /** Disables focus trap */\n noFocusTrap?: boolean;\n\n /** Controls if modal should be centered */\n centered?: boolean;\n}\n\nexport function MantineModal({\n className,\n opened,\n title,\n onClose,\n children,\n hideCloseButton = false,\n overlayOpacity,\n size = 'md',\n transitionDuration = 300,\n closeButtonLabel,\n overlayColor,\n overflow = 'outside',\n transition = 'pop',\n padding = 'lg',\n shadow = 'lg',\n radius = 'sm',\n id,\n classNames,\n styles,\n closeOnClickOutside = true,\n noFocusTrap = false,\n closeOnEscape = true,\n centered = false,\n ...others\n}: ModalProps) {\n const baseId = useUuid(id);\n const titleId = `${baseId}-title`;\n const bodyId = `${baseId}-body`;\n const { classes, cx, theme } = useStyles(\n { size, overflow, centered },\n { classNames, styles, name: 'Modal' }\n );\n const focusTrapRef = useFocusTrap(!noFocusTrap && opened);\n const _overlayOpacity =\n typeof overlayOpacity === 'number'\n ? overlayOpacity\n : theme.colorScheme === 'dark'\n ? 0.85\n : 0.75;\n\n const [, lockScroll] = useScrollLock();\n\n const closeOnEscapePress = (event: KeyboardEvent) => {\n if (noFocusTrap && event.code === 'Escape' && closeOnEscape) {\n onClose();\n }\n };\n\n // eslint-disable-next-line consistent-return\n useEffect(() => {\n // onKeyDownCapture event will not fire when focus trap is not active\n if (noFocusTrap) {\n window.addEventListener('keydown', closeOnEscapePress);\n return () => window.removeEventListener('keydown', closeOnEscapePress);\n }\n }, [noFocusTrap]);\n\n useFocusReturn({ opened, transitionDuration });\n\n return (\n <GroupedTransition\n onExited={() => lockScroll(false)}\n onEntered={() => lockScroll(true)}\n mounted={opened}\n transitions={{\n modal: { duration: transitionDuration, transition },\n overlay: {\n duration: transitionDuration / 2,\n transition: 'fade',\n timingFunction: 'ease',\n },\n }}\n >\n {(transitionStyles) => (\n <Box className={cx(classes.root, className)} {...others}>\n <div\n className={classes.inner}\n onMouseDown={() => closeOnClickOutside && onClose()}\n onKeyDownCapture={(event) => {\n const shouldTrigger =\n (event.target as any)?.getAttribute('data-mantine-stop-propagation') !== 'true';\n shouldTrigger && event.nativeEvent.code === 'Escape' && closeOnEscape && onClose();\n }}\n ref={focusTrapRef}\n >\n <Paper<'div'>\n onMouseDown={(event) => event.stopPropagation()}\n className={classes.modal}\n shadow={shadow}\n padding={padding}\n radius={radius}\n role=\"dialog\"\n aria-labelledby={titleId}\n aria-describedby={bodyId}\n aria-modal\n tabIndex={-1}\n style={{\n ...transitionStyles.modal,\n marginLeft: 'calc(var(--removed-scroll-width, 0px) * -1)',\n zIndex: 3,\n }}\n >\n {(title || !hideCloseButton) && (\n <div className={classes.header}>\n <Text id={titleId} className={classes.title}>\n {title}\n </Text>\n\n {!hideCloseButton && (\n <CloseButton\n iconSize={16}\n onClick={onClose}\n aria-label={closeButtonLabel}\n className={classes.close}\n />\n )}\n </div>\n )}\n\n <div id={bodyId} className={classes.body}>\n {children}\n </div>\n </Paper>\n </div>\n\n <div style={transitionStyles.overlay}>\n <Overlay\n zIndex={0}\n color={\n overlayColor || (theme.colorScheme === 'dark' ? theme.colors.dark[9] : theme.black)\n }\n opacity={_overlayOpacity}\n />\n </div>\n </Box>\n )}\n </GroupedTransition>\n );\n}\n\nexport function Modal({\n zIndex = getDefaultZIndex('modal'),\n ...props\n}: React.ComponentPropsWithoutRef<typeof MantineModal>) {\n return (\n <Portal zIndex={zIndex}>\n <MantineModal {...props} />\n </Portal>\n );\n}\n\nModal.displayName = '@mantine/core/Modal';\n"],"names":["useUuid","useStyles","useFocusTrap","useScrollLock","useEffect","useFocusReturn","React","GroupedTransition","Box","Paper","Text","CloseButton","Overlay","getDefaultZIndex","Portal"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Modal.js","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["/* eslint-disable jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */\nimport React, { useEffect } from 'react';\nimport { useScrollLock, useFocusTrap, useFocusReturn, useUuid } from '@mantine/hooks';\nimport {\n DefaultProps,\n MantineNumberSize,\n MantineShadow,\n ClassNames,\n MantineMargin,\n getDefaultZIndex,\n} from '@mantine/styles';\nimport { CloseButton } from '../ActionIcon';\nimport { Text } from '../Text';\nimport { Paper } from '../Paper';\nimport { Overlay } from '../Overlay';\nimport { Portal } from '../Portal';\nimport { Box } from '../Box';\nimport { GroupedTransition, MantineTransition } from '../Transition';\nimport useStyles from './Modal.styles';\n\nexport type ModalStylesNames = ClassNames<typeof useStyles>;\n\nexport interface ModalProps\n extends Omit<DefaultProps<ModalStylesNames>, MantineMargin>,\n Omit<React.ComponentPropsWithoutRef<'div'>, 'title'> {\n /** Mounts modal if true */\n opened: boolean;\n\n /** Called when close button clicked and when escape key is pressed */\n onClose(): void;\n\n /** Modal title, displayed in header before close button */\n title?: React.ReactNode;\n\n /** Modal z-index property */\n zIndex?: number;\n\n /** Control vertical overflow behavior */\n overflow?: 'outside' | 'inside';\n\n /** Hides close button, modal still can be closed with escape key and by clicking outside */\n hideCloseButton?: boolean;\n\n /** Overlay below modal opacity, defaults to 0.75 in light theme and to 0.85 in dark theme */\n overlayOpacity?: number;\n\n /** Overlay below modal color, defaults to theme.black in light theme and to theme.colors.dark[9] in dark theme */\n overlayColor?: string;\n\n /** Modal radius */\n radius?: MantineNumberSize;\n\n /** Modal body width */\n size?: string | number;\n\n /** Modal body transition */\n transition?: MantineTransition;\n\n /** Duration in ms of modal transitions, set to 0 to disable all animations */\n transitionDuration?: number;\n\n /** Modal body transitionTimingFunction, defaults to theme.transitionTimingFunction */\n transitionTimingFunction?: string;\n\n /** Close button aria-label */\n closeButtonLabel?: string;\n\n /** id base, used to generate ids to connect modal title and body with aria- attributes, defaults to random id */\n id?: string;\n\n /** Modal shadow from theme or css value */\n shadow?: MantineShadow;\n\n /** Modal padding from theme or number value for padding in px */\n padding?: MantineNumberSize;\n\n /** Should modal be closed when outside click was registered? */\n closeOnClickOutside?: boolean;\n\n /** Should modal be closed when escape is pressed? */\n closeOnEscape?: boolean;\n\n /** Disables focus trap */\n noFocusTrap?: boolean;\n\n /** Controls if modal should be centered */\n centered?: boolean;\n\n /** Target element or selector where modal portal should be rendered */\n target?: HTMLElement | string;\n}\n\nexport function MantineModal({\n className,\n opened,\n title,\n onClose,\n children,\n hideCloseButton = false,\n overlayOpacity,\n size = 'md',\n transitionDuration = 300,\n closeButtonLabel,\n overlayColor,\n overflow = 'outside',\n transition = 'pop',\n padding = 'lg',\n shadow = 'lg',\n radius = 'sm',\n id,\n classNames,\n styles,\n closeOnClickOutside = true,\n noFocusTrap = false,\n closeOnEscape = true,\n centered = false,\n target,\n ...others\n}: ModalProps) {\n const baseId = useUuid(id);\n const titleId = `${baseId}-title`;\n const bodyId = `${baseId}-body`;\n const { classes, cx, theme } = useStyles(\n { size, overflow, centered },\n { classNames, styles, name: 'Modal' }\n );\n const focusTrapRef = useFocusTrap(!noFocusTrap && opened);\n const _overlayOpacity =\n typeof overlayOpacity === 'number'\n ? overlayOpacity\n : theme.colorScheme === 'dark'\n ? 0.85\n : 0.75;\n\n const [, lockScroll] = useScrollLock();\n\n const closeOnEscapePress = (event: KeyboardEvent) => {\n if (noFocusTrap && event.code === 'Escape' && closeOnEscape) {\n onClose();\n }\n };\n\n // eslint-disable-next-line consistent-return\n useEffect(() => {\n // onKeyDownCapture event will not fire when focus trap is not active\n if (noFocusTrap) {\n window.addEventListener('keydown', closeOnEscapePress);\n return () => window.removeEventListener('keydown', closeOnEscapePress);\n }\n }, [noFocusTrap]);\n\n useFocusReturn({ opened, transitionDuration });\n\n return (\n <GroupedTransition\n onExited={() => lockScroll(false)}\n onEntered={() => lockScroll(true)}\n mounted={opened}\n transitions={{\n modal: { duration: transitionDuration, transition },\n overlay: {\n duration: transitionDuration / 2,\n transition: 'fade',\n timingFunction: 'ease',\n },\n }}\n >\n {(transitionStyles) => (\n <Box className={cx(classes.root, className)} {...others}>\n <div\n className={classes.inner}\n onMouseDown={() => closeOnClickOutside && onClose()}\n onKeyDownCapture={(event) => {\n const shouldTrigger =\n (event.target as any)?.getAttribute('data-mantine-stop-propagation') !== 'true';\n shouldTrigger && event.nativeEvent.code === 'Escape' && closeOnEscape && onClose();\n }}\n ref={focusTrapRef}\n >\n <Paper<'div'>\n onMouseDown={(event) => event.stopPropagation()}\n className={classes.modal}\n shadow={shadow}\n padding={padding}\n radius={radius}\n role=\"dialog\"\n aria-labelledby={titleId}\n aria-describedby={bodyId}\n aria-modal\n tabIndex={-1}\n style={{\n ...transitionStyles.modal,\n marginLeft: 'calc(var(--removed-scroll-width, 0px) * -1)',\n zIndex: 3,\n }}\n >\n {(title || !hideCloseButton) && (\n <div className={classes.header}>\n <Text id={titleId} className={classes.title}>\n {title}\n </Text>\n\n {!hideCloseButton && (\n <CloseButton\n iconSize={16}\n onClick={onClose}\n aria-label={closeButtonLabel}\n className={classes.close}\n />\n )}\n </div>\n )}\n\n <div id={bodyId} className={classes.body}>\n {children}\n </div>\n </Paper>\n </div>\n\n <div style={transitionStyles.overlay}>\n <Overlay\n zIndex={0}\n color={\n overlayColor || (theme.colorScheme === 'dark' ? theme.colors.dark[9] : theme.black)\n }\n opacity={_overlayOpacity}\n />\n </div>\n </Box>\n )}\n </GroupedTransition>\n );\n}\n\nexport function Modal({\n zIndex = getDefaultZIndex('modal'),\n target,\n ...props\n}: React.ComponentPropsWithoutRef<typeof MantineModal>) {\n return (\n <Portal zIndex={zIndex} target={target}>\n <MantineModal {...props} />\n </Portal>\n );\n}\n\nModal.displayName = '@mantine/core/Modal';\n"],"names":["useUuid","useStyles","useFocusTrap","useScrollLock","useEffect","useFocusReturn","React","GroupedTransition","Box","Paper","Text","CloseButton","Overlay","getDefaultZIndex","Portal"],"mappings":"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"}
|
|
@@ -15,7 +15,7 @@ function Portal({ children, zIndex = 1, target, className }) {
|
|
|
15
15
|
const ref = React.useRef();
|
|
16
16
|
hooks.useIsomorphicEffect(() => {
|
|
17
17
|
setMounted(true);
|
|
18
|
-
ref.current = target
|
|
18
|
+
ref.current = !target ? document.createElement("div") : typeof target === "string" ? document.querySelector(target) : target;
|
|
19
19
|
if (!target) {
|
|
20
20
|
document.body.appendChild(ref.current);
|
|
21
21
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Portal.js","sources":["../../../src/components/Portal/Portal.tsx"],"sourcesContent":["import React, { ReactPortal, useRef, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useIsomorphicEffect } from '@mantine/hooks';\n\nexport interface PortalProps {\n /** Portal children, for example, modal or popover */\n children: React.ReactNode;\n\n /** Root element z-index property */\n zIndex?: number;\n\n /** Element where portal should be rendered, by default new div element is created and appended to document.body */\n target?:
|
|
1
|
+
{"version":3,"file":"Portal.js","sources":["../../../src/components/Portal/Portal.tsx"],"sourcesContent":["import React, { ReactPortal, useRef, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useIsomorphicEffect } from '@mantine/hooks';\n\nexport interface PortalProps {\n /** Portal children, for example, modal or popover */\n children: React.ReactNode;\n\n /** Root element z-index property */\n zIndex?: number;\n\n /** Element where portal should be rendered, by default new div element is created and appended to document.body */\n target?: HTMLElement | string;\n\n /** Root element className */\n className?: string;\n}\n\nexport function Portal({ children, zIndex = 1, target, className }: PortalProps): ReactPortal {\n const [mounted, setMounted] = useState(false);\n const ref = useRef<HTMLElement>();\n\n useIsomorphicEffect(() => {\n setMounted(true);\n ref.current = !target\n ? document.createElement('div')\n : typeof target === 'string'\n ? document.querySelector(target)\n : target;\n\n if (!target) {\n document.body.appendChild(ref.current);\n }\n\n return () => {\n !target && document.body.removeChild(ref.current);\n };\n }, [target]);\n\n if (!mounted) {\n return null;\n }\n\n return createPortal(\n <div className={className} style={{ position: 'relative', zIndex }}>\n {children}\n </div>,\n ref.current\n );\n}\n\nPortal.displayName = '@mantine/core/Portal';\n"],"names":["useState","useRef","useIsomorphicEffect","createPortal","React"],"mappings":";;;;;;;;;;;;AAGO,SAAS,MAAM,CAAC,EAAE,QAAQ,EAAE,MAAM,GAAG,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE;AACpE,EAAE,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAGA,cAAQ,CAAC,KAAK,CAAC,CAAC;AAChD,EAAE,MAAM,GAAG,GAAGC,YAAM,EAAE,CAAC;AACvB,EAAEC,yBAAmB,CAAC,MAAM;AAC5B,IAAI,UAAU,CAAC,IAAI,CAAC,CAAC;AACrB,IAAI,GAAG,CAAC,OAAO,GAAG,CAAC,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,GAAG,OAAO,MAAM,KAAK,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,GAAG,MAAM,CAAC;AACjI,IAAI,IAAI,CAAC,MAAM,EAAE;AACjB,MAAM,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;AAC7C,KAAK;AACL,IAAI,OAAO,MAAM;AACjB,MAAM,CAAC,MAAM,IAAI,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;AACxD,KAAK,CAAC;AACN,GAAG,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;AACf,EAAE,IAAI,CAAC,OAAO,EAAE;AAChB,IAAI,OAAO,IAAI,CAAC;AAChB,GAAG;AACH,EAAE,OAAOC,qBAAY,iBAAiBC,cAAK,CAAC,aAAa,CAAC,KAAK,EAAE;AACjE,IAAI,SAAS;AACb,IAAI,KAAK,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,EAAE;AAC3C,GAAG,EAAE,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC,CAAC;AAC7B,CAAC;AACD,MAAM,CAAC,WAAW,GAAG,sBAAsB;;;;"}
|
|
@@ -93,26 +93,23 @@ function SegmentedControl(_a) {
|
|
|
93
93
|
const [activePosition, setActivePosition] = React.useState({ width: 0, translate: 0 });
|
|
94
94
|
const uuid = hooks.useUuid(name);
|
|
95
95
|
const refs = React.useRef({});
|
|
96
|
-
const
|
|
96
|
+
const [ref, containerRect] = hooks.useResizeObserver();
|
|
97
97
|
React.useEffect(() => {
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
}
|
|
98
|
+
if (_value in refs.current && ref.current) {
|
|
99
|
+
const element = refs.current[_value];
|
|
100
|
+
const elementRect = element.getBoundingClientRect();
|
|
101
|
+
const scaledValue = element.offsetWidth / elementRect.width;
|
|
102
|
+
setActivePosition({
|
|
103
|
+
width: elementRect.width * scaledValue,
|
|
104
|
+
translate: element.parentElement.offsetLeft - SegmentedControl_styles.WRAPPER_PADDING
|
|
105
|
+
});
|
|
106
|
+
if (!shouldAnimate) {
|
|
107
|
+
setTimeout(() => {
|
|
108
|
+
setShouldAnimate(true);
|
|
109
|
+
}, 4);
|
|
111
110
|
}
|
|
112
|
-
}
|
|
113
|
-
|
|
114
|
-
return () => observer.disconnect();
|
|
115
|
-
}, [_value]);
|
|
111
|
+
}
|
|
112
|
+
}, [_value, containerRect]);
|
|
116
113
|
const controls = data.map((item) => /* @__PURE__ */ React__default.createElement("div", {
|
|
117
114
|
className: cx(classes.control, { [classes.controlActive]: _value === item.value }),
|
|
118
115
|
key: item.value
|
|
@@ -133,7 +130,7 @@ function SegmentedControl(_a) {
|
|
|
133
130
|
}, item.label)));
|
|
134
131
|
return /* @__PURE__ */ React__default.createElement(Box.Box, __spreadValues({
|
|
135
132
|
className: cx(classes.root, className),
|
|
136
|
-
ref
|
|
133
|
+
ref
|
|
137
134
|
}, others), !!_value && /* @__PURE__ */ React__default.createElement("span", {
|
|
138
135
|
className: classes.active,
|
|
139
136
|
style: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SegmentedControl.js","sources":["../../../src/components/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { useReducedMotion, useUncontrolled, useUuid } from '@mantine/hooks';\nimport {\n DefaultProps,\n MantineNumberSize,\n MantineSize,\n MantineColor,\n ClassNames,\n} from '@mantine/styles';\nimport { Box } from '../Box';\nimport useStyles, { WRAPPER_PADDING } from './SegmentedControl.styles';\n\nexport interface SegmentedControlItem<T extends string> {\n value: T;\n label: React.ReactNode;\n}\n\nexport type SegmentedControlStylesNames = ClassNames<typeof useStyles>;\n\nexport interface SegmentedControlProps<T extends string>\n extends DefaultProps<SegmentedControlStylesNames>,\n Omit<React.ComponentPropsWithoutRef<'div'>, 'value' | 'onChange'> {\n /** Data based on which controls are rendered */\n data: T[] | SegmentedControlItem<T>[];\n\n /** Current selected value */\n value?: T;\n\n /** Called when value changes */\n onChange?(value: T): void;\n\n /** Name of the radio group, default to random id */\n name?: string;\n\n /** True if component should have 100% width */\n fullWidth?: boolean;\n\n /** Active control color from theme.colors, defaults to white in light color scheme and theme.colors.dark[9] in dark */\n color?: MantineColor;\n\n /** Controls font-size, paddings and height */\n size?: MantineSize;\n\n /** Border-radius from theme or number to set border-radius in px */\n radius?: MantineNumberSize;\n\n /** Transition duration in ms, set to 0 to turn off transitions */\n transitionDuration?: number;\n\n /** Transition timing function for all transitions, defaults to theme.transitionTimingFunction */\n transitionTimingFunction?: string;\n\n /** Default value for uncontrolled component */\n defaultValue?: string;\n}\n\nexport function SegmentedControl<T extends string = string>({\n className,\n data: _data,\n name,\n value,\n onChange,\n color,\n fullWidth,\n radius = 'sm',\n size = 'sm',\n transitionDuration = 200,\n transitionTimingFunction,\n classNames,\n styles,\n defaultValue,\n ...others\n}: SegmentedControlProps<T>) {\n const reduceMotion = useReducedMotion();\n const data = _data.map((item: any) =>\n typeof item === 'string' ? { label: item, value: item } : item\n );\n\n const [shouldAnimate, setShouldAnimate] = useState(false);\n const [_value, handleValueChange] = useUncontrolled({\n value,\n defaultValue,\n finalValue: Array.isArray(data) ? data[0].value : null,\n onChange,\n rule: (val) => !!val,\n });\n\n const { classes, cx } = useStyles(\n {\n size,\n fullWidth,\n color,\n radius,\n shouldAnimate: reduceMotion || !shouldAnimate,\n transitionDuration,\n transitionTimingFunction,\n },\n { classNames, styles, name: 'SegmentedControl' }\n );\n\n const [activePosition, setActivePosition] = useState({ width: 0, translate: 0 });\n const uuid = useUuid(name);\n const refs = useRef<Record<string, HTMLLabelElement>>({});\n const wrapperRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n const observer = new ResizeObserver(() => {\n if (_value in refs.current && wrapperRef.current) {\n const element = refs.current[_value];\n const rect = element.getBoundingClientRect();\n setActivePosition({\n width: rect.width,\n translate: rect.x - wrapperRef.current.getBoundingClientRect().x - WRAPPER_PADDING,\n });\n\n if (!shouldAnimate) {\n setTimeout(() => {\n setShouldAnimate(true);\n }, 4);\n }\n }\n });\n observer.observe(wrapperRef.current);\n return () => observer.disconnect();\n }, [_value]);\n\n const controls = data.map((item) => (\n <div\n className={cx(classes.control, { [classes.controlActive]: _value === item.value })}\n key={item.value}\n >\n <input\n className={classes.input}\n type=\"radio\"\n name={uuid}\n value={item.value}\n id={`${uuid}-${item.value}`}\n checked={_value === item.value}\n onChange={() => handleValueChange(item.value)}\n />\n\n <label\n className={cx(classes.label, { [classes.labelActive]: _value === item.value })}\n htmlFor={`${uuid}-${item.value}`}\n ref={(node) => {\n refs.current[item.value] = node;\n }}\n >\n {item.label}\n </label>\n </div>\n ));\n\n return (\n <Box className={cx(classes.root, className)} ref={wrapperRef} {...others}>\n {!!_value && (\n <span\n className={classes.active}\n style={{\n width: activePosition.width,\n transform: `translateX(${activePosition.translate}px)`,\n }}\n />\n )}\n\n {controls}\n </Box>\n );\n}\n\nSegmentedControl.displayName = '@mantine/core/SegmentedControl';\n"],"names":["useReducedMotion","useState","useUncontrolled","useStyles","useUuid","useRef","useEffect","WRAPPER_PADDING","React","Box"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"SegmentedControl.js","sources":["../../../src/components/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { useReducedMotion, useResizeObserver, useUncontrolled, useUuid } from '@mantine/hooks';\nimport {\n DefaultProps,\n MantineNumberSize,\n MantineSize,\n MantineColor,\n ClassNames,\n} from '@mantine/styles';\nimport { Box } from '../Box';\nimport useStyles, { WRAPPER_PADDING } from './SegmentedControl.styles';\n\nexport interface SegmentedControlItem<T extends string> {\n value: T;\n label: React.ReactNode;\n}\n\nexport type SegmentedControlStylesNames = ClassNames<typeof useStyles>;\n\nexport interface SegmentedControlProps<T extends string>\n extends DefaultProps<SegmentedControlStylesNames>,\n Omit<React.ComponentPropsWithoutRef<'div'>, 'value' | 'onChange'> {\n /** Data based on which controls are rendered */\n data: T[] | SegmentedControlItem<T>[];\n\n /** Current selected value */\n value?: T;\n\n /** Called when value changes */\n onChange?(value: T): void;\n\n /** Name of the radio group, default to random id */\n name?: string;\n\n /** True if component should have 100% width */\n fullWidth?: boolean;\n\n /** Active control color from theme.colors, defaults to white in light color scheme and theme.colors.dark[9] in dark */\n color?: MantineColor;\n\n /** Controls font-size, paddings and height */\n size?: MantineSize;\n\n /** Border-radius from theme or number to set border-radius in px */\n radius?: MantineNumberSize;\n\n /** Transition duration in ms, set to 0 to turn off transitions */\n transitionDuration?: number;\n\n /** Transition timing function for all transitions, defaults to theme.transitionTimingFunction */\n transitionTimingFunction?: string;\n\n /** Default value for uncontrolled component */\n defaultValue?: string;\n}\n\nexport function SegmentedControl<T extends string = string>({\n className,\n data: _data,\n name,\n value,\n onChange,\n color,\n fullWidth,\n radius = 'sm',\n size = 'sm',\n transitionDuration = 200,\n transitionTimingFunction,\n classNames,\n styles,\n defaultValue,\n ...others\n}: SegmentedControlProps<T>) {\n const reduceMotion = useReducedMotion();\n const data = _data.map((item: any) =>\n typeof item === 'string' ? { label: item, value: item } : item\n );\n\n const [shouldAnimate, setShouldAnimate] = useState(false);\n const [_value, handleValueChange] = useUncontrolled({\n value,\n defaultValue,\n finalValue: Array.isArray(data) ? data[0].value : null,\n onChange,\n rule: (val) => !!val,\n });\n\n const { classes, cx } = useStyles(\n {\n size,\n fullWidth,\n color,\n radius,\n shouldAnimate: reduceMotion || !shouldAnimate,\n transitionDuration,\n transitionTimingFunction,\n },\n { classNames, styles, name: 'SegmentedControl' }\n );\n\n const [activePosition, setActivePosition] = useState({ width: 0, translate: 0 });\n const uuid = useUuid(name);\n const refs = useRef<Record<string, HTMLLabelElement>>({});\n const [ref, containerRect] = useResizeObserver();\n\n useEffect(() => {\n if (_value in refs.current && ref.current) {\n const element = refs.current[_value];\n const elementRect = element.getBoundingClientRect();\n\n // Scaled value to undo transforms applied\n const scaledValue = element.offsetWidth / elementRect.width;\n setActivePosition({\n width: elementRect.width * scaledValue,\n translate: element.parentElement.offsetLeft - WRAPPER_PADDING,\n });\n\n if (!shouldAnimate) {\n setTimeout(() => {\n setShouldAnimate(true);\n }, 4);\n }\n }\n }, [_value, containerRect]);\n\n const controls = data.map((item) => (\n <div\n className={cx(classes.control, { [classes.controlActive]: _value === item.value })}\n key={item.value}\n >\n <input\n className={classes.input}\n type=\"radio\"\n name={uuid}\n value={item.value}\n id={`${uuid}-${item.value}`}\n checked={_value === item.value}\n onChange={() => handleValueChange(item.value)}\n />\n\n <label\n className={cx(classes.label, { [classes.labelActive]: _value === item.value })}\n htmlFor={`${uuid}-${item.value}`}\n ref={(node) => {\n refs.current[item.value] = node;\n }}\n >\n {item.label}\n </label>\n </div>\n ));\n\n return (\n <Box className={cx(classes.root, className)} ref={ref} {...others}>\n {!!_value && (\n <span\n className={classes.active}\n style={{\n width: activePosition.width,\n transform: `translateX(${activePosition.translate}px)`,\n }}\n />\n )}\n\n {controls}\n </Box>\n );\n}\n\nSegmentedControl.displayName = '@mantine/core/SegmentedControl';\n"],"names":["useReducedMotion","useState","useUncontrolled","useStyles","useUuid","useRef","useResizeObserver","useEffect","WRAPPER_PADDING","React","Box"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AppShell.styles.js","sources":["../../../src/components/AppShell/AppShell.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize, MantineTheme, CSSObject } from '@mantine/styles';\n\ninterface AppShellStyles {\n padding: MantineNumberSize;\n fixed: boolean;\n headerHeight: string;\n navbarBreakpoints: [number, { width: string | number }][];\n navbarWidth: string;\n navbarOffsetBreakpoint: MantineNumberSize;\n}\n\nfunction getPositionStyles(props: AppShellStyles, theme: MantineTheme): CSSObject {\n const padding = theme.fn.size({ size: props.padding, sizes: theme.spacing });\n const offset = props.navbarOffsetBreakpoint\n ? theme.fn.size({ size: props.navbarOffsetBreakpoint, sizes: theme.breakpoints })\n : null;\n\n if (!props.fixed) {\n return { padding };\n }\n\n const queries = props.navbarBreakpoints.reduce((acc, [breakpoint, breakpointSize]) => {\n acc[`@media (min-width: ${breakpoint + 1}px)`] = {\n paddingLeft: `calc(${breakpointSize}px + ${padding}px)`,\n };\n\n return acc;\n }, {});\n\n if (offset) {\n queries[`@media (max-width: ${offset}px)`] = {\n paddingLeft: padding,\n };\n }\n\n return {\n minHeight: '100vh',\n paddingTop: `calc(${props.headerHeight} + ${padding}px)`,\n paddingLeft: `calc(${props.navbarWidth} + ${padding}px)`,\n ...queries,\n };\n}\n\nexport default createStyles((theme, props: AppShellStyles) => ({\n root: {\n boxSizing: 'border-box',\n },\n\n body: {\n display: 'flex',\n boxSizing: 'border-box',\n },\n\n main: {\n flex: 1,\n boxSizing: 'border-box',\n ...getPositionStyles(props, theme),\n },\n}));\n"],"names":[],"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;AAEF,SAAS,iBAAiB,CAAC,KAAK,EAAE,KAAK,EAAE;AACzC,EAAE,MAAM,OAAO,GAAG,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,KAAK,CAAC,OAAO,EAAE,KAAK,EAAE,KAAK,CAAC,OAAO,EAAE,CAAC,CAAC;AAC/E,EAAE,MAAM,MAAM,GAAG,KAAK,CAAC,sBAAsB,GAAG,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,KAAK,CAAC,sBAAsB,EAAE,KAAK,EAAE,KAAK,CAAC,WAAW,EAAE,CAAC,GAAG,IAAI,CAAC;AACvI,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE;AACpB,IAAI,OAAO,EAAE,OAAO,EAAE,CAAC;AACvB,GAAG;AACH,EAAE,MAAM,OAAO,GAAG,KAAK,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,CAAC,UAAU,EAAE,cAAc,CAAC,KAAK;AACxF,IAAI,GAAG,CAAC,CAAC,mBAAmB,EAAE,UAAU,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG;AACrD,MAAM,WAAW,EAAE,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,EAAE,OAAO,CAAC,GAAG,CAAC;AAC7D,KAAK,CAAC;AACN,IAAI,OAAO,GAAG,CAAC;AACf,GAAG,EAAE,EAAE,CAAC,CAAC;AACT,EAAE,IAAI,MAAM,EAAE;AACd,IAAI,OAAO,CAAC,CAAC,mBAAmB,EAAE,MAAM,CAAC,GAAG,CAAC,CAAC,GAAG;AACjD,MAAM,WAAW,EAAE,OAAO;AAC1B,KAAK,CAAC;AACN,GAAG;AACH,EAAE,OAAO,cAAc,CAAC;AACxB,IAAI,SAAS,EAAE,OAAO;AACtB,IAAI,UAAU,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,YAAY,CAAC,GAAG,EAAE,OAAO,CAAC,GAAG,CAAC;AAC5D,IAAI,WAAW,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE,OAAO,CAAC,GAAG,CAAC;AAC5D,GAAG,EAAE,OAAO,CAAC,CAAC;AACd,CAAC;AACD,gBAAe,YAAY,CAAC,CAAC,KAAK,EAAE,KAAK,MAAM;AAC/C,EAAE,IAAI,EAAE;AACR,IAAI,SAAS,EAAE,YAAY;AAC3B,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,OAAO,EAAE,MAAM;AACnB,IAAI,SAAS,EAAE,YAAY;AAC3B,GAAG;AACH,EAAE,IAAI,EAAE,cAAc,CAAC;AACvB,IAAI,IAAI,EAAE,CAAC;AACX,IAAI,SAAS,EAAE,YAAY;AAC3B,GAAG,EAAE,iBAAiB,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;AACrC,CAAC,CAAC,CAAC;;;;"}
|
|
1
|
+
{"version":3,"file":"AppShell.styles.js","sources":["../../../src/components/AppShell/AppShell.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize, MantineTheme, CSSObject } from '@mantine/styles';\n\ninterface AppShellStyles {\n padding: MantineNumberSize;\n fixed: boolean;\n headerHeight: string;\n navbarBreakpoints: [number, { width: string | number }][];\n navbarWidth: string;\n navbarOffsetBreakpoint: MantineNumberSize;\n}\n\nfunction getPositionStyles(props: AppShellStyles, theme: MantineTheme): CSSObject {\n const padding = theme.fn.size({ size: props.padding, sizes: theme.spacing });\n const offset = props.navbarOffsetBreakpoint\n ? theme.fn.size({ size: props.navbarOffsetBreakpoint, sizes: theme.breakpoints })\n : null;\n\n if (!props.fixed) {\n return { padding };\n }\n\n const queries = props.navbarBreakpoints.reduce((acc, [breakpoint, breakpointSize]) => {\n acc[`@media (min-width: ${breakpoint + 1}px)`] = {\n paddingLeft: `calc(${breakpointSize}px + ${padding}px)`,\n };\n\n return acc;\n }, {});\n\n if (offset) {\n queries[`@media (max-width: ${offset}px)`] = {\n paddingLeft: padding,\n };\n }\n\n return {\n minHeight: '100vh',\n paddingTop: `calc(${props.headerHeight} + ${padding}px)`,\n paddingLeft: `calc(${props.navbarWidth} + ${padding}px)`,\n ...queries,\n };\n}\n\nexport default createStyles((theme, props: AppShellStyles) => ({\n root: {\n boxSizing: 'border-box',\n },\n\n body: {\n display: 'flex',\n boxSizing: 'border-box',\n },\n\n main: {\n flex: 1,\n width: '100vw',\n boxSizing: 'border-box',\n ...getPositionStyles(props, theme),\n },\n}));\n"],"names":[],"mappings":"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"}
|
|
@@ -72,7 +72,8 @@ function MantineDrawer(_a) {
|
|
|
72
72
|
hideCloseButton,
|
|
73
73
|
closeButtonLabel,
|
|
74
74
|
classNames,
|
|
75
|
-
styles
|
|
75
|
+
styles,
|
|
76
|
+
target
|
|
76
77
|
} = _b, others = __objRest(_b, [
|
|
77
78
|
"className",
|
|
78
79
|
"opened",
|
|
@@ -97,7 +98,8 @@ function MantineDrawer(_a) {
|
|
|
97
98
|
"hideCloseButton",
|
|
98
99
|
"closeButtonLabel",
|
|
99
100
|
"classNames",
|
|
100
|
-
"styles"
|
|
101
|
+
"styles",
|
|
102
|
+
"target"
|
|
101
103
|
]);
|
|
102
104
|
const { classes, cx, theme } = useStyles({ size, position }, { classNames, styles, name: "Drawer" });
|
|
103
105
|
const focusTrapRef = useFocusTrap(!noFocusTrap && opened);
|
|
@@ -167,12 +169,15 @@ function MantineDrawer(_a) {
|
|
|
167
169
|
}
|
|
168
170
|
function Drawer(_c) {
|
|
169
171
|
var _d = _c, {
|
|
170
|
-
zIndex = getDefaultZIndex("modal")
|
|
172
|
+
zIndex = getDefaultZIndex("modal"),
|
|
173
|
+
target
|
|
171
174
|
} = _d, props = __objRest(_d, [
|
|
172
|
-
"zIndex"
|
|
175
|
+
"zIndex",
|
|
176
|
+
"target"
|
|
173
177
|
]);
|
|
174
178
|
return /* @__PURE__ */ React.createElement(Portal, {
|
|
175
|
-
zIndex
|
|
179
|
+
zIndex,
|
|
180
|
+
target
|
|
176
181
|
}, /* @__PURE__ */ React.createElement(MantineDrawer, __spreadValues({}, props)));
|
|
177
182
|
}
|
|
178
183
|
Drawer.displayName = "@mantine/core/Drawer";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Drawer.js","sources":["../../../src/components/Drawer/Drawer.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\nimport { useScrollLock, useFocusTrap, useFocusReturn } from '@mantine/hooks';\nimport {\n DefaultProps,\n MantineNumberSize,\n MantineShadow,\n ClassNames,\n MantineMargin,\n getDefaultZIndex,\n} from '@mantine/styles';\nimport { Paper } from '../Paper';\nimport { Overlay } from '../Overlay';\nimport { Portal } from '../Portal';\nimport { Text } from '../Text';\nimport { Box } from '../Box';\nimport { CloseButton } from '../ActionIcon';\nimport { GroupedTransition, MantineTransition } from '../Transition';\nimport useStyles, { DrawerPosition } from './Drawer.styles';\n\nexport type DrawerStylesNames = Exclude<ClassNames<typeof useStyles>, 'noOverlay'>;\n\nexport interface DrawerProps\n extends Omit<DefaultProps<DrawerStylesNames>, MantineMargin>,\n Omit<React.ComponentPropsWithoutRef<'div'>, 'title'> {\n /** If true drawer is mounted to the dom */\n opened: boolean;\n\n /** Called when drawer is closed (Escape key and click outside, depending on options) */\n onClose(): void;\n\n /** Drawer body position */\n position?: DrawerPosition;\n\n /** Drawer body width (right | left position) or height (top | bottom position), cannot exceed 100vh for height and 100% for width */\n size?: string | number;\n\n /** Drawer body shadow from theme or any css shadow value */\n shadow?: MantineShadow;\n\n /** Drawer body padding from theme or number for padding in px */\n padding?: MantineNumberSize;\n\n /** Drawer z-index property */\n zIndex?: number;\n\n /** Disables focus trap */\n noFocusTrap?: boolean;\n\n /** Disables scroll lock */\n noScrollLock?: boolean;\n\n /** Disable onClock trigger for outside events */\n noCloseOnClickOutside?: boolean;\n\n /** Disable onClock trigger for escape key press */\n noCloseOnEscape?: boolean;\n\n /** Drawer appear and disappear transition, see Transition component for full documentation */\n transition?: MantineTransition;\n\n /** Transition duration in ms */\n transitionDuration?: number;\n\n /** Drawer transitionTimingFunction css property */\n transitionTimingFunction?: string;\n\n /** Removes overlay entirely */\n noOverlay?: boolean;\n\n /** Sets overlay opacity, defaults to 0.75 in light theme and to 0.85 in dark theme */\n overlayOpacity?: number;\n\n /** Sets overlay color, defaults to theme.black in light theme and to theme.colors.dark[9] in dark theme */\n overlayColor?: string;\n\n /** Drawer title, displayed in header before close button */\n title?: React.ReactNode;\n\n /** Hides close button, modal still can be closed with escape key and by clicking outside */\n hideCloseButton?: boolean;\n\n /** Close button aria-label */\n closeButtonLabel?: string;\n}\n\nconst transitions: Record<DrawerPosition, MantineTransition> = {\n top: 'slide-down',\n bottom: 'slide-up',\n left: 'slide-right',\n right: 'slide-left',\n};\n\nexport function MantineDrawer({\n className,\n opened,\n onClose,\n position = 'left',\n size = 'md',\n noFocusTrap = false,\n noScrollLock = false,\n noCloseOnClickOutside = false,\n noCloseOnEscape = false,\n transition,\n transitionDuration = 250,\n transitionTimingFunction = 'ease',\n zIndex = getDefaultZIndex('modal'),\n overlayColor,\n overlayOpacity,\n children,\n noOverlay = false,\n shadow = 'md',\n padding = 0,\n title,\n hideCloseButton,\n closeButtonLabel,\n classNames,\n styles,\n ...others\n}: DrawerProps) {\n const { classes, cx, theme } = useStyles(\n { size, position },\n { classNames, styles, name: 'Drawer' }\n );\n const focusTrapRef = useFocusTrap(!noFocusTrap && opened);\n\n const [, lockScroll] = useScrollLock();\n\n const drawerTransition = transition || transitions[position];\n const _overlayOpacity =\n typeof overlayOpacity === 'number'\n ? overlayOpacity\n : theme.colorScheme === 'dark'\n ? 0.85\n : 0.75;\n\n const closeOnEscape = (event: KeyboardEvent) => {\n if (noFocusTrap && event.code === 'Escape' && !noCloseOnEscape) {\n onClose();\n }\n };\n\n // eslint-disable-next-line consistent-return\n useEffect(() => {\n // onKeyDownCapture event will not fire when focus trap is not active\n if (noFocusTrap) {\n window.addEventListener('keydown', closeOnEscape);\n return () => window.removeEventListener('keydown', closeOnEscape);\n }\n }, [noFocusTrap]);\n\n useFocusReturn({ opened, transitionDuration });\n\n return (\n <GroupedTransition\n onExited={() => lockScroll(false)}\n onEntered={() => lockScroll(!noScrollLock && true)}\n mounted={opened}\n transitions={{\n overlay: { duration: transitionDuration / 2, transition: 'fade', timingFunction: 'ease' },\n drawer: {\n duration: transitionDuration,\n transition: drawerTransition,\n timingFunction: transitionTimingFunction,\n },\n }}\n >\n {(transitionStyles) => (\n <Box\n className={cx(classes.root, { [classes.noOverlay]: noOverlay }, className)}\n role=\"dialog\"\n aria-modal\n onMouseDown={() => !noCloseOnClickOutside && onClose()}\n {...others}\n >\n <Paper<'div'>\n onMouseDown={(event) => event.stopPropagation()}\n className={cx(classes.drawer, className)}\n ref={focusTrapRef}\n style={{ ...transitionStyles.drawer, zIndex: zIndex + 2 }}\n radius={0}\n tabIndex={-1}\n onKeyDownCapture={(event) => {\n const shouldTrigger =\n (event.target as any)?.getAttribute('data-mantine-stop-propagation') !== 'true';\n\n shouldTrigger && event.nativeEvent.code === 'Escape' && !noCloseOnEscape && onClose();\n }}\n shadow={shadow}\n padding={padding}\n >\n {(title || !hideCloseButton) && (\n <div className={classes.header}>\n <Text className={classes.title}>{title}</Text>\n\n {!hideCloseButton && (\n <CloseButton\n iconSize={16}\n onClick={onClose}\n aria-label={closeButtonLabel}\n className={classes.closeButton}\n />\n )}\n </div>\n )}\n {children}\n </Paper>\n\n {!noOverlay && (\n <div style={transitionStyles.overlay}>\n <Overlay\n className={classes.overlay}\n opacity={_overlayOpacity}\n zIndex={zIndex}\n color={\n overlayColor ||\n (theme.colorScheme === 'dark' ? theme.colors.dark[9] : theme.black)\n }\n />\n </div>\n )}\n </Box>\n )}\n </GroupedTransition>\n );\n}\n\nexport function Drawer({\n zIndex = getDefaultZIndex('modal'),\n ...props\n}: React.ComponentPropsWithoutRef<typeof MantineDrawer>) {\n return (\n <Portal zIndex={zIndex}>\n <MantineDrawer {...props} />\n </Portal>\n );\n}\n\nDrawer.displayName = '@mantine/core/Drawer';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Drawer.js","sources":["../../../src/components/Drawer/Drawer.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\nimport { useScrollLock, useFocusTrap, useFocusReturn } from '@mantine/hooks';\nimport {\n DefaultProps,\n MantineNumberSize,\n MantineShadow,\n ClassNames,\n MantineMargin,\n getDefaultZIndex,\n} from '@mantine/styles';\nimport { Paper } from '../Paper';\nimport { Overlay } from '../Overlay';\nimport { Portal } from '../Portal';\nimport { Text } from '../Text';\nimport { Box } from '../Box';\nimport { CloseButton } from '../ActionIcon';\nimport { GroupedTransition, MantineTransition } from '../Transition';\nimport useStyles, { DrawerPosition } from './Drawer.styles';\n\nexport type DrawerStylesNames = Exclude<ClassNames<typeof useStyles>, 'noOverlay'>;\n\nexport interface DrawerProps\n extends Omit<DefaultProps<DrawerStylesNames>, MantineMargin>,\n Omit<React.ComponentPropsWithoutRef<'div'>, 'title'> {\n /** If true drawer is mounted to the dom */\n opened: boolean;\n\n /** Called when drawer is closed (Escape key and click outside, depending on options) */\n onClose(): void;\n\n /** Drawer body position */\n position?: DrawerPosition;\n\n /** Drawer body width (right | left position) or height (top | bottom position), cannot exceed 100vh for height and 100% for width */\n size?: string | number;\n\n /** Drawer body shadow from theme or any css shadow value */\n shadow?: MantineShadow;\n\n /** Drawer body padding from theme or number for padding in px */\n padding?: MantineNumberSize;\n\n /** Drawer z-index property */\n zIndex?: number;\n\n /** Disables focus trap */\n noFocusTrap?: boolean;\n\n /** Disables scroll lock */\n noScrollLock?: boolean;\n\n /** Disable onClock trigger for outside events */\n noCloseOnClickOutside?: boolean;\n\n /** Disable onClock trigger for escape key press */\n noCloseOnEscape?: boolean;\n\n /** Drawer appear and disappear transition, see Transition component for full documentation */\n transition?: MantineTransition;\n\n /** Transition duration in ms */\n transitionDuration?: number;\n\n /** Drawer transitionTimingFunction css property */\n transitionTimingFunction?: string;\n\n /** Removes overlay entirely */\n noOverlay?: boolean;\n\n /** Sets overlay opacity, defaults to 0.75 in light theme and to 0.85 in dark theme */\n overlayOpacity?: number;\n\n /** Sets overlay color, defaults to theme.black in light theme and to theme.colors.dark[9] in dark theme */\n overlayColor?: string;\n\n /** Drawer title, displayed in header before close button */\n title?: React.ReactNode;\n\n /** Hides close button, modal still can be closed with escape key and by clicking outside */\n hideCloseButton?: boolean;\n\n /** Close button aria-label */\n closeButtonLabel?: string;\n\n /** Target element or selector where drawer portal should be rendered */\n target?: HTMLElement | string;\n}\n\nconst transitions: Record<DrawerPosition, MantineTransition> = {\n top: 'slide-down',\n bottom: 'slide-up',\n left: 'slide-right',\n right: 'slide-left',\n};\n\nexport function MantineDrawer({\n className,\n opened,\n onClose,\n position = 'left',\n size = 'md',\n noFocusTrap = false,\n noScrollLock = false,\n noCloseOnClickOutside = false,\n noCloseOnEscape = false,\n transition,\n transitionDuration = 250,\n transitionTimingFunction = 'ease',\n zIndex = getDefaultZIndex('modal'),\n overlayColor,\n overlayOpacity,\n children,\n noOverlay = false,\n shadow = 'md',\n padding = 0,\n title,\n hideCloseButton,\n closeButtonLabel,\n classNames,\n styles,\n target,\n ...others\n}: DrawerProps) {\n const { classes, cx, theme } = useStyles(\n { size, position },\n { classNames, styles, name: 'Drawer' }\n );\n const focusTrapRef = useFocusTrap(!noFocusTrap && opened);\n\n const [, lockScroll] = useScrollLock();\n\n const drawerTransition = transition || transitions[position];\n const _overlayOpacity =\n typeof overlayOpacity === 'number'\n ? overlayOpacity\n : theme.colorScheme === 'dark'\n ? 0.85\n : 0.75;\n\n const closeOnEscape = (event: KeyboardEvent) => {\n if (noFocusTrap && event.code === 'Escape' && !noCloseOnEscape) {\n onClose();\n }\n };\n\n // eslint-disable-next-line consistent-return\n useEffect(() => {\n // onKeyDownCapture event will not fire when focus trap is not active\n if (noFocusTrap) {\n window.addEventListener('keydown', closeOnEscape);\n return () => window.removeEventListener('keydown', closeOnEscape);\n }\n }, [noFocusTrap]);\n\n useFocusReturn({ opened, transitionDuration });\n\n return (\n <GroupedTransition\n onExited={() => lockScroll(false)}\n onEntered={() => lockScroll(!noScrollLock && true)}\n mounted={opened}\n transitions={{\n overlay: { duration: transitionDuration / 2, transition: 'fade', timingFunction: 'ease' },\n drawer: {\n duration: transitionDuration,\n transition: drawerTransition,\n timingFunction: transitionTimingFunction,\n },\n }}\n >\n {(transitionStyles) => (\n <Box\n className={cx(classes.root, { [classes.noOverlay]: noOverlay }, className)}\n role=\"dialog\"\n aria-modal\n onMouseDown={() => !noCloseOnClickOutside && onClose()}\n {...others}\n >\n <Paper<'div'>\n onMouseDown={(event) => event.stopPropagation()}\n className={cx(classes.drawer, className)}\n ref={focusTrapRef}\n style={{ ...transitionStyles.drawer, zIndex: zIndex + 2 }}\n radius={0}\n tabIndex={-1}\n onKeyDownCapture={(event) => {\n const shouldTrigger =\n (event.target as any)?.getAttribute('data-mantine-stop-propagation') !== 'true';\n\n shouldTrigger && event.nativeEvent.code === 'Escape' && !noCloseOnEscape && onClose();\n }}\n shadow={shadow}\n padding={padding}\n >\n {(title || !hideCloseButton) && (\n <div className={classes.header}>\n <Text className={classes.title}>{title}</Text>\n\n {!hideCloseButton && (\n <CloseButton\n iconSize={16}\n onClick={onClose}\n aria-label={closeButtonLabel}\n className={classes.closeButton}\n />\n )}\n </div>\n )}\n {children}\n </Paper>\n\n {!noOverlay && (\n <div style={transitionStyles.overlay}>\n <Overlay\n className={classes.overlay}\n opacity={_overlayOpacity}\n zIndex={zIndex}\n color={\n overlayColor ||\n (theme.colorScheme === 'dark' ? theme.colors.dark[9] : theme.black)\n }\n />\n </div>\n )}\n </Box>\n )}\n </GroupedTransition>\n );\n}\n\nexport function Drawer({\n zIndex = getDefaultZIndex('modal'),\n target,\n ...props\n}: React.ComponentPropsWithoutRef<typeof MantineDrawer>) {\n return (\n <Portal zIndex={zIndex} target={target}>\n <MantineDrawer {...props} />\n </Portal>\n );\n}\n\nDrawer.displayName = '@mantine/core/Drawer';\n"],"names":[],"mappings":"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"}
|
|
@@ -1,11 +1,13 @@
|
|
|
1
|
-
import React, { forwardRef, useState } from 'react';
|
|
2
|
-
import {
|
|
1
|
+
import React, { forwardRef, useState, useRef, useEffect } from 'react';
|
|
2
|
+
import { useMergedRef } from '@mantine/hooks';
|
|
3
3
|
import { ImageIcon } from './ImageIcon.js';
|
|
4
4
|
import useStyles from './Image.styles.js';
|
|
5
5
|
import { Box } from '../Box/Box.js';
|
|
6
6
|
import { Text } from '../Text/Text.js';
|
|
7
7
|
|
|
8
8
|
var __defProp = Object.defineProperty;
|
|
9
|
+
var __defProps = Object.defineProperties;
|
|
10
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
9
11
|
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
10
12
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
11
13
|
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
@@ -21,6 +23,7 @@ var __spreadValues = (a, b) => {
|
|
|
21
23
|
}
|
|
22
24
|
return a;
|
|
23
25
|
};
|
|
26
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
24
27
|
var __objRest = (source, exclude) => {
|
|
25
28
|
var target = {};
|
|
26
29
|
for (var prop in source)
|
|
@@ -69,9 +72,14 @@ const Image = forwardRef((_a, ref) => {
|
|
|
69
72
|
const [loaded, setLoaded] = useState(false);
|
|
70
73
|
const [error, setError] = useState(!src);
|
|
71
74
|
const isPlaceholder = withPlaceholder && (!loaded || error);
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
+
const internalImgRef = useRef(null);
|
|
76
|
+
const mergedImgRef = useMergedRef(imageRef, internalImgRef);
|
|
77
|
+
useEffect(() => {
|
|
78
|
+
const { current } = internalImgRef;
|
|
79
|
+
if (current == null ? void 0 : current.complete) {
|
|
80
|
+
setError(current.naturalHeight === 0);
|
|
81
|
+
setLoaded(current.naturalHeight !== 0);
|
|
82
|
+
}
|
|
75
83
|
}, [src]);
|
|
76
84
|
return /* @__PURE__ */ React.createElement(Box, __spreadValues({
|
|
77
85
|
className: cx(classes.root, className),
|
|
@@ -80,12 +88,13 @@ const Image = forwardRef((_a, ref) => {
|
|
|
80
88
|
className: classes.figure
|
|
81
89
|
}, /* @__PURE__ */ React.createElement("div", {
|
|
82
90
|
className: classes.imageWrapper
|
|
83
|
-
}, /* @__PURE__ */ React.createElement("img", __spreadValues({
|
|
91
|
+
}, /* @__PURE__ */ React.createElement("img", __spreadProps(__spreadValues({
|
|
84
92
|
className: classes.image,
|
|
85
93
|
src,
|
|
86
94
|
alt,
|
|
87
95
|
style: { objectFit: fit, width, height },
|
|
88
|
-
ref:
|
|
96
|
+
ref: mergedImgRef
|
|
97
|
+
}, imageProps), {
|
|
89
98
|
onLoad: (event) => {
|
|
90
99
|
setLoaded(true);
|
|
91
100
|
typeof (imageProps == null ? void 0 : imageProps.onLoad) === "function" && imageProps.onLoad(event);
|
|
@@ -94,7 +103,7 @@ const Image = forwardRef((_a, ref) => {
|
|
|
94
103
|
setError(true);
|
|
95
104
|
typeof (imageProps == null ? void 0 : imageProps.onError) === "function" && imageProps.onError(event);
|
|
96
105
|
}
|
|
97
|
-
}
|
|
106
|
+
})), isPlaceholder && /* @__PURE__ */ React.createElement("div", {
|
|
98
107
|
className: classes.placeholder,
|
|
99
108
|
title: alt
|
|
100
109
|
}, placeholder || /* @__PURE__ */ React.createElement(ImageIcon, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Image.js","sources":["../../../src/components/Image/Image.tsx"],"sourcesContent":["import React, { useState, forwardRef } from 'react';\nimport { DefaultProps, MantineNumberSize, ClassNames } from '@mantine/styles';\nimport {
|
|
1
|
+
{"version":3,"file":"Image.js","sources":["../../../src/components/Image/Image.tsx"],"sourcesContent":["import React, { useState, forwardRef, useEffect, useRef } from 'react';\nimport { DefaultProps, MantineNumberSize, ClassNames } from '@mantine/styles';\nimport { useMergedRef } from '@mantine/hooks';\nimport { Text } from '../Text';\nimport { Box } from '../Box';\nimport { ImageIcon } from './ImageIcon';\nimport useStyles from './Image.styles';\n\nexport type ImageStylesNames = ClassNames<typeof useStyles>;\n\nexport interface ImageProps\n extends DefaultProps<ImageStylesNames>,\n Omit<React.ComponentPropsWithoutRef<'div'>, 'placeholder'> {\n /** Image src */\n src?: string;\n\n /** Image alt text, used as title for placeholder if image was not loaded */\n alt?: string;\n\n /** Image object-fit property */\n fit?: 'contain' | 'cover';\n\n /** Image width, defaults to 100%, cannot exceed 100% */\n width?: number | string;\n\n /** Image height, defaults to original image height adjusted to given width */\n height?: number | string;\n\n /** Predefined border-radius value from theme.radius or number for border-radius in px */\n radius?: MantineNumberSize;\n\n /** Enable placeholder when image is loading and when image fails to load */\n withPlaceholder?: boolean;\n\n /** Customize placeholder content */\n placeholder?: React.ReactNode;\n\n /** Props spread to img element */\n imageProps?: React.ComponentPropsWithoutRef<'img'>;\n\n /** Get image element ref */\n imageRef?: React.ForwardedRef<HTMLImageElement>;\n\n /** Image figcaption, displayed bellow image */\n caption?: React.ReactNode;\n}\n\nexport const Image = forwardRef<HTMLDivElement, ImageProps>(\n (\n {\n className,\n alt,\n src,\n fit = 'cover',\n width = '100%',\n height = 'auto',\n radius = 0,\n imageProps,\n withPlaceholder = false,\n placeholder,\n imageRef,\n classNames,\n styles,\n caption,\n ...others\n }: ImageProps,\n ref\n ) => {\n const { classes, cx } = useStyles({ radius }, { classNames, styles, name: 'Image' });\n const [loaded, setLoaded] = useState(false);\n const [error, setError] = useState(!src);\n const isPlaceholder = withPlaceholder && (!loaded || error);\n const internalImgRef = useRef<HTMLImageElement>(null);\n const mergedImgRef = useMergedRef(imageRef, internalImgRef);\n\n useEffect(() => {\n const { current } = internalImgRef;\n if (current?.complete) {\n setError(current.naturalHeight === 0);\n setLoaded(current.naturalHeight !== 0);\n }\n }, [src]);\n\n return (\n <Box className={cx(classes.root, className)} ref={ref} {...others}>\n <figure className={classes.figure}>\n <div className={classes.imageWrapper}>\n <img\n className={classes.image}\n src={src}\n alt={alt}\n style={{ objectFit: fit, width, height }}\n ref={mergedImgRef}\n {...imageProps}\n onLoad={(event) => {\n setLoaded(true);\n typeof imageProps?.onLoad === 'function' && imageProps.onLoad(event);\n }}\n onError={(event) => {\n setError(true);\n typeof imageProps?.onError === 'function' && imageProps.onError(event);\n }}\n />\n\n {isPlaceholder && (\n <div className={classes.placeholder} title={alt}>\n {placeholder || <ImageIcon style={{ width: 40, height: 40 }} />}\n </div>\n )}\n </div>\n\n {!!caption && (\n <Text component=\"figcaption\" size=\"sm\" align=\"center\" className={classes.caption}>\n {caption}\n </Text>\n )}\n </figure>\n </Box>\n );\n }\n);\n\nImage.displayName = '@mantine/core/Image';\n"],"names":[],"mappings":"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"}
|
|
@@ -65,7 +65,8 @@ function MantineModal(_a) {
|
|
|
65
65
|
closeOnClickOutside = true,
|
|
66
66
|
noFocusTrap = false,
|
|
67
67
|
closeOnEscape = true,
|
|
68
|
-
centered = false
|
|
68
|
+
centered = false,
|
|
69
|
+
target
|
|
69
70
|
} = _b, others = __objRest(_b, [
|
|
70
71
|
"className",
|
|
71
72
|
"opened",
|
|
@@ -89,7 +90,8 @@ function MantineModal(_a) {
|
|
|
89
90
|
"closeOnClickOutside",
|
|
90
91
|
"noFocusTrap",
|
|
91
92
|
"closeOnEscape",
|
|
92
|
-
"centered"
|
|
93
|
+
"centered",
|
|
94
|
+
"target"
|
|
93
95
|
]);
|
|
94
96
|
const baseId = useUuid(id);
|
|
95
97
|
const titleId = `${baseId}-title`;
|
|
@@ -171,12 +173,15 @@ function MantineModal(_a) {
|
|
|
171
173
|
}
|
|
172
174
|
function Modal(_c) {
|
|
173
175
|
var _d = _c, {
|
|
174
|
-
zIndex = getDefaultZIndex("modal")
|
|
176
|
+
zIndex = getDefaultZIndex("modal"),
|
|
177
|
+
target
|
|
175
178
|
} = _d, props = __objRest(_d, [
|
|
176
|
-
"zIndex"
|
|
179
|
+
"zIndex",
|
|
180
|
+
"target"
|
|
177
181
|
]);
|
|
178
182
|
return /* @__PURE__ */ React.createElement(Portal, {
|
|
179
|
-
zIndex
|
|
183
|
+
zIndex,
|
|
184
|
+
target
|
|
180
185
|
}, /* @__PURE__ */ React.createElement(MantineModal, __spreadValues({}, props)));
|
|
181
186
|
}
|
|
182
187
|
Modal.displayName = "@mantine/core/Modal";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.js","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["/* eslint-disable jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */\nimport React, { useEffect } from 'react';\nimport { useScrollLock, useFocusTrap, useFocusReturn, useUuid } from '@mantine/hooks';\nimport {\n DefaultProps,\n MantineNumberSize,\n MantineShadow,\n ClassNames,\n MantineMargin,\n getDefaultZIndex,\n} from '@mantine/styles';\nimport { CloseButton } from '../ActionIcon';\nimport { Text } from '../Text';\nimport { Paper } from '../Paper';\nimport { Overlay } from '../Overlay';\nimport { Portal } from '../Portal';\nimport { Box } from '../Box';\nimport { GroupedTransition, MantineTransition } from '../Transition';\nimport useStyles from './Modal.styles';\n\nexport type ModalStylesNames = ClassNames<typeof useStyles>;\n\nexport interface ModalProps\n extends Omit<DefaultProps<ModalStylesNames>, MantineMargin>,\n Omit<React.ComponentPropsWithoutRef<'div'>, 'title'> {\n /** Mounts modal if true */\n opened: boolean;\n\n /** Called when close button clicked and when escape key is pressed */\n onClose(): void;\n\n /** Modal title, displayed in header before close button */\n title?: React.ReactNode;\n\n /** Modal z-index property */\n zIndex?: number;\n\n /** Control vertical overflow behavior */\n overflow?: 'outside' | 'inside';\n\n /** Hides close button, modal still can be closed with escape key and by clicking outside */\n hideCloseButton?: boolean;\n\n /** Overlay below modal opacity, defaults to 0.75 in light theme and to 0.85 in dark theme */\n overlayOpacity?: number;\n\n /** Overlay below modal color, defaults to theme.black in light theme and to theme.colors.dark[9] in dark theme */\n overlayColor?: string;\n\n /** Modal radius */\n radius?: MantineNumberSize;\n\n /** Modal body width */\n size?: string | number;\n\n /** Modal body transition */\n transition?: MantineTransition;\n\n /** Duration in ms of modal transitions, set to 0 to disable all animations */\n transitionDuration?: number;\n\n /** Modal body transitionTimingFunction, defaults to theme.transitionTimingFunction */\n transitionTimingFunction?: string;\n\n /** Close button aria-label */\n closeButtonLabel?: string;\n\n /** id base, used to generate ids to connect modal title and body with aria- attributes, defaults to random id */\n id?: string;\n\n /** Modal shadow from theme or css value */\n shadow?: MantineShadow;\n\n /** Modal padding from theme or number value for padding in px */\n padding?: MantineNumberSize;\n\n /** Should modal be closed when outside click was registered? */\n closeOnClickOutside?: boolean;\n\n /** Should modal be closed when escape is pressed? */\n closeOnEscape?: boolean;\n\n /** Disables focus trap */\n noFocusTrap?: boolean;\n\n /** Controls if modal should be centered */\n centered?: boolean;\n}\n\nexport function MantineModal({\n className,\n opened,\n title,\n onClose,\n children,\n hideCloseButton = false,\n overlayOpacity,\n size = 'md',\n transitionDuration = 300,\n closeButtonLabel,\n overlayColor,\n overflow = 'outside',\n transition = 'pop',\n padding = 'lg',\n shadow = 'lg',\n radius = 'sm',\n id,\n classNames,\n styles,\n closeOnClickOutside = true,\n noFocusTrap = false,\n closeOnEscape = true,\n centered = false,\n ...others\n}: ModalProps) {\n const baseId = useUuid(id);\n const titleId = `${baseId}-title`;\n const bodyId = `${baseId}-body`;\n const { classes, cx, theme } = useStyles(\n { size, overflow, centered },\n { classNames, styles, name: 'Modal' }\n );\n const focusTrapRef = useFocusTrap(!noFocusTrap && opened);\n const _overlayOpacity =\n typeof overlayOpacity === 'number'\n ? overlayOpacity\n : theme.colorScheme === 'dark'\n ? 0.85\n : 0.75;\n\n const [, lockScroll] = useScrollLock();\n\n const closeOnEscapePress = (event: KeyboardEvent) => {\n if (noFocusTrap && event.code === 'Escape' && closeOnEscape) {\n onClose();\n }\n };\n\n // eslint-disable-next-line consistent-return\n useEffect(() => {\n // onKeyDownCapture event will not fire when focus trap is not active\n if (noFocusTrap) {\n window.addEventListener('keydown', closeOnEscapePress);\n return () => window.removeEventListener('keydown', closeOnEscapePress);\n }\n }, [noFocusTrap]);\n\n useFocusReturn({ opened, transitionDuration });\n\n return (\n <GroupedTransition\n onExited={() => lockScroll(false)}\n onEntered={() => lockScroll(true)}\n mounted={opened}\n transitions={{\n modal: { duration: transitionDuration, transition },\n overlay: {\n duration: transitionDuration / 2,\n transition: 'fade',\n timingFunction: 'ease',\n },\n }}\n >\n {(transitionStyles) => (\n <Box className={cx(classes.root, className)} {...others}>\n <div\n className={classes.inner}\n onMouseDown={() => closeOnClickOutside && onClose()}\n onKeyDownCapture={(event) => {\n const shouldTrigger =\n (event.target as any)?.getAttribute('data-mantine-stop-propagation') !== 'true';\n shouldTrigger && event.nativeEvent.code === 'Escape' && closeOnEscape && onClose();\n }}\n ref={focusTrapRef}\n >\n <Paper<'div'>\n onMouseDown={(event) => event.stopPropagation()}\n className={classes.modal}\n shadow={shadow}\n padding={padding}\n radius={radius}\n role=\"dialog\"\n aria-labelledby={titleId}\n aria-describedby={bodyId}\n aria-modal\n tabIndex={-1}\n style={{\n ...transitionStyles.modal,\n marginLeft: 'calc(var(--removed-scroll-width, 0px) * -1)',\n zIndex: 3,\n }}\n >\n {(title || !hideCloseButton) && (\n <div className={classes.header}>\n <Text id={titleId} className={classes.title}>\n {title}\n </Text>\n\n {!hideCloseButton && (\n <CloseButton\n iconSize={16}\n onClick={onClose}\n aria-label={closeButtonLabel}\n className={classes.close}\n />\n )}\n </div>\n )}\n\n <div id={bodyId} className={classes.body}>\n {children}\n </div>\n </Paper>\n </div>\n\n <div style={transitionStyles.overlay}>\n <Overlay\n zIndex={0}\n color={\n overlayColor || (theme.colorScheme === 'dark' ? theme.colors.dark[9] : theme.black)\n }\n opacity={_overlayOpacity}\n />\n </div>\n </Box>\n )}\n </GroupedTransition>\n );\n}\n\nexport function Modal({\n zIndex = getDefaultZIndex('modal'),\n ...props\n}: React.ComponentPropsWithoutRef<typeof MantineModal>) {\n return (\n <Portal zIndex={zIndex}>\n <MantineModal {...props} />\n </Portal>\n );\n}\n\nModal.displayName = '@mantine/core/Modal';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Modal.js","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["/* eslint-disable jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */\nimport React, { useEffect } from 'react';\nimport { useScrollLock, useFocusTrap, useFocusReturn, useUuid } from '@mantine/hooks';\nimport {\n DefaultProps,\n MantineNumberSize,\n MantineShadow,\n ClassNames,\n MantineMargin,\n getDefaultZIndex,\n} from '@mantine/styles';\nimport { CloseButton } from '../ActionIcon';\nimport { Text } from '../Text';\nimport { Paper } from '../Paper';\nimport { Overlay } from '../Overlay';\nimport { Portal } from '../Portal';\nimport { Box } from '../Box';\nimport { GroupedTransition, MantineTransition } from '../Transition';\nimport useStyles from './Modal.styles';\n\nexport type ModalStylesNames = ClassNames<typeof useStyles>;\n\nexport interface ModalProps\n extends Omit<DefaultProps<ModalStylesNames>, MantineMargin>,\n Omit<React.ComponentPropsWithoutRef<'div'>, 'title'> {\n /** Mounts modal if true */\n opened: boolean;\n\n /** Called when close button clicked and when escape key is pressed */\n onClose(): void;\n\n /** Modal title, displayed in header before close button */\n title?: React.ReactNode;\n\n /** Modal z-index property */\n zIndex?: number;\n\n /** Control vertical overflow behavior */\n overflow?: 'outside' | 'inside';\n\n /** Hides close button, modal still can be closed with escape key and by clicking outside */\n hideCloseButton?: boolean;\n\n /** Overlay below modal opacity, defaults to 0.75 in light theme and to 0.85 in dark theme */\n overlayOpacity?: number;\n\n /** Overlay below modal color, defaults to theme.black in light theme and to theme.colors.dark[9] in dark theme */\n overlayColor?: string;\n\n /** Modal radius */\n radius?: MantineNumberSize;\n\n /** Modal body width */\n size?: string | number;\n\n /** Modal body transition */\n transition?: MantineTransition;\n\n /** Duration in ms of modal transitions, set to 0 to disable all animations */\n transitionDuration?: number;\n\n /** Modal body transitionTimingFunction, defaults to theme.transitionTimingFunction */\n transitionTimingFunction?: string;\n\n /** Close button aria-label */\n closeButtonLabel?: string;\n\n /** id base, used to generate ids to connect modal title and body with aria- attributes, defaults to random id */\n id?: string;\n\n /** Modal shadow from theme or css value */\n shadow?: MantineShadow;\n\n /** Modal padding from theme or number value for padding in px */\n padding?: MantineNumberSize;\n\n /** Should modal be closed when outside click was registered? */\n closeOnClickOutside?: boolean;\n\n /** Should modal be closed when escape is pressed? */\n closeOnEscape?: boolean;\n\n /** Disables focus trap */\n noFocusTrap?: boolean;\n\n /** Controls if modal should be centered */\n centered?: boolean;\n\n /** Target element or selector where modal portal should be rendered */\n target?: HTMLElement | string;\n}\n\nexport function MantineModal({\n className,\n opened,\n title,\n onClose,\n children,\n hideCloseButton = false,\n overlayOpacity,\n size = 'md',\n transitionDuration = 300,\n closeButtonLabel,\n overlayColor,\n overflow = 'outside',\n transition = 'pop',\n padding = 'lg',\n shadow = 'lg',\n radius = 'sm',\n id,\n classNames,\n styles,\n closeOnClickOutside = true,\n noFocusTrap = false,\n closeOnEscape = true,\n centered = false,\n target,\n ...others\n}: ModalProps) {\n const baseId = useUuid(id);\n const titleId = `${baseId}-title`;\n const bodyId = `${baseId}-body`;\n const { classes, cx, theme } = useStyles(\n { size, overflow, centered },\n { classNames, styles, name: 'Modal' }\n );\n const focusTrapRef = useFocusTrap(!noFocusTrap && opened);\n const _overlayOpacity =\n typeof overlayOpacity === 'number'\n ? overlayOpacity\n : theme.colorScheme === 'dark'\n ? 0.85\n : 0.75;\n\n const [, lockScroll] = useScrollLock();\n\n const closeOnEscapePress = (event: KeyboardEvent) => {\n if (noFocusTrap && event.code === 'Escape' && closeOnEscape) {\n onClose();\n }\n };\n\n // eslint-disable-next-line consistent-return\n useEffect(() => {\n // onKeyDownCapture event will not fire when focus trap is not active\n if (noFocusTrap) {\n window.addEventListener('keydown', closeOnEscapePress);\n return () => window.removeEventListener('keydown', closeOnEscapePress);\n }\n }, [noFocusTrap]);\n\n useFocusReturn({ opened, transitionDuration });\n\n return (\n <GroupedTransition\n onExited={() => lockScroll(false)}\n onEntered={() => lockScroll(true)}\n mounted={opened}\n transitions={{\n modal: { duration: transitionDuration, transition },\n overlay: {\n duration: transitionDuration / 2,\n transition: 'fade',\n timingFunction: 'ease',\n },\n }}\n >\n {(transitionStyles) => (\n <Box className={cx(classes.root, className)} {...others}>\n <div\n className={classes.inner}\n onMouseDown={() => closeOnClickOutside && onClose()}\n onKeyDownCapture={(event) => {\n const shouldTrigger =\n (event.target as any)?.getAttribute('data-mantine-stop-propagation') !== 'true';\n shouldTrigger && event.nativeEvent.code === 'Escape' && closeOnEscape && onClose();\n }}\n ref={focusTrapRef}\n >\n <Paper<'div'>\n onMouseDown={(event) => event.stopPropagation()}\n className={classes.modal}\n shadow={shadow}\n padding={padding}\n radius={radius}\n role=\"dialog\"\n aria-labelledby={titleId}\n aria-describedby={bodyId}\n aria-modal\n tabIndex={-1}\n style={{\n ...transitionStyles.modal,\n marginLeft: 'calc(var(--removed-scroll-width, 0px) * -1)',\n zIndex: 3,\n }}\n >\n {(title || !hideCloseButton) && (\n <div className={classes.header}>\n <Text id={titleId} className={classes.title}>\n {title}\n </Text>\n\n {!hideCloseButton && (\n <CloseButton\n iconSize={16}\n onClick={onClose}\n aria-label={closeButtonLabel}\n className={classes.close}\n />\n )}\n </div>\n )}\n\n <div id={bodyId} className={classes.body}>\n {children}\n </div>\n </Paper>\n </div>\n\n <div style={transitionStyles.overlay}>\n <Overlay\n zIndex={0}\n color={\n overlayColor || (theme.colorScheme === 'dark' ? theme.colors.dark[9] : theme.black)\n }\n opacity={_overlayOpacity}\n />\n </div>\n </Box>\n )}\n </GroupedTransition>\n );\n}\n\nexport function Modal({\n zIndex = getDefaultZIndex('modal'),\n target,\n ...props\n}: React.ComponentPropsWithoutRef<typeof MantineModal>) {\n return (\n <Portal zIndex={zIndex} target={target}>\n <MantineModal {...props} />\n </Portal>\n );\n}\n\nModal.displayName = '@mantine/core/Modal';\n"],"names":[],"mappings":"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"}
|
|
@@ -7,7 +7,7 @@ function Portal({ children, zIndex = 1, target, className }) {
|
|
|
7
7
|
const ref = useRef();
|
|
8
8
|
useIsomorphicEffect(() => {
|
|
9
9
|
setMounted(true);
|
|
10
|
-
ref.current = target
|
|
10
|
+
ref.current = !target ? document.createElement("div") : typeof target === "string" ? document.querySelector(target) : target;
|
|
11
11
|
if (!target) {
|
|
12
12
|
document.body.appendChild(ref.current);
|
|
13
13
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Portal.js","sources":["../../../src/components/Portal/Portal.tsx"],"sourcesContent":["import React, { ReactPortal, useRef, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useIsomorphicEffect } from '@mantine/hooks';\n\nexport interface PortalProps {\n /** Portal children, for example, modal or popover */\n children: React.ReactNode;\n\n /** Root element z-index property */\n zIndex?: number;\n\n /** Element where portal should be rendered, by default new div element is created and appended to document.body */\n target?:
|
|
1
|
+
{"version":3,"file":"Portal.js","sources":["../../../src/components/Portal/Portal.tsx"],"sourcesContent":["import React, { ReactPortal, useRef, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useIsomorphicEffect } from '@mantine/hooks';\n\nexport interface PortalProps {\n /** Portal children, for example, modal or popover */\n children: React.ReactNode;\n\n /** Root element z-index property */\n zIndex?: number;\n\n /** Element where portal should be rendered, by default new div element is created and appended to document.body */\n target?: HTMLElement | string;\n\n /** Root element className */\n className?: string;\n}\n\nexport function Portal({ children, zIndex = 1, target, className }: PortalProps): ReactPortal {\n const [mounted, setMounted] = useState(false);\n const ref = useRef<HTMLElement>();\n\n useIsomorphicEffect(() => {\n setMounted(true);\n ref.current = !target\n ? document.createElement('div')\n : typeof target === 'string'\n ? document.querySelector(target)\n : target;\n\n if (!target) {\n document.body.appendChild(ref.current);\n }\n\n return () => {\n !target && document.body.removeChild(ref.current);\n };\n }, [target]);\n\n if (!mounted) {\n return null;\n }\n\n return createPortal(\n <div className={className} style={{ position: 'relative', zIndex }}>\n {children}\n </div>,\n ref.current\n );\n}\n\nPortal.displayName = '@mantine/core/Portal';\n"],"names":[],"mappings":";;;;AAGO,SAAS,MAAM,CAAC,EAAE,QAAQ,EAAE,MAAM,GAAG,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE;AACpE,EAAE,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;AAChD,EAAE,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;AACvB,EAAE,mBAAmB,CAAC,MAAM;AAC5B,IAAI,UAAU,CAAC,IAAI,CAAC,CAAC;AACrB,IAAI,GAAG,CAAC,OAAO,GAAG,CAAC,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,GAAG,OAAO,MAAM,KAAK,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,GAAG,MAAM,CAAC;AACjI,IAAI,IAAI,CAAC,MAAM,EAAE;AACjB,MAAM,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;AAC7C,KAAK;AACL,IAAI,OAAO,MAAM;AACjB,MAAM,CAAC,MAAM,IAAI,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;AACxD,KAAK,CAAC;AACN,GAAG,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;AACf,EAAE,IAAI,CAAC,OAAO,EAAE;AAChB,IAAI,OAAO,IAAI,CAAC;AAChB,GAAG;AACH,EAAE,OAAO,YAAY,iBAAiB,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE;AACjE,IAAI,SAAS;AACb,IAAI,KAAK,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,EAAE;AAC3C,GAAG,EAAE,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC,CAAC;AAC7B,CAAC;AACD,MAAM,CAAC,WAAW,GAAG,sBAAsB;;;;"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React, { useState, useRef, useEffect } from 'react';
|
|
2
|
-
import { useReducedMotion, useUncontrolled, useUuid } from '@mantine/hooks';
|
|
2
|
+
import { useReducedMotion, useUncontrolled, useUuid, useResizeObserver } from '@mantine/hooks';
|
|
3
3
|
import useStyles, { WRAPPER_PADDING } from './SegmentedControl.styles.js';
|
|
4
4
|
import { Box } from '../Box/Box.js';
|
|
5
5
|
|
|
@@ -85,26 +85,23 @@ function SegmentedControl(_a) {
|
|
|
85
85
|
const [activePosition, setActivePosition] = useState({ width: 0, translate: 0 });
|
|
86
86
|
const uuid = useUuid(name);
|
|
87
87
|
const refs = useRef({});
|
|
88
|
-
const
|
|
88
|
+
const [ref, containerRect] = useResizeObserver();
|
|
89
89
|
useEffect(() => {
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
}
|
|
90
|
+
if (_value in refs.current && ref.current) {
|
|
91
|
+
const element = refs.current[_value];
|
|
92
|
+
const elementRect = element.getBoundingClientRect();
|
|
93
|
+
const scaledValue = element.offsetWidth / elementRect.width;
|
|
94
|
+
setActivePosition({
|
|
95
|
+
width: elementRect.width * scaledValue,
|
|
96
|
+
translate: element.parentElement.offsetLeft - WRAPPER_PADDING
|
|
97
|
+
});
|
|
98
|
+
if (!shouldAnimate) {
|
|
99
|
+
setTimeout(() => {
|
|
100
|
+
setShouldAnimate(true);
|
|
101
|
+
}, 4);
|
|
103
102
|
}
|
|
104
|
-
}
|
|
105
|
-
|
|
106
|
-
return () => observer.disconnect();
|
|
107
|
-
}, [_value]);
|
|
103
|
+
}
|
|
104
|
+
}, [_value, containerRect]);
|
|
108
105
|
const controls = data.map((item) => /* @__PURE__ */ React.createElement("div", {
|
|
109
106
|
className: cx(classes.control, { [classes.controlActive]: _value === item.value }),
|
|
110
107
|
key: item.value
|
|
@@ -125,7 +122,7 @@ function SegmentedControl(_a) {
|
|
|
125
122
|
}, item.label)));
|
|
126
123
|
return /* @__PURE__ */ React.createElement(Box, __spreadValues({
|
|
127
124
|
className: cx(classes.root, className),
|
|
128
|
-
ref
|
|
125
|
+
ref
|
|
129
126
|
}, others), !!_value && /* @__PURE__ */ React.createElement("span", {
|
|
130
127
|
className: classes.active,
|
|
131
128
|
style: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SegmentedControl.js","sources":["../../../src/components/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { useReducedMotion, useUncontrolled, useUuid } from '@mantine/hooks';\nimport {\n DefaultProps,\n MantineNumberSize,\n MantineSize,\n MantineColor,\n ClassNames,\n} from '@mantine/styles';\nimport { Box } from '../Box';\nimport useStyles, { WRAPPER_PADDING } from './SegmentedControl.styles';\n\nexport interface SegmentedControlItem<T extends string> {\n value: T;\n label: React.ReactNode;\n}\n\nexport type SegmentedControlStylesNames = ClassNames<typeof useStyles>;\n\nexport interface SegmentedControlProps<T extends string>\n extends DefaultProps<SegmentedControlStylesNames>,\n Omit<React.ComponentPropsWithoutRef<'div'>, 'value' | 'onChange'> {\n /** Data based on which controls are rendered */\n data: T[] | SegmentedControlItem<T>[];\n\n /** Current selected value */\n value?: T;\n\n /** Called when value changes */\n onChange?(value: T): void;\n\n /** Name of the radio group, default to random id */\n name?: string;\n\n /** True if component should have 100% width */\n fullWidth?: boolean;\n\n /** Active control color from theme.colors, defaults to white in light color scheme and theme.colors.dark[9] in dark */\n color?: MantineColor;\n\n /** Controls font-size, paddings and height */\n size?: MantineSize;\n\n /** Border-radius from theme or number to set border-radius in px */\n radius?: MantineNumberSize;\n\n /** Transition duration in ms, set to 0 to turn off transitions */\n transitionDuration?: number;\n\n /** Transition timing function for all transitions, defaults to theme.transitionTimingFunction */\n transitionTimingFunction?: string;\n\n /** Default value for uncontrolled component */\n defaultValue?: string;\n}\n\nexport function SegmentedControl<T extends string = string>({\n className,\n data: _data,\n name,\n value,\n onChange,\n color,\n fullWidth,\n radius = 'sm',\n size = 'sm',\n transitionDuration = 200,\n transitionTimingFunction,\n classNames,\n styles,\n defaultValue,\n ...others\n}: SegmentedControlProps<T>) {\n const reduceMotion = useReducedMotion();\n const data = _data.map((item: any) =>\n typeof item === 'string' ? { label: item, value: item } : item\n );\n\n const [shouldAnimate, setShouldAnimate] = useState(false);\n const [_value, handleValueChange] = useUncontrolled({\n value,\n defaultValue,\n finalValue: Array.isArray(data) ? data[0].value : null,\n onChange,\n rule: (val) => !!val,\n });\n\n const { classes, cx } = useStyles(\n {\n size,\n fullWidth,\n color,\n radius,\n shouldAnimate: reduceMotion || !shouldAnimate,\n transitionDuration,\n transitionTimingFunction,\n },\n { classNames, styles, name: 'SegmentedControl' }\n );\n\n const [activePosition, setActivePosition] = useState({ width: 0, translate: 0 });\n const uuid = useUuid(name);\n const refs = useRef<Record<string, HTMLLabelElement>>({});\n const wrapperRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n const observer = new ResizeObserver(() => {\n if (_value in refs.current && wrapperRef.current) {\n const element = refs.current[_value];\n const rect = element.getBoundingClientRect();\n setActivePosition({\n width: rect.width,\n translate: rect.x - wrapperRef.current.getBoundingClientRect().x - WRAPPER_PADDING,\n });\n\n if (!shouldAnimate) {\n setTimeout(() => {\n setShouldAnimate(true);\n }, 4);\n }\n }\n });\n observer.observe(wrapperRef.current);\n return () => observer.disconnect();\n }, [_value]);\n\n const controls = data.map((item) => (\n <div\n className={cx(classes.control, { [classes.controlActive]: _value === item.value })}\n key={item.value}\n >\n <input\n className={classes.input}\n type=\"radio\"\n name={uuid}\n value={item.value}\n id={`${uuid}-${item.value}`}\n checked={_value === item.value}\n onChange={() => handleValueChange(item.value)}\n />\n\n <label\n className={cx(classes.label, { [classes.labelActive]: _value === item.value })}\n htmlFor={`${uuid}-${item.value}`}\n ref={(node) => {\n refs.current[item.value] = node;\n }}\n >\n {item.label}\n </label>\n </div>\n ));\n\n return (\n <Box className={cx(classes.root, className)} ref={wrapperRef} {...others}>\n {!!_value && (\n <span\n className={classes.active}\n style={{\n width: activePosition.width,\n transform: `translateX(${activePosition.translate}px)`,\n }}\n />\n )}\n\n {controls}\n </Box>\n );\n}\n\nSegmentedControl.displayName = '@mantine/core/SegmentedControl';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"SegmentedControl.js","sources":["../../../src/components/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { useReducedMotion, useResizeObserver, useUncontrolled, useUuid } from '@mantine/hooks';\nimport {\n DefaultProps,\n MantineNumberSize,\n MantineSize,\n MantineColor,\n ClassNames,\n} from '@mantine/styles';\nimport { Box } from '../Box';\nimport useStyles, { WRAPPER_PADDING } from './SegmentedControl.styles';\n\nexport interface SegmentedControlItem<T extends string> {\n value: T;\n label: React.ReactNode;\n}\n\nexport type SegmentedControlStylesNames = ClassNames<typeof useStyles>;\n\nexport interface SegmentedControlProps<T extends string>\n extends DefaultProps<SegmentedControlStylesNames>,\n Omit<React.ComponentPropsWithoutRef<'div'>, 'value' | 'onChange'> {\n /** Data based on which controls are rendered */\n data: T[] | SegmentedControlItem<T>[];\n\n /** Current selected value */\n value?: T;\n\n /** Called when value changes */\n onChange?(value: T): void;\n\n /** Name of the radio group, default to random id */\n name?: string;\n\n /** True if component should have 100% width */\n fullWidth?: boolean;\n\n /** Active control color from theme.colors, defaults to white in light color scheme and theme.colors.dark[9] in dark */\n color?: MantineColor;\n\n /** Controls font-size, paddings and height */\n size?: MantineSize;\n\n /** Border-radius from theme or number to set border-radius in px */\n radius?: MantineNumberSize;\n\n /** Transition duration in ms, set to 0 to turn off transitions */\n transitionDuration?: number;\n\n /** Transition timing function for all transitions, defaults to theme.transitionTimingFunction */\n transitionTimingFunction?: string;\n\n /** Default value for uncontrolled component */\n defaultValue?: string;\n}\n\nexport function SegmentedControl<T extends string = string>({\n className,\n data: _data,\n name,\n value,\n onChange,\n color,\n fullWidth,\n radius = 'sm',\n size = 'sm',\n transitionDuration = 200,\n transitionTimingFunction,\n classNames,\n styles,\n defaultValue,\n ...others\n}: SegmentedControlProps<T>) {\n const reduceMotion = useReducedMotion();\n const data = _data.map((item: any) =>\n typeof item === 'string' ? { label: item, value: item } : item\n );\n\n const [shouldAnimate, setShouldAnimate] = useState(false);\n const [_value, handleValueChange] = useUncontrolled({\n value,\n defaultValue,\n finalValue: Array.isArray(data) ? data[0].value : null,\n onChange,\n rule: (val) => !!val,\n });\n\n const { classes, cx } = useStyles(\n {\n size,\n fullWidth,\n color,\n radius,\n shouldAnimate: reduceMotion || !shouldAnimate,\n transitionDuration,\n transitionTimingFunction,\n },\n { classNames, styles, name: 'SegmentedControl' }\n );\n\n const [activePosition, setActivePosition] = useState({ width: 0, translate: 0 });\n const uuid = useUuid(name);\n const refs = useRef<Record<string, HTMLLabelElement>>({});\n const [ref, containerRect] = useResizeObserver();\n\n useEffect(() => {\n if (_value in refs.current && ref.current) {\n const element = refs.current[_value];\n const elementRect = element.getBoundingClientRect();\n\n // Scaled value to undo transforms applied\n const scaledValue = element.offsetWidth / elementRect.width;\n setActivePosition({\n width: elementRect.width * scaledValue,\n translate: element.parentElement.offsetLeft - WRAPPER_PADDING,\n });\n\n if (!shouldAnimate) {\n setTimeout(() => {\n setShouldAnimate(true);\n }, 4);\n }\n }\n }, [_value, containerRect]);\n\n const controls = data.map((item) => (\n <div\n className={cx(classes.control, { [classes.controlActive]: _value === item.value })}\n key={item.value}\n >\n <input\n className={classes.input}\n type=\"radio\"\n name={uuid}\n value={item.value}\n id={`${uuid}-${item.value}`}\n checked={_value === item.value}\n onChange={() => handleValueChange(item.value)}\n />\n\n <label\n className={cx(classes.label, { [classes.labelActive]: _value === item.value })}\n htmlFor={`${uuid}-${item.value}`}\n ref={(node) => {\n refs.current[item.value] = node;\n }}\n >\n {item.label}\n </label>\n </div>\n ));\n\n return (\n <Box className={cx(classes.root, className)} ref={ref} {...others}>\n {!!_value && (\n <span\n className={classes.active}\n style={{\n width: activePosition.width,\n transform: `translateX(${activePosition.translate}px)`,\n }}\n />\n )}\n\n {controls}\n </Box>\n );\n}\n\nSegmentedControl.displayName = '@mantine/core/SegmentedControl';\n"],"names":[],"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;AAKK,SAAS,gBAAgB,CAAC,EAAE,EAAE;AACrC,EAAE,IAAI,EAAE,GAAG,EAAE,EAAE;AACf,IAAI,SAAS;AACb,IAAI,IAAI,EAAE,KAAK;AACf,IAAI,IAAI;AACR,IAAI,KAAK;AACT,IAAI,QAAQ;AACZ,IAAI,KAAK;AACT,IAAI,SAAS;AACb,IAAI,MAAM,GAAG,IAAI;AACjB,IAAI,IAAI,GAAG,IAAI;AACf,IAAI,kBAAkB,GAAG,GAAG;AAC5B,IAAI,wBAAwB;AAC5B,IAAI,UAAU;AACd,IAAI,MAAM;AACV,IAAI,YAAY;AAChB,GAAG,GAAG,EAAE,EAAE,MAAM,GAAG,SAAS,CAAC,EAAE,EAAE;AACjC,IAAI,WAAW;AACf,IAAI,MAAM;AACV,IAAI,MAAM;AACV,IAAI,OAAO;AACX,IAAI,UAAU;AACd,IAAI,OAAO;AACX,IAAI,WAAW;AACf,IAAI,QAAQ;AACZ,IAAI,MAAM;AACV,IAAI,oBAAoB;AACxB,IAAI,0BAA0B;AAC9B,IAAI,YAAY;AAChB,IAAI,QAAQ;AACZ,IAAI,cAAc;AAClB,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,YAAY,GAAG,gBAAgB,EAAE,CAAC;AAC1C,EAAE,MAAM,IAAI,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,KAAK,OAAO,IAAI,KAAK,QAAQ,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC,CAAC;AACnG,EAAE,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;AAC5D,EAAE,MAAM,CAAC,MAAM,EAAE,iBAAiB,CAAC,GAAG,eAAe,CAAC;AACtD,IAAI,KAAK;AACT,IAAI,YAAY;AAChB,IAAI,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC,KAAK,GAAG,IAAI;AAC1D,IAAI,QAAQ;AACZ,IAAI,IAAI,EAAE,CAAC,GAAG,KAAK,CAAC,CAAC,GAAG;AACxB,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,EAAE,GAAG,SAAS,CAAC;AACpC,IAAI,IAAI;AACR,IAAI,SAAS;AACb,IAAI,KAAK;AACT,IAAI,MAAM;AACV,IAAI,aAAa,EAAE,YAAY,IAAI,CAAC,aAAa;AACjD,IAAI,kBAAkB;AACtB,IAAI,wBAAwB;AAC5B,GAAG,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,IAAI,EAAE,kBAAkB,EAAE,CAAC,CAAC;AACvD,EAAE,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,SAAS,EAAE,CAAC,EAAE,CAAC,CAAC;AACnF,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;AAC7B,EAAE,MAAM,IAAI,GAAG,MAAM,CAAC,EAAE,CAAC,CAAC;AAC1B,EAAE,MAAM,CAAC,GAAG,EAAE,aAAa,CAAC,GAAG,iBAAiB,EAAE,CAAC;AACnD,EAAE,SAAS,CAAC,MAAM;AAClB,IAAI,IAAI,MAAM,IAAI,IAAI,CAAC,OAAO,IAAI,GAAG,CAAC,OAAO,EAAE;AAC/C,MAAM,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;AAC3C,MAAM,MAAM,WAAW,GAAG,OAAO,CAAC,qBAAqB,EAAE,CAAC;AAC1D,MAAM,MAAM,WAAW,GAAG,OAAO,CAAC,WAAW,GAAG,WAAW,CAAC,KAAK,CAAC;AAClE,MAAM,iBAAiB,CAAC;AACxB,QAAQ,KAAK,EAAE,WAAW,CAAC,KAAK,GAAG,WAAW;AAC9C,QAAQ,SAAS,EAAE,OAAO,CAAC,aAAa,CAAC,UAAU,GAAG,eAAe;AACrE,OAAO,CAAC,CAAC;AACT,MAAM,IAAI,CAAC,aAAa,EAAE;AAC1B,QAAQ,UAAU,CAAC,MAAM;AACzB,UAAU,gBAAgB,CAAC,IAAI,CAAC,CAAC;AACjC,SAAS,EAAE,CAAC,CAAC,CAAC;AACd,OAAO;AACP,KAAK;AACL,GAAG,EAAE,CAAC,MAAM,EAAE,aAAa,CAAC,CAAC,CAAC;AAC9B,EAAE,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,qBAAqB,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE;AACjF,IAAI,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,CAAC,aAAa,GAAG,MAAM,KAAK,IAAI,CAAC,KAAK,EAAE,CAAC;AACtF,IAAI,GAAG,EAAE,IAAI,CAAC,KAAK;AACnB,GAAG,kBAAkB,KAAK,CAAC,aAAa,CAAC,OAAO,EAAE;AAClD,IAAI,SAAS,EAAE,OAAO,CAAC,KAAK;AAC5B,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,IAAI,EAAE,IAAI;AACd,IAAI,KAAK,EAAE,IAAI,CAAC,KAAK;AACrB,IAAI,EAAE,EAAE,CAAC,EAAE,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;AAC/B,IAAI,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC,KAAK;AAClC,IAAI,QAAQ,EAAE,MAAM,iBAAiB,CAAC,IAAI,CAAC,KAAK,CAAC;AACjD,GAAG,CAAC,kBAAkB,KAAK,CAAC,aAAa,CAAC,OAAO,EAAE;AACnD,IAAI,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,OAAO,CAAC,WAAW,GAAG,MAAM,KAAK,IAAI,CAAC,KAAK,EAAE,CAAC;AAClF,IAAI,OAAO,EAAE,CAAC,EAAE,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;AACpC,IAAI,GAAG,EAAE,CAAC,IAAI,KAAK;AACnB,MAAM,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC;AACtC,KAAK;AACL,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;AACnB,EAAE,uBAAuB,KAAK,CAAC,aAAa,CAAC,GAAG,EAAE,cAAc,CAAC;AACjE,IAAI,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,SAAS,CAAC;AAC1C,IAAI,GAAG;AACP,GAAG,EAAE,MAAM,CAAC,EAAE,CAAC,CAAC,MAAM,oBAAoB,KAAK,CAAC,aAAa,CAAC,MAAM,EAAE;AACtE,IAAI,SAAS,EAAE,OAAO,CAAC,MAAM;AAC7B,IAAI,KAAK,EAAE;AACX,MAAM,KAAK,EAAE,cAAc,CAAC,KAAK;AACjC,MAAM,SAAS,EAAE,CAAC,WAAW,EAAE,cAAc,CAAC,SAAS,CAAC,GAAG,CAAC;AAC5D,KAAK;AACL,GAAG,CAAC,EAAE,QAAQ,CAAC,CAAC;AAChB,CAAC;AACD,gBAAgB,CAAC,WAAW,GAAG,gCAAgC;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AppShell.styles.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAgB,iBAAiB,EAAE,YAAY,EAAa,MAAM,iBAAiB,CAAC;AAE3F,UAAU,cAAc;IACtB,OAAO,EAAE,iBAAiB,CAAC;IAC3B,KAAK,EAAE,OAAO,CAAC;IACf,YAAY,EAAE,MAAM,CAAC;IACrB,iBAAiB,EAAE,CAAC,MAAM,EAAE;QAAE,KAAK,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAC,EAAE,CAAC;IAC1D,WAAW,EAAE,MAAM,CAAC;IACpB,sBAAsB,EAAE,iBAAiB,CAAC;CAC3C;;;;;;AAkCD,
|
|
1
|
+
{"version":3,"file":"AppShell.styles.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAgB,iBAAiB,EAAE,YAAY,EAAa,MAAM,iBAAiB,CAAC;AAE3F,UAAU,cAAc;IACtB,OAAO,EAAE,iBAAiB,CAAC;IAC3B,KAAK,EAAE,OAAO,CAAC;IACf,YAAY,EAAE,MAAM,CAAC;IACrB,iBAAiB,EAAE,CAAC,MAAM,EAAE;QAAE,KAAK,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAC,EAAE,CAAC;IAC1D,WAAW,EAAE,MAAM,CAAC;IACpB,sBAAsB,EAAE,iBAAiB,CAAC;CAC3C;;;;;;AAkCD,wBAgBI"}
|
|
@@ -44,9 +44,11 @@ export interface DrawerProps extends Omit<DefaultProps<DrawerStylesNames>, Manti
|
|
|
44
44
|
hideCloseButton?: boolean;
|
|
45
45
|
/** Close button aria-label */
|
|
46
46
|
closeButtonLabel?: string;
|
|
47
|
+
/** Target element or selector where drawer portal should be rendered */
|
|
48
|
+
target?: HTMLElement | string;
|
|
47
49
|
}
|
|
48
|
-
export declare function MantineDrawer({ className, opened, onClose, position, size, noFocusTrap, noScrollLock, noCloseOnClickOutside, noCloseOnEscape, transition, transitionDuration, transitionTimingFunction, zIndex, overlayColor, overlayOpacity, children, noOverlay, shadow, padding, title, hideCloseButton, closeButtonLabel, classNames, styles, ...others }: DrawerProps): JSX.Element;
|
|
49
|
-
export declare function Drawer({ zIndex, ...props }: React.ComponentPropsWithoutRef<typeof MantineDrawer>): JSX.Element;
|
|
50
|
+
export declare function MantineDrawer({ className, opened, onClose, position, size, noFocusTrap, noScrollLock, noCloseOnClickOutside, noCloseOnEscape, transition, transitionDuration, transitionTimingFunction, zIndex, overlayColor, overlayOpacity, children, noOverlay, shadow, padding, title, hideCloseButton, closeButtonLabel, classNames, styles, target, ...others }: DrawerProps): JSX.Element;
|
|
51
|
+
export declare function Drawer({ zIndex, target, ...props }: React.ComponentPropsWithoutRef<typeof MantineDrawer>): JSX.Element;
|
|
50
52
|
export declare namespace Drawer {
|
|
51
53
|
var displayName: string;
|
|
52
54
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Drawer.d.ts","sourceRoot":"","sources":["../../../src/components/Drawer/Drawer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoB,MAAM,OAAO,CAAC;AAEzC,OAAO,EACL,YAAY,EACZ,iBAAiB,EACjB,aAAa,EACb,UAAU,EACV,aAAa,EAEd,MAAM,iBAAiB,CAAC;AAOzB,OAAO,EAAqB,iBAAiB,EAAE,MAAM,eAAe,CAAC;AACrE,OAAO,SAAS,EAAE,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAE5D,oBAAY,iBAAiB,GAAG,OAAO,CAAC,UAAU,CAAC,OAAO,SAAS,CAAC,EAAE,WAAW,CAAC,CAAC;AAEnF,MAAM,WAAW,WACf,SAAQ,IAAI,CAAC,YAAY,CAAC,iBAAiB,CAAC,EAAE,aAAa,CAAC,EAC1D,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC;IACtD,2CAA2C;IAC3C,MAAM,EAAE,OAAO,CAAC;IAEhB,wFAAwF;IACxF,OAAO,IAAI,IAAI,CAAC;IAEhB,2BAA2B;IAC3B,QAAQ,CAAC,EAAE,cAAc,CAAC;IAE1B,qIAAqI;IACrI,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAEvB,4DAA4D;IAC5D,MAAM,CAAC,EAAE,aAAa,CAAC;IAEvB,iEAAiE;IACjE,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAE5B,8BAA8B;IAC9B,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,0BAA0B;IAC1B,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB,2BAA2B;IAC3B,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,iDAAiD;IACjD,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAEhC,mDAAmD;IACnD,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B,8FAA8F;IAC9F,UAAU,CAAC,EAAE,iBAAiB,CAAC;IAE/B,gCAAgC;IAChC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B,mDAAmD;IACnD,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAElC,+BAA+B;IAC/B,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,sFAAsF;IACtF,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,2GAA2G;IAC3G,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,4DAA4D;IAC5D,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAExB,4FAA4F;IAC5F,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B,8BAA8B;IAC9B,gBAAgB,CAAC,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"Drawer.d.ts","sourceRoot":"","sources":["../../../src/components/Drawer/Drawer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoB,MAAM,OAAO,CAAC;AAEzC,OAAO,EACL,YAAY,EACZ,iBAAiB,EACjB,aAAa,EACb,UAAU,EACV,aAAa,EAEd,MAAM,iBAAiB,CAAC;AAOzB,OAAO,EAAqB,iBAAiB,EAAE,MAAM,eAAe,CAAC;AACrE,OAAO,SAAS,EAAE,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAE5D,oBAAY,iBAAiB,GAAG,OAAO,CAAC,UAAU,CAAC,OAAO,SAAS,CAAC,EAAE,WAAW,CAAC,CAAC;AAEnF,MAAM,WAAW,WACf,SAAQ,IAAI,CAAC,YAAY,CAAC,iBAAiB,CAAC,EAAE,aAAa,CAAC,EAC1D,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC;IACtD,2CAA2C;IAC3C,MAAM,EAAE,OAAO,CAAC;IAEhB,wFAAwF;IACxF,OAAO,IAAI,IAAI,CAAC;IAEhB,2BAA2B;IAC3B,QAAQ,CAAC,EAAE,cAAc,CAAC;IAE1B,qIAAqI;IACrI,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAEvB,4DAA4D;IAC5D,MAAM,CAAC,EAAE,aAAa,CAAC;IAEvB,iEAAiE;IACjE,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAE5B,8BAA8B;IAC9B,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,0BAA0B;IAC1B,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB,2BAA2B;IAC3B,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,iDAAiD;IACjD,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAEhC,mDAAmD;IACnD,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B,8FAA8F;IAC9F,UAAU,CAAC,EAAE,iBAAiB,CAAC;IAE/B,gCAAgC;IAChC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B,mDAAmD;IACnD,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAElC,+BAA+B;IAC/B,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,sFAAsF;IACtF,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,2GAA2G;IAC3G,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,4DAA4D;IAC5D,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAExB,4FAA4F;IAC5F,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B,8BAA8B;IAC9B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B,wEAAwE;IACxE,MAAM,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC;CAC/B;AASD,wBAAgB,aAAa,CAAC,EAC5B,SAAS,EACT,MAAM,EACN,OAAO,EACP,QAAiB,EACjB,IAAW,EACX,WAAmB,EACnB,YAAoB,EACpB,qBAA6B,EAC7B,eAAuB,EACvB,UAAU,EACV,kBAAwB,EACxB,wBAAiC,EACjC,MAAkC,EAClC,YAAY,EACZ,cAAc,EACd,QAAQ,EACR,SAAiB,EACjB,MAAa,EACb,OAAW,EACX,KAAK,EACL,eAAe,EACf,gBAAgB,EAChB,UAAU,EACV,MAAM,EACN,MAAM,EACN,GAAG,MAAM,EACV,EAAE,WAAW,eA0Gb;AAED,wBAAgB,MAAM,CAAC,EACrB,MAAkC,EAClC,MAAM,EACN,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,wBAAwB,CAAC,OAAO,aAAa,CAAC,eAMtD;yBAVe,MAAM"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Image.d.ts","sourceRoot":"","sources":["../../../src/components/Image/Image.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"Image.d.ts","sourceRoot":"","sources":["../../../src/components/Image/Image.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkD,MAAM,OAAO,CAAC;AACvE,OAAO,EAAE,YAAY,EAAE,iBAAiB,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAK9E,OAAO,SAAS,MAAM,gBAAgB,CAAC;AAEvC,oBAAY,gBAAgB,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC;AAE5D,MAAM,WAAW,UACf,SAAQ,YAAY,CAAC,gBAAgB,CAAC,EACpC,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,aAAa,CAAC;IAC5D,gBAAgB;IAChB,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb,4EAA4E;IAC5E,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb,gCAAgC;IAChC,GAAG,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAE1B,wDAAwD;IACxD,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAExB,8EAA8E;IAC9E,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAEzB,yFAAyF;IACzF,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAE3B,4EAA4E;IAC5E,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B,oCAAoC;IACpC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE9B,kCAAkC;IAClC,UAAU,CAAC,EAAE,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAC;IAEnD,4BAA4B;IAC5B,QAAQ,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,gBAAgB,CAAC,CAAC;IAEhD,+CAA+C;IAC/C,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,KAAK,mFAyEjB,CAAC"}
|
|
@@ -46,9 +46,11 @@ export interface ModalProps extends Omit<DefaultProps<ModalStylesNames>, Mantine
|
|
|
46
46
|
noFocusTrap?: boolean;
|
|
47
47
|
/** Controls if modal should be centered */
|
|
48
48
|
centered?: boolean;
|
|
49
|
+
/** Target element or selector where modal portal should be rendered */
|
|
50
|
+
target?: HTMLElement | string;
|
|
49
51
|
}
|
|
50
|
-
export declare function MantineModal({ className, opened, title, onClose, children, hideCloseButton, overlayOpacity, size, transitionDuration, closeButtonLabel, overlayColor, overflow, transition, padding, shadow, radius, id, classNames, styles, closeOnClickOutside, noFocusTrap, closeOnEscape, centered, ...others }: ModalProps): JSX.Element;
|
|
51
|
-
export declare function Modal({ zIndex, ...props }: React.ComponentPropsWithoutRef<typeof MantineModal>): JSX.Element;
|
|
52
|
+
export declare function MantineModal({ className, opened, title, onClose, children, hideCloseButton, overlayOpacity, size, transitionDuration, closeButtonLabel, overlayColor, overflow, transition, padding, shadow, radius, id, classNames, styles, closeOnClickOutside, noFocusTrap, closeOnEscape, centered, target, ...others }: ModalProps): JSX.Element;
|
|
53
|
+
export declare function Modal({ zIndex, target, ...props }: React.ComponentPropsWithoutRef<typeof MantineModal>): JSX.Element;
|
|
52
54
|
export declare namespace Modal {
|
|
53
55
|
var displayName: string;
|
|
54
56
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAoB,MAAM,OAAO,CAAC;AAEzC,OAAO,EACL,YAAY,EACZ,iBAAiB,EACjB,aAAa,EACb,UAAU,EACV,aAAa,EAEd,MAAM,iBAAiB,CAAC;AAOzB,OAAO,EAAqB,iBAAiB,EAAE,MAAM,eAAe,CAAC;AACrE,OAAO,SAAS,MAAM,gBAAgB,CAAC;AAEvC,oBAAY,gBAAgB,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC;AAE5D,MAAM,WAAW,UACf,SAAQ,IAAI,CAAC,YAAY,CAAC,gBAAgB,CAAC,EAAE,aAAa,CAAC,EACzD,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC;IACtD,2BAA2B;IAC3B,MAAM,EAAE,OAAO,CAAC;IAEhB,sEAAsE;IACtE,OAAO,IAAI,IAAI,CAAC;IAEhB,2DAA2D;IAC3D,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAExB,6BAA6B;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,yCAAyC;IACzC,QAAQ,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAEhC,4FAA4F;IAC5F,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B,6FAA6F;IAC7F,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,kHAAkH;IAClH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,mBAAmB;IACnB,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAE3B,uBAAuB;IACvB,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAEvB,4BAA4B;IAC5B,UAAU,CAAC,EAAE,iBAAiB,CAAC;IAE/B,8EAA8E;IAC9E,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B,sFAAsF;IACtF,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAElC,8BAA8B;IAC9B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B,iHAAiH;IACjH,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ,2CAA2C;IAC3C,MAAM,CAAC,EAAE,aAAa,CAAC;IAEvB,iEAAiE;IACjE,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAE5B,gEAAgE;IAChE,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B,qDAAqD;IACrD,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB,0BAA0B;IAC1B,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB,2CAA2C;IAC3C,QAAQ,CAAC,EAAE,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAoB,MAAM,OAAO,CAAC;AAEzC,OAAO,EACL,YAAY,EACZ,iBAAiB,EACjB,aAAa,EACb,UAAU,EACV,aAAa,EAEd,MAAM,iBAAiB,CAAC;AAOzB,OAAO,EAAqB,iBAAiB,EAAE,MAAM,eAAe,CAAC;AACrE,OAAO,SAAS,MAAM,gBAAgB,CAAC;AAEvC,oBAAY,gBAAgB,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC;AAE5D,MAAM,WAAW,UACf,SAAQ,IAAI,CAAC,YAAY,CAAC,gBAAgB,CAAC,EAAE,aAAa,CAAC,EACzD,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC;IACtD,2BAA2B;IAC3B,MAAM,EAAE,OAAO,CAAC;IAEhB,sEAAsE;IACtE,OAAO,IAAI,IAAI,CAAC;IAEhB,2DAA2D;IAC3D,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAExB,6BAA6B;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,yCAAyC;IACzC,QAAQ,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAEhC,4FAA4F;IAC5F,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B,6FAA6F;IAC7F,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,kHAAkH;IAClH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,mBAAmB;IACnB,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAE3B,uBAAuB;IACvB,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAEvB,4BAA4B;IAC5B,UAAU,CAAC,EAAE,iBAAiB,CAAC;IAE/B,8EAA8E;IAC9E,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B,sFAAsF;IACtF,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAElC,8BAA8B;IAC9B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B,iHAAiH;IACjH,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ,2CAA2C;IAC3C,MAAM,CAAC,EAAE,aAAa,CAAC;IAEvB,iEAAiE;IACjE,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAE5B,gEAAgE;IAChE,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B,qDAAqD;IACrD,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB,0BAA0B;IAC1B,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB,2CAA2C;IAC3C,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,uEAAuE;IACvE,MAAM,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC;CAC/B;AAED,wBAAgB,YAAY,CAAC,EAC3B,SAAS,EACT,MAAM,EACN,KAAK,EACL,OAAO,EACP,QAAQ,EACR,eAAuB,EACvB,cAAc,EACd,IAAW,EACX,kBAAwB,EACxB,gBAAgB,EAChB,YAAY,EACZ,QAAoB,EACpB,UAAkB,EAClB,OAAc,EACd,MAAa,EACb,MAAa,EACb,EAAE,EACF,UAAU,EACV,MAAM,EACN,mBAA0B,EAC1B,WAAmB,EACnB,aAAoB,EACpB,QAAgB,EAChB,MAAM,EACN,GAAG,MAAM,EACV,EAAE,UAAU,eAkHZ;AAED,wBAAgB,KAAK,CAAC,EACpB,MAAkC,EAClC,MAAM,EACN,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,wBAAwB,CAAC,OAAO,YAAY,CAAC,eAMrD;yBAVe,KAAK"}
|
|
@@ -5,7 +5,7 @@ export interface PortalProps {
|
|
|
5
5
|
/** Root element z-index property */
|
|
6
6
|
zIndex?: number;
|
|
7
7
|
/** Element where portal should be rendered, by default new div element is created and appended to document.body */
|
|
8
|
-
target?:
|
|
8
|
+
target?: HTMLElement | string;
|
|
9
9
|
/** Root element className */
|
|
10
10
|
className?: string;
|
|
11
11
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Portal.d.ts","sourceRoot":"","sources":["../../../src/components/Portal/Portal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAoB,MAAM,OAAO,CAAC;AAI7D,MAAM,WAAW,WAAW;IAC1B,qDAAqD;IACrD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAE1B,oCAAoC;IACpC,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,mHAAmH;IACnH,MAAM,CAAC,EAAE,
|
|
1
|
+
{"version":3,"file":"Portal.d.ts","sourceRoot":"","sources":["../../../src/components/Portal/Portal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAoB,MAAM,OAAO,CAAC;AAI7D,MAAM,WAAW,WAAW;IAC1B,qDAAqD;IACrD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAE1B,oCAAoC;IACpC,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,mHAAmH;IACnH,MAAM,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC;IAE9B,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,MAAM,CAAC,EAAE,QAAQ,EAAE,MAAU,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,WAAW,GAAG,WAAW,CA+B5F;yBA/Be,MAAM"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SegmentedControl.d.ts","sourceRoot":"","sources":["../../../src/components/SegmentedControl/SegmentedControl.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAE3D,OAAO,EACL,YAAY,EACZ,iBAAiB,EACjB,WAAW,EACX,YAAY,EACZ,UAAU,EACX,MAAM,iBAAiB,CAAC;AAEzB,OAAO,SAA8B,MAAM,2BAA2B,CAAC;AAEvE,MAAM,WAAW,oBAAoB,CAAC,CAAC,SAAS,MAAM;IACpD,KAAK,EAAE,CAAC,CAAC;IACT,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;CACxB;AAED,oBAAY,2BAA2B,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC;AAEvE,MAAM,WAAW,qBAAqB,CAAC,CAAC,SAAS,MAAM,CACrD,SAAQ,YAAY,CAAC,2BAA2B,CAAC,EAC/C,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC;IACnE,gDAAgD;IAChD,IAAI,EAAE,CAAC,EAAE,GAAG,oBAAoB,CAAC,CAAC,CAAC,EAAE,CAAC;IAEtC,6BAA6B;IAC7B,KAAK,CAAC,EAAE,CAAC,CAAC;IAEV,gCAAgC;IAChC,QAAQ,CAAC,CAAC,KAAK,EAAE,CAAC,GAAG,IAAI,CAAC;IAE1B,oDAAoD;IACpD,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,+CAA+C;IAC/C,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,uHAAuH;IACvH,KAAK,CAAC,EAAE,YAAY,CAAC;IAErB,8CAA8C;IAC9C,IAAI,CAAC,EAAE,WAAW,CAAC;IAEnB,oEAAoE;IACpE,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAE3B,kEAAkE;IAClE,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B,iGAAiG;IACjG,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAElC,+CAA+C;IAC/C,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,EAAE,EAC1D,SAAS,EACT,IAAI,EAAE,KAAK,EACX,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,KAAK,EACL,SAAS,EACT,MAAa,EACb,IAAW,EACX,kBAAwB,EACxB,wBAAwB,EACxB,UAAU,EACV,MAAM,EACN,YAAY,EACZ,GAAG,MAAM,EACV,EAAE,qBAAqB,CAAC,CAAC,CAAC,
|
|
1
|
+
{"version":3,"file":"SegmentedControl.d.ts","sourceRoot":"","sources":["../../../src/components/SegmentedControl/SegmentedControl.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAE3D,OAAO,EACL,YAAY,EACZ,iBAAiB,EACjB,WAAW,EACX,YAAY,EACZ,UAAU,EACX,MAAM,iBAAiB,CAAC;AAEzB,OAAO,SAA8B,MAAM,2BAA2B,CAAC;AAEvE,MAAM,WAAW,oBAAoB,CAAC,CAAC,SAAS,MAAM;IACpD,KAAK,EAAE,CAAC,CAAC;IACT,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;CACxB;AAED,oBAAY,2BAA2B,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC;AAEvE,MAAM,WAAW,qBAAqB,CAAC,CAAC,SAAS,MAAM,CACrD,SAAQ,YAAY,CAAC,2BAA2B,CAAC,EAC/C,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC;IACnE,gDAAgD;IAChD,IAAI,EAAE,CAAC,EAAE,GAAG,oBAAoB,CAAC,CAAC,CAAC,EAAE,CAAC;IAEtC,6BAA6B;IAC7B,KAAK,CAAC,EAAE,CAAC,CAAC;IAEV,gCAAgC;IAChC,QAAQ,CAAC,CAAC,KAAK,EAAE,CAAC,GAAG,IAAI,CAAC;IAE1B,oDAAoD;IACpD,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,+CAA+C;IAC/C,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,uHAAuH;IACvH,KAAK,CAAC,EAAE,YAAY,CAAC;IAErB,8CAA8C;IAC9C,IAAI,CAAC,EAAE,WAAW,CAAC;IAEnB,oEAAoE;IACpE,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAE3B,kEAAkE;IAClE,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B,iGAAiG;IACjG,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAElC,+CAA+C;IAC/C,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,EAAE,EAC1D,SAAS,EACT,IAAI,EAAE,KAAK,EACX,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,KAAK,EACL,SAAS,EACT,MAAa,EACb,IAAW,EACX,kBAAwB,EACxB,wBAAwB,EACxB,UAAU,EACV,MAAM,EACN,YAAY,EACZ,GAAG,MAAM,EACV,EAAE,qBAAqB,CAAC,CAAC,CAAC,eA+F1B;yBA/Ge,gBAAgB"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mantine/core",
|
|
3
3
|
"description": "React components library focused on usability, accessibility and developer experience",
|
|
4
|
-
"version": "3.5.
|
|
4
|
+
"version": "3.5.4",
|
|
5
5
|
"main": "cjs/index.js",
|
|
6
6
|
"module": "esm/index.js",
|
|
7
7
|
"types": "lib/index.d.ts",
|
|
@@ -15,12 +15,12 @@
|
|
|
15
15
|
"directory": "src/mantine-core"
|
|
16
16
|
},
|
|
17
17
|
"peerDependencies": {
|
|
18
|
-
"@mantine/hooks": "3.5.
|
|
18
|
+
"@mantine/hooks": "3.5.4",
|
|
19
19
|
"react": ">=16.8.0",
|
|
20
20
|
"react-dom": ">=16.8.0"
|
|
21
21
|
},
|
|
22
22
|
"dependencies": {
|
|
23
|
-
"@mantine/styles": "3.5.
|
|
23
|
+
"@mantine/styles": "3.5.4",
|
|
24
24
|
"@radix-ui/react-scroll-area": "^0.1.1",
|
|
25
25
|
"clsx": "^1.1.1",
|
|
26
26
|
"react-textarea-autosize": "^8.3.2",
|