@pega/cosmos-react-core 4.0.0-dev.6.1 → 4.0.0-dev.8.0

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 (217) hide show
  1. package/lib/components/Backdrop/Backdrop.d.ts.map +1 -1
  2. package/lib/components/Backdrop/Backdrop.js +22 -2
  3. package/lib/components/Backdrop/Backdrop.js.map +1 -1
  4. package/lib/components/Banner/Banner.d.ts +9 -1
  5. package/lib/components/Banner/Banner.d.ts.map +1 -1
  6. package/lib/components/Banner/Banner.js +21 -10
  7. package/lib/components/Banner/Banner.js.map +1 -1
  8. package/lib/components/Banner/index.d.ts +1 -1
  9. package/lib/components/Banner/index.d.ts.map +1 -1
  10. package/lib/components/Banner/index.js.map +1 -1
  11. package/lib/components/Card/Card.d.ts +4 -7
  12. package/lib/components/Card/Card.d.ts.map +1 -1
  13. package/lib/components/Card/Card.js +2 -9
  14. package/lib/components/Card/Card.js.map +1 -1
  15. package/lib/components/Configuration/Configuration.d.ts +4 -1
  16. package/lib/components/Configuration/Configuration.d.ts.map +1 -1
  17. package/lib/components/Configuration/Configuration.js +2 -0
  18. package/lib/components/Configuration/Configuration.js.map +1 -1
  19. package/lib/components/DateTime/DateTime.types.d.ts +4 -1
  20. package/lib/components/DateTime/DateTime.types.d.ts.map +1 -1
  21. package/lib/components/DateTime/DateTime.types.js.map +1 -1
  22. package/lib/components/DateTime/Input/DateInput.d.ts.map +1 -1
  23. package/lib/components/DateTime/Input/DateInput.js +12 -1
  24. package/lib/components/DateTime/Input/DateInput.js.map +1 -1
  25. package/lib/components/DateTime/Input/DateRangeInput.d.ts +4 -2
  26. package/lib/components/DateTime/Input/DateRangeInput.d.ts.map +1 -1
  27. package/lib/components/DateTime/Input/DateRangeInput.js +71 -34
  28. package/lib/components/DateTime/Input/DateRangeInput.js.map +1 -1
  29. package/lib/components/DateTime/Input/DateTimeInput.d.ts.map +1 -1
  30. package/lib/components/DateTime/Input/DateTimeInput.js +19 -2
  31. package/lib/components/DateTime/Input/DateTimeInput.js.map +1 -1
  32. package/lib/components/DateTime/Input/PartInput.d.ts.map +1 -1
  33. package/lib/components/DateTime/Input/PartInput.js +2 -2
  34. package/lib/components/DateTime/Input/PartInput.js.map +1 -1
  35. package/lib/components/DateTime/Input/TimeInput.d.ts.map +1 -1
  36. package/lib/components/DateTime/Input/TimeInput.js +13 -2
  37. package/lib/components/DateTime/Input/TimeInput.js.map +1 -1
  38. package/lib/components/DateTime/Input/TimeRangeInput.d.ts +4 -2
  39. package/lib/components/DateTime/Input/TimeRangeInput.d.ts.map +1 -1
  40. package/lib/components/DateTime/Input/TimeRangeInput.js +70 -27
  41. package/lib/components/DateTime/Input/TimeRangeInput.js.map +1 -1
  42. package/lib/components/Dialog/FormDialog.d.ts.map +1 -1
  43. package/lib/components/Dialog/FormDialog.js +2 -6
  44. package/lib/components/Dialog/FormDialog.js.map +1 -1
  45. package/lib/components/Dialog/InfoDialog.d.ts.map +1 -1
  46. package/lib/components/Dialog/InfoDialog.js +2 -6
  47. package/lib/components/Dialog/InfoDialog.js.map +1 -1
  48. package/lib/components/FormControl/FormControl.d.ts +4 -0
  49. package/lib/components/FormControl/FormControl.d.ts.map +1 -1
  50. package/lib/components/FormControl/FormControl.js.map +1 -1
  51. package/lib/components/FormControl/index.d.ts +1 -0
  52. package/lib/components/FormControl/index.d.ts.map +1 -1
  53. package/lib/components/FormControl/index.js.map +1 -1
  54. package/lib/components/ListToolbar/ListToolbar.d.ts.map +1 -1
  55. package/lib/components/ListToolbar/ListToolbar.js +84 -66
  56. package/lib/components/ListToolbar/ListToolbar.js.map +1 -1
  57. package/lib/components/ListToolbar/ListToolbar.styles.d.ts +2 -0
  58. package/lib/components/ListToolbar/ListToolbar.styles.d.ts.map +1 -1
  59. package/lib/components/ListToolbar/ListToolbar.styles.js +37 -5
  60. package/lib/components/ListToolbar/ListToolbar.styles.js.map +1 -1
  61. package/lib/components/ListToolbar/ListToolbar.types.d.ts +4 -4
  62. package/lib/components/ListToolbar/ListToolbar.types.d.ts.map +1 -1
  63. package/lib/components/ListToolbar/ListToolbar.types.js.map +1 -1
  64. package/lib/components/LiveLog/Context.d.ts +3 -0
  65. package/lib/components/LiveLog/Context.d.ts.map +1 -0
  66. package/lib/components/LiveLog/Context.js +9 -0
  67. package/lib/components/LiveLog/Context.js.map +1 -0
  68. package/lib/components/LiveLog/LiveLog.d.ts +10 -0
  69. package/lib/components/LiveLog/LiveLog.d.ts.map +1 -0
  70. package/lib/components/LiveLog/LiveLog.js +99 -0
  71. package/lib/components/LiveLog/LiveLog.js.map +1 -0
  72. package/lib/components/LiveLog/LiveLog.styles.d.ts +3 -0
  73. package/lib/components/LiveLog/LiveLog.styles.d.ts.map +1 -0
  74. package/lib/components/LiveLog/LiveLog.styles.js +9 -0
  75. package/lib/components/LiveLog/LiveLog.styles.js.map +1 -0
  76. package/lib/components/LiveLog/LiveLog.types.d.ts +93 -0
  77. package/lib/components/LiveLog/LiveLog.types.d.ts.map +1 -0
  78. package/lib/components/LiveLog/LiveLog.types.js +2 -0
  79. package/lib/components/LiveLog/LiveLog.types.js.map +1 -0
  80. package/lib/components/LiveLog/index.d.ts +4 -0
  81. package/lib/components/LiveLog/index.d.ts.map +1 -0
  82. package/lib/components/LiveLog/index.js +3 -0
  83. package/lib/components/LiveLog/index.js.map +1 -0
  84. package/lib/components/Menu/Menu.d.ts.map +1 -1
  85. package/lib/components/Menu/Menu.js +2 -0
  86. package/lib/components/Menu/Menu.js.map +1 -1
  87. package/lib/components/Menu/MenuList.d.ts.map +1 -1
  88. package/lib/components/Menu/MenuList.js +4 -3
  89. package/lib/components/Menu/MenuList.js.map +1 -1
  90. package/lib/components/Modal/Modal.d.ts.map +1 -1
  91. package/lib/components/Modal/Modal.js +6 -8
  92. package/lib/components/Modal/Modal.js.map +1 -1
  93. package/lib/components/Modal/Modal.types.d.ts +1 -0
  94. package/lib/components/Modal/Modal.types.d.ts.map +1 -1
  95. package/lib/components/Modal/Modal.types.js.map +1 -1
  96. package/lib/components/Number/NumberInput.types.d.ts +3 -1
  97. package/lib/components/Number/NumberInput.types.d.ts.map +1 -1
  98. package/lib/components/Number/NumberInput.types.js.map +1 -1
  99. package/lib/components/Number/NumberRangeInput.d.ts.map +1 -1
  100. package/lib/components/Number/NumberRangeInput.js +71 -4
  101. package/lib/components/Number/NumberRangeInput.js.map +1 -1
  102. package/lib/components/PageTemplates/CategorySubPage.d.ts.map +1 -1
  103. package/lib/components/PageTemplates/CategorySubPage.js +14 -3
  104. package/lib/components/PageTemplates/CategorySubPage.js.map +1 -1
  105. package/lib/components/PageTemplates/CategorySubPage.styles.d.ts.map +1 -1
  106. package/lib/components/PageTemplates/CategorySubPage.styles.js +5 -0
  107. package/lib/components/PageTemplates/CategorySubPage.styles.js.map +1 -1
  108. package/lib/components/PageTemplates/DashboardPage.d.ts.map +1 -1
  109. package/lib/components/PageTemplates/DashboardPage.js +16 -2
  110. package/lib/components/PageTemplates/DashboardPage.js.map +1 -1
  111. package/lib/components/PageTemplates/PageTemplates.d.ts.map +1 -1
  112. package/lib/components/PageTemplates/PageTemplates.js +20 -3
  113. package/lib/components/PageTemplates/PageTemplates.js.map +1 -1
  114. package/lib/components/Popover/Popover.d.ts.map +1 -1
  115. package/lib/components/Popover/Popover.js +2 -5
  116. package/lib/components/Popover/Popover.js.map +1 -1
  117. package/lib/components/Popover/Popover.styles.d.ts +0 -1
  118. package/lib/components/Popover/Popover.styles.d.ts.map +1 -1
  119. package/lib/components/Popover/Popover.styles.js +0 -6
  120. package/lib/components/Popover/Popover.styles.js.map +1 -1
  121. package/lib/components/Popover/modifiers.d.ts +0 -2
  122. package/lib/components/Popover/modifiers.d.ts.map +1 -1
  123. package/lib/components/Popover/modifiers.js +1 -32
  124. package/lib/components/Popover/modifiers.js.map +1 -1
  125. package/lib/components/Progress/Progress.d.ts.map +1 -1
  126. package/lib/components/Progress/Progress.js +92 -50
  127. package/lib/components/Progress/Progress.js.map +1 -1
  128. package/lib/components/Progress/Progress.styles.d.ts.map +1 -1
  129. package/lib/components/Progress/Progress.styles.js +0 -1
  130. package/lib/components/Progress/Progress.styles.js.map +1 -1
  131. package/lib/components/Progress/Progress.types.d.ts +18 -6
  132. package/lib/components/Progress/Progress.types.d.ts.map +1 -1
  133. package/lib/components/Progress/Progress.types.js.map +1 -1
  134. package/lib/components/Progress/index.d.ts +1 -1
  135. package/lib/components/Progress/index.d.ts.map +1 -1
  136. package/lib/components/Progress/index.js.map +1 -1
  137. package/lib/components/QRCode/QRCode.d.ts +14 -0
  138. package/lib/components/QRCode/QRCode.d.ts.map +1 -0
  139. package/lib/components/QRCode/QRCode.js +39 -0
  140. package/lib/components/QRCode/QRCode.js.map +1 -0
  141. package/lib/components/QRCode/index.d.ts +3 -0
  142. package/lib/components/QRCode/index.d.ts.map +1 -0
  143. package/lib/components/QRCode/index.js +2 -0
  144. package/lib/components/QRCode/index.js.map +1 -0
  145. package/lib/components/SearchInput/SearchInput.d.ts.map +1 -1
  146. package/lib/components/SearchInput/SearchInput.js +27 -7
  147. package/lib/components/SearchInput/SearchInput.js.map +1 -1
  148. package/lib/components/Tabs/Tabs.d.ts.map +1 -1
  149. package/lib/components/Tabs/Tabs.js +6 -0
  150. package/lib/components/Tabs/Tabs.js.map +1 -1
  151. package/lib/components/Toaster/Context.d.ts +1 -0
  152. package/lib/components/Toaster/Context.d.ts.map +1 -1
  153. package/lib/components/Toaster/Context.js.map +1 -1
  154. package/lib/components/Toaster/Toaster.d.ts.map +1 -1
  155. package/lib/components/Toaster/Toaster.js +5 -1
  156. package/lib/components/Toaster/Toaster.js.map +1 -1
  157. package/lib/components/Tree/StandardTree.d.ts.map +1 -1
  158. package/lib/components/Tree/StandardTree.js +70 -27
  159. package/lib/components/Tree/StandardTree.js.map +1 -1
  160. package/lib/components/Tree/StandardTree.styles.d.ts +1 -0
  161. package/lib/components/Tree/StandardTree.styles.d.ts.map +1 -1
  162. package/lib/components/Tree/StandardTree.styles.js +32 -18
  163. package/lib/components/Tree/StandardTree.styles.js.map +1 -1
  164. package/lib/components/Tree/StandardTree.types.d.ts +27 -0
  165. package/lib/components/Tree/StandardTree.types.d.ts.map +1 -1
  166. package/lib/components/Tree/StandardTree.types.js.map +1 -1
  167. package/lib/components/Tree/helpers.d.ts +11 -9
  168. package/lib/components/Tree/helpers.d.ts.map +1 -1
  169. package/lib/components/Tree/helpers.js +25 -5
  170. package/lib/components/Tree/helpers.js.map +1 -1
  171. package/lib/components/Tree/index.d.ts +1 -1
  172. package/lib/components/Tree/index.d.ts.map +1 -1
  173. package/lib/components/Tree/index.js.map +1 -1
  174. package/lib/components/URL/URLDisplay.d.ts +2 -2
  175. package/lib/components/URL/URLDisplay.d.ts.map +1 -1
  176. package/lib/components/URL/URLDisplay.js +8 -1
  177. package/lib/components/URL/URLDisplay.js.map +1 -1
  178. package/lib/hooks/index.d.ts +1 -0
  179. package/lib/hooks/index.d.ts.map +1 -1
  180. package/lib/hooks/index.js +1 -0
  181. package/lib/hooks/index.js.map +1 -1
  182. package/lib/hooks/useArrows.d.ts.map +1 -1
  183. package/lib/hooks/useArrows.js +3 -3
  184. package/lib/hooks/useArrows.js.map +1 -1
  185. package/lib/hooks/useBreakpoint.d.ts.map +1 -1
  186. package/lib/hooks/useBreakpoint.js +3 -2
  187. package/lib/hooks/useBreakpoint.js.map +1 -1
  188. package/lib/hooks/useI18n.d.ts +43 -0
  189. package/lib/hooks/useI18n.d.ts.map +1 -1
  190. package/lib/hooks/useLiveLog.d.ts +8 -0
  191. package/lib/hooks/useLiveLog.d.ts.map +1 -0
  192. package/lib/hooks/useLiveLog.js +16 -0
  193. package/lib/hooks/useLiveLog.js.map +1 -0
  194. package/lib/i18n/default.d.ts +43 -0
  195. package/lib/i18n/default.d.ts.map +1 -1
  196. package/lib/i18n/default.js +50 -6
  197. package/lib/i18n/default.js.map +1 -1
  198. package/lib/i18n/i18n.d.ts +43 -0
  199. package/lib/i18n/i18n.d.ts.map +1 -1
  200. package/lib/index.d.ts +4 -0
  201. package/lib/index.d.ts.map +1 -1
  202. package/lib/index.js +4 -0
  203. package/lib/index.js.map +1 -1
  204. package/lib/register-contexts.js +2 -0
  205. package/lib/register-contexts.js.map +1 -1
  206. package/lib/theme/theme.d.ts +12 -0
  207. package/lib/theme/theme.d.ts.map +1 -1
  208. package/lib/theme/themeDefinition.json +8 -0
  209. package/lib/theme/themes/darkTheme.json +3 -1
  210. package/lib/types/types.d.ts +3 -0
  211. package/lib/types/types.d.ts.map +1 -1
  212. package/lib/types/types.js.map +1 -1
  213. package/package.json +3 -1
  214. package/lib/components/ListToolbar/QueryOptionPopover.d.ts +0 -12
  215. package/lib/components/ListToolbar/QueryOptionPopover.d.ts.map +0 -1
  216. package/lib/components/ListToolbar/QueryOptionPopover.js +0 -36
  217. package/lib/components/ListToolbar/QueryOptionPopover.js.map +0 -1
