@mantine/core 3.6.0-alpha.1 → 3.6.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (138) hide show
  1. package/cjs/components/ActionIcon/ActionIcon.js +2 -5
  2. package/cjs/components/ActionIcon/ActionIcon.js.map +1 -1
  3. package/cjs/components/Code/Code.js +3 -1
  4. package/cjs/components/Code/Code.js.map +1 -1
  5. package/cjs/components/ColorInput/ColorInput.js +0 -2
  6. package/cjs/components/ColorInput/ColorInput.js.map +1 -1
  7. package/cjs/components/ColorInput/ColorInput.styles.js +0 -4
  8. package/cjs/components/ColorInput/ColorInput.styles.js.map +1 -1
  9. package/cjs/components/Drawer/Drawer.js +7 -1
  10. package/cjs/components/Drawer/Drawer.js.map +1 -1
  11. package/cjs/components/Input/Input.js +3 -0
  12. package/cjs/components/Input/Input.js.map +1 -1
  13. package/cjs/components/Input/Input.styles.js +11 -2
  14. package/cjs/components/Input/Input.styles.js.map +1 -1
  15. package/cjs/components/Menu/Menu.js +8 -3
  16. package/cjs/components/Menu/Menu.js.map +1 -1
  17. package/cjs/components/NumberInput/NumberInput.js.map +1 -1
  18. package/cjs/components/Pagination/DefaultItem/DefaultItem.js +10 -1
  19. package/cjs/components/Pagination/DefaultItem/DefaultItem.js.map +1 -1
  20. package/cjs/components/Popover/Popover.js +8 -3
  21. package/cjs/components/Popover/Popover.js.map +1 -1
  22. package/cjs/components/Popper/Popper.js +28 -2
  23. package/cjs/components/Popper/Popper.js.map +1 -1
  24. package/cjs/components/Popper/Popper.styles.js +20 -12
  25. package/cjs/components/Popper/Popper.styles.js.map +1 -1
  26. package/cjs/components/Portal/Portal.js +3 -0
  27. package/cjs/components/Portal/Portal.js.map +1 -1
  28. package/cjs/components/Progress/Progress.js +3 -3
  29. package/cjs/components/Progress/Progress.js.map +1 -1
  30. package/cjs/components/ScrollArea/ScrollArea.js +6 -4
  31. package/cjs/components/ScrollArea/ScrollArea.js.map +1 -1
  32. package/cjs/components/ScrollArea/ScrollArea.styles.js +2 -3
  33. package/cjs/components/ScrollArea/ScrollArea.styles.js.map +1 -1
  34. package/cjs/components/SegmentedControl/SegmentedControl.js +34 -11
  35. package/cjs/components/SegmentedControl/SegmentedControl.js.map +1 -1
  36. package/cjs/components/SegmentedControl/SegmentedControl.styles.js +53 -41
  37. package/cjs/components/SegmentedControl/SegmentedControl.styles.js.map +1 -1
  38. package/cjs/components/Select/Select.js +5 -4
  39. package/cjs/components/Select/Select.js.map +1 -1
  40. package/cjs/components/Slider/RangeSlider/RangeSlider.js +25 -10
  41. package/cjs/components/Slider/RangeSlider/RangeSlider.js.map +1 -1
  42. package/cjs/components/Slider/Slider/Slider.js +21 -9
  43. package/cjs/components/Slider/Slider/Slider.js.map +1 -1
  44. package/cjs/components/Slider/Thumb/Thumb.js +3 -2
  45. package/cjs/components/Slider/Thumb/Thumb.js.map +1 -1
  46. package/cjs/components/Tabs/Tabs.js +5 -4
  47. package/cjs/components/Tabs/Tabs.js.map +1 -1
  48. package/cjs/components/TransferList/RenderList/RenderList.js +16 -3
  49. package/cjs/components/TransferList/RenderList/RenderList.js.map +1 -1
  50. package/cjs/components/TransferList/RenderList/RenderList.styles.js +0 -2
  51. package/cjs/components/TransferList/RenderList/RenderList.styles.js.map +1 -1
  52. package/esm/components/ActionIcon/ActionIcon.js +2 -5
  53. package/esm/components/ActionIcon/ActionIcon.js.map +1 -1
  54. package/esm/components/Code/Code.js +3 -1
  55. package/esm/components/Code/Code.js.map +1 -1
  56. package/esm/components/ColorInput/ColorInput.js +0 -2
  57. package/esm/components/ColorInput/ColorInput.js.map +1 -1
  58. package/esm/components/ColorInput/ColorInput.styles.js +0 -4
  59. package/esm/components/ColorInput/ColorInput.styles.js.map +1 -1
  60. package/esm/components/Drawer/Drawer.js +7 -1
  61. package/esm/components/Drawer/Drawer.js.map +1 -1
  62. package/esm/components/Input/Input.js +3 -0
  63. package/esm/components/Input/Input.js.map +1 -1
  64. package/esm/components/Input/Input.styles.js +11 -2
  65. package/esm/components/Input/Input.styles.js.map +1 -1
  66. package/esm/components/Menu/Menu.js +8 -3
  67. package/esm/components/Menu/Menu.js.map +1 -1
  68. package/esm/components/NumberInput/NumberInput.js.map +1 -1
  69. package/esm/components/Pagination/DefaultItem/DefaultItem.js +10 -1
  70. package/esm/components/Pagination/DefaultItem/DefaultItem.js.map +1 -1
  71. package/esm/components/Popover/Popover.js +8 -3
  72. package/esm/components/Popover/Popover.js.map +1 -1
  73. package/esm/components/Popper/Popper.js +28 -2
  74. package/esm/components/Popper/Popper.js.map +1 -1
  75. package/esm/components/Popper/Popper.styles.js +20 -12
  76. package/esm/components/Popper/Popper.styles.js.map +1 -1
  77. package/esm/components/Portal/Portal.js +3 -0
  78. package/esm/components/Portal/Portal.js.map +1 -1
  79. package/esm/components/Progress/Progress.js +3 -3
  80. package/esm/components/Progress/Progress.js.map +1 -1
  81. package/esm/components/ScrollArea/ScrollArea.js +5 -3
  82. package/esm/components/ScrollArea/ScrollArea.js.map +1 -1
  83. package/esm/components/ScrollArea/ScrollArea.styles.js +2 -3
  84. package/esm/components/ScrollArea/ScrollArea.styles.js.map +1 -1
  85. package/esm/components/SegmentedControl/SegmentedControl.js +34 -11
  86. package/esm/components/SegmentedControl/SegmentedControl.js.map +1 -1
  87. package/esm/components/SegmentedControl/SegmentedControl.styles.js +53 -41
  88. package/esm/components/SegmentedControl/SegmentedControl.styles.js.map +1 -1
  89. package/esm/components/Select/Select.js +5 -4
  90. package/esm/components/Select/Select.js.map +1 -1
  91. package/esm/components/Slider/RangeSlider/RangeSlider.js +21 -6
  92. package/esm/components/Slider/RangeSlider/RangeSlider.js.map +1 -1
  93. package/esm/components/Slider/Slider/Slider.js +17 -5
  94. package/esm/components/Slider/Slider/Slider.js.map +1 -1
  95. package/esm/components/Slider/Thumb/Thumb.js +3 -2
  96. package/esm/components/Slider/Thumb/Thumb.js.map +1 -1
  97. package/esm/components/Tabs/Tabs.js +5 -4
  98. package/esm/components/Tabs/Tabs.js.map +1 -1
  99. package/esm/components/TransferList/RenderList/RenderList.js +16 -3
  100. package/esm/components/TransferList/RenderList/RenderList.js.map +1 -1
  101. package/esm/components/TransferList/RenderList/RenderList.styles.js +0 -2
  102. package/esm/components/TransferList/RenderList/RenderList.styles.js.map +1 -1
  103. package/lib/components/Code/Code.d.ts.map +1 -1
  104. package/lib/components/ColorInput/ColorInput.d.ts.map +1 -1
  105. package/lib/components/ColorInput/ColorInput.styles.d.ts +2 -2
  106. package/lib/components/ColorInput/ColorInput.styles.d.ts.map +1 -1
  107. package/lib/components/Drawer/Drawer.d.ts.map +1 -1
  108. package/lib/components/Input/Input.d.ts +2 -0
  109. package/lib/components/Input/Input.d.ts.map +1 -1
  110. package/lib/components/Input/Input.styles.d.ts +1 -0
  111. package/lib/components/Input/Input.styles.d.ts.map +1 -1
  112. package/lib/components/Menu/Menu.d.ts +2 -0
  113. package/lib/components/Menu/Menu.d.ts.map +1 -1
  114. package/lib/components/NumberInput/NumberInput.d.ts +1 -1
  115. package/lib/components/NumberInput/NumberInput.d.ts.map +1 -1
  116. package/lib/components/Pagination/DefaultItem/DefaultItem.d.ts.map +1 -1
  117. package/lib/components/Popover/Popover.d.ts +3 -1
  118. package/lib/components/Popover/Popover.d.ts.map +1 -1
  119. package/lib/components/Popper/Popper.d.ts.map +1 -1
  120. package/lib/components/Popper/Popper.styles.d.ts +2 -1
  121. package/lib/components/Popper/Popper.styles.d.ts.map +1 -1
  122. package/lib/components/Portal/Portal.d.ts.map +1 -1
  123. package/lib/components/ScrollArea/ScrollArea.d.ts.map +1 -1
  124. package/lib/components/ScrollArea/ScrollArea.styles.d.ts +0 -1
  125. package/lib/components/ScrollArea/ScrollArea.styles.d.ts.map +1 -1
  126. package/lib/components/SegmentedControl/SegmentedControl.d.ts +4 -0
  127. package/lib/components/SegmentedControl/SegmentedControl.d.ts.map +1 -1
  128. package/lib/components/SegmentedControl/SegmentedControl.styles.d.ts +3 -2
  129. package/lib/components/SegmentedControl/SegmentedControl.styles.d.ts.map +1 -1
  130. package/lib/components/Select/Select.d.ts.map +1 -1
  131. package/lib/components/Slider/RangeSlider/RangeSlider.d.ts.map +1 -1
  132. package/lib/components/Slider/Slider/Slider.d.ts +1 -1
  133. package/lib/components/Slider/Slider/Slider.d.ts.map +1 -1
  134. package/lib/components/Slider/Thumb/Thumb.d.ts.map +1 -1
  135. package/lib/components/Tabs/Tabs.d.ts.map +1 -1
  136. package/lib/components/TransferList/RenderList/RenderList.d.ts.map +1 -1
  137. package/lib/components/TransferList/RenderList/RenderList.styles.d.ts.map +1 -1
  138. package/package.json +3 -3
@@ -1 +1 @@
1
- {"version":3,"file":"Popper.js","sources":["../../../src/components/Popper/Popper.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { usePopper, StrictModifier } from 'react-popper';\nimport { getDefaultZIndex } from '@mantine/styles';\nimport type { Placement } from '@popperjs/core';\nimport { useDidUpdate } from '@mantine/hooks';\nimport { Transition, MantineTransition } from '../Transition';\nimport { parsePopperPosition } from './parse-popper-position/parse-popper-position';\nimport { PopperContainer } from './PopperContainer/PopperContainer';\nimport useStyles from './Popper.styles';\n\nexport interface SharedPopperProps {\n /** Position relative to reference element */\n position?: 'top' | 'left' | 'bottom' | 'right';\n\n /** Placement relative to reference element */\n placement?: 'start' | 'center' | 'end';\n\n /** Spacing between element and popper in px */\n gutter?: number;\n\n /** Arrow size in px */\n arrowSize?: number;\n\n /** Arrow distance to the left/right * arrowSize */\n arrowDistance?: number;\n\n /** Renders arrow if true */\n withArrow?: boolean;\n\n /** Popper z-index */\n zIndex?: number;\n\n /** Customize mount/unmount transition */\n transition?: MantineTransition;\n\n /** Mount transition duration in ms */\n transitionDuration?: number;\n\n /** Unmount transition duration in ms */\n exitTransitionDuration?: number;\n\n /** Mount/unmount transition timing function, defaults to theme.transitionTimingFunction */\n transitionTimingFunction?: string;\n}\n\nexport interface PopperProps<T extends HTMLElement> extends SharedPopperProps {\n /** Element at which popper should be attached */\n referenceElement: T;\n\n /** Popper content */\n children: React.ReactNode;\n\n /** True to show popper, false to hide */\n mounted: boolean;\n\n /** Arrow class name */\n arrowClassName?: string;\n\n /** Arrow inline styles */\n arrowStyle?: React.CSSProperties;\n\n /** useEffect dependencies to force update popper position */\n forceUpdateDependencies?: any[];\n\n /** Called when transition ends */\n onTransitionEnd?(): void;\n\n /** Popperjs modifiers array */\n modifiers?: StrictModifier[];\n\n /** Whether to render the target element in a Portal */\n withinPortal?: boolean;\n}\n\nexport function Popper<T extends HTMLElement = HTMLDivElement>({\n position = 'top',\n placement = 'center',\n gutter = 5,\n arrowSize = 2,\n arrowDistance = 2,\n withArrow = false,\n referenceElement,\n children,\n mounted,\n transition = 'pop-top-left',\n transitionDuration,\n exitTransitionDuration = transitionDuration,\n transitionTimingFunction,\n arrowClassName,\n arrowStyle,\n zIndex = getDefaultZIndex('popover'),\n forceUpdateDependencies = [],\n modifiers = [],\n onTransitionEnd,\n withinPortal = true,\n}: PopperProps<T>) {\n const padding = withArrow ? gutter + arrowSize : gutter;\n const { classes, cx } = useStyles({ arrowSize, arrowDistance }, { name: 'Popper' });\n const [popperElement, setPopperElement] = useState(null);\n\n const initialPlacement: Placement =\n placement === 'center' ? position : `${position}-${placement}`;\n\n const { styles, attributes, forceUpdate } = usePopper(referenceElement, popperElement, {\n placement: initialPlacement,\n modifiers: [\n {\n name: 'offset',\n options: {\n offset: [0, padding],\n },\n },\n ...modifiers,\n ],\n });\n\n const parsedAttributes = parsePopperPosition(attributes.popper?.['data-popper-placement']);\n\n useDidUpdate(() => {\n typeof forceUpdate === 'function' && forceUpdate();\n }, forceUpdateDependencies);\n\n return (\n <Transition\n mounted={mounted && !!referenceElement}\n duration={transitionDuration}\n exitDuration={exitTransitionDuration}\n transition={transition}\n timingFunction={transitionTimingFunction}\n onExited={onTransitionEnd}\n >\n {(transitionStyles) => (\n <div>\n <PopperContainer withinPortal={withinPortal} zIndex={zIndex}>\n <div\n ref={setPopperElement}\n style={{ ...styles.popper, pointerEvents: 'none' }}\n {...attributes.popper}\n >\n <div style={transitionStyles}>\n {children}\n {withArrow && (\n <div\n style={arrowStyle}\n className={cx(\n classes.arrow,\n classes[parsedAttributes.placement],\n classes[parsedAttributes.position],\n arrowClassName\n )}\n />\n )}\n </div>\n </div>\n </PopperContainer>\n </div>\n )}\n </Transition>\n );\n}\n\nPopper.displayName = '@mantine/core/Popper';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Popper.js","sources":["../../../src/components/Popper/Popper.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { usePopper, StrictModifier } from 'react-popper';\nimport { getDefaultZIndex } from '@mantine/styles';\nimport type { Placement } from '@popperjs/core';\nimport { useDidUpdate } from '@mantine/hooks';\nimport { Transition, MantineTransition } from '../Transition';\nimport { parsePopperPosition } from './parse-popper-position/parse-popper-position';\nimport { PopperContainer } from './PopperContainer/PopperContainer';\nimport useStyles from './Popper.styles';\n\nexport interface SharedPopperProps {\n /** Position relative to reference element */\n position?: 'top' | 'left' | 'bottom' | 'right';\n\n /** Placement relative to reference element */\n placement?: 'start' | 'center' | 'end';\n\n /** Spacing between element and popper in px */\n gutter?: number;\n\n /** Arrow size in px */\n arrowSize?: number;\n\n /** Arrow distance to the left/right * arrowSize */\n arrowDistance?: number;\n\n /** Renders arrow if true */\n withArrow?: boolean;\n\n /** Popper z-index */\n zIndex?: number;\n\n /** Customize mount/unmount transition */\n transition?: MantineTransition;\n\n /** Mount transition duration in ms */\n transitionDuration?: number;\n\n /** Unmount transition duration in ms */\n exitTransitionDuration?: number;\n\n /** Mount/unmount transition timing function, defaults to theme.transitionTimingFunction */\n transitionTimingFunction?: string;\n}\n\nexport interface PopperProps<T extends HTMLElement> extends SharedPopperProps {\n /** Element at which popper should be attached */\n referenceElement: T;\n\n /** Popper content */\n children: React.ReactNode;\n\n /** True to show popper, false to hide */\n mounted: boolean;\n\n /** Arrow class name */\n arrowClassName?: string;\n\n /** Arrow inline styles */\n arrowStyle?: React.CSSProperties;\n\n /** useEffect dependencies to force update popper position */\n forceUpdateDependencies?: any[];\n\n /** Called when transition ends */\n onTransitionEnd?(): void;\n\n /** Popperjs modifiers array */\n modifiers?: StrictModifier[];\n\n /** Whether to render the target element in a Portal */\n withinPortal?: boolean;\n}\n\nfunction flipPlacement(placement: 'start' | 'center' | 'end', dir: 'ltr' | 'rtl') {\n if (placement === 'center') {\n return placement;\n }\n\n if (dir === 'rtl') {\n if (placement === 'end') {\n return 'start';\n }\n\n return 'end';\n }\n\n return placement;\n}\n\nfunction flipPosition(position: 'top' | 'left' | 'bottom' | 'right', dir: 'ltr' | 'rtl') {\n if (position === 'top' || position === 'bottom') {\n return position;\n }\n\n if (dir === 'rtl') {\n if (position === 'left') {\n return 'right';\n }\n\n return 'left';\n }\n\n return position;\n}\n\nexport function Popper<T extends HTMLElement = HTMLDivElement>({\n position = 'top',\n placement = 'center',\n gutter = 5,\n arrowSize = 2,\n arrowDistance = 2,\n withArrow = false,\n referenceElement,\n children,\n mounted,\n transition = 'pop-top-left',\n transitionDuration,\n exitTransitionDuration = transitionDuration,\n transitionTimingFunction,\n arrowClassName,\n arrowStyle,\n zIndex = getDefaultZIndex('popover'),\n forceUpdateDependencies = [],\n modifiers = [],\n onTransitionEnd,\n withinPortal = true,\n}: PopperProps<T>) {\n const padding = withArrow ? gutter + arrowSize : gutter;\n const { classes, cx, theme } = useStyles({ arrowSize, arrowDistance }, { name: 'Popper' });\n const [popperElement, setPopperElement] = useState(null);\n const _placement = flipPlacement(placement, theme.dir);\n const _position = flipPosition(position, theme.dir);\n\n const initialPlacement: Placement =\n _placement === 'center' ? _position : `${_position}-${_placement}`;\n\n const { styles, attributes, forceUpdate } = usePopper(referenceElement, popperElement, {\n placement: initialPlacement,\n modifiers: [\n {\n name: 'offset',\n options: {\n offset: [0, padding],\n },\n },\n ...modifiers,\n ],\n });\n\n const parsedAttributes = parsePopperPosition(attributes.popper?.['data-popper-placement']);\n\n useDidUpdate(() => {\n typeof forceUpdate === 'function' && forceUpdate();\n }, forceUpdateDependencies);\n\n return (\n <Transition\n mounted={mounted && !!referenceElement}\n duration={transitionDuration}\n exitDuration={exitTransitionDuration}\n transition={transition}\n timingFunction={transitionTimingFunction}\n onExited={onTransitionEnd}\n >\n {(transitionStyles) => (\n <div>\n <PopperContainer withinPortal={withinPortal} zIndex={zIndex}>\n <div\n ref={setPopperElement}\n style={{ ...styles.popper, pointerEvents: 'none' }}\n {...attributes.popper}\n >\n <div style={transitionStyles}>\n {children}\n {withArrow && (\n <div\n style={arrowStyle}\n className={cx(\n classes.arrow,\n classes[parsedAttributes.placement],\n classes[parsedAttributes.position],\n arrowClassName\n )}\n />\n )}\n </div>\n </div>\n </PopperContainer>\n </div>\n )}\n </Transition>\n );\n}\n\nPopper.displayName = '@mantine/core/Popper';\n"],"names":[],"mappings":"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"}
@@ -30,18 +30,20 @@ const horizontalPlacement = (arrowSize, distance, classes) => ({
30
30
  top: arrowSize * distance
31
31
  }
32
32
  });