@@ -5,8 +5,7 @@ import { usePopper } from 'react-popper';
5
5
  import { useAfterInitialEffect, useConfiguration, useConsolidatedRef, useElement, useUID } from '../../hooks';
6
6
  import { windowIsAvailable } from '../../utils';
7
7
  import { PopoverManagerContext } from './PopoverContext';
8
- import { StyledPopover, StyledPopoverContent, StyledPopoverArrow } from './Popover.styles';
9
- import { applyMaxSize, maxSize } from './modifiers';
8
+ import { StyledPopover, StyledPopoverArrow } from './Popover.styles';
10
9
  const delays = {
11
10
  none: 0,
12
11
  short: 500,
@@ -44,8 +43,6 @@ const Popover = forwardRef(({ show = true, portal = false, target, placement, st
44
43
  tether: !modifiers.find(m => m.name === 'sameWidth')
45
44
  }
46
45
  },
47
- maxSize,
48
- applyMaxSize,
49
46
  ...modifiers
50
47
  ], [modifiers, arrow, hideOnTargetHidden]);
51
48
  const offset = useMemo(() => {
@@ -102,7 +99,7 @@ const Popover = forwardRef(({ show = true, portal = false, target, placement, st
102
99
  setShowPopover(false);
103
100
  }
104
101
  }, [groupId ? popovers[groupId] : undefined]);
105
- const content = (_jsxs(StyledPopover, { ...restProps, offset: offset, ref: popperRef, style: { ...style, ...styles.popper }, ...attributes.popper, children: [arrow && _jsx(StyledPopoverArrow, { ref: arrowRef, style: { ...styles.arrow } }), _jsx(StyledPopoverContent, { children: children })] }));
102
+ const content = (_jsxs(StyledPopover, { ...restProps, offset: offset, ref: popperRef, style: { ...style, ...styles.popper }, ...attributes.popper, children: [arrow && _jsx(StyledPopoverArrow, { ref: arrowRef, style: { ...styles.arrow } }), children] }));
106
103
  if (!target || !showPopover || (groupId && !checkActive(uid, groupId)))
107
104
  return null;
108
105
  return portal && portalTarget ? createPortal(content, portalTarget) : content;
@@ -1 +1 @@
1
- {"version":3,"file":"Popover.js","sourceRoot":"","sources":["../../../src/components/Popover/Popover.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n useContext,\n PropsWithoutRef,\n Ref,\n CSSProperties,\n ReactElement,\n useRef,\n ReactNode,\n useEffect,\n useMemo,\n useState\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { usePopper, PopperProps } from 'react-popper';\nimport { VirtualElement } from '@popperjs/core';\nimport { OffsetModifier } from '@popperjs/core/lib/modifiers/offset';\n\nimport { BaseProps, ForwardProps } from '../../types';\nimport {\n useAfterInitialEffect,\n useConfiguration,\n useConsolidatedRef,\n useElement,\n useUID\n} from '../../hooks';\nimport { windowIsAvailable } from '../../utils';\nimport { ConfigurationProps } from '../Configuration';\n\nimport { PopoverManagerContext } from './PopoverContext';\nimport { StyledPopover, StyledPopoverContent, StyledPopoverArrow } from './Popover.styles';\nimport { applyMaxSize, maxSize } from './modifiers';\n\nexport type Delay = 'none' | 'short' | 'long';\nexport interface PopoverProps<Modifiers extends string = string> extends BaseProps {\n /** The DOM element or [virtual element](https://popper.js.org/docs/v2/virtual-elements) that the Popover is positioned in reference to. */\n target: Element | VirtualElement | null;\n /**\n * If true, the Popover will be visible.\n * @default true\n */\n show?: boolean;\n /**\n * If true, the Popover will render outside of the current DOM hierarchy in a [portal](https://reactjs.org/docs/portals.html).\n * @default false\n */\n portal?: boolean | ConfigurationProps['portalTarget'];\n /**\n * Delay on showing the Popover.\n * @default \"none\"\n */\n showDelay?: Delay;\n /**\n * Delay on hiding the Popover.\n * @default \"none\"\n */\n hideDelay?: Delay;\n /**\n * [React Popper Placement](https://popper.js.org/react-popper/v2/render-props/#placement)\n */\n placement?: PopperProps<Modifiers>['placement'];\n /**\n * [React Popper Strategy](https://popper.js.org/react-popper/v2/render-props/#strategy)\n * @default \"absolute\"\n */\n strategy?: PopperProps<Modifiers>['strategy'];\n /**\n * [React Popper Modifiers](https://popper.js.org/react-popper/v2/render-props/#modifiers)\n * @default []\n */\n modifiers?: PopperProps<Modifiers>['modifiers'];\n /**\n * If true, an arrow will visually identify from which element the Popover is rendered.\n * @default false\n */\n arrow?: boolean;\n /** The group that the Popover belongs to. Popovers in the same group will be closed when others open. */\n groupId?: string;\n /**\n * If true, the Popover will be visibly hidden when its target leaves the viewport.\n * @default false\n */\n hideOnTargetHidden?: boolean;\n /** Callback that runs when the popover is hidden */\n onHide?: () => void;\n /** The content of the Popover. */\n children: ReactNode;\n /** The ref of the wrapping element. */\n ref?: Ref<HTMLDivElement>;\n}\n\nconst delays = {\n none: 0,\n short: 500,\n long: 1000\n};\n\nconst Popover: <Modifiers extends string = string>(\n props: PopoverProps<Modifiers> & ForwardProps\n) => ReactElement | null = forwardRef(\n (\n {\n show = true,\n portal = false,\n target,\n placement,\n strategy = 'fixed',\n style,\n modifiers = [],\n arrow = false,\n groupId,\n showDelay = 'none',\n hideDelay = 'none',\n hideOnTargetHidden = false,\n children,\n onHide,\n ...restProps\n }: PropsWithoutRef<PopoverProps> & { style?: CSSProperties },\n ref: PopoverProps['ref']\n ) => {\n const { portalTarget: configurationPortal } = useConfiguration();\n const { checkActive, setActive, popovers } = useContext(PopoverManagerContext);\n const [, setPopperEl] = useElement<HTMLDivElement>();\n const popperRef = useConsolidatedRef<HTMLDivElement>(ref, setPopperEl);\n const arrowRef = useRef<HTMLDivElement>(null);\n const forceUpdateRef = useRef<() => void>();\n const [showPopover, setShowPopover] = useState(show);\n const timeout = useRef<number>();\n const uid = useUID();\n\n const portalTarget = typeof portal === 'boolean' ? configurationPortal : portal;\n\n const memoedModifiers = useMemo(\n () => [\n {\n name: 'computeStyles',\n options: {\n gpuAcceleration: false\n }\n },\n {\n name: 'offset',\n options: {\n offset: [0, arrow ? 5.5 : 2]\n }\n },\n { name: 'hide', enabled: hideOnTargetHidden },\n { name: 'arrow', enabled: arrow, options: { element: arrowRef.current } },\n {\n name: 'preventOverflow',\n options: {\n tether: !modifiers.find(m => m.name === 'sameWidth')\n }\n },\n maxSize,\n applyMaxSize,\n ...modifiers\n ],\n [modifiers, arrow, hideOnTargetHidden]\n );\n\n const offset = useMemo(() => {\n const offsetModifier = [...memoedModifiers]\n .reverse()\n .find(m => m.name === 'offset' && m.enabled !== false) as OffsetModifier | undefined;\n return Array.isArray(offsetModifier?.options?.offset)\n ? offsetModifier?.options?.offset[1] ?? 0\n : 0;\n }, [memoedModifiers]);\n\n const { styles, attributes, forceUpdate } = usePopper(target, popperRef.current, {\n placement,\n strategy,\n modifiers: memoedModifiers\n });\n\n if (forceUpdate) forceUpdateRef.current = forceUpdate;\n\n useEffect(() => {\n const observer = new ResizeObserver(() => {\n forceUpdateRef.current?.();\n });\n\n if (popperRef.current) observer.observe(popperRef.current);\n if (target instanceof Element) observer.observe(target);\n\n return () => {\n observer.disconnect();\n };\n }, [forceUpdate, popperRef.current, target]);\n\n useEffect(() => {\n if (groupId && show) setActive(uid, groupId);\n\n if (windowIsAvailable) {\n if (timeout.current) clearTimeout(timeout.current);\n timeout.current = window.setTimeout(() => {\n setShowPopover(show);\n }, delays[show ? showDelay : hideDelay]);\n } else {\n setShowPopover(show);\n }\n }, [show]);\n\n useEffect(() => {\n return () => clearTimeout(timeout.current);\n }, []);\n\n useAfterInitialEffect(() => {\n if (!showPopover) {\n onHide?.();\n }\n }, [showPopover]);\n\n useEffect(() => {\n if (groupId && popovers[groupId] && popovers[groupId] !== uid) {\n setShowPopover(false);\n }\n }, [groupId ? popovers[groupId] : undefined]);\n\n const content = (\n <StyledPopover\n {...restProps}\n offset={offset}\n ref={popperRef}\n style={{ ...style, ...styles.popper }}\n {...attributes.popper}\n >\n {arrow && <StyledPopoverArrow ref={arrowRef} style={{ ...styles.arrow }} />}\n <StyledPopoverContent>{children}</StyledPopoverContent>\n </StyledPopover>\n );\n\n if (!target || !showPopover || (groupId && !checkActive(uid, groupId))) return null;\n\n return portal && portalTarget ? createPortal(content, portalTarget) : content;\n }\n);\n\nexport default Popover;\n"]}
1
+ {"version":3,"file":"Popover.js","sourceRoot":"","sources":["../../../src/components/Popover/Popover.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n useContext,\n PropsWithoutRef,\n Ref,\n CSSProperties,\n ReactElement,\n useRef,\n ReactNode,\n useEffect,\n useMemo,\n useState\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { usePopper, PopperProps } from 'react-popper';\nimport { VirtualElement } from '@popperjs/core';\nimport { OffsetModifier } from '@popperjs/core/lib/modifiers/offset';\n\nimport { BaseProps, ForwardProps } from '../../types';\nimport {\n useAfterInitialEffect,\n useConfiguration,\n useConsolidatedRef,\n useElement,\n useUID\n} from '../../hooks';\nimport { windowIsAvailable } from '../../utils';\nimport { ConfigurationProps } from '../Configuration';\n\nimport { PopoverManagerContext } from './PopoverContext';\nimport { StyledPopover, StyledPopoverArrow } from './Popover.styles';\n\nexport type Delay = 'none' | 'short' | 'long';\nexport interface PopoverProps<Modifiers extends string = string> extends BaseProps {\n /** The DOM element or [virtual element](https://popper.js.org/docs/v2/virtual-elements) that the Popover is positioned in reference to. */\n target: Element | VirtualElement | null;\n /**\n * If true, the Popover will be visible.\n * @default true\n */\n show?: boolean;\n /**\n * If true, the Popover will render outside of the current DOM hierarchy in a [portal](https://reactjs.org/docs/portals.html).\n * @default false\n */\n portal?: boolean | ConfigurationProps['portalTarget'];\n /**\n * Delay on showing the Popover.\n * @default \"none\"\n */\n showDelay?: Delay;\n /**\n * Delay on hiding the Popover.\n * @default \"none\"\n */\n hideDelay?: Delay;\n /**\n * [React Popper Placement](https://popper.js.org/react-popper/v2/render-props/#placement)\n */\n placement?: PopperProps<Modifiers>['placement'];\n /**\n * [React Popper Strategy](https://popper.js.org/react-popper/v2/render-props/#strategy)\n * @default \"absolute\"\n */\n strategy?: PopperProps<Modifiers>['strategy'];\n /**\n * [React Popper Modifiers](https://popper.js.org/react-popper/v2/render-props/#modifiers)\n * @default []\n */\n modifiers?: PopperProps<Modifiers>['modifiers'];\n /**\n * If true, an arrow will visually identify from which element the Popover is rendered.\n * @default false\n */\n arrow?: boolean;\n /** The group that the Popover belongs to. Popovers in the same group will be closed when others open. */\n groupId?: string;\n /**\n * If true, the Popover will be visibly hidden when its target leaves the viewport.\n * @default false\n */\n hideOnTargetHidden?: boolean;\n /** Callback that runs when the popover is hidden */\n onHide?: () => void;\n /** The content of the Popover. */\n children: ReactNode;\n /** The ref of the wrapping element. */\n ref?: Ref<HTMLDivElement>;\n}\n\nconst delays = {\n none: 0,\n short: 500,\n long: 1000\n};\n\nconst Popover: <Modifiers extends string = string>(\n props: PopoverProps<Modifiers> & ForwardProps\n) => ReactElement | null = forwardRef(\n (\n {\n show = true,\n portal = false,\n target,\n placement,\n strategy = 'fixed',\n style,\n modifiers = [],\n arrow = false,\n groupId,\n showDelay = 'none',\n hideDelay = 'none',\n hideOnTargetHidden = false,\n children,\n onHide,\n ...restProps\n }: PropsWithoutRef<PopoverProps> & { style?: CSSProperties },\n ref: PopoverProps['ref']\n ) => {\n const { portalTarget: configurationPortal } = useConfiguration();\n const { checkActive, setActive, popovers } = useContext(PopoverManagerContext);\n const [, setPopperEl] = useElement<HTMLDivElement>();\n const popperRef = useConsolidatedRef<HTMLDivElement>(ref, setPopperEl);\n const arrowRef = useRef<HTMLDivElement>(null);\n const forceUpdateRef = useRef<() => void>();\n const [showPopover, setShowPopover] = useState(show);\n const timeout = useRef<number>();\n const uid = useUID();\n\n const portalTarget = typeof portal === 'boolean' ? configurationPortal : portal;\n\n const memoedModifiers = useMemo(\n () => [\n {\n name: 'computeStyles',\n options: {\n gpuAcceleration: false\n }\n },\n {\n name: 'offset',\n options: {\n offset: [0, arrow ? 5.5 : 2]\n }\n },\n { name: 'hide', enabled: hideOnTargetHidden },\n { name: 'arrow', enabled: arrow, options: { element: arrowRef.current } },\n {\n name: 'preventOverflow',\n options: {\n tether: !modifiers.find(m => m.name === 'sameWidth')\n }\n },\n ...modifiers\n ],\n [modifiers, arrow, hideOnTargetHidden]\n );\n\n const offset = useMemo(() => {\n const offsetModifier = [...memoedModifiers]\n .reverse()\n .find(m => m.name === 'offset' && m.enabled !== false) as OffsetModifier | undefined;\n return Array.isArray(offsetModifier?.options?.offset)\n ? offsetModifier?.options?.offset[1] ?? 0\n : 0;\n }, [memoedModifiers]);\n\n const { styles, attributes, forceUpdate } = usePopper(target, popperRef.current, {\n placement,\n strategy,\n modifiers: memoedModifiers\n });\n\n if (forceUpdate) forceUpdateRef.current = forceUpdate;\n\n useEffect(() => {\n const observer = new ResizeObserver(() => {\n forceUpdateRef.current?.();\n });\n\n if (popperRef.current) observer.observe(popperRef.current);\n if (target instanceof Element) observer.observe(target);\n\n return () => {\n observer.disconnect();\n };\n }, [forceUpdate, popperRef.current, target]);\n\n useEffect(() => {\n if (groupId && show) setActive(uid, groupId);\n\n if (windowIsAvailable) {\n if (timeout.current) clearTimeout(timeout.current);\n timeout.current = window.setTimeout(() => {\n setShowPopover(show);\n }, delays[show ? showDelay : hideDelay]);\n } else {\n setShowPopover(show);\n }\n }, [show]);\n\n useEffect(() => {\n return () => clearTimeout(timeout.current);\n }, []);\n\n useAfterInitialEffect(() => {\n if (!showPopover) {\n onHide?.();\n }\n }, [showPopover]);\n\n useEffect(() => {\n if (groupId && popovers[groupId] && popovers[groupId] !== uid) {\n setShowPopover(false);\n }\n }, [groupId ? popovers[groupId] : undefined]);\n\n const content = (\n <StyledPopover\n {...restProps}\n offset={offset}\n ref={popperRef}\n style={{ ...style, ...styles.popper }}\n {...attributes.popper}\n >\n {arrow && <StyledPopoverArrow ref={arrowRef} style={{ ...styles.arrow }} />}\n {children}\n </StyledPopover>\n );\n\n if (!target || !showPopover || (groupId && !checkActive(uid, groupId))) return null;\n\n return portal && portalTarget ? createPortal(content, portalTarget) : content;\n }\n);\n\nexport default Popover;\n"]}
@@ -1,5 +1,4 @@
1
1
  export declare const StyledPopoverArrow: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
2
- export declare const StyledPopoverContent: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
3
2
  export declare const StyledPopover: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
4
3
  offset?: number | undefined;
5
4
  }, never>;
@@ -1 +1 @@
1
- {"version":3,"file":"Popover.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Popover/Popover.styles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,kBAAkB,yGAW9B,CAAC;AAIF,eAAO,MAAM,oBAAoB,yGAKhC,CAAC;AAEF,eAAO,MAAM,aAAa;;SA4GzB,CAAC"}
1
+ {"version":3,"file":"Popover.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Popover/Popover.styles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,kBAAkB,yGAW9B,CAAC;AAIF,eAAO,MAAM,aAAa;;SA4GzB,CAAC"}
@@ -13,12 +13,6 @@ export const StyledPopoverArrow = styled.div `
13
13
  }
14
14
  `;
15
15
  StyledPopoverArrow.defaultProps = defaultThemeProp;
16
- export const StyledPopoverContent = styled.div `
17
- max-width: inherit;
18
- max-height: inherit;
19
- border-radius: inherit;
20
- overflow: auto;
21
- `;
22
16
  export const StyledPopover = styled.div(({ theme: { base: { 'border-radius': borderRadius, 'z-index': { popover: zIndex }, shadow: { low } }, components: { card: { background }, 'form-control': { 'border-radius': formControlBorderRadius } } }, offset }) => {
23
17
  return css `
24
18
  /*
@@ -1 +1 @@
1
- {"version":3,"file":"Popover.styles.js","sourceRoot":"","sources":["../../../src/components/Popover/Popover.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;CAW3C,CAAC;AAEF,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEnD,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;CAK7C,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CACrC,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EACJ,eAAe,EAAE,YAAY,EAC7B,SAAS,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAC9B,MAAM,EAAE,EAAE,GAAG,EAAE,EAChB,EACD,UAAU,EAAE,EACV,IAAI,EAAE,EAAE,UAAU,EAAE,EACpB,cAAc,EAAE,EAAE,eAAe,EAAE,uBAAuB,EAAE,EAC7D,EACF,EACD,MAAM,EACP,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;;;;;;iBAMG,MAAM;0BACG,UAAU;4BACR,uBAAuB,MAAM,YAAY;oBACjD,GAAG;;;;;;;;YAQX,kBAAkB;;;;+CAIiB,YAAY;;;;;;;oBAOvC,MAAM;qBACL,MAAM;;;;;;;YAOf,kBAAkB;;;;2CAIa,YAAY;;;;;;;oBAOnC,MAAM;kBACR,MAAM;;;;;;;YAOZ,kBAAkB;;;;8CAIgB,YAAY;;;;;;;mBAOvC,MAAM;mBACN,MAAM;;;;;;;YAOb,kBAAkB;;;;4CAIc,YAAY;;;;;;;mBAOrC,MAAM;oBACL,MAAM;;;;;KAKrB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,aAAa,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\n\nexport const StyledPopoverArrow = styled.div`\n background-color: inherit;\n\n ::before {\n content: '';\n display: block;\n position: absolute;\n inset: -0.25rem;\n background-color: inherit;\n transform: rotate(45deg);\n }\n`;\n\nStyledPopoverArrow.defaultProps = defaultThemeProp;\n\nexport const StyledPopoverContent = styled.div`\n max-width: inherit;\n max-height: inherit;\n border-radius: inherit;\n overflow: auto;\n`;\n\nexport const StyledPopover = styled.div<{ offset?: number }>(\n ({\n theme: {\n base: {\n 'border-radius': borderRadius,\n 'z-index': { popover: zIndex },\n shadow: { low }\n },\n components: {\n card: { background },\n 'form-control': { 'border-radius': formControlBorderRadius }\n }\n },\n offset\n }) => {\n return css`\n /*\n Margin should never be used with Popper.\n https://popper.js.org/docs/v2/migration-guide/#4-remove-all-css-margins\n */\n margin: 0 !important;\n z-index: ${zIndex};\n background-color: ${background};\n border-radius: calc(${formControlBorderRadius} * ${borderRadius});\n box-shadow: ${low};\n\n &[data-popper-reference-hidden='true'] {\n visibility: hidden;\n pointer-events: none;\n }\n\n &[data-popper-placement^='top'] {\n > ${StyledPopoverArrow} {\n top: calc(100%);\n\n ::before {\n border-bottom-right-radius: calc(${borderRadius} / 4);\n }\n }\n\n ::before {\n content: '';\n position: absolute;\n height: ${offset}px;\n bottom: -${offset}px;\n left: 0;\n right: 0;\n }\n }\n\n &[data-popper-placement^='bottom'] {\n > ${StyledPopoverArrow} {\n bottom: calc(100%);\n\n ::before {\n border-top-left-radius: calc(${borderRadius} / 4);\n }\n }\n\n ::before {\n content: '';\n position: absolute;\n height: ${offset}px;\n top: -${offset}px;\n left: 0;\n right: 0;\n }\n }\n\n &[data-popper-placement^='right'] {\n > ${StyledPopoverArrow} {\n right: calc(100%);\n\n ::before {\n border-bottom-left-radius: calc(${borderRadius} / 4);\n }\n }\n\n ::before {\n content: '';\n position: absolute;\n width: ${offset}px;\n left: -${offset}px;\n top: 0;\n bottom: 0;\n }\n }\n\n &[data-popper-placement^='left'] {\n > ${StyledPopoverArrow} {\n left: calc(100%);\n\n ::before {\n border-top-right-radius: calc(${borderRadius} / 4);\n }\n }\n\n ::before {\n content: '';\n position: absolute;\n width: ${offset}px;\n right: -${offset}px;\n top: 0;\n bottom: 0;\n }\n }\n `;\n }\n);\n\nStyledPopover.defaultProps = defaultThemeProp;\n"]}
1
+ {"version":3,"file":"Popover.styles.js","sourceRoot":"","sources":["../../../src/components/Popover/Popover.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;CAW3C,CAAC;AAEF,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEnD,MAAM,CAAC,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CACrC,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EACJ,eAAe,EAAE,YAAY,EAC7B,SAAS,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAC9B,MAAM,EAAE,EAAE,GAAG,EAAE,EAChB,EACD,UAAU,EAAE,EACV,IAAI,EAAE,EAAE,UAAU,EAAE,EACpB,cAAc,EAAE,EAAE,eAAe,EAAE,uBAAuB,EAAE,EAC7D,EACF,EACD,MAAM,EACP,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;;;;;;iBAMG,MAAM;0BACG,UAAU;4BACR,uBAAuB,MAAM,YAAY;oBACjD,GAAG;;;;;;;;YAQX,kBAAkB;;;;+CAIiB,YAAY;;;;;;;oBAOvC,MAAM;qBACL,MAAM;;;;;;;YAOf,kBAAkB;;;;2CAIa,YAAY;;;;;;;oBAOnC,MAAM;kBACR,MAAM;;;;;;;YAOZ,kBAAkB;;;;8CAIgB,YAAY;;;;;;;mBAOvC,MAAM;mBACN,MAAM;;;;;;;YAOb,kBAAkB;;;;4CAIc,YAAY;;;;;;;mBAOrC,MAAM;oBACL,MAAM;;;;;KAKrB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,aAAa,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\n\nexport const StyledPopoverArrow = styled.div`\n background-color: inherit;\n\n ::before {\n content: '';\n display: block;\n position: absolute;\n inset: -0.25rem;\n background-color: inherit;\n transform: rotate(45deg);\n }\n`;\n\nStyledPopoverArrow.defaultProps = defaultThemeProp;\n\nexport const StyledPopover = styled.div<{ offset?: number }>(\n ({\n theme: {\n base: {\n 'border-radius': borderRadius,\n 'z-index': { popover: zIndex },\n shadow: { low }\n },\n components: {\n card: { background },\n 'form-control': { 'border-radius': formControlBorderRadius }\n }\n },\n offset\n }) => {\n return css`\n /*\n Margin should never be used with Popper.\n https://popper.js.org/docs/v2/migration-guide/#4-remove-all-css-margins\n */\n margin: 0 !important;\n z-index: ${zIndex};\n background-color: ${background};\n border-radius: calc(${formControlBorderRadius} * ${borderRadius});\n box-shadow: ${low};\n\n &[data-popper-reference-hidden='true'] {\n visibility: hidden;\n pointer-events: none;\n }\n\n &[data-popper-placement^='top'] {\n > ${StyledPopoverArrow} {\n top: calc(100%);\n\n ::before {\n border-bottom-right-radius: calc(${borderRadius} / 4);\n }\n }\n\n ::before {\n content: '';\n position: absolute;\n height: ${offset}px;\n bottom: -${offset}px;\n left: 0;\n right: 0;\n }\n }\n\n &[data-popper-placement^='bottom'] {\n > ${StyledPopoverArrow} {\n bottom: calc(100%);\n\n ::before {\n border-top-left-radius: calc(${borderRadius} / 4);\n }\n }\n\n ::before {\n content: '';\n position: absolute;\n height: ${offset}px;\n top: -${offset}px;\n left: 0;\n right: 0;\n }\n }\n\n &[data-popper-placement^='right'] {\n > ${StyledPopoverArrow} {\n right: calc(100%);\n\n ::before {\n border-bottom-left-radius: calc(${borderRadius} / 4);\n }\n }\n\n ::before {\n content: '';\n position: absolute;\n width: ${offset}px;\n left: -${offset}px;\n top: 0;\n bottom: 0;\n }\n }\n\n &[data-popper-placement^='left'] {\n > ${StyledPopoverArrow} {\n left: calc(100%);\n\n ::before {\n border-top-right-radius: calc(${borderRadius} / 4);\n }\n }\n\n ::before {\n content: '';\n position: absolute;\n width: ${offset}px;\n right: -${offset}px;\n top: 0;\n bottom: 0;\n }\n }\n `;\n }\n);\n\nStyledPopover.defaultProps = defaultThemeProp;\n"]}
@@ -1,5 +1,3 @@
1
1
  import { Modifier } from '@popperjs/core';
2
2
  export declare const sameWidth: Modifier<'sameWidth', object>;
3
- export declare const maxSize: Modifier<'maxSize', object>;
4
- export declare const applyMaxSize: Modifier<'applyMaxSize', object>;
5
3
  //# sourceMappingURL=modifiers.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"modifiers.d.ts","sourceRoot":"","sources":["../../../src/components/Popover/modifiers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAG1D,eAAO,MAAM,SAAS,EAAE,QAAQ,CAAC,WAAW,EAAE,MAAM,CAQlD,CAAC;AAGH,eAAO,MAAM,OAAO,EAAE,QAAQ,CAAC,SAAS,EAAE,MAAM,CAmB9C,CAAC;AAGH,eAAO,MAAM,YAAY,EAAE,QAAQ,CAAC,cAAc,EAAE,MAAM,CASxD,CAAC"}
1
+ {"version":3,"file":"modifiers.d.ts","sourceRoot":"","sources":["../../../src/components/Popover/modifiers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAG1C,eAAO,MAAM,SAAS,EAAE,QAAQ,CAAC,WAAW,EAAE,MAAM,CAQlD,CAAC"}
@@ -1,5 +1,4 @@
1
- import { detectOverflow } from '@popperjs/core';
2
- // taken from https://codesandbox.io/s/bitter-sky-pe3z9?file=/src/index.js
1
+ // eslint-disable-next-line import/prefer-default-export
3
2
  export const sameWidth = Object.freeze({
4
3
  name: 'sameWidth',
5
4
  enabled: true,
@@ -9,34 +8,4 @@ export const sameWidth = Object.freeze({
9
8
  },
10
9
  requires: ['computeStyles']
11
10
  });
12
- // taken from https://github.com/atomiks/popper.js/blob/master/src/modifiers/maxSize.js
13
- export const maxSize = Object.freeze({
14
- name: 'maxSize',
15
- enabled: true,
16
- phase: 'main',
17
- requiresIfExists: ['offset', 'preventOverflow', 'flip'],
18
- fn({ state, name, options }) {
19
- const overflow = detectOverflow(state, options);
20
- const { x, y } = state.modifiersData.preventOverflow || { x: 0, y: 0 };
21
- const { width, height } = state.rects.popper;
22
- const [basePlacement] = state.placement.split('-');
23
- const widthProp = basePlacement === 'left' ? 'left' : 'right';
24
- const heightProp = basePlacement === 'top' ? 'top' : 'bottom';
25
- state.modifiersData[name] = {
26
- width: width - overflow[widthProp] - x,
27
- height: height - overflow[heightProp] - y
28
- };
29
- }
30
- });
31
- // taken from https://codesandbox.io/s/great-tesla-3roz7?file=/src/index.js
32
- export const applyMaxSize = Object.freeze({
33
- name: 'applyMaxSize',
34
- enabled: true,
35
- phase: 'beforeWrite',
36
- requires: ['maxSize'],
37
- fn({ state }) {
38
- const { height } = state.modifiersData.maxSize;
39
- state.styles.popper.maxHeight = `${height}px`;
40
- }
41
- });
42
11
  //# sourceMappingURL=modifiers.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"modifiers.js","sourceRoot":"","sources":["../../../src/components/Popover/modifiers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAY,MAAM,gBAAgB,CAAC;AAE1D,0EAA0E;AAC1E,MAAM,CAAC,MAAM,SAAS,GAAkC,MAAM,CAAC,MAAM,CAAC;IACpE,IAAI,EAAE,WAAW;IACjB,OAAO,EAAE,IAAI;IACb,KAAK,EAAE,aAAa;IACpB,EAAE,CAAC,EAAE,KAAK,EAAE;QACV,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK,GAAG,GAAG,KAAK,CAAC,KAAK,CAAC,SAAS,CAAC,KAAK,IAAI,CAAC;IACjE,CAAC;IACD,QAAQ,EAAE,CAAC,eAAe,CAAC;CAC5B,CAAC,CAAC;AAEH,uFAAuF;AACvF,MAAM,CAAC,MAAM,OAAO,GAAgC,MAAM,CAAC,MAAM,CAAC;IAChE,IAAI,EAAE,SAAS;IACf,OAAO,EAAE,IAAI;IACb,KAAK,EAAE,MAAM;IACb,gBAAgB,EAAE,CAAC,QAAQ,EAAE,iBAAiB,EAAE,MAAM,CAAC;IACvD,EAAE,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE;QACzB,MAAM,QAAQ,GAAG,cAAc,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;QAChD,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,KAAK,CAAC,aAAa,CAAC,eAAe,IAAI,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC;QACvE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC;QAC7C,MAAM,CAAC,aAAa,CAAC,GAAG,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QAEnD,MAAM,SAAS,GAAG,aAAa,KAAK,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC;QAC9D,MAAM,UAAU,GAAG,aAAa,KAAK,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC;QAE9D,KAAK,CAAC,aAAa,CAAC,IAAI,CAAC,GAAG;YAC1B,KAAK,EAAE,KAAK,GAAG,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC;YACtC,MAAM,EAAE,MAAM,GAAG,QAAQ,CAAC,UAAU,CAAC,GAAG,CAAC;SAC1C,CAAC;IACJ,CAAC;CACF,CAAC,CAAC;AAEH,2EAA2E;AAC3E,MAAM,CAAC,MAAM,YAAY,GAAqC,MAAM,CAAC,MAAM,CAAC;IAC1E,IAAI,EAAE,cAAc;IACpB,OAAO,EAAE,IAAI;IACb,KAAK,EAAE,aAAa;IACpB,QAAQ,EAAE,CAAC,SAAS,CAAC;IACrB,EAAE,CAAC,EAAE,KAAK,EAAE;QACV,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC,aAAa,CAAC,OAAO,CAAC;QAC/C,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,SAAS,GAAG,GAAG,MAAM,IAAI,CAAC;IAChD,CAAC;CACF,CAAC,CAAC","sourcesContent":["import { detectOverflow, Modifier } from '@popperjs/core';\n\n// taken from https://codesandbox.io/s/bitter-sky-pe3z9?file=/src/index.js\nexport const sameWidth: Modifier<'sameWidth', object> = Object.freeze({\n name: 'sameWidth',\n enabled: true,\n phase: 'beforeWrite',\n fn({ state }) {\n state.styles.popper.width = `${state.rects.reference.width}px`;\n },\n requires: ['computeStyles']\n});\n\n// taken from https://github.com/atomiks/popper.js/blob/master/src/modifiers/maxSize.js\nexport const maxSize: Modifier<'maxSize', object> = Object.freeze({\n name: 'maxSize',\n enabled: true,\n phase: 'main',\n requiresIfExists: ['offset', 'preventOverflow', 'flip'],\n fn({ state, name, options }) {\n const overflow = detectOverflow(state, options);\n const { x, y } = state.modifiersData.preventOverflow || { x: 0, y: 0 };\n const { width, height } = state.rects.popper;\n const [basePlacement] = state.placement.split('-');\n\n const widthProp = basePlacement === 'left' ? 'left' : 'right';\n const heightProp = basePlacement === 'top' ? 'top' : 'bottom';\n\n state.modifiersData[name] = {\n width: width - overflow[widthProp] - x,\n height: height - overflow[heightProp] - y\n };\n }\n});\n\n// taken from https://codesandbox.io/s/great-tesla-3roz7?file=/src/index.js\nexport const applyMaxSize: Modifier<'applyMaxSize', object> = Object.freeze({\n name: 'applyMaxSize',\n enabled: true,\n phase: 'beforeWrite',\n requires: ['maxSize'],\n fn({ state }) {\n const { height } = state.modifiersData.maxSize;\n state.styles.popper.maxHeight = `${height}px`;\n }\n});\n"]}
1
+ {"version":3,"file":"modifiers.js","sourceRoot":"","sources":["../../../src/components/Popover/modifiers.ts"],"names":[],"mappings":"AAEA,wDAAwD;AACxD,MAAM,CAAC,MAAM,SAAS,GAAkC,MAAM,CAAC,MAAM,CAAC;IACpE,IAAI,EAAE,WAAW;IACjB,OAAO,EAAE,IAAI;IACb,KAAK,EAAE,aAAa;IACpB,EAAE,CAAC,EAAE,KAAK,EAAE;QACV,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK,GAAG,GAAG,KAAK,CAAC,KAAK,CAAC,SAAS,CAAC,KAAK,IAAI,CAAC;IACjE,CAAC;IACD,QAAQ,EAAE,CAAC,eAAe,CAAC;CAC5B,CAAC,CAAC","sourcesContent":["import { Modifier } from '@popperjs/core';\n\n// eslint-disable-next-line import/prefer-default-export\nexport const sameWidth: Modifier<'sameWidth', object> = Object.freeze({\n name: 'sameWidth',\n enabled: true,\n phase: 'beforeWrite',\n fn({ state }) {\n state.styles.popper.width = `${state.rects.reference.width}px`;\n },\n requires: ['computeStyles']\n});\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"Progress.d.ts","sourceRoot":"","sources":["../../../src/components/Progress/Progress.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,EAAE,EAKH,MAAM,OAAO,CAAC;AAGf,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAM3C,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAMjD,QAAA,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,GAAG,YAAY,CA4H9C,CAAC;AAEF,eAAe,QAAQ,CAAC"}
1
+ {"version":3,"file":"Progress.d.ts","sourceRoot":"","sources":["../../../src/components/Progress/Progress.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA+B,EAAE,EAA+B,MAAM,OAAO,CAAC;AAGrF,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAM3C,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAejD,QAAA,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,GAAG,YAAY,CA+K9C,CAAC;AAEF,eAAe,QAAQ,CAAC"}
@@ -1,78 +1,120 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { forwardRef, useState, useEffect, useImperativeHandle, useRef } from 'react';
2
+ import { forwardRef, useState, useEffect, useRef } from 'react';
3
3
  import { createPortal } from 'react-dom';
4
4
  import Backdrop from '../Backdrop';
5
5
  import Text from '../Text';
6
- import { useConfiguration, useConsolidatedRef, useI18n } from '../../hooks';
6
+ import { useConfiguration, useConsolidatedRef, useI18n, useLiveLog } from '../../hooks';
7
7
  import Flex from '../Flex';
8
8
  import Bar from './Bar';
9
9
  import Ellipsis from './Ellipsis';
10
10
  import Ring from './Ring';
11
11
  import { StyledMessage, StyledProgress } from './Progress.styles';
12
- const Progress = forwardRef(({ variant = 'ring', placement = 'global', visible = true, onTransitionEndIn, onTransitionEndOut, value, message, handle, ...restProps }, ref) => {
12
+ const variantMap = {
13
+ ring: Ring,
14
+ bar: Bar,
15
+ ellipsis: Ellipsis
16
+ };
17
+ const delayDuration = 100;
18
+ const minVisibleDuration = 1000;
19
+ const Progress = forwardRef(({ variant = 'ring', placement = 'global', visible: visibleProp = true, focusOnVisible = false, delay = false, onTransitionEndIn, onTransitionEndOut, value, message, liveConfig, ...restProps }, ref) => {
13
20
  const t = useI18n();
14
- const [isVisible, setIsVisible] = useState(visible);
15
- const [isNull, setIsNull] = useState(!visible);
16
21
  const { portalTarget } = useConfiguration();
22
+ const { announcePolite } = useLiveLog();
17
23
  const progressEl = useConsolidatedRef(ref);
18
- const showTime = useRef();
19
- const showTimeout = useRef();
20
- const hideTimeout = useRef();
21
- let Comp = Ring;
22
- if (variant === 'bar')
23
- Comp = Bar;
24
- else if (variant === 'ellipsis')
25
- Comp = Ellipsis;
26
- const onBackdropTransitionEnd = () => {
27
- setIsNull(true);
28
- onTransitionEndOut?.();
24
+ // Rendering states. Both are needed due to Backdrop's transition phase where isVisibleState is false but nullRender is true until onAfterTransitionOut.
25
+ const [isVisibleState, setIsVisibleState] = useState(delay ? false : visibleProp);
26
+ const [nullRender, setNullRender] = useState(!isVisibleState);
27
+ // Refs for timestamps and timeout ids.
28
+ const timeBeforeVisibleRender = useRef();
29
+ const timeAfterVisibleRender = useRef();
30
+ const delayTimer = useRef();
31
+ const minVisibleTimer = useRef();
32
+ const hasBackdrop = placement === 'global' || placement === 'local';
33
+ const valString = typeof value === 'number' ? `${value}%` : undefined;
34
+ const label = message && valString ? `${message} - ${valString}` : message || valString;
35
+ const renderVisible = () => {
36
+ setIsVisibleState(true);
37
+ setNullRender(false);
29
38
  };
30
- useImperativeHandle(handle, () => ({
31
- focus: () => {
32
- progressEl.current?.focus();
39
+ const renderNotVisible = () => {
40
+ setIsVisibleState(false);
41
+ // With a transition, setNullRender needs to be called in Backdrop's onAfterTransitionOut.
42
+ if (!hasBackdrop) {
43
+ setNullRender(true);
33
44
  }
34
- }));
45
+ };
46
+ // Handle render and visible state.
35
47
  useEffect(() => {
36
- if (visible) {
37
- clearTimeout(hideTimeout.current);
38
- showTime.current = Date.now();
39
- showTimeout.current = window.setTimeout(() => {
40
- setIsVisible(true);
41
- setIsNull(false);
42
- }, 100);
48
+ if (visibleProp) {
49
+ // Capture a timestamp for additional timers.
50
+ timeBeforeVisibleRender.current = Date.now();
51
+ if (delay) {
52
+ delayTimer.current = window.setTimeout(renderVisible, delayDuration);
53
+ }
54
+ else {
55
+ renderVisible();
56
+ }
43
57
  }
44
- else {
45
- clearTimeout(showTimeout.current);
46
- if (typeof showTime.current === 'number') {
47
- const minimumDuration = 1000;
48
- const timeElapsed = Date.now() - showTime.current;
49
- if (timeElapsed > minimumDuration)
50
- setIsVisible(false);
58
+ else if (
59
+ // A timer was started to render visible either avoid it or render null.
60
+ delayTimer.current !== undefined) {
61
+ // If a timeout has started to render visible, clear it.
62
+ clearTimeout(delayTimer.current);
63
+ // If the indicator has already rendered visible.
64
+ if (timeAfterVisibleRender.current !== undefined) {
65
+ const timeElapsedSinceLastVisibleRender = Date.now() - timeAfterVisibleRender.current;
66
+ // If the indicator has been visible for long enough we can remove it.
67
+ if (timeElapsedSinceLastVisibleRender >= minVisibleDuration) {
68
+ renderNotVisible();
69
+ }
51
70
  else {
52
- hideTimeout.current = window.setTimeout(() => {
53
- setIsVisible(false);
54
- }, minimumDuration - timeElapsed);
71
+ // Hold off removing until we hit the minimum visible time.
72
+ minVisibleTimer.current = window.setTimeout(renderNotVisible, minVisibleDuration - timeElapsedSinceLastVisibleRender);
55
73
  }
56
74
  }
57
- else
58
- setIsVisible(false);
75
+ else {
76
+ renderNotVisible();
77
+ }
59
78
  }
60
- }, [visible]);
79
+ else {
80
+ renderNotVisible();
81
+ }
82
+ },
83
+ // visibleProp is the only triggerable dependency. Others values will be captured.
84
+ [visibleProp]);
85
+ // Live announcement
86
+ useEffect(() => {
87
+ if (liveConfig?.contextualLabel && isVisibleState) {
88
+ announcePolite({
89
+ message: `${liveConfig.contextualLabel}, ${label ?? t('loading')}`,
90
+ type: 'status'
91
+ });
92
+ }
93
+ },
94
+ // isVisibleState is the only triggerable dependency. Others values will be captured.
95
+ [isVisibleState]);
96
+ // Auto focusing and render timestamping.
61
97
  useEffect(() => {
62
- return () => {
63
- clearTimeout(showTimeout.current);
64
- clearTimeout(hideTimeout.current);
65
- };
66
- }, []);
67
- if (isNull)
98
+ if (!nullRender && isVisibleState) {
99
+ // After a visible render set a timestamp for timers above.
100
+ timeAfterVisibleRender.current = Date.now();
101
+ if (focusOnVisible)
102
+ progressEl.current?.focus();
103
+ }
104
+ },
105
+ // nullRender is the only triggerable dependency. Others values will be captured.
106
+ [nullRender]);
107
+ if (nullRender)
68
108
  return null;
69
- const valString = typeof value === 'number' ? `${value}%` : undefined;
70
- const label = message && valString ? `${message} - ${valString}` : message || valString;
71
- let indicator = (_jsx(Comp, { "aria-label": typeof value !== 'number' ? label : t('loading'), ...restProps, placement: placement, value: value, "aria-valuetext": typeof value === 'number' ? label : undefined, ref: progressEl, tabIndex: -1 }));
109
+ const CompVariant = variantMap[variant];
110
+ let indicator = (_jsx(CompVariant, { "aria-label": typeof value !== 'number' ? label : t('loading'), ...restProps, placement: placement, value: value, "aria-valuetext": typeof value === 'number' ? label : undefined, ref: progressEl, tabIndex: -1 }));
72
111
  if (placement !== 'inline') {
73
112
  indicator = (_jsxs(Flex, { container: { direction: 'column', alignItems: 'center', gap: 0.5 }, as: StyledProgress, placement: placement, children: [indicator, message && (_jsx(Text, { as: StyledMessage, variant: 'secondary', "aria-hidden": 'true', children: message }))] }));
74
113
  }
75
- const content = placement === 'block' || placement === 'inline' ? (indicator) : (_jsx(Backdrop, { open: isVisible, container: { direction: 'column' }, position: placement === 'global' ? 'fixed' : 'absolute', variant: 'light', alpha: 0.5, onAfterTransitionIn: onTransitionEndIn, onAfterTransitionOut: onBackdropTransitionEnd, children: indicator }));
114
+ const content = hasBackdrop ? (_jsx(Backdrop, { open: isVisibleState, container: { direction: 'column' }, position: placement === 'global' ? 'fixed' : 'absolute', variant: 'light', alpha: 0.5, onAfterTransitionIn: onTransitionEndIn, onAfterTransitionOut: () => {
115
+ setNullRender(true);
116
+ onTransitionEndOut?.();
117
+ }, children: indicator })) : (indicator);
76
118
  return placement === 'global' && portalTarget ? createPortal(content, portalTarget) : content;
77
119
  });
78
120
  export default Progress;
@@ -1 +1 @@
1
- {"version":3,"file":"Progress.js","sourceRoot":"","sources":["../../../src/components/Progress/Progress.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n PropsWithoutRef,\n FC,\n useState,\n useEffect,\n useImperativeHandle,\n useRef\n} from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { ForwardProps } from '../../types';\nimport Backdrop from '../Backdrop';\nimport Text from '../Text';\nimport { useConfiguration, useConsolidatedRef, useI18n } from '../../hooks';\nimport Flex from '../Flex';\n\nimport { ProgressProps } from './Progress.types';\nimport Bar from './Bar';\nimport Ellipsis from './Ellipsis';\nimport Ring from './Ring';\nimport { StyledMessage, StyledProgress } from './Progress.styles';\n\nconst Progress: FC<ProgressProps & ForwardProps> = forwardRef(\n (\n {\n variant = 'ring',\n placement = 'global',\n visible = true,\n onTransitionEndIn,\n onTransitionEndOut,\n value,\n message,\n handle,\n ...restProps\n }: PropsWithoutRef<ProgressProps>,\n ref: ProgressProps['ref']\n ) => {\n const t = useI18n();\n const [isVisible, setIsVisible] = useState(visible);\n const [isNull, setIsNull] = useState(!visible);\n const { portalTarget } = useConfiguration();\n const progressEl = useConsolidatedRef<HTMLDivElement>(ref);\n const showTime = useRef<number>();\n const showTimeout = useRef<number>();\n const hideTimeout = useRef<number>();\n\n let Comp = Ring;\n if (variant === 'bar') Comp = Bar;\n else if (variant === 'ellipsis') Comp = Ellipsis;\n\n const onBackdropTransitionEnd = () => {\n setIsNull(true);\n onTransitionEndOut?.();\n };\n\n useImperativeHandle(handle, () => ({\n focus: () => {\n progressEl.current?.focus();\n }\n }));\n\n useEffect(() => {\n if (visible) {\n clearTimeout(hideTimeout.current);\n showTime.current = Date.now();\n showTimeout.current = window.setTimeout(() => {\n setIsVisible(true);\n setIsNull(false);\n }, 100);\n } else {\n clearTimeout(showTimeout.current);\n\n if (typeof showTime.current === 'number') {\n const minimumDuration = 1000;\n const timeElapsed = Date.now() - showTime.current;\n\n if (timeElapsed > minimumDuration) setIsVisible(false);\n else {\n hideTimeout.current = window.setTimeout(() => {\n setIsVisible(false);\n }, minimumDuration - timeElapsed);\n }\n } else setIsVisible(false);\n }\n }, [visible]);\n\n useEffect(() => {\n return () => {\n clearTimeout(showTimeout.current);\n clearTimeout(hideTimeout.current);\n };\n }, []);\n\n if (isNull) return null;\n\n const valString = typeof value === 'number' ? `${value}%` : undefined;\n const label = message && valString ? `${message} - ${valString}` : message || valString;\n\n let indicator = (\n <Comp\n aria-label={typeof value !== 'number' ? label : t('loading')}\n {...restProps}\n placement={placement}\n value={value}\n aria-valuetext={typeof value === 'number' ? label : undefined}\n ref={progressEl}\n tabIndex={-1}\n />\n );\n\n if (placement !== 'inline') {\n indicator = (\n <Flex\n container={{ direction: 'column', alignItems: 'center', gap: 0.5 }}\n as={StyledProgress}\n placement={placement}\n >\n {indicator}\n {message && (\n <Text as={StyledMessage} variant='secondary' aria-hidden='true'>\n {message}\n </Text>\n )}\n </Flex>\n );\n }\n\n const content =\n placement === 'block' || placement === 'inline' ? (\n indicator\n ) : (\n <Backdrop\n open={isVisible}\n container={{ direction: 'column' }}\n position={placement === 'global' ? 'fixed' : 'absolute'}\n variant='light'\n alpha={0.5}\n onAfterTransitionIn={onTransitionEndIn}\n onAfterTransitionOut={onBackdropTransitionEnd}\n >\n {indicator}\n </Backdrop>\n );\n\n return placement === 'global' && portalTarget ? createPortal(content, portalTarget) : content;\n }\n);\n\nexport default Progress;\n"]}
1
+ {"version":3,"file":"Progress.js","sourceRoot":"","sources":["../../../src/components/Progress/Progress.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, PropsWithoutRef, FC, useState, useEffect, useRef } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { ForwardProps } from '../../types';\nimport Backdrop from '../Backdrop';\nimport Text from '../Text';\nimport { useConfiguration, useConsolidatedRef, useI18n, useLiveLog } from '../../hooks';\nimport Flex from '../Flex';\n\nimport { ProgressProps } from './Progress.types';\nimport Bar from './Bar';\nimport Ellipsis from './Ellipsis';\nimport Ring from './Ring';\nimport { StyledMessage, StyledProgress } from './Progress.styles';\n\nconst variantMap = {\n ring: Ring,\n bar: Bar,\n ellipsis: Ellipsis\n} as const;\n\nconst delayDuration = 100;\nconst minVisibleDuration = 1000;\n\nconst Progress: FC<ProgressProps & ForwardProps> = forwardRef(\n (\n {\n variant = 'ring',\n placement = 'global',\n visible: visibleProp = true,\n focusOnVisible = false,\n delay = false,\n onTransitionEndIn,\n onTransitionEndOut,\n value,\n message,\n liveConfig,\n ...restProps\n }: PropsWithoutRef<ProgressProps>,\n ref: ProgressProps['ref']\n ) => {\n const t = useI18n();\n const { portalTarget } = useConfiguration();\n const { announcePolite } = useLiveLog();\n const progressEl = useConsolidatedRef<HTMLDivElement>(ref);\n\n // Rendering states. Both are needed due to Backdrop's transition phase where isVisibleState is false but nullRender is true until onAfterTransitionOut.\n const [isVisibleState, setIsVisibleState] = useState(delay ? false : visibleProp);\n const [nullRender, setNullRender] = useState(!isVisibleState);\n\n // Refs for timestamps and timeout ids.\n const timeBeforeVisibleRender = useRef<number>();\n const timeAfterVisibleRender = useRef<number>();\n const delayTimer = useRef<number>();\n const minVisibleTimer = useRef<number>();\n\n const hasBackdrop = placement === 'global' || placement === 'local';\n const valString = typeof value === 'number' ? `${value}%` : undefined;\n const label = message && valString ? `${message} - ${valString}` : message || valString;\n\n const renderVisible = () => {\n setIsVisibleState(true);\n setNullRender(false);\n };\n\n const renderNotVisible = () => {\n setIsVisibleState(false);\n // With a transition, setNullRender needs to be called in Backdrop's onAfterTransitionOut.\n if (!hasBackdrop) {\n setNullRender(true);\n }\n };\n\n // Handle render and visible state.\n useEffect(\n () => {\n if (visibleProp) {\n // Capture a timestamp for additional timers.\n timeBeforeVisibleRender.current = Date.now();\n\n if (delay) {\n delayTimer.current = window.setTimeout(renderVisible, delayDuration);\n } else {\n renderVisible();\n }\n } else if (\n // A timer was started to render visible either avoid it or render null.\n delayTimer.current !== undefined\n ) {\n // If a timeout has started to render visible, clear it.\n clearTimeout(delayTimer.current);\n\n // If the indicator has already rendered visible.\n if (timeAfterVisibleRender.current !== undefined) {\n const timeElapsedSinceLastVisibleRender = Date.now() - timeAfterVisibleRender.current;\n\n // If the indicator has been visible for long enough we can remove it.\n if (timeElapsedSinceLastVisibleRender >= minVisibleDuration) {\n renderNotVisible();\n } else {\n // Hold off removing until we hit the minimum visible time.\n minVisibleTimer.current = window.setTimeout(\n renderNotVisible,\n minVisibleDuration - timeElapsedSinceLastVisibleRender\n );\n }\n } else {\n renderNotVisible();\n }\n } else {\n renderNotVisible();\n }\n },\n // visibleProp is the only triggerable dependency. Others values will be captured.\n [visibleProp]\n );\n\n // Live announcement\n useEffect(\n () => {\n if (liveConfig?.contextualLabel && isVisibleState) {\n announcePolite({\n message: `${liveConfig.contextualLabel}, ${label ?? t('loading')}`,\n type: 'status'\n });\n }\n },\n // isVisibleState is the only triggerable dependency. Others values will be captured.\n [isVisibleState]\n );\n\n // Auto focusing and render timestamping.\n useEffect(\n () => {\n if (!nullRender && isVisibleState) {\n // After a visible render set a timestamp for timers above.\n timeAfterVisibleRender.current = Date.now();\n\n if (focusOnVisible) progressEl.current?.focus();\n }\n },\n // nullRender is the only triggerable dependency. Others values will be captured.\n [nullRender]\n );\n\n if (nullRender) return null;\n\n const CompVariant = variantMap[variant];\n\n let indicator = (\n <CompVariant\n aria-label={typeof value !== 'number' ? label : t('loading')}\n {...restProps}\n placement={placement}\n value={value}\n aria-valuetext={typeof value === 'number' ? label : undefined}\n ref={progressEl}\n tabIndex={-1}\n />\n );\n\n if (placement !== 'inline') {\n indicator = (\n <Flex\n container={{ direction: 'column', alignItems: 'center', gap: 0.5 }}\n as={StyledProgress}\n placement={placement}\n >\n {indicator}\n {message && (\n <Text as={StyledMessage} variant='secondary' aria-hidden='true'>\n {message}\n </Text>\n )}\n </Flex>\n );\n }\n\n const content = hasBackdrop ? (\n <Backdrop\n open={isVisibleState}\n container={{ direction: 'column' }}\n position={placement === 'global' ? 'fixed' : 'absolute'}\n variant='light'\n alpha={0.5}\n onAfterTransitionIn={onTransitionEndIn}\n onAfterTransitionOut={() => {\n setNullRender(true);\n onTransitionEndOut?.();\n }}\n >\n {indicator}\n </Backdrop>\n ) : (\n indicator\n );\n\n return placement === 'global' && portalTarget ? createPortal(content, portalTarget) : content;\n }\n);\n\nexport default Progress;\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"Progress.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Progress/Progress.styles.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAcjD,eAAO,MAAM,kBAAkB;iBACqB,OAAO;SAkDzD,CAAC;AAIH,eAAO,MAAM,iBAAiB;iBACG,OAAO;SAmDtC,CAAC;AAIH,eAAO,MAAM,sBAAsB,uIAuEjC,CAAC;AAIH,eAAO,MAAM,aAAa,0GAexB,CAAC;AAIH,eAAO,MAAM,cAAc,+NAc1B,CAAC"}
1
+ {"version":3,"file":"Progress.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Progress/Progress.styles.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAcjD,eAAO,MAAM,kBAAkB;iBACqB,OAAO;SAkDzD,CAAC;AAIH,eAAO,MAAM,iBAAiB;iBACG,OAAO;SAmDtC,CAAC;AAIH,eAAO,MAAM,sBAAsB,uIAsEjC,CAAC;AAIH,eAAO,MAAM,aAAa,0GAexB,CAAC;AAIH,eAAO,MAAM,cAAc,+NAc1B,CAAC"}
@@ -146,7 +146,6 @@ export const StyledProgressEllipsis = styled(StyledProgressVisual)(({ theme, pla
146
146
  ${placement === 'inline' &&
147
147
  css `
148
148
  display: inline-flex;
149
- margin-inline-start: 0.1875rem;
150
149
  `}
151
150
  }
152
151
 
@@ -1 +1 @@
1
- {"version":3,"file":"Progress.styles.js","sourceRoot":"","sources":["../../../src/components/Progress/Progress.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import { rgba, readableColor } from 'polished';\nimport styled, { css } from 'styled-components';\n\nimport { calculateFontSize, FontSize } from '../../styles';\nimport { defaultThemeProp } from '../../theme';\nimport { tryCatch } from '../../utils';\nimport Flex from '../Flex';\n\nimport { ProgressProps } from './Progress.types';\n\nconst StyledProgressVisual = styled.div(({ theme }) => {\n return css`\n &:focus-visible {\n box-shadow: ${theme.components.button['focus-shadow']};\n outline: none;\n border-radius: calc(9999 * ${theme.base['border-radius']});\n }\n `;\n});\n\nStyledProgressVisual.defaultProps = defaultThemeProp;\n\nexport const StyledProgressRing = styled(StyledProgressVisual)<\n Pick<ProgressProps, 'placement'> & { determinate: boolean }\n>(({ theme, placement, determinate }) => {\n const size = placement === 'inline' ? '1em' : '2rem';\n\n return css`\n @keyframes LoadingRing {\n 0% {\n transform: rotate(0deg);\n }\n\n 100% {\n transform: rotate(360deg);\n }\n }\n position: relative;\n\n svg {\n display: block;\n width: ${size};\n height: ${size};\n\n circle {\n fill: transparent;\n stroke: ${theme.base.colors.gray['extra-light']};\n stroke-width: 2;\n r: 45%;\n cx: 50%;\n cy: 50%;\n transform: rotate(-90deg);\n transform-origin: 50% 50%;\n\n &:nth-child(2) {\n stroke: ${theme.components.progress['progress-color']};\n transition: stroke-dashoffset calc(0.5 * ${theme.base.animation.speed})\n ${theme.base.animation.timing.ease};\n\n ${!determinate &&\n css`\n animation: LoadingRing calc(4 * ${theme.base.animation.speed}) linear infinite;\n `}\n }\n }\n }\n\n ${placement === 'inline' &&\n css`\n display: inline-flex;\n vertical-align: top;\n `}\n `;\n});\n\nStyledProgressRing.defaultProps = defaultThemeProp;\n\nexport const StyledProgressBar = styled(StyledProgressVisual)<\n ProgressProps & { determinate: boolean }\n>(({ theme, placement, determinate }) => {\n return css`\n background-color: ${theme.base.colors.gray['extra-light']};\n border-radius: ${theme.base['border-radius']};\n width: calc(100% - ${placement === 'local' ? css`4 * ${theme.base.spacing}` : '0rem'});\n height: 0.375rem;\n min-width: 2rem;\n max-width: min(calc(100vw - 4 * ${theme.base.spacing}), ${theme.base['content-width'].lg});\n overflow: hidden;\n\n @keyframes LoadingBar {\n 0% {\n transform: translateX(-100%);\n }\n\n 100% {\n transform: translateX(200%);\n }\n }\n\n ::before {\n content: '';\n display: block;\n height: 100%;\n width: 100%;\n left: 0;\n border-radius: ${theme.base['border-radius']};\n background-color: ${theme.components.progress['progress-color']};\n ${determinate &&\n css`\n transform: translateX(var(--progress, 0));\n transform-origin: 0 50%;\n transition: transform calc(0.5 * ${theme.base.animation.speed})\n ${theme.base.animation.timing.ease};\n `}\n\n ${!determinate &&\n css`\n animation: LoadingBar calc(8 * ${theme.base.animation.speed}) linear infinite;\n width: 50%;\n `}\n }\n\n ${placement === 'inline' &&\n css`\n width: 3rem;\n display: inline-block;\n position: relative;\n `}\n `;\n});\n\nStyledProgressBar.defaultProps = defaultThemeProp;\n\nexport const StyledProgressEllipsis = styled(StyledProgressVisual)<\n Pick<ProgressProps, 'placement'>\n>(({ theme, placement }) => {\n return css`\n line-height: 1;\n display: ${placement === 'inline' ? 'inline-flex' : 'block'};\n\n @keyframes LoadingEllipsis {\n 0% {\n transform: scale(0);\n opacity: 0;\n }\n\n 50% {\n transform: scale(1);\n opacity: 1;\n }\n\n 100% {\n transform: scale(0);\n opacity: 0;\n }\n }\n\n > span {\n display: flex;\n justify-content: center;\n mix-blend-mode: multiply;\n\n ${placement === 'inline' &&\n css`\n display: inline-flex;\n margin-inline-start: 0.1875rem;\n `}\n }\n\n > span span {\n margin: 0 0.3125rem;\n background: ${theme.components.progress['progress-color']};\n border-radius: 50%;\n animation: LoadingEllipsis calc(4 * ${theme.base.animation.speed}) infinite;\n\n ${placement === 'global' &&\n css`\n width: 1.25rem;\n height: 1.25rem;\n `}\n\n ${(placement === 'local' || placement === 'block') &&\n css`\n width: 0.625rem;\n height: 0.625rem;\n `}\n\n ${placement === 'inline' &&\n css`\n width: 0.1875rem;\n height: 0.1875rem;\n margin: 0 0.1875rem;\n animation-duration: calc(4 * ${theme.base.animation.speed});\n `}\n\n &:nth-child(2) {\n animation-delay: 0.1667s;\n }\n\n &:nth-child(3) {\n animation-delay: ${0.1667 * 2}s;\n }\n }\n `;\n});\n\nStyledProgressEllipsis.defaultProps = defaultThemeProp;\n\nexport const StyledMessage = styled.span(({ theme }) => {\n const color = tryCatch(() => {\n return rgba(\n readableColor(theme.base.palette['primary-background']),\n theme.base.transparency['transparent-3']\n );\n });\n\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n font-size: ${fontSize[theme.components.label['font-size'] as FontSize]};\n font-weight: ${theme.base['font-weight']['semi-bold']};\n color: ${color};\n `;\n});\n\nStyledMessage.defaultProps = defaultThemeProp;\n\nexport const StyledProgress = styled(Flex)<Pick<ProgressProps, 'placement'>>(\n ({ theme, placement }) => {\n return css`\n ${placement !== 'inline' &&\n css`\n width: 100%;\n `}\n\n ${placement === 'block' &&\n css`\n margin-block: calc(2 * ${theme.base.spacing});\n `}\n `;\n }\n);\n\nStyledProgress.defaultProps = defaultThemeProp;\n"]}
1
+ {"version":3,"file":"Progress.styles.js","sourceRoot":"","sources":["../../../src/components/Progress/Progress.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import { rgba, readableColor } from 'polished';\nimport styled, { css } from 'styled-components';\n\nimport { calculateFontSize, FontSize } from '../../styles';\nimport { defaultThemeProp } from '../../theme';\nimport { tryCatch } from '../../utils';\nimport Flex from '../Flex';\n\nimport { ProgressProps } from './Progress.types';\n\nconst StyledProgressVisual = styled.div(({ theme }) => {\n return css`\n &:focus-visible {\n box-shadow: ${theme.components.button['focus-shadow']};\n outline: none;\n border-radius: calc(9999 * ${theme.base['border-radius']});\n }\n `;\n});\n\nStyledProgressVisual.defaultProps = defaultThemeProp;\n\nexport const StyledProgressRing = styled(StyledProgressVisual)<\n Pick<ProgressProps, 'placement'> & { determinate: boolean }\n>(({ theme, placement, determinate }) => {\n const size = placement === 'inline' ? '1em' : '2rem';\n\n return css`\n @keyframes LoadingRing {\n 0% {\n transform: rotate(0deg);\n }\n\n 100% {\n transform: rotate(360deg);\n }\n }\n position: relative;\n\n svg {\n display: block;\n width: ${size};\n height: ${size};\n\n circle {\n fill: transparent;\n stroke: ${theme.base.colors.gray['extra-light']};\n stroke-width: 2;\n r: 45%;\n cx: 50%;\n cy: 50%;\n transform: rotate(-90deg);\n transform-origin: 50% 50%;\n\n &:nth-child(2) {\n stroke: ${theme.components.progress['progress-color']};\n transition: stroke-dashoffset calc(0.5 * ${theme.base.animation.speed})\n ${theme.base.animation.timing.ease};\n\n ${!determinate &&\n css`\n animation: LoadingRing calc(4 * ${theme.base.animation.speed}) linear infinite;\n `}\n }\n }\n }\n\n ${placement === 'inline' &&\n css`\n display: inline-flex;\n vertical-align: top;\n `}\n `;\n});\n\nStyledProgressRing.defaultProps = defaultThemeProp;\n\nexport const StyledProgressBar = styled(StyledProgressVisual)<\n ProgressProps & { determinate: boolean }\n>(({ theme, placement, determinate }) => {\n return css`\n background-color: ${theme.base.colors.gray['extra-light']};\n border-radius: ${theme.base['border-radius']};\n width: calc(100% - ${placement === 'local' ? css`4 * ${theme.base.spacing}` : '0rem'});\n height: 0.375rem;\n min-width: 2rem;\n max-width: min(calc(100vw - 4 * ${theme.base.spacing}), ${theme.base['content-width'].lg});\n overflow: hidden;\n\n @keyframes LoadingBar {\n 0% {\n transform: translateX(-100%);\n }\n\n 100% {\n transform: translateX(200%);\n }\n }\n\n ::before {\n content: '';\n display: block;\n height: 100%;\n width: 100%;\n left: 0;\n border-radius: ${theme.base['border-radius']};\n background-color: ${theme.components.progress['progress-color']};\n ${determinate &&\n css`\n transform: translateX(var(--progress, 0));\n transform-origin: 0 50%;\n transition: transform calc(0.5 * ${theme.base.animation.speed})\n ${theme.base.animation.timing.ease};\n `}\n\n ${!determinate &&\n css`\n animation: LoadingBar calc(8 * ${theme.base.animation.speed}) linear infinite;\n width: 50%;\n `}\n }\n\n ${placement === 'inline' &&\n css`\n width: 3rem;\n display: inline-block;\n position: relative;\n `}\n `;\n});\n\nStyledProgressBar.defaultProps = defaultThemeProp;\n\nexport const StyledProgressEllipsis = styled(StyledProgressVisual)<\n Pick<ProgressProps, 'placement'>\n>(({ theme, placement }) => {\n return css`\n line-height: 1;\n display: ${placement === 'inline' ? 'inline-flex' : 'block'};\n\n @keyframes LoadingEllipsis {\n 0% {\n transform: scale(0);\n opacity: 0;\n }\n\n 50% {\n transform: scale(1);\n opacity: 1;\n }\n\n 100% {\n transform: scale(0);\n opacity: 0;\n }\n }\n\n > span {\n display: flex;\n justify-content: center;\n mix-blend-mode: multiply;\n\n ${placement === 'inline' &&\n css`\n display: inline-flex;\n `}\n }\n\n > span span {\n margin: 0 0.3125rem;\n background: ${theme.components.progress['progress-color']};\n border-radius: 50%;\n animation: LoadingEllipsis calc(4 * ${theme.base.animation.speed}) infinite;\n\n ${placement === 'global' &&\n css`\n width: 1.25rem;\n height: 1.25rem;\n `}\n\n ${(placement === 'local' || placement === 'block') &&\n css`\n width: 0.625rem;\n height: 0.625rem;\n `}\n\n ${placement === 'inline' &&\n css`\n width: 0.1875rem;\n height: 0.1875rem;\n margin: 0 0.1875rem;\n animation-duration: calc(4 * ${theme.base.animation.speed});\n `}\n\n &:nth-child(2) {\n animation-delay: 0.1667s;\n }\n\n &:nth-child(3) {\n animation-delay: ${0.1667 * 2}s;\n }\n }\n `;\n});\n\nStyledProgressEllipsis.defaultProps = defaultThemeProp;\n\nexport const StyledMessage = styled.span(({ theme }) => {\n const color = tryCatch(() => {\n return rgba(\n readableColor(theme.base.palette['primary-background']),\n theme.base.transparency['transparent-3']\n );\n });\n\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n font-size: ${fontSize[theme.components.label['font-size'] as FontSize]};\n font-weight: ${theme.base['font-weight']['semi-bold']};\n color: ${color};\n `;\n});\n\nStyledMessage.defaultProps = defaultThemeProp;\n\nexport const StyledProgress = styled(Flex)<Pick<ProgressProps, 'placement'>>(\n ({ theme, placement }) => {\n return css`\n ${placement !== 'inline' &&\n css`\n width: 100%;\n `}\n\n ${placement === 'block' &&\n css`\n margin-block: calc(2 * ${theme.base.spacing});\n `}\n `;\n }\n);\n\nStyledProgress.defaultProps = defaultThemeProp;\n"]}
@@ -1,9 +1,6 @@
1
1
  import { Ref } from 'react';
2
2
  import { BaseProps, NoChildrenProp } from '../../types';
3
3
  import { BackdropProps } from '../Backdrop/Backdrop';
4
- export interface ProgressHandleValue {
5
- focus: () => void;
6
- }
7
4
  export interface ProgressProps extends BaseProps, NoChildrenProp {
8
5
  /**
9
6
  * Determines which variant should be rendered.
@@ -33,16 +30,31 @@ export interface ProgressProps extends BaseProps, NoChildrenProp {
33
30
  * When true, fade in occurs when component mounts.
34
31
  * When false, mounted component fades out then re-renders self and returns null, removing itself from the DOM.
35
32
  * This is technically not the same as unmounting via parent.
33
+ * Applicable for all placements but the fade effect is only applicable to 'global' | 'local' placement.
36
34
  * @default true
37
35
  */
38
36
  visible?: boolean;
37
+ /**
38
+ * If true, upon visible render the indicator element will take focus.
39
+ * @default false
40
+ */
41
+ focusOnVisible?: boolean;
42
+ /**
43
+ * If true, the indicator will not render as visible until 1sec after the visible prop is set to true.
44
+ * This is a best estimate to avoid visual flicker where progress is resolved within 1sec.
45
+ * @default false
46
+ */
47
+ delay?: boolean;
39
48
  /** Called when the css transition ends on the way in. */
40
49
  onTransitionEndIn?: BackdropProps['onAfterTransitionIn'];
41
50
  /** Called when the css transition ends on the way out...A good time to unmount! */
42
51
  onTransitionEndOut?: BackdropProps['onAfterTransitionOut'];
43
- /** Ref for the wrapping element. */
52
+ /** Triggers live announcement on show and value or message change. */
53
+ liveConfig?: {
54
+ /** Distinguishes the source of the update on the page. */
55
+ contextualLabel: string;
56
+ };
57
+ /** Ref to the visual indicator element, currently a role of progressbar. */
44
58
  ref?: Ref<HTMLDivElement>;
45
- /** Imperative handle */
46
- handle?: Ref<ProgressHandleValue>;
47
59
  }
48
60
  //# sourceMappingURL=Progress.types.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Progress.types.d.ts","sourceRoot":"","sources":["../../../src/components/Progress/Progress.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE5B,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAErD,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED,MAAM,WAAW,aAAc,SAAQ,SAAS,EAAE,cAAc;IAC9D;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,KAAK,GAAG,UAAU,CAAC;IACtC;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,wFAAwF;IACxF,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+DAA+D;IAC/D,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,SAAS,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC;IACpD;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,yDAAyD;IACzD,iBAAiB,CAAC,EAAE,aAAa,CAAC,qBAAqB,CAAC,CAAC;IACzD,mFAAmF;IACnF,kBAAkB,CAAC,EAAE,aAAa,CAAC,sBAAsB,CAAC,CAAC;IAC3D,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC1B,wBAAwB;IACxB,MAAM,CAAC,EAAE,GAAG,CAAC,mBAAmB,CAAC,CAAC;CACnC"}
1
+ {"version":3,"file":"Progress.types.d.ts","sourceRoot":"","sources":["../../../src/components/Progress/Progress.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE5B,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAErD,MAAM,WAAW,aAAc,SAAQ,SAAS,EAAE,cAAc;IAC9D;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,KAAK,GAAG,UAAU,CAAC;IACtC;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,wFAAwF;IACxF,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+DAA+D;IAC/D,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,SAAS,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC;IACpD;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,yDAAyD;IACzD,iBAAiB,CAAC,EAAE,aAAa,CAAC,qBAAqB,CAAC,CAAC;IACzD,mFAAmF;IACnF,kBAAkB,CAAC,EAAE,aAAa,CAAC,sBAAsB,CAAC,CAAC;IAC3D,sEAAsE;IACtE,UAAU,CAAC,EAAE;QACX,0DAA0D;QAC1D,eAAe,EAAE,MAAM,CAAC;KACzB,CAAC;IACF,4EAA4E;IAC5E,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B"}
@@ -1 +1 @@
1
- {"version":3,"file":"Progress.types.js","sourceRoot":"","sources":["../../../src/components/Progress/Progress.types.ts"],"names":[],"mappings":"","sourcesContent":["import { Ref } from 'react';\n\nimport { BaseProps, NoChildrenProp } from '../../types';\nimport { BackdropProps } from '../Backdrop/Backdrop';\n\nexport interface ProgressHandleValue {\n focus: () => void;\n}\n\nexport interface ProgressProps extends BaseProps, NoChildrenProp {\n /**\n * Determines which variant should be rendered.\n * @default \"ring\"\n */\n variant?: 'ring' | 'bar' | 'ellipsis';\n /**\n * Minimum possible value.\n * @default 0\n */\n minValue?: number;\n /**\n * Maximum possible value.\n * @default 100\n */\n maxValue?: number;\n /** Current progress value within the range specified, or the default range of 0-100. */\n value?: number;\n /** Provides a message to the user along with the component. */\n message?: string;\n /**\n * Determines the placement of the component.\n * @default \"global\"\n */\n placement?: 'global' | 'local' | 'block' | 'inline';\n /**\n * When true, fade in occurs when component mounts.\n * When false, mounted component fades out then re-renders self and returns null, removing itself from the DOM.\n * This is technically not the same as unmounting via parent.\n * @default true\n */\n visible?: boolean;\n /** Called when the css transition ends on the way in. */\n onTransitionEndIn?: BackdropProps['onAfterTransitionIn'];\n /** Called when the css transition ends on the way out...A good time to unmount! */\n onTransitionEndOut?: BackdropProps['onAfterTransitionOut'];\n /** Ref for the wrapping element. */\n ref?: Ref<HTMLDivElement>;\n /** Imperative handle */\n handle?: Ref<ProgressHandleValue>;\n}\n"]}
1
+ {"version":3,"file":"Progress.types.js","sourceRoot":"","sources":["../../../src/components/Progress/Progress.types.ts"],"names":[],"mappings":"","sourcesContent":["import { Ref } from 'react';\n\nimport { BaseProps, NoChildrenProp } from '../../types';\nimport { BackdropProps } from '../Backdrop/Backdrop';\n\nexport interface ProgressProps extends BaseProps, NoChildrenProp {\n /**\n * Determines which variant should be rendered.\n * @default \"ring\"\n */\n variant?: 'ring' | 'bar' | 'ellipsis';\n /**\n * Minimum possible value.\n * @default 0\n */\n minValue?: number;\n /**\n * Maximum possible value.\n * @default 100\n */\n maxValue?: number;\n /** Current progress value within the range specified, or the default range of 0-100. */\n value?: number;\n /** Provides a message to the user along with the component. */\n message?: string;\n /**\n * Determines the placement of the component.\n * @default \"global\"\n */\n placement?: 'global' | 'local' | 'block' | 'inline';\n /**\n * When true, fade in occurs when component mounts.\n * When false, mounted component fades out then re-renders self and returns null, removing itself from the DOM.\n * This is technically not the same as unmounting via parent.\n * Applicable for all placements but the fade effect is only applicable to 'global' | 'local' placement.\n * @default true\n */\n visible?: boolean;\n /**\n * If true, upon visible render the indicator element will take focus.\n * @default false\n */\n focusOnVisible?: boolean;\n /**\n * If true, the indicator will not render as visible until 1sec after the visible prop is set to true.\n * This is a best estimate to avoid visual flicker where progress is resolved within 1sec.\n * @default false\n */\n delay?: boolean;\n /** Called when the css transition ends on the way in. */\n onTransitionEndIn?: BackdropProps['onAfterTransitionIn'];\n /** Called when the css transition ends on the way out...A good time to unmount! */\n onTransitionEndOut?: BackdropProps['onAfterTransitionOut'];\n /** Triggers live announcement on show and value or message change. */\n liveConfig?: {\n /** Distinguishes the source of the update on the page. */\n contextualLabel: string;\n };\n /** Ref to the visual indicator element, currently a role of progressbar. */\n ref?: Ref<HTMLDivElement>;\n}\n"]}
@@ -1,4 +1,4 @@
1
1
  export { default } from './Progress';
2
- export { ProgressProps, ProgressHandleValue } from './Progress.types';
2
+ export { ProgressProps } from './Progress.types';
3
3
  export { StyledProgressBar, StyledProgressRing, StyledProgressEllipsis } from './Progress.styles';
4
4
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Progress/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,OAAO,EAAE,aAAa,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AACtE,OAAO,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,sBAAsB,EAAE,MAAM,mBAAmB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Progress/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,sBAAsB,EAAE,MAAM,mBAAmB,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Progress/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAErC,OAAO,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,sBAAsB,EAAE,MAAM,mBAAmB,CAAC","sourcesContent":["export { default } from './Progress';\nexport { ProgressProps, ProgressHandleValue } from './Progress.types';\nexport { StyledProgressBar, StyledProgressRing, StyledProgressEllipsis } from './Progress.styles';\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Progress/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAErC,OAAO,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,sBAAsB,EAAE,MAAM,mBAAmB,CAAC","sourcesContent":["export { default } from './Progress';\nexport { ProgressProps } from './Progress.types';\nexport { StyledProgressBar, StyledProgressRing, StyledProgressEllipsis } from './Progress.styles';\n"]}