33
- const verticalPlacement = (arrowSize, distance, classes) => ({
33
+ const verticalPlacement = (arrowSize, distance, classes, theme) => ({
34
34
  [`&.${classes.center}`]: {
35
35
  left: `calc(50% - ${arrowSize}px)`
36
36
  },
37
37
  [`&.${classes.end}`]: {
38
- right: arrowSize * distance
38
+ right: theme.dir === "ltr" ? arrowSize * distance : void 0,
39
+ left: theme.dir === "rtl" ? arrowSize * distance : void 0
39
40
  },
40
41
  [`&.${classes.start}`]: {
41
- left: arrowSize * distance
42
+ left: theme.dir === "ltr" ? arrowSize * distance : void 0,
43
+ right: theme.dir === "rtl" ? arrowSize * distance : void 0
42
44
  }
43
45
  });
44
- var useStyles = createStyles((_theme, { arrowSize, arrowDistance }, getRef) => {
46
+ var useStyles = createStyles((theme, { arrowSize, arrowDistance }, getRef) => {
45
47
  const center = { ref: getRef("center") };
46
48
  const start = { ref: getRef("start") };
47
49
  const end = { ref: getRef("end") };
@@ -63,23 +65,29 @@ var useStyles = createStyles((_theme, { arrowSize, arrowDistance }, getRef) => {
63
65
  zIndex: 1
64
66
  },
65
67
  left: __spreadProps(__spreadValues({}, horizontalPlacement(arrowSize, arrowDistance, placementClasses)), {
66
- right: -arrowSize,
67
- borderLeft: 0,
68
+ right: theme.dir === "ltr" ? -arrowSize : "unset",
69
+ left: theme.dir === "rtl" ? -arrowSize : "unset",
70
+ borderLeft: theme.dir === "ltr" ? 0 : void 0,
71
+ borderRight: theme.dir === "rtl" ? 0 : void 0,
68
72
  borderBottom: 0
69
73
  }),
70
74
  right: __spreadProps(__spreadValues({}, horizontalPlacement(arrowSize, arrowDistance, placementClasses)), {
71
- left: -arrowSize,
72
- borderRight: 0,
75
+ left: theme.dir === "ltr" ? -arrowSize : "unset",
76
+ right: theme.dir === "rtl" ? -arrowSize : "unset",
77
+ borderRight: theme.dir === "ltr" ? 0 : void 0,
78
+ borderLeft: theme.dir === "rtl" ? 0 : void 0,
73
79
  borderTop: 0
74
80
  }),
75
- top: __spreadProps(__spreadValues({}, verticalPlacement(arrowSize, arrowDistance, placementClasses)), {
81
+ top: __spreadProps(__spreadValues({}, verticalPlacement(arrowSize, arrowDistance, placementClasses, theme)), {
76
82
  bottom: -arrowSize,
77
- borderLeft: 0,
83
+ borderLeft: theme.dir === "ltr" ? 0 : void 0,
84
+ borderRight: theme.dir === "rtl" ? 0 : void 0,
78
85
  borderTop: 0
79
86
  }),
80
- bottom: __spreadProps(__spreadValues({}, verticalPlacement(arrowSize, arrowDistance, placementClasses)), {
87
+ bottom: __spreadProps(__spreadValues({}, verticalPlacement(arrowSize, arrowDistance, placementClasses, theme)), {
81
88
  top: -arrowSize,
82
- borderRight: 0,
89
+ borderRight: theme.dir === "ltr" ? 0 : void 0,
90
+ borderLeft: theme.dir === "rtl" ? 0 : void 0,
83
91
  borderBottom: 0
84
92
  })
85
93
  };
@@ -1 +1 @@
1
- {"version":3,"file":"Popper.styles.js","sources":["../../../src/components/Popper/Popper.styles.ts"],"sourcesContent":["import { createStyles } from '@mantine/styles';\n\ninterface PopperStyles {\n arrowSize: number;\n arrowDistance: number;\n}\n\ninterface PlacementClasses {\n center: string;\n end: string;\n start: string;\n}\n\nconst horizontalPlacement = (arrowSize: number, distance: number, classes: PlacementClasses) => ({\n [`&.${classes.center}`]: {\n top: `calc(50% - ${arrowSize}px)`,\n },\n\n [`&.${classes.end}`]: {\n bottom: arrowSize * distance,\n },\n\n [`&.${classes.start}`]: {\n top: arrowSize * distance,\n },\n});\n\nconst verticalPlacement = (arrowSize: number, distance: number, classes: PlacementClasses) => ({\n [`&.${classes.center}`]: {\n left: `calc(50% - ${arrowSize}px)`,\n },\n\n [`&.${classes.end}`]: {\n right: arrowSize * distance,\n },\n\n [`&.${classes.start}`]: {\n left: arrowSize * distance,\n },\n});\n\nexport default createStyles((_theme, { arrowSize, arrowDistance }: PopperStyles, getRef) => {\n const center = { ref: getRef('center') } as const;\n const start = { ref: getRef('start') } as const;\n const end = { ref: getRef('end') } as const;\n\n const placementClasses = {\n center: center.ref,\n start: start.ref,\n end: end.ref,\n };\n\n return {\n center,\n start,\n end,\n\n arrow: {\n width: arrowSize * 2,\n height: arrowSize * 2,\n position: 'absolute',\n transform: 'rotate(45deg)',\n border: '1px solid transparent',\n zIndex: 1,\n },\n\n left: {\n ...horizontalPlacement(arrowSize, arrowDistance, placementClasses),\n right: -arrowSize,\n borderLeft: 0,\n borderBottom: 0,\n },\n\n right: {\n ...horizontalPlacement(arrowSize, arrowDistance, placementClasses),\n left: -arrowSize,\n borderRight: 0,\n borderTop: 0,\n },\n\n top: {\n ...verticalPlacement(arrowSize, arrowDistance, placementClasses),\n bottom: -arrowSize,\n borderLeft: 0,\n borderTop: 0,\n },\n\n bottom: {\n ...verticalPlacement(arrowSize, arrowDistance, placementClasses),\n top: -arrowSize,\n borderRight: 0,\n borderBottom: 0,\n },\n };\n});\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Popper.styles.js","sources":["../../../src/components/Popper/Popper.styles.ts"],"sourcesContent":["import { createStyles, MantineTheme } from '@mantine/styles';\n\ninterface PopperStyles {\n arrowSize: number;\n arrowDistance: number;\n}\n\ninterface PlacementClasses {\n center: string;\n end: string;\n start: string;\n}\n\nconst horizontalPlacement = (arrowSize: number, distance: number, classes: PlacementClasses) => ({\n [`&.${classes.center}`]: {\n top: `calc(50% - ${arrowSize}px)`,\n },\n\n [`&.${classes.end}`]: {\n bottom: arrowSize * distance,\n },\n\n [`&.${classes.start}`]: {\n top: arrowSize * distance,\n },\n});\n\nconst verticalPlacement = (\n arrowSize: number,\n distance: number,\n classes: PlacementClasses,\n theme: MantineTheme\n) => ({\n [`&.${classes.center}`]: {\n left: `calc(50% - ${arrowSize}px)`,\n },\n\n [`&.${classes.end}`]: {\n right: theme.dir === 'ltr' ? arrowSize * distance : undefined,\n left: theme.dir === 'rtl' ? arrowSize * distance : undefined,\n },\n\n [`&.${classes.start}`]: {\n left: theme.dir === 'ltr' ? arrowSize * distance : undefined,\n right: theme.dir === 'rtl' ? arrowSize * distance : undefined,\n },\n});\n\nexport default createStyles((theme, { arrowSize, arrowDistance }: PopperStyles, getRef) => {\n const center = { ref: getRef('center') } as const;\n const start = { ref: getRef('start') } as const;\n const end = { ref: getRef('end') } as const;\n\n const placementClasses = {\n center: center.ref,\n start: start.ref,\n end: end.ref,\n };\n\n return {\n center,\n start,\n end,\n\n arrow: {\n width: arrowSize * 2,\n height: arrowSize * 2,\n position: 'absolute',\n transform: 'rotate(45deg)',\n border: '1px solid transparent',\n zIndex: 1,\n },\n\n left: {\n ...horizontalPlacement(arrowSize, arrowDistance, placementClasses),\n right: theme.dir === 'ltr' ? -arrowSize : 'unset',\n left: theme.dir === 'rtl' ? -arrowSize : 'unset',\n borderLeft: theme.dir === 'ltr' ? 0 : undefined,\n borderRight: theme.dir === 'rtl' ? 0 : undefined,\n borderBottom: 0,\n },\n\n right: {\n ...horizontalPlacement(arrowSize, arrowDistance, placementClasses),\n left: theme.dir === 'ltr' ? -arrowSize : 'unset',\n right: theme.dir === 'rtl' ? -arrowSize : 'unset',\n borderRight: theme.dir === 'ltr' ? 0 : undefined,\n borderLeft: theme.dir === 'rtl' ? 0 : undefined,\n borderTop: 0,\n },\n\n top: {\n ...verticalPlacement(arrowSize, arrowDistance, placementClasses, theme),\n bottom: -arrowSize,\n borderLeft: theme.dir === 'ltr' ? 0 : undefined,\n borderRight: theme.dir === 'rtl' ? 0 : undefined,\n borderTop: 0,\n },\n\n bottom: {\n ...verticalPlacement(arrowSize, arrowDistance, placementClasses, theme),\n top: -arrowSize,\n borderRight: theme.dir === 'ltr' ? 0 : undefined,\n borderLeft: theme.dir === 'rtl' ? 0 : undefined,\n borderBottom: 0,\n },\n };\n});\n"],"names":[],"mappings":"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"}
@@ -1,8 +1,10 @@
1
1
  import React, { useState, useRef } from 'react';
2
2
  import { createPortal } from 'react-dom';
3
3
  import { useIsomorphicEffect } from '@mantine/hooks';
4
+ import { useMantineTheme } from '@mantine/styles';
4
5
 
5
6
  function Portal({ children, zIndex = 1, target, className }) {
7
+ const theme = useMantineTheme();
6
8
  const [mounted, setMounted] = useState(false);
7
9
  const ref = useRef();
8
10
  useIsomorphicEffect(() => {
@@ -20,6 +22,7 @@ function Portal({ children, zIndex = 1, target, className }) {
20
22
  }
21
23
  return createPortal(/* @__PURE__ */ React.createElement("div", {
22
24
  className,
25
+ dir: theme.dir,
23
26
  style: { position: "relative", zIndex }
24
27
  }, children), ref.current);
25
28
  }
@@ -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?: 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
+ {"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';\nimport { useMantineTheme } from '@mantine/styles';\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 theme = useMantineTheme();\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} dir={theme.dir} style={{ position: 'relative', zIndex }}>\n {children}\n </div>,\n ref.current\n );\n}\n\nPortal.displayName = '@mantine/core/Portal';\n"],"names":[],"mappings":";;;;;AAIO,SAAS,MAAM,CAAC,EAAE,QAAQ,EAAE,MAAM,GAAG,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE;AACpE,EAAE,MAAM,KAAK,GAAG,eAAe,EAAE,CAAC;AAClC,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,GAAG,EAAE,KAAK,CAAC,GAAG;AAClB,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,7 +1,7 @@
1
1
  import React, { forwardRef } from 'react';
2
2
  import useStyles from './Progress.styles.js';
3
- import { Text } from '../Text/Text.js';
4
3
  import { Box } from '../Box/Box.js';
4
+ import { Text } from '../Text/Text.js';
5
5
 
6
6
  var __defProp = Object.defineProperty;
7
7
  var __defProps = Object.defineProperties;
@@ -70,10 +70,10 @@ const Progress = forwardRef((_a, ref) => {
70
70
  "sections"
71
71
  ]);
72
72
  const { classes, cx, theme } = useStyles({ color, size, radius, striped: striped || animate, animate }, { classNames, styles, name: "Progress" });
73
- const segments = Array.isArray(sections) ? getCumulativeSections(sections).map((section, index) => /* @__PURE__ */ React.createElement("div", {
73
+ const segments = Array.isArray(sections) ? getCumulativeSections(sections).map((section, index) => /* @__PURE__ */ React.createElement(Box, {
74
74
  key: index,
75
75
  className: classes.bar,
76
- style: {
76
+ sx: {
77
77
  width: `${section.value}%`,
78
78
  left: `${section.accumulated}%`,
79
79
  backgroundColor: theme.fn.themeColor(section.color, 6, false)
@@ -1 +1 @@
1
- {"version":3,"file":"Progress.js","sources":["../../../src/components/Progress/Progress.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { DefaultProps, MantineNumberSize, MantineColor, ClassNames } from '@mantine/styles';\nimport { Box } from '../Box';\nimport useStyles from './Progress.styles';\nimport { Text } from '../Text';\n\nexport type ProgressStylesNames = ClassNames<typeof useStyles>;\n\nexport interface ProgressProps\n extends DefaultProps<ProgressStylesNames>,\n React.ComponentPropsWithoutRef<'div'> {\n /** Percent of filled bar (0-100) */\n value?: number;\n\n /** Progress color from theme */\n color?: MantineColor;\n\n /** Predefined progress height or number for height in px */\n size?: MantineNumberSize;\n\n /** Predefined progress radius from theme.radius or number for height in px */\n radius?: MantineNumberSize;\n\n /** Adds stripes */\n striped?: boolean;\n\n /** Whether to animate striped progress bars */\n animate?: boolean;\n\n /** Text to be placed inside the progress bar */\n label?: string;\n\n /** Replaces value if present, renders multiple sections instead of single one */\n sections?: { value: number; color: MantineColor; label?: string }[];\n}\n\nfunction getCumulativeSections(\n sections: { value: number; color: MantineColor; label?: string }[]\n): { value: number; color: MantineColor; accumulated: number; label?: string }[] {\n return sections.reduce(\n (acc, section) => {\n acc.sections.push({ ...section, accumulated: acc.accumulated });\n acc.accumulated += section.value;\n return acc;\n },\n { accumulated: 0, sections: [] }\n ).sections;\n}\n\nexport const Progress = forwardRef<HTMLDivElement, ProgressProps>(\n (\n {\n className,\n value,\n color,\n size = 'md',\n radius = 'sm',\n striped = false,\n animate = false,\n label = '',\n 'aria-label': ariaLabel,\n classNames,\n styles,\n sections,\n ...others\n }: ProgressProps,\n ref\n ) => {\n const { classes, cx, theme } = useStyles(\n { color, size, radius, striped: striped || animate, animate },\n { classNames, styles, name: 'Progress' }\n );\n\n const segments = Array.isArray(sections)\n ? getCumulativeSections(sections).map((section, index) => (\n <div\n key={index}\n className={classes.bar}\n style={{\n width: `${section.value}%`,\n left: `${section.accumulated}%`,\n backgroundColor: theme.fn.themeColor(section.color, 6, false),\n }}\n >\n {section.label && <Text className={classes.label}>{section.label}</Text>}\n </div>\n ))\n : null;\n\n return (\n <Box className={cx(classes.root, className)} ref={ref} {...others}>\n {segments || (\n <div\n role=\"progressbar\"\n aria-valuemax={100}\n aria-valuemin={0}\n aria-valuenow={value}\n aria-label={ariaLabel}\n className={classes.bar}\n style={{ width: `${value}%` }}\n >\n {label ? <Text className={classes.label}>{label}</Text> : ''}\n </div>\n )}\n </Box>\n );\n }\n);\n\nProgress.displayName = '@mantine/core/Progress';\n"],"names":[],"mappings":";;;;;AAAA,IAAI,SAAS,GAAG,MAAM,CAAC,cAAc,CAAC;AACtC,IAAI,UAAU,GAAG,MAAM,CAAC,gBAAgB,CAAC;AACzC,IAAI,iBAAiB,GAAG,MAAM,CAAC,yBAAyB,CAAC;AACzD,IAAI,mBAAmB,GAAG,MAAM,CAAC,qBAAqB,CAAC;AACvD,IAAI,YAAY,GAAG,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC;AACnD,IAAI,YAAY,GAAG,MAAM,CAAC,SAAS,CAAC,oBAAoB,CAAC;AACzD,IAAI,eAAe,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,KAAK,KAAK,GAAG,IAAI,GAAG,GAAG,SAAS,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,GAAG,GAAG,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;AAChK,IAAI,cAAc,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK;AAC/B,EAAE,KAAK,IAAI,IAAI,IAAI,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC;AAChC,IAAI,IAAI,YAAY,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC;AAClC,MAAM,eAAe,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;AACxC,EAAE,IAAI,mBAAmB;AACzB,IAAI,KAAK,IAAI,IAAI,IAAI,mBAAmB,CAAC,CAAC,CAAC,EAAE;AAC7C,MAAM,IAAI,YAAY,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC;AACpC,QAAQ,eAAe,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;AAC1C,KAAK;AACL,EAAE,OAAO,CAAC,CAAC;AACX,CAAC,CAAC;AACF,IAAI,aAAa,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK,UAAU,CAAC,CAAC,EAAE,iBAAiB,CAAC,CAAC,CAAC,CAAC,CAAC;AAClE,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;AAKF,SAAS,qBAAqB,CAAC,QAAQ,EAAE;AACzC,EAAE,OAAO,QAAQ,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,OAAO,KAAK;AAC3C,IAAI,GAAG,CAAC,QAAQ,CAAC,IAAI,CAAC,aAAa,CAAC,cAAc,CAAC,EAAE,EAAE,OAAO,CAAC,EAAE,EAAE,WAAW,EAAE,GAAG,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC;AACpG,IAAI,GAAG,CAAC,WAAW,IAAI,OAAO,CAAC,KAAK,CAAC;AACrC,IAAI,OAAO,GAAG,CAAC;AACf,GAAG,EAAE,EAAE,WAAW,EAAE,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CAAC,QAAQ,CAAC;AAChD,CAAC;AACW,MAAC,QAAQ,GAAG,UAAU,CAAC,CAAC,EAAE,EAAE,GAAG,KAAK;AAChD,EAAE,IAAI,EAAE,GAAG,EAAE,EAAE;AACf,IAAI,SAAS;AACb,IAAI,KAAK;AACT,IAAI,KAAK;AACT,IAAI,IAAI,GAAG,IAAI;AACf,IAAI,MAAM,GAAG,IAAI;AACjB,IAAI,OAAO,GAAG,KAAK;AACnB,IAAI,OAAO,GAAG,KAAK;AACnB,IAAI,KAAK,GAAG,EAAE;AACd,IAAI,YAAY,EAAE,SAAS;AAC3B,IAAI,UAAU;AACd,IAAI,MAAM;AACV,IAAI,QAAQ;AACZ,GAAG,GAAG,EAAE,EAAE,MAAM,GAAG,SAAS,CAAC,EAAE,EAAE;AACjC,IAAI,WAAW;AACf,IAAI,OAAO;AACX,IAAI,OAAO;AACX,IAAI,MAAM;AACV,IAAI,QAAQ;AACZ,IAAI,SAAS;AACb,IAAI,SAAS;AACb,IAAI,OAAO;AACX,IAAI,YAAY;AAChB,IAAI,YAAY;AAChB,IAAI,QAAQ;AACZ,IAAI,UAAU;AACd,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,EAAE,KAAK,EAAE,GAAG,SAAS,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,OAAO,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC,CAAC;AACpJ,EAAE,MAAM,QAAQ,GAAG,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,qBAAqB,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,KAAK,qBAAqB,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE;AAChJ,IAAI,GAAG,EAAE,KAAK;AACd,IAAI,SAAS,EAAE,OAAO,CAAC,GAAG;AAC1B,IAAI,KAAK,EAAE;AACX,MAAM,KAAK,EAAE,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC;AAChC,MAAM,IAAI,EAAE,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC;AACrC,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC,EAAE,KAAK,CAAC;AACnE,KAAK;AACL,GAAG,EAAE,OAAO,CAAC,KAAK,oBAAoB,KAAK,CAAC,aAAa,CAAC,IAAI,EAAE;AAChE,IAAI,SAAS,EAAE,OAAO,CAAC,KAAK;AAC5B,GAAG,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC;AAC7B,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,QAAQ,oBAAoB,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE;AACrE,IAAI,IAAI,EAAE,aAAa;AACvB,IAAI,eAAe,EAAE,GAAG;AACxB,IAAI,eAAe,EAAE,CAAC;AACtB,IAAI,eAAe,EAAE,KAAK;AAC1B,IAAI,YAAY,EAAE,SAAS;AAC3B,IAAI,SAAS,EAAE,OAAO,CAAC,GAAG;AAC1B,IAAI,KAAK,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE;AACjC,GAAG,EAAE,KAAK,mBAAmB,KAAK,CAAC,aAAa,CAAC,IAAI,EAAE;AACvD,IAAI,SAAS,EAAE,OAAO,CAAC,KAAK;AAC5B,GAAG,EAAE,KAAK,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC;AACnB,CAAC,EAAE;AACH,QAAQ,CAAC,WAAW,GAAG,wBAAwB;;;;"}
1
+ {"version":3,"file":"Progress.js","sources":["../../../src/components/Progress/Progress.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { DefaultProps, MantineNumberSize, MantineColor, ClassNames } from '@mantine/styles';\nimport { Box } from '../Box';\nimport useStyles from './Progress.styles';\nimport { Text } from '../Text';\n\nexport type ProgressStylesNames = ClassNames<typeof useStyles>;\n\nexport interface ProgressProps\n extends DefaultProps<ProgressStylesNames>,\n React.ComponentPropsWithoutRef<'div'> {\n /** Percent of filled bar (0-100) */\n value?: number;\n\n /** Progress color from theme */\n color?: MantineColor;\n\n /** Predefined progress height or number for height in px */\n size?: MantineNumberSize;\n\n /** Predefined progress radius from theme.radius or number for height in px */\n radius?: MantineNumberSize;\n\n /** Adds stripes */\n striped?: boolean;\n\n /** Whether to animate striped progress bars */\n animate?: boolean;\n\n /** Text to be placed inside the progress bar */\n label?: string;\n\n /** Replaces value if present, renders multiple sections instead of single one */\n sections?: { value: number; color: MantineColor; label?: string }[];\n}\n\nfunction getCumulativeSections(\n sections: { value: number; color: MantineColor; label?: string }[]\n): { value: number; color: MantineColor; accumulated: number; label?: string }[] {\n return sections.reduce(\n (acc, section) => {\n acc.sections.push({ ...section, accumulated: acc.accumulated });\n acc.accumulated += section.value;\n return acc;\n },\n { accumulated: 0, sections: [] }\n ).sections;\n}\n\nexport const Progress = forwardRef<HTMLDivElement, ProgressProps>(\n (\n {\n className,\n value,\n color,\n size = 'md',\n radius = 'sm',\n striped = false,\n animate = false,\n label = '',\n 'aria-label': ariaLabel,\n classNames,\n styles,\n sections,\n ...others\n }: ProgressProps,\n ref\n ) => {\n const { classes, cx, theme } = useStyles(\n { color, size, radius, striped: striped || animate, animate },\n { classNames, styles, name: 'Progress' }\n );\n\n const segments = Array.isArray(sections)\n ? getCumulativeSections(sections).map((section, index) => (\n <Box\n key={index}\n className={classes.bar}\n sx={{\n width: `${section.value}%`,\n left: `${section.accumulated}%`,\n backgroundColor: theme.fn.themeColor(section.color, 6, false),\n }}\n >\n {section.label && <Text className={classes.label}>{section.label}</Text>}\n </Box>\n ))\n : null;\n\n return (\n <Box className={cx(classes.root, className)} ref={ref} {...others}>\n {segments || (\n <div\n role=\"progressbar\"\n aria-valuemax={100}\n aria-valuemin={0}\n aria-valuenow={value}\n aria-label={ariaLabel}\n className={classes.bar}\n style={{ width: `${value}%` }}\n >\n {label ? <Text className={classes.label}>{label}</Text> : ''}\n </div>\n )}\n </Box>\n );\n }\n);\n\nProgress.displayName = '@mantine/core/Progress';\n"],"names":[],"mappings":"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"}
@@ -1,5 +1,6 @@
1
1
  import React, { forwardRef, useState } from 'react';
2
2
  import * as RadixScrollArea from '@radix-ui/react-scroll-area';
3
+ import { useMantineTheme } from '@mantine/styles';
3
4
  import useStyles from './ScrollArea.styles.js';
4
5
  import { Box } from '../Box/Box.js';
5
6
 
@@ -40,7 +41,7 @@ const ScrollArea = forwardRef((_a, ref) => {
40
41
  scrollbarSize = 12,
41
42
  scrollHideDelay = 1e3,
42
43
  type = "hover",
43
- dir = "ltr",
44
+ dir,
44
45
  offsetScrollbars = false,
45
46
  viewportRef,
46
47
  onScrollPositionChange
@@ -58,11 +59,12 @@ const ScrollArea = forwardRef((_a, ref) => {
58
59
  "onScrollPositionChange"
59
60
  ]);
60
61
  const [scrollbarHovered, setScrollbarHovered] = useState(false);
61
- const { classes, cx } = useStyles({ scrollbarSize, offsetScrollbars, dir, scrollbarHovered }, { name: "ScrollArea", classNames, styles });
62
+ const theme = useMantineTheme();
63
+ const { classes, cx } = useStyles({ scrollbarSize, offsetScrollbars, scrollbarHovered }, { name: "ScrollArea", classNames, styles });
62
64
  return /* @__PURE__ */ React.createElement(RadixScrollArea.Root, {
63
65
  type,
64
66
  scrollHideDelay,
65
- dir,
67
+ dir: dir || theme.dir,
66
68
  ref,
67
69
  asChild: true
68
70
  }, /* @__PURE__ */ React.createElement(Box, __spreadValues({
@@ -1 +1 @@
1
- {"version":3,"file":"ScrollArea.js","sources":["../../../src/components/ScrollArea/ScrollArea.tsx"],"sourcesContent":["import React, { useState, forwardRef } from 'react';\nimport * as RadixScrollArea from '@radix-ui/react-scroll-area';\nimport { DefaultProps, ClassNames } from '@mantine/styles';\nimport { Box } from '../Box';\nimport useStyles from './ScrollArea.styles';\n\nexport type ScrollAreaStylesNames = ClassNames<typeof useStyles>;\n\nexport interface ScrollAreaProps\n extends DefaultProps<ScrollAreaStylesNames>,\n React.ComponentPropsWithoutRef<'div'> {\n /** Scrollbar size in px */\n scrollbarSize?: number;\n\n /** Scrollbars type */\n type?: 'auto' | 'always' | 'scroll' | 'hover';\n\n /** Scroll hide delay in ms, for scroll and hover types only */\n scrollHideDelay?: number;\n\n /** Reading direction of the scroll area */\n dir?: 'ltr' | 'rtl';\n\n /** Should scrollbars be offset with padding */\n offsetScrollbars?: boolean;\n\n /** Get viewport ref */\n viewportRef?: React.ForwardedRef<HTMLDivElement>;\n\n /** Subscribe to scroll position changes */\n onScrollPositionChange?(position: { x: number; y: number }): void;\n}\n\nexport const ScrollArea = forwardRef<HTMLDivElement, ScrollAreaProps>(\n (\n {\n children,\n className,\n classNames,\n styles,\n scrollbarSize = 12,\n scrollHideDelay = 1000,\n type = 'hover',\n dir = 'ltr',\n offsetScrollbars = false,\n viewportRef,\n onScrollPositionChange,\n ...others\n }: ScrollAreaProps,\n ref\n ) => {\n const [scrollbarHovered, setScrollbarHovered] = useState(false);\n const { classes, cx } = useStyles(\n { scrollbarSize, offsetScrollbars, dir, scrollbarHovered },\n { name: 'ScrollArea', classNames, styles }\n );\n\n return (\n <RadixScrollArea.Root\n type={type}\n scrollHideDelay={scrollHideDelay}\n dir={dir}\n ref={ref}\n asChild\n >\n <Box className={cx(classes.root, className)} {...others}>\n <RadixScrollArea.Viewport\n className={classes.viewport}\n ref={viewportRef}\n onScroll={\n typeof onScrollPositionChange === 'function'\n ? ({ currentTarget }) =>\n onScrollPositionChange({\n x: currentTarget.scrollLeft,\n y: currentTarget.scrollTop,\n })\n : undefined\n }\n >\n {children}\n </RadixScrollArea.Viewport>\n <RadixScrollArea.Scrollbar\n orientation=\"horizontal\"\n className={classes.scrollbar}\n forceMount\n onMouseEnter={() => setScrollbarHovered(true)}\n onMouseLeave={() => setScrollbarHovered(false)}\n >\n <RadixScrollArea.Thumb className={classes.thumb} />\n </RadixScrollArea.Scrollbar>\n <RadixScrollArea.Scrollbar\n orientation=\"vertical\"\n className={classes.scrollbar}\n forceMount\n onMouseEnter={() => setScrollbarHovered(true)}\n onMouseLeave={() => setScrollbarHovered(false)}\n >\n <RadixScrollArea.Thumb className={classes.thumb} />\n </RadixScrollArea.Scrollbar>\n <RadixScrollArea.Corner className={classes.corner} />\n </Box>\n </RadixScrollArea.Root>\n );\n }\n);\n\nScrollArea.displayName = '@mantine/core/ScrollArea';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"ScrollArea.js","sources":["../../../src/components/ScrollArea/ScrollArea.tsx"],"sourcesContent":["import React, { useState, forwardRef } from 'react';\nimport * as RadixScrollArea from '@radix-ui/react-scroll-area';\nimport { DefaultProps, ClassNames, useMantineTheme } from '@mantine/styles';\nimport { Box } from '../Box';\nimport useStyles from './ScrollArea.styles';\n\nexport type ScrollAreaStylesNames = ClassNames<typeof useStyles>;\n\nexport interface ScrollAreaProps\n extends DefaultProps<ScrollAreaStylesNames>,\n React.ComponentPropsWithoutRef<'div'> {\n /** Scrollbar size in px */\n scrollbarSize?: number;\n\n /** Scrollbars type */\n type?: 'auto' | 'always' | 'scroll' | 'hover';\n\n /** Scroll hide delay in ms, for scroll and hover types only */\n scrollHideDelay?: number;\n\n /** Reading direction of the scroll area */\n dir?: 'ltr' | 'rtl';\n\n /** Should scrollbars be offset with padding */\n offsetScrollbars?: boolean;\n\n /** Get viewport ref */\n viewportRef?: React.ForwardedRef<HTMLDivElement>;\n\n /** Subscribe to scroll position changes */\n onScrollPositionChange?(position: { x: number; y: number }): void;\n}\n\nexport const ScrollArea = forwardRef<HTMLDivElement, ScrollAreaProps>(\n (\n {\n children,\n className,\n classNames,\n styles,\n scrollbarSize = 12,\n scrollHideDelay = 1000,\n type = 'hover',\n dir,\n offsetScrollbars = false,\n viewportRef,\n onScrollPositionChange,\n ...others\n }: ScrollAreaProps,\n ref\n ) => {\n const [scrollbarHovered, setScrollbarHovered] = useState(false);\n const theme = useMantineTheme();\n const { classes, cx } = useStyles(\n { scrollbarSize, offsetScrollbars, scrollbarHovered },\n { name: 'ScrollArea', classNames, styles }\n );\n\n return (\n <RadixScrollArea.Root\n type={type}\n scrollHideDelay={scrollHideDelay}\n dir={dir || theme.dir}\n ref={ref}\n asChild\n >\n <Box className={cx(classes.root, className)} {...others}>\n <RadixScrollArea.Viewport\n className={classes.viewport}\n ref={viewportRef}\n onScroll={\n typeof onScrollPositionChange === 'function'\n ? ({ currentTarget }) =>\n onScrollPositionChange({\n x: currentTarget.scrollLeft,\n y: currentTarget.scrollTop,\n })\n : undefined\n }\n >\n {children}\n </RadixScrollArea.Viewport>\n <RadixScrollArea.Scrollbar\n orientation=\"horizontal\"\n className={classes.scrollbar}\n forceMount\n onMouseEnter={() => setScrollbarHovered(true)}\n onMouseLeave={() => setScrollbarHovered(false)}\n >\n <RadixScrollArea.Thumb className={classes.thumb} />\n </RadixScrollArea.Scrollbar>\n <RadixScrollArea.Scrollbar\n orientation=\"vertical\"\n className={classes.scrollbar}\n forceMount\n onMouseEnter={() => setScrollbarHovered(true)}\n onMouseLeave={() => setScrollbarHovered(false)}\n >\n <RadixScrollArea.Thumb className={classes.thumb} />\n </RadixScrollArea.Scrollbar>\n <RadixScrollArea.Corner className={classes.corner} />\n </Box>\n </RadixScrollArea.Root>\n );\n }\n);\n\nScrollArea.displayName = '@mantine/core/ScrollArea';\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;AAMU,MAAC,UAAU,GAAG,UAAU,CAAC,CAAC,EAAE,EAAE,GAAG,KAAK;AAClD,EAAE,IAAI,EAAE,GAAG,EAAE,EAAE;AACf,IAAI,QAAQ;AACZ,IAAI,SAAS;AACb,IAAI,UAAU;AACd,IAAI,MAAM;AACV,IAAI,aAAa,GAAG,EAAE;AACtB,IAAI,eAAe,GAAG,GAAG;AACzB,IAAI,IAAI,GAAG,OAAO;AAClB,IAAI,GAAG;AACP,IAAI,gBAAgB,GAAG,KAAK;AAC5B,IAAI,WAAW;AACf,IAAI,sBAAsB;AAC1B,GAAG,GAAG,EAAE,EAAE,MAAM,GAAG,SAAS,CAAC,EAAE,EAAE;AACjC,IAAI,UAAU;AACd,IAAI,WAAW;AACf,IAAI,YAAY;AAChB,IAAI,QAAQ;AACZ,IAAI,eAAe;AACnB,IAAI,iBAAiB;AACrB,IAAI,MAAM;AACV,IAAI,KAAK;AACT,IAAI,kBAAkB;AACtB,IAAI,aAAa;AACjB,IAAI,wBAAwB;AAC5B,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;AAClE,EAAE,MAAM,KAAK,GAAG,eAAe,EAAE,CAAC;AAClC,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,EAAE,GAAG,SAAS,CAAC,EAAE,aAAa,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,EAAE,EAAE,IAAI,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,EAAE,CAAC,CAAC;AACvI,EAAE,uBAAuB,KAAK,CAAC,aAAa,CAAC,eAAe,CAAC,IAAI,EAAE;AACnE,IAAI,IAAI;AACR,IAAI,eAAe;AACnB,IAAI,GAAG,EAAE,GAAG,IAAI,KAAK,CAAC,GAAG;AACzB,IAAI,GAAG;AACP,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG,kBAAkB,KAAK,CAAC,aAAa,CAAC,GAAG,EAAE,cAAc,CAAC;AAC7D,IAAI,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,SAAS,CAAC;AAC1C,GAAG,EAAE,MAAM,CAAC,kBAAkB,KAAK,CAAC,aAAa,CAAC,eAAe,CAAC,QAAQ,EAAE;AAC5E,IAAI,SAAS,EAAE,OAAO,CAAC,QAAQ;AAC/B,IAAI,GAAG,EAAE,WAAW;AACpB,IAAI,QAAQ,EAAE,OAAO,sBAAsB,KAAK,UAAU,GAAG,CAAC,EAAE,aAAa,EAAE,KAAK,sBAAsB,CAAC;AAC3G,MAAM,CAAC,EAAE,aAAa,CAAC,UAAU;AACjC,MAAM,CAAC,EAAE,aAAa,CAAC,SAAS;AAChC,KAAK,CAAC,GAAG,KAAK,CAAC;AACf,GAAG,EAAE,QAAQ,CAAC,kBAAkB,KAAK,CAAC,aAAa,CAAC,eAAe,CAAC,SAAS,EAAE;AAC/E,IAAI,WAAW,EAAE,YAAY;AAC7B,IAAI,SAAS,EAAE,OAAO,CAAC,SAAS;AAChC,IAAI,UAAU,EAAE,IAAI;AACpB,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC,IAAI,CAAC;AACjD,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC,KAAK,CAAC;AAClD,GAAG,kBAAkB,KAAK,CAAC,aAAa,CAAC,eAAe,CAAC,KAAK,EAAE;AAChE,IAAI,SAAS,EAAE,OAAO,CAAC,KAAK;AAC5B,GAAG,CAAC,CAAC,kBAAkB,KAAK,CAAC,aAAa,CAAC,eAAe,CAAC,SAAS,EAAE;AACtE,IAAI,WAAW,EAAE,UAAU;AAC3B,IAAI,SAAS,EAAE,OAAO,CAAC,SAAS;AAChC,IAAI,UAAU,EAAE,IAAI;AACpB,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC,IAAI,CAAC;AACjD,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC,KAAK,CAAC;AAClD,GAAG,kBAAkB,KAAK,CAAC,aAAa,CAAC,eAAe,CAAC,KAAK,EAAE;AAChE,IAAI,SAAS,EAAE,OAAO,CAAC,KAAK;AAC5B,GAAG,CAAC,CAAC,kBAAkB,KAAK,CAAC,aAAa,CAAC,eAAe,CAAC,MAAM,EAAE;AACnE,IAAI,SAAS,EAAE,OAAO,CAAC,MAAM;AAC7B,GAAG,CAAC,CAAC,CAAC,CAAC;AACP,CAAC,EAAE;AACH,UAAU,CAAC,WAAW,GAAG,0BAA0B;;;;"}
@@ -1,6 +1,6 @@
1
1
  import { createStyles } from '@mantine/styles';
2
2
 
3
- var useStyles = createStyles((theme, { scrollbarSize, dir, offsetScrollbars, scrollbarHovered }, getRef) => {
3
+ var useStyles = createStyles((theme, { scrollbarSize, offsetScrollbars, scrollbarHovered }, getRef) => {
4
4
  const thumb = getRef("thumb");
5
5
  return {
6
6
  root: {
@@ -9,8 +9,7 @@ var useStyles = createStyles((theme, { scrollbarSize, dir, offsetScrollbars, scr
9
9
  viewport: {
10
10
  width: "100%",
11
11
  height: "100%",
12
- paddingRight: dir === "ltr" && offsetScrollbars ? scrollbarSize : void 0,
13
- paddingLeft: dir === "rtl" && offsetScrollbars ? scrollbarSize : void 0
12
+ paddingRight: offsetScrollbars ? scrollbarSize : void 0
14
13
  },
15
14
  scrollbar: {
16
15
  display: "flex",
@@ -1 +1 @@
1
- {"version":3,"file":"ScrollArea.styles.js","sources":["../../../src/components/ScrollArea/ScrollArea.styles.ts"],"sourcesContent":["import { createStyles } from '@mantine/styles';\n\ninterface ScrollAreaStyles {\n scrollbarSize: number;\n dir: 'ltr' | 'rtl';\n offsetScrollbars: boolean;\n scrollbarHovered: boolean;\n}\n\nexport default createStyles(\n (theme, { scrollbarSize, dir, offsetScrollbars, scrollbarHovered }: ScrollAreaStyles, getRef) => {\n const thumb = getRef('thumb');\n return {\n root: {\n overflow: 'hidden',\n },\n\n viewport: {\n width: '100%',\n height: '100%',\n paddingRight: dir === 'ltr' && offsetScrollbars ? scrollbarSize : undefined,\n paddingLeft: dir === 'rtl' && offsetScrollbars ? scrollbarSize : undefined,\n },\n\n scrollbar: {\n display: 'flex',\n userSelect: 'none',\n touchAction: 'none',\n boxSizing: 'border-box',\n padding: scrollbarSize / 5,\n transition: 'background-color 150ms ease, opacity 150ms ease',\n\n '&:hover': {\n backgroundColor:\n theme.colorScheme === 'dark' ? theme.colors.dark[8] : theme.colors.gray[0],\n [`& .${thumb}`]: {\n backgroundColor:\n theme.colorScheme === 'dark'\n ? theme.fn.rgba('#ffffff', 0.5)\n : theme.fn.rgba(theme.black, 0.5),\n },\n },\n\n '&[data-orientation=\"vertical\"]': {\n width: scrollbarSize,\n },\n\n '&[data-orientation=\"horizontal\"]': {\n flexDirection: 'column',\n height: scrollbarSize,\n },\n\n '&[data-state=\"hidden\"]': {\n opacity: 0,\n },\n },\n\n thumb: {\n ref: thumb,\n flex: 1,\n backgroundColor:\n theme.colorScheme === 'dark'\n ? theme.fn.rgba('#ffffff', 0.4)\n : theme.fn.rgba(theme.black, 0.4),\n borderRadius: scrollbarSize,\n position: 'relative',\n transition: 'background-color 150ms ease',\n\n '&::before': {\n content: '\"\"',\n position: 'absolute',\n top: '50%',\n left: '50%',\n transform: 'translate(-50%, -50%)',\n width: '100%',\n height: '100%',\n minWidth: 44,\n minHeight: 44,\n },\n },\n\n corner: {\n backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[0],\n transition: 'opacity 150ms ease',\n opacity: scrollbarHovered ? 1 : 0,\n },\n };\n }\n);\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"ScrollArea.styles.js","sources":["../../../src/components/ScrollArea/ScrollArea.styles.ts"],"sourcesContent":["import { createStyles } from '@mantine/styles';\n\ninterface ScrollAreaStyles {\n scrollbarSize: number;\n offsetScrollbars: boolean;\n scrollbarHovered: boolean;\n}\n\nexport default createStyles(\n (theme, { scrollbarSize, offsetScrollbars, scrollbarHovered }: ScrollAreaStyles, getRef) => {\n const thumb = getRef('thumb');\n return {\n root: {\n overflow: 'hidden',\n },\n\n viewport: {\n width: '100%',\n height: '100%',\n paddingRight: offsetScrollbars ? scrollbarSize : undefined,\n },\n\n scrollbar: {\n display: 'flex',\n userSelect: 'none',\n touchAction: 'none',\n boxSizing: 'border-box',\n padding: scrollbarSize / 5,\n transition: 'background-color 150ms ease, opacity 150ms ease',\n\n '&:hover': {\n backgroundColor:\n theme.colorScheme === 'dark' ? theme.colors.dark[8] : theme.colors.gray[0],\n [`& .${thumb}`]: {\n backgroundColor:\n theme.colorScheme === 'dark'\n ? theme.fn.rgba('#ffffff', 0.5)\n : theme.fn.rgba(theme.black, 0.5),\n },\n },\n\n '&[data-orientation=\"vertical\"]': {\n width: scrollbarSize,\n },\n\n '&[data-orientation=\"horizontal\"]': {\n flexDirection: 'column',\n height: scrollbarSize,\n },\n\n '&[data-state=\"hidden\"]': {\n opacity: 0,\n },\n },\n\n thumb: {\n ref: thumb,\n flex: 1,\n backgroundColor:\n theme.colorScheme === 'dark'\n ? theme.fn.rgba('#ffffff', 0.4)\n : theme.fn.rgba(theme.black, 0.4),\n borderRadius: scrollbarSize,\n position: 'relative',\n transition: 'background-color 150ms ease',\n\n '&::before': {\n content: '\"\"',\n position: 'absolute',\n top: '50%',\n left: '50%',\n transform: 'translate(-50%, -50%)',\n width: '100%',\n height: '100%',\n minWidth: 44,\n minHeight: 44,\n },\n },\n\n corner: {\n backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[0],\n transition: 'opacity 150ms ease',\n opacity: scrollbarHovered ? 1 : 0,\n },\n };\n }\n);\n"],"names":[],"mappings":"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"}
@@ -34,6 +34,7 @@ var __objRest = (source, exclude) => {
34
34
  const SegmentedControl = forwardRef((_a, ref) => {
35
35
  var _b = _a, {
36
36
  className,
37
+ disabled = false,
37
38
  data: _data,
38
39
  name,
39
40
  value,
@@ -46,9 +47,11 @@ const SegmentedControl = forwardRef((_a, ref) => {
46
47
  transitionTimingFunction,
47
48
  classNames,
48
49
  styles,
49
- defaultValue
50
+ defaultValue,
51
+ orientation
50
52
  } = _b, others = __objRest(_b, [
51
53
  "className",
54
+ "disabled",
52
55
  "data",
53
56
  "name",
54
57
  "value",
@@ -61,7 +64,8 @@ const SegmentedControl = forwardRef((_a, ref) => {
61
64
  "transitionTimingFunction",
62
65
  "classNames",
63
66
  "styles",
64
- "defaultValue"
67
+ "defaultValue",
68
+ "orientation"
65
69
  ]);
66
70
  const reduceMotion = useReducedMotion();
67
71
  const data = _data.map((item) => typeof item === "string" ? { label: item, value: item } : item);
@@ -73,16 +77,21 @@ const SegmentedControl = forwardRef((_a, ref) => {
73
77
  onChange,
74
78
  rule: (val) => !!val
75
79
  });
76
- const { classes, cx } = useStyles({
80
+ const { classes, cx, theme } = useStyles({
77
81
  size,
78
82
  fullWidth,
79
83
  color,
80
84
  radius,
81
85
  shouldAnimate: reduceMotion || !shouldAnimate,
82
86
  transitionDuration,
83
- transitionTimingFunction
87
+ transitionTimingFunction,
88
+ orientation
84
89
  }, { classNames, styles, name: "SegmentedControl" });
85
- const [activePosition, setActivePosition] = useState({ width: 0, translate: 0 });
90
+ const [activePosition, setActivePosition] = useState({
91
+ width: 0,
92
+ height: 0,
93
+ translate: [0, 0]
94
+ });
86
95
  const uuid = useUuid(name);
87
96
  const refs = useRef({});
88
97
  const [observerRef, containerRect] = useResizeObserver();
@@ -91,9 +100,17 @@ const SegmentedControl = forwardRef((_a, ref) => {
91
100
  const element = refs.current[_value];
92
101
  const elementRect = element.getBoundingClientRect();
93
102
  const scaledValue = element.offsetWidth / elementRect.width;
103
+ const width = elementRect.width * scaledValue || 0;
104
+ const height = elementRect.height * scaledValue || 0;
105
+ const offsetRight = containerRect.width - element.parentElement.offsetLeft + WRAPPER_PADDING - width;
106
+ const offsetLeft = element.parentElement.offsetLeft - WRAPPER_PADDING;
94
107
  setActivePosition({
95
- width: elementRect.width * scaledValue || 0,
96
- translate: element.parentElement.offsetLeft - WRAPPER_PADDING
108
+ width,
109
+ height,
110
+ translate: [
111
+ theme.dir === "rtl" ? offsetRight : offsetLeft,
112
+ element.parentElement.offsetTop - WRAPPER_PADDING
113
+ ]
97
114
  });
98
115
  }
99
116
  }, [_value, containerRect]);
@@ -105,6 +122,7 @@ const SegmentedControl = forwardRef((_a, ref) => {
105
122
  key: item.value
106
123
  }, /* @__PURE__ */ React.createElement("input", {
107
124
  className: classes.input,
125
+ disabled,
108
126
  type: "radio",
109
127
  name: uuid,
110
128
  value: item.value,
@@ -112,7 +130,10 @@ const SegmentedControl = forwardRef((_a, ref) => {
112
130
  checked: _value === item.value,
113
131
  onChange: () => handleValueChange(item.value)
114
132
  }), /* @__PURE__ */ React.createElement("label", {
115
- className: cx(classes.label, { [classes.labelActive]: _value === item.value }),
133
+ className: cx(classes.label, {
134
+ [classes.labelActive]: _value === item.value,
135
+ [classes.disabled]: disabled
136
+ }),
116
137
  htmlFor: `${uuid}-${item.value}`,
117
138
  ref: (node) => {
118
139
  refs.current[item.value] = node;
@@ -121,11 +142,13 @@ const SegmentedControl = forwardRef((_a, ref) => {
121
142
  return /* @__PURE__ */ React.createElement(Box, __spreadValues({
122
143
  className: cx(classes.root, className),
123
144
  ref: useMergedRef(observerRef, ref)
124
- }, others), !!_value && /* @__PURE__ */ React.createElement("span", {
145
+ }, others), !!_value && /* @__PURE__ */ React.createElement(Box, {
146
+ component: "span",
125
147
  className: classes.active,
126
- style: {
148
+ sx: {
127
149
  width: activePosition.width,
128
- transform: `translateX(${activePosition.translate}px)`
150
+ height: activePosition.height,
151
+ transform: `translate(${activePosition.translate[0]}px, ${activePosition.translate[1]}px )`
129
152
  }
130
153
  }), controls);
131
154
  });
@@ -1 +1 @@
1
- {"version":3,"file":"SegmentedControl.js","sources":["../../../src/components/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState, forwardRef } from 'react';\nimport {\n useReducedMotion,\n useResizeObserver,\n useUncontrolled,\n useUuid,\n useMergedRef,\n} 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 {\n value: string;\n label: React.ReactNode;\n}\n\nexport type SegmentedControlStylesNames = ClassNames<typeof useStyles>;\n\nexport interface SegmentedControlProps\n extends DefaultProps<SegmentedControlStylesNames>,\n Omit<React.ComponentPropsWithoutRef<'div'>, 'value' | 'onChange'> {\n /** Data based on which controls are rendered */\n data: string[] | SegmentedControlItem[];\n\n /** Current selected value */\n value?: string;\n\n /** Called when value changes */\n onChange?(value: string): 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 const SegmentedControl = forwardRef<HTMLDivElement, SegmentedControlProps>(\n (\n {\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 },\n ref\n ) => {\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 [observerRef, containerRect] = useResizeObserver();\n\n useEffect(() => {\n if (_value in refs.current && observerRef.current) {\n const element = refs.current[_value];\n const elementRect = element.getBoundingClientRect();\n const scaledValue = element.offsetWidth / elementRect.width;\n\n setActivePosition({\n width: elementRect.width * scaledValue || 0,\n translate: element.parentElement.offsetLeft - WRAPPER_PADDING,\n });\n }\n }, [_value, containerRect]);\n\n useEffect(() => {\n setShouldAnimate(true);\n }, []);\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={useMergedRef(observerRef, 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);\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, forwardRef } from 'react';\nimport {\n useReducedMotion,\n useResizeObserver,\n useUncontrolled,\n useUuid,\n useMergedRef,\n} 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 {\n value: string;\n label: React.ReactNode;\n}\n\nexport type SegmentedControlStylesNames = ClassNames<typeof useStyles>;\n\nexport interface SegmentedControlProps\n extends DefaultProps<SegmentedControlStylesNames>,\n Omit<React.ComponentPropsWithoutRef<'div'>, 'value' | 'onChange'> {\n /** Data based on which controls are rendered */\n data: string[] | SegmentedControlItem[];\n\n /** Current selected value */\n value?: string;\n\n /** Disabled input state */\n disabled?: boolean;\n\n /** Called when value changes */\n onChange?(value: string): 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 /** Display Vertically */\n orientation?: 'vertical' | 'horizontal';\n}\n\nexport const SegmentedControl = forwardRef<HTMLDivElement, SegmentedControlProps>(\n (\n {\n className,\n disabled = false,\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 orientation,\n ...others\n },\n ref\n ) => {\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, theme } = useStyles(\n {\n size,\n fullWidth,\n color,\n radius,\n shouldAnimate: reduceMotion || !shouldAnimate,\n transitionDuration,\n transitionTimingFunction,\n orientation,\n },\n { classNames, styles, name: 'SegmentedControl' }\n );\n\n const [activePosition, setActivePosition] = useState({\n width: 0,\n height: 0,\n translate: [0, 0],\n });\n const uuid = useUuid(name);\n const refs = useRef<Record<string, HTMLLabelElement>>({});\n const [observerRef, containerRect] = useResizeObserver();\n\n useEffect(() => {\n if (_value in refs.current && observerRef.current) {\n const element = refs.current[_value];\n const elementRect = element.getBoundingClientRect();\n const scaledValue = element.offsetWidth / elementRect.width;\n const width = elementRect.width * scaledValue || 0;\n const height = elementRect.height * scaledValue || 0;\n\n const offsetRight =\n containerRect.width - element.parentElement.offsetLeft + WRAPPER_PADDING - width;\n const offsetLeft = element.parentElement.offsetLeft - WRAPPER_PADDING;\n\n setActivePosition({\n width,\n height,\n translate: [\n theme.dir === 'rtl' ? offsetRight : offsetLeft,\n element.parentElement.offsetTop - WRAPPER_PADDING,\n ],\n });\n }\n }, [_value, containerRect]);\n\n useEffect(() => {\n setShouldAnimate(true);\n }, []);\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 disabled={disabled}\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, {\n [classes.labelActive]: _value === item.value,\n [classes.disabled]: disabled,\n })}\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={useMergedRef(observerRef, ref)} {...others}>\n {!!_value && (\n <Box\n component=\"span\"\n className={classes.active}\n sx={{\n width: activePosition.width,\n height: activePosition.height,\n transform: `translate(${activePosition.translate[0]}px, ${activePosition.translate[1]}px )`,\n }}\n />\n )}\n\n {controls}\n </Box>\n );\n }\n);\n\nSegmentedControl.displayName = '@mantine/core/SegmentedControl';\n"],"names":[],"mappings":"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"}