@lumx/react 3.20.1-alpha.28 → 3.20.1-alpha.29

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 (197) hide show
  1. package/index.js +14033 -63
  2. package/index.js.map +1 -1
  3. package/package.json +3 -3
  4. package/utils/index.js +158 -3
  5. package/utils/index.js.map +1 -1
  6. package/_internal/Button-5a87fee9.js +0 -97
  7. package/_internal/Button-5a87fee9.js.map +0 -1
  8. package/_internal/ButtonRoot-bf682215.js +0 -117
  9. package/_internal/ButtonRoot-bf682215.js.map +0 -1
  10. package/_internal/Chip-8d0aae06.js +0 -143
  11. package/_internal/Chip-8d0aae06.js.map +0 -1
  12. package/_internal/ClickAwayProvider-1204f237.js +0 -95
  13. package/_internal/ClickAwayProvider-1204f237.js.map +0 -1
  14. package/_internal/DisabledStateContext-ea04260d.js +0 -29
  15. package/_internal/DisabledStateContext-ea04260d.js.map +0 -1
  16. package/_internal/HeadingLevelProvider-ebdcb0c7.js +0 -61
  17. package/_internal/HeadingLevelProvider-ebdcb0c7.js.map +0 -1
  18. package/_internal/IconButton-351389b0.js +0 -77
  19. package/_internal/IconButton-351389b0.js.map +0 -1
  20. package/_internal/ImageCaption-4109b433.js +0 -75
  21. package/_internal/ImageCaption-4109b433.js.map +0 -1
  22. package/_internal/List-b7882a99.js +0 -817
  23. package/_internal/List-b7882a99.js.map +0 -1
  24. package/_internal/PopoverDialog-2e7b9ed5.js +0 -655
  25. package/_internal/PopoverDialog-2e7b9ed5.js.map +0 -1
  26. package/_internal/Portal-3f86608e.js +0 -45
  27. package/_internal/Portal-3f86608e.js.map +0 -1
  28. package/_internal/RawClickable-2c2b6a89.js +0 -52
  29. package/_internal/RawClickable-2c2b6a89.js.map +0 -1
  30. package/_internal/Slides-83646e84.js +0 -679
  31. package/_internal/Slides-83646e84.js.map +0 -1
  32. package/_internal/ThemeContext-3181f000.js +0 -14
  33. package/_internal/ThemeContext-3181f000.js.map +0 -1
  34. package/_internal/Thumbnail-741501a5.js +0 -314
  35. package/_internal/Thumbnail-741501a5.js.map +0 -1
  36. package/_internal/check-circle-de24f857.js +0 -4
  37. package/_internal/check-circle-de24f857.js.map +0 -1
  38. package/_internal/chevron-right-827b804a.js +0 -6
  39. package/_internal/chevron-right-827b804a.js.map +0 -1
  40. package/_internal/chevron-up-0b9c76cb.js +0 -6
  41. package/_internal/chevron-up-0b9c76cb.js.map +0 -1
  42. package/_internal/close-circle-ef5d1aac.js +0 -4
  43. package/_internal/close-circle-ef5d1aac.js.map +0 -1
  44. package/_internal/close-eaf6c45a.js +0 -4
  45. package/_internal/close-eaf6c45a.js.map +0 -1
  46. package/_internal/components/alert-dialog-5df4f133.js +0 -163
  47. package/_internal/components/alert-dialog-5df4f133.js.map +0 -1
  48. package/_internal/components/autocomplete-824c779e.js +0 -261
  49. package/_internal/components/autocomplete-824c779e.js.map +0 -1
  50. package/_internal/components/avatar-69b66f01.js +0 -83
  51. package/_internal/components/avatar-69b66f01.js.map +0 -1
  52. package/_internal/components/badge-63cd3b1c.js +0 -81
  53. package/_internal/components/badge-63cd3b1c.js.map +0 -1
  54. package/_internal/components/button-eebd4e00.js +0 -47
  55. package/_internal/components/button-eebd4e00.js.map +0 -1
  56. package/_internal/components/checkbox-54943a02.js +0 -143
  57. package/_internal/components/checkbox-54943a02.js.map +0 -1
  58. package/_internal/components/chip-9ad6b318.js +0 -102
  59. package/_internal/components/chip-9ad6b318.js.map +0 -1
  60. package/_internal/components/comment-block-55a4ab3c.js +0 -138
  61. package/_internal/components/comment-block-55a4ab3c.js.map +0 -1
  62. package/_internal/components/date-picker-a824a3ae.js +0 -2
  63. package/_internal/components/date-picker-a824a3ae.js.map +0 -1
  64. package/_internal/components/dialog-5e6320b8.js +0 -238
  65. package/_internal/components/dialog-5e6320b8.js.map +0 -1
  66. package/_internal/components/divider-bdf11ba3.js +0 -50
  67. package/_internal/components/divider-bdf11ba3.js.map +0 -1
  68. package/_internal/components/drag-handle-45912fd3.js +0 -52
  69. package/_internal/components/drag-handle-45912fd3.js.map +0 -1
  70. package/_internal/components/dropdown-0216211d.js +0 -147
  71. package/_internal/components/dropdown-0216211d.js.map +0 -1
  72. package/_internal/components/expansion-panel-3ce73c6b.js +0 -167
  73. package/_internal/components/expansion-panel-3ce73c6b.js.map +0 -1
  74. package/_internal/components/flag-1b177f78.js +0 -59
  75. package/_internal/components/flag-1b177f78.js.map +0 -1
  76. package/_internal/components/flex-box-93b97715.js +0 -56
  77. package/_internal/components/flex-box-93b97715.js.map +0 -1
  78. package/_internal/components/generic-block-925f7c5b.js +0 -128
  79. package/_internal/components/generic-block-925f7c5b.js.map +0 -1
  80. package/_internal/components/grid-95fd1493.js +0 -104
  81. package/_internal/components/grid-95fd1493.js.map +0 -1
  82. package/_internal/components/grid-column-43f28cfb.js +0 -58
  83. package/_internal/components/grid-column-43f28cfb.js.map +0 -1
  84. package/_internal/components/heading-45d6e78e.js +0 -53
  85. package/_internal/components/heading-45d6e78e.js.map +0 -1
  86. package/_internal/components/icon-79195151.js +0 -2
  87. package/_internal/components/icon-79195151.js.map +0 -1
  88. package/_internal/components/image-block-aba6d2db.js +0 -110
  89. package/_internal/components/image-block-aba6d2db.js.map +0 -1
  90. package/_internal/components/image-lightbox-8b8e77c2.js +0 -759
  91. package/_internal/components/image-lightbox-8b8e77c2.js.map +0 -1
  92. package/_internal/components/inline-list-dfb9fd34.js +0 -74
  93. package/_internal/components/inline-list-dfb9fd34.js.map +0 -1
  94. package/_internal/components/input-helper-c8a0078b.js +0 -71
  95. package/_internal/components/input-helper-c8a0078b.js.map +0 -1
  96. package/_internal/components/input-label-9711398b.js +0 -59
  97. package/_internal/components/input-label-9711398b.js.map +0 -1
  98. package/_internal/components/lightbox-894abe64.js +0 -155
  99. package/_internal/components/lightbox-894abe64.js.map +0 -1
  100. package/_internal/components/link-e70e64ed.js +0 -72
  101. package/_internal/components/link-e70e64ed.js.map +0 -1
  102. package/_internal/components/link-preview-e56f3570.js +0 -117
  103. package/_internal/components/link-preview-e56f3570.js.map +0 -1
  104. package/_internal/components/list-59b7ce56.js +0 -71
  105. package/_internal/components/list-59b7ce56.js.map +0 -1
  106. package/_internal/components/message-a255dfd3.js +0 -98
  107. package/_internal/components/message-a255dfd3.js.map +0 -1
  108. package/_internal/components/mosaic-192f2270.js +0 -94
  109. package/_internal/components/mosaic-192f2270.js.map +0 -1
  110. package/_internal/components/navigation-dfe8aac0.js +0 -225
  111. package/_internal/components/navigation-dfe8aac0.js.map +0 -1
  112. package/_internal/components/notification-10f289b5.js +0 -143
  113. package/_internal/components/notification-10f289b5.js.map +0 -1
  114. package/_internal/components/popover-6c7f745b.js +0 -3
  115. package/_internal/components/popover-6c7f745b.js.map +0 -1
  116. package/_internal/components/post-block-f7dcc6e9.js +0 -109
  117. package/_internal/components/post-block-f7dcc6e9.js.map +0 -1
  118. package/_internal/components/progress-7a05fb0c.js +0 -182
  119. package/_internal/components/progress-7a05fb0c.js.map +0 -1
  120. package/_internal/components/progress-tracker-48876add.js +0 -309
  121. package/_internal/components/progress-tracker-48876add.js.map +0 -1
  122. package/_internal/components/radio-button-07cf45e9.js +0 -149
  123. package/_internal/components/radio-button-07cf45e9.js.map +0 -1
  124. package/_internal/components/select-8b54a444.js +0 -457
  125. package/_internal/components/select-8b54a444.js.map +0 -1
  126. package/_internal/components/side-navigation-7eeed3b4.js +0 -164
  127. package/_internal/components/side-navigation-7eeed3b4.js.map +0 -1
  128. package/_internal/components/skeleton-a4e84085.js +0 -166
  129. package/_internal/components/skeleton-a4e84085.js.map +0 -1
  130. package/_internal/components/slider-5d64b470.js +0 -311
  131. package/_internal/components/slider-5d64b470.js.map +0 -1
  132. package/_internal/components/slideshow-bce65cf6.js +0 -151
  133. package/_internal/components/slideshow-bce65cf6.js.map +0 -1
  134. package/_internal/components/switch-7ae55d89.js +0 -121
  135. package/_internal/components/switch-7ae55d89.js.map +0 -1
  136. package/_internal/components/table-5bdf4aec.js +0 -297
  137. package/_internal/components/table-5bdf4aec.js.map +0 -1
  138. package/_internal/components/tabs-2ad54592.js +0 -298
  139. package/_internal/components/tabs-2ad54592.js.map +0 -1
  140. package/_internal/components/text-09c81111.js +0 -2
  141. package/_internal/components/text-09c81111.js.map +0 -1
  142. package/_internal/components/text-field-3e1030f0.js +0 -359
  143. package/_internal/components/text-field-3e1030f0.js.map +0 -1
  144. package/_internal/components/thumbnail-1c5828b9.js +0 -42
  145. package/_internal/components/thumbnail-1c5828b9.js.map +0 -1
  146. package/_internal/components/toolbar-0d14efb7.js +0 -61
  147. package/_internal/components/toolbar-0d14efb7.js.map +0 -1
  148. package/_internal/components/tooltip-31181a24.js +0 -327
  149. package/_internal/components/tooltip-31181a24.js.map +0 -1
  150. package/_internal/components/uploader-845b2412.js +0 -153
  151. package/_internal/components/uploader-845b2412.js.map +0 -1
  152. package/_internal/components/user-block-91c30797.js +0 -144
  153. package/_internal/components/user-block-91c30797.js.map +0 -1
  154. package/_internal/constants-9b714e31.js +0 -2167
  155. package/_internal/constants-9b714e31.js.map +0 -1
  156. package/_internal/constants-d0e3f49e.js +0 -24
  157. package/_internal/constants-d0e3f49e.js.map +0 -1
  158. package/_internal/context-9d1336a1.js +0 -19
  159. package/_internal/context-9d1336a1.js.map +0 -1
  160. package/_internal/forwardRef-d0e90329.js +0 -82
  161. package/_internal/forwardRef-d0e90329.js.map +0 -1
  162. package/_internal/getFocusableElements-230173a8.js +0 -13
  163. package/_internal/getFocusableElements-230173a8.js.map +0 -1
  164. package/_internal/index-68e1b0af.js +0 -436
  165. package/_internal/index-68e1b0af.js.map +0 -1
  166. package/_internal/index-745f94ee.js +0 -103
  167. package/_internal/index-745f94ee.js.map +0 -1
  168. package/_internal/index-ab520e78.js +0 -117
  169. package/_internal/index-ab520e78.js.map +0 -1
  170. package/_internal/information-49bbeed3.js +0 -6
  171. package/_internal/information-49bbeed3.js.map +0 -1
  172. package/_internal/isComponent-b9762ff1.js +0 -18
  173. package/_internal/isComponent-b9762ff1.js.map +0 -1
  174. package/_internal/isComponentType-e806b848.js +0 -9
  175. package/_internal/isComponentType-e806b848.js.map +0 -1
  176. package/_internal/mergeRefs-f0d7d6ea.js +0 -30
  177. package/_internal/mergeRefs-f0d7d6ea.js.map +0 -1
  178. package/_internal/state-db358714.js +0 -130
  179. package/_internal/state-db358714.js.map +0 -1
  180. package/_internal/useBooleanState-2a3d237c.js +0 -12
  181. package/_internal/useBooleanState-2a3d237c.js.map +0 -1
  182. package/_internal/useCallbackOnEscape-0b220f9c.js +0 -62
  183. package/_internal/useCallbackOnEscape-0b220f9c.js.map +0 -1
  184. package/_internal/useDisableBodyScroll-36bd7352.js +0 -219
  185. package/_internal/useDisableBodyScroll-36bd7352.js.map +0 -1
  186. package/_internal/useDisableStateProps-69e16b7c.js +0 -36
  187. package/_internal/useDisableStateProps-69e16b7c.js.map +0 -1
  188. package/_internal/useFocusTrap-3114e5e8.js +0 -112
  189. package/_internal/useFocusTrap-3114e5e8.js.map +0 -1
  190. package/_internal/useId-3a1facc0.js +0 -18
  191. package/_internal/useId-3a1facc0.js.map +0 -1
  192. package/_internal/useRovingTabIndex-7daf0f24.js +0 -77
  193. package/_internal/useRovingTabIndex-7daf0f24.js.map +0 -1
  194. package/_internal/useTransitionVisibility-321fdbfa.js +0 -50
  195. package/_internal/useTransitionVisibility-321fdbfa.js.map +0 -1
  196. package/_internal/wrapChildrenIconWithSpaces-e6038f72.js +0 -20
  197. package/_internal/wrapChildrenIconWithSpaces-e6038f72.js.map +0 -1
@@ -1,95 +0,0 @@
1
- import { useEffect, useContext, useMemo, useRef, createContext } from 'react';
2
- import { isEmpty } from '@lumx/core/js/utils/collection/isEmpty';
3
- import { jsx } from 'react/jsx-runtime';
4
-
5
- const EVENT_TYPES = ['mousedown', 'touchstart'];
6
- function isClickAway(targets, refs) {
7
- // The targets elements are not contained in any of the listed element references.
8
- return !refs.some(ref => targets.some(target => ref?.current?.contains(target)));
9
- }
10
- /**
11
- * Listen to clicks away from the given elements and callback the passed in function.
12
- *
13
- * Warning: If you need to detect click away on nested React portals, please use the `ClickAwayProvider` component.
14
- */
15
- function useClickAway({
16
- callback,
17
- childrenRefs
18
- }) {
19
- useEffect(() => {
20
- const {
21
- current: currentRefs
22
- } = childrenRefs;
23
- if (!callback || !currentRefs || isEmpty(currentRefs)) {
24
- return undefined;
25
- }
26
- const listener = evt => {
27
- const targets = [evt.composedPath?.()[0], evt.target];
28
- if (isClickAway(targets, currentRefs)) {
29
- callback(evt);
30
- }
31
- };
32
- EVENT_TYPES.forEach(evtType => document.addEventListener(evtType, listener));
33
- return () => {
34
- EVENT_TYPES.forEach(evtType => document.removeEventListener(evtType, listener));
35
- };
36
- }, [callback, childrenRefs]);
37
- }
38
-
39
- const ClickAwayAncestorContext = /*#__PURE__*/createContext(null);
40
- /**
41
- * Component combining the `useClickAway` hook with a React context to hook into the React component tree and make sure
42
- * we take into account both the DOM tree and the React tree to detect click away.
43
- *
44
- * @return the react component.
45
- */
46
- const ClickAwayProvider = ({
47
- children,
48
- callback,
49
- childrenRefs,
50
- parentRef
51
- }) => {
52
- const parentContext = useContext(ClickAwayAncestorContext);
53
- const currentContext = useMemo(() => {
54
- const context = {
55
- childrenRefs: [],
56
- /**
57
- * Add element refs to the current context and propagate to the parent context.
58
- */
59
- addRefs(...newChildrenRefs) {
60
- // Add element refs that should be considered as inside the click away context.
61
- context.childrenRefs.push(...newChildrenRefs);
62
- if (parentContext) {
63
- // Also add then to the parent context
64
- parentContext.addRefs(...newChildrenRefs);
65
- if (parentRef) {
66
- // The parent element is also considered as inside the parent click away context but not inside the current context
67
- parentContext.addRefs(parentRef);
68
- }
69
- }
70
- }
71
- };
72
- return context;
73
- }, [parentContext, parentRef]);
74
- useEffect(() => {
75
- const {
76
- current: currentRefs
77
- } = childrenRefs;
78
- if (!currentRefs) {
79
- return;
80
- }
81
- currentContext.addRefs(...currentRefs);
82
- }, [currentContext, childrenRefs]);
83
- useClickAway({
84
- callback,
85
- childrenRefs: useRef(currentContext.childrenRefs)
86
- });
87
- return /*#__PURE__*/jsx(ClickAwayAncestorContext.Provider, {
88
- value: currentContext,
89
- children: children
90
- });
91
- };
92
- ClickAwayProvider.displayName = 'ClickAwayProvider';
93
-
94
- export { ClickAwayProvider as C };
95
- //# sourceMappingURL=ClickAwayProvider-1204f237.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ClickAwayProvider-1204f237.js","sources":["../../src/hooks/useClickAway.tsx","../../src/utils/ClickAwayProvider/ClickAwayProvider.tsx"],"sourcesContent":["import { RefObject, useEffect } from 'react';\n\nimport { Falsy } from '@lumx/react/utils/type';\nimport { isEmpty } from '@lumx/core/js/utils/collection/isEmpty';\n\nconst EVENT_TYPES = ['mousedown', 'touchstart'];\n\nfunction isClickAway(targets: HTMLElement[], refs: Array<RefObject<HTMLElement>>): boolean {\n // The targets elements are not contained in any of the listed element references.\n return !refs.some((ref) => targets.some((target) => ref?.current?.contains(target)));\n}\n\nexport interface ClickAwayParameters {\n /**\n * A callback function to call when the user clicks away from the elements.\n */\n callback: EventListener | Falsy;\n /**\n * Elements considered within the click away context (clicking outside them will trigger the click away callback).\n */\n childrenRefs: RefObject<Array<RefObject<HTMLElement>>>;\n}\n\n/**\n * Listen to clicks away from the given elements and callback the passed in function.\n *\n * Warning: If you need to detect click away on nested React portals, please use the `ClickAwayProvider` component.\n */\nexport function useClickAway({ callback, childrenRefs }: ClickAwayParameters): void {\n useEffect(() => {\n const { current: currentRefs } = childrenRefs;\n if (!callback || !currentRefs || isEmpty(currentRefs)) {\n return undefined;\n }\n const listener: EventListener = (evt) => {\n const targets = [evt.composedPath?.()[0], evt.target] as HTMLElement[];\n if (isClickAway(targets, currentRefs)) {\n callback(evt);\n }\n };\n\n EVENT_TYPES.forEach((evtType) => document.addEventListener(evtType, listener));\n return () => {\n EVENT_TYPES.forEach((evtType) => document.removeEventListener(evtType, listener));\n };\n }, [callback, childrenRefs]);\n}\n","import { createContext, RefObject, useContext, useEffect, useMemo, useRef } from 'react';\nimport { ClickAwayParameters, useClickAway } from '@lumx/react/hooks/useClickAway';\n\ninterface ContextValue {\n childrenRefs: Array<RefObject<HTMLElement>>;\n addRefs(...newChildrenRefs: Array<RefObject<HTMLElement>>): void;\n}\n\nconst ClickAwayAncestorContext = createContext<ContextValue | null>(null);\n\ninterface ClickAwayProviderProps extends ClickAwayParameters {\n /**\n * (Optional) Element that should be considered as part of the parent\n */\n parentRef?: RefObject<HTMLElement>;\n /**\n * Children\n */\n children?: React.ReactNode;\n}\n\n/**\n * Component combining the `useClickAway` hook with a React context to hook into the React component tree and make sure\n * we take into account both the DOM tree and the React tree to detect click away.\n *\n * @return the react component.\n */\nexport const ClickAwayProvider: React.FC<ClickAwayProviderProps> = ({\n children,\n callback,\n childrenRefs,\n parentRef,\n}) => {\n const parentContext = useContext(ClickAwayAncestorContext);\n const currentContext = useMemo(() => {\n const context: ContextValue = {\n childrenRefs: [],\n /**\n * Add element refs to the current context and propagate to the parent context.\n */\n addRefs(...newChildrenRefs) {\n // Add element refs that should be considered as inside the click away context.\n context.childrenRefs.push(...newChildrenRefs);\n\n if (parentContext) {\n // Also add then to the parent context\n parentContext.addRefs(...newChildrenRefs);\n if (parentRef) {\n // The parent element is also considered as inside the parent click away context but not inside the current context\n parentContext.addRefs(parentRef);\n }\n }\n },\n };\n return context;\n }, [parentContext, parentRef]);\n\n useEffect(() => {\n const { current: currentRefs } = childrenRefs;\n if (!currentRefs) {\n return;\n }\n currentContext.addRefs(...currentRefs);\n }, [currentContext, childrenRefs]);\n\n useClickAway({ callback, childrenRefs: useRef(currentContext.childrenRefs) });\n return <ClickAwayAncestorContext.Provider value={currentContext}>{children}</ClickAwayAncestorContext.Provider>;\n};\nClickAwayProvider.displayName = 'ClickAwayProvider';\n"],"names":["EVENT_TYPES","isClickAway","targets","refs","some","ref","target","current","contains","useClickAway","callback","childrenRefs","useEffect","currentRefs","isEmpty","undefined","listener","evt","composedPath","forEach","evtType","document","addEventListener","removeEventListener","ClickAwayAncestorContext","createContext","ClickAwayProvider","children","parentRef","parentContext","useContext","currentContext","useMemo","context","addRefs","newChildrenRefs","push","useRef","_jsx","Provider","value","displayName"],"mappings":"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"}
@@ -1,29 +0,0 @@
1
- import React__default, { useContext } from 'react';
2
- import { jsx } from 'react/jsx-runtime';
3
-
4
- const DisabledStateContext = /*#__PURE__*/React__default.createContext({
5
- state: null
6
- });
7
- /**
8
- * Disabled state provider.
9
- * All nested LumX Design System components inherit this disabled state.
10
- */
11
- function DisabledStateProvider({
12
- children,
13
- ...value
14
- }) {
15
- return /*#__PURE__*/jsx(DisabledStateContext.Provider, {
16
- value: value,
17
- children: children
18
- });
19
- }
20
-
21
- /**
22
- * Get DisabledState context value
23
- */
24
- function useDisabledStateContext() {
25
- return useContext(DisabledStateContext);
26
- }
27
-
28
- export { DisabledStateProvider as D, useDisabledStateContext as u };
29
- //# sourceMappingURL=DisabledStateContext-ea04260d.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"DisabledStateContext-ea04260d.js","sources":["../../src/utils/disabled/DisabledStateContext.tsx"],"sourcesContent":["import React, { useContext } from 'react';\n\n/** Disable state */\ntype DisabledStateContextValue =\n | {\n state: 'disabled';\n }\n | { state: undefined | null };\n\nexport const DisabledStateContext = React.createContext<DisabledStateContextValue>({ state: null });\n\nexport type DisabledStateProviderProps = DisabledStateContextValue & {\n children: React.ReactNode;\n};\n\n/**\n * Disabled state provider.\n * All nested LumX Design System components inherit this disabled state.\n */\nexport function DisabledStateProvider({ children, ...value }: DisabledStateProviderProps) {\n return <DisabledStateContext.Provider value={value}>{children}</DisabledStateContext.Provider>;\n}\n\n/**\n * Get DisabledState context value\n */\nexport function useDisabledStateContext(): DisabledStateContextValue {\n return useContext(DisabledStateContext);\n}\n"],"names":["DisabledStateContext","React","createContext","state","DisabledStateProvider","children","value","_jsx","Provider","useDisabledStateContext","useContext"],"mappings":";;;AASO,MAAMA,oBAAoB,gBAAGC,cAAK,CAACC,aAAa,CAA4B;AAAEC,EAAAA,KAAK,EAAE,IAAA;AAAK,CAAC,CAAC,CAAA;AAMnG;AACA;AACA;AACA;AACO,SAASC,qBAAqBA,CAAC;EAAEC,QAAQ;EAAE,GAAGC,KAAAA;AAAkC,CAAC,EAAE;AACtF,EAAA,oBAAOC,GAAA,CAACP,oBAAoB,CAACQ,QAAQ,EAAA;AAACF,IAAAA,KAAK,EAAEA,KAAM;AAAAD,IAAAA,QAAA,EAAEA,QAAAA;AAAQ,GAAgC,CAAC,CAAA;AAClG,CAAA;;AAEA;AACA;AACA;AACO,SAASI,uBAAuBA,GAA8B;EACjE,OAAOC,UAAU,CAACV,oBAAoB,CAAC,CAAA;AAC3C;;;;"}
@@ -1,61 +0,0 @@
1
- import { Typography } from '@lumx/core/js/constants';
2
- import React__default, { createContext } from 'react';
3
- import { jsx } from 'react/jsx-runtime';
4
-
5
- /** The maximum authorized heading level. */
6
- const MAX_HEADING_LEVEL = 6;
7
-
8
- /**
9
- * Typography to use by default depending on the heading level.
10
- */
11
- const DEFAULT_TYPOGRAPHY_BY_LEVEL = {
12
- h1: Typography.display1,
13
- h2: Typography.headline,
14
- h3: Typography.title,
15
- h4: Typography.subtitle2,
16
- h5: Typography.subtitle1,
17
- h6: Typography.body2
18
- };
19
-
20
- const defaultContext = {
21
- level: 1,
22
- headingElement: 'h1'
23
- };
24
- const HeadingLevelContext = /*#__PURE__*/createContext(defaultContext);
25
-
26
- const useHeadingLevel = () => {
27
- const {
28
- level = 1,
29
- headingElement = 'h1'
30
- } = React__default.useContext(HeadingLevelContext);
31
- return {
32
- level,
33
- headingElement
34
- };
35
- };
36
-
37
- /**
38
- * Provide a new heading level context.
39
- */
40
- const HeadingLevelProvider = ({
41
- children,
42
- level
43
- }) => {
44
- const {
45
- level: contextLevel
46
- } = useHeadingLevel();
47
- const incrementedLevel = level || contextLevel + 1;
48
- /** Don't allow a level beyond the maximum level. */
49
- const nextLevel = incrementedLevel > MAX_HEADING_LEVEL ? MAX_HEADING_LEVEL : incrementedLevel;
50
- const headingElement = `h${nextLevel}`;
51
- return /*#__PURE__*/jsx(HeadingLevelContext.Provider, {
52
- value: {
53
- level: nextLevel,
54
- headingElement
55
- },
56
- children: children
57
- });
58
- };
59
-
60
- export { DEFAULT_TYPOGRAPHY_BY_LEVEL as D, HeadingLevelProvider as H, useHeadingLevel as u };
61
- //# sourceMappingURL=HeadingLevelProvider-ebdcb0c7.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"HeadingLevelProvider-ebdcb0c7.js","sources":["../../src/components/heading/constants.ts","../../src/components/heading/context.tsx","../../src/components/heading/useHeadingLevel.tsx","../../src/components/heading/HeadingLevelProvider.tsx"],"sourcesContent":["import { Typography } from '@lumx/core/js/constants';\n\n/** The maximum authorized heading level. */\nexport const MAX_HEADING_LEVEL = 6;\n\n/**\n * Typography to use by default depending on the heading level.\n */\nexport const DEFAULT_TYPOGRAPHY_BY_LEVEL = {\n h1: Typography.display1,\n h2: Typography.headline,\n h3: Typography.title,\n h4: Typography.subtitle2,\n h5: Typography.subtitle1,\n h6: Typography.body2,\n};\n","import { HeadingElement } from '@lumx/react/utils/type';\nimport { createContext } from 'react';\n\ninterface HeadingLevelContext {\n /** The current level */\n level: number;\n /** The heading element matching the current level */\n headingElement: HeadingElement;\n}\n\nconst defaultContext: HeadingLevelContext = { level: 1, headingElement: 'h1' };\n\nexport const HeadingLevelContext = createContext<HeadingLevelContext>(defaultContext);\n","import React from 'react';\nimport { HeadingLevelContext } from './context';\n\nexport const useHeadingLevel = () => {\n const { level = 1, headingElement = 'h1' } = React.useContext(HeadingLevelContext);\n\n return { level, headingElement };\n};\n","import { HeadingElement } from '@lumx/react/utils/type';\nimport { ReactNode } from 'react';\nimport { MAX_HEADING_LEVEL } from './constants';\nimport { HeadingLevelContext } from './context';\nimport { useHeadingLevel } from './useHeadingLevel';\n\nexport interface HeadingLevelProviderProps {\n /** The heading level to start at. If left undefined, the parent context will be used, if any. */\n level?: number;\n /** The children to display */\n children: ReactNode;\n}\n\n/**\n * Provide a new heading level context.\n */\nexport const HeadingLevelProvider: React.FC<HeadingLevelProviderProps> = ({ children, level }) => {\n const { level: contextLevel } = useHeadingLevel();\n\n const incrementedLevel = level || contextLevel + 1;\n /** Don't allow a level beyond the maximum level. */\n const nextLevel = incrementedLevel > MAX_HEADING_LEVEL ? MAX_HEADING_LEVEL : incrementedLevel;\n const headingElement = `h${nextLevel}` as HeadingElement;\n\n return (\n <HeadingLevelContext.Provider value={{ level: nextLevel, headingElement }}>\n {children}\n </HeadingLevelContext.Provider>\n );\n};\n"],"names":["MAX_HEADING_LEVEL","DEFAULT_TYPOGRAPHY_BY_LEVEL","h1","Typography","display1","h2","headline","h3","title","h4","subtitle2","h5","subtitle1","h6","body2","defaultContext","level","headingElement","HeadingLevelContext","createContext","useHeadingLevel","React","useContext","HeadingLevelProvider","children","contextLevel","incrementedLevel","nextLevel","_jsx","Provider","value"],"mappings":";;;;AAEA;AACO,MAAMA,iBAAiB,GAAG,CAAC,CAAA;;AAElC;AACA;AACA;AACO,MAAMC,2BAA2B,GAAG;EACvCC,EAAE,EAAEC,UAAU,CAACC,QAAQ;EACvBC,EAAE,EAAEF,UAAU,CAACG,QAAQ;EACvBC,EAAE,EAAEJ,UAAU,CAACK,KAAK;EACpBC,EAAE,EAAEN,UAAU,CAACO,SAAS;EACxBC,EAAE,EAAER,UAAU,CAACS,SAAS;EACxBC,EAAE,EAAEV,UAAU,CAACW,KAAAA;AACnB;;ACLA,MAAMC,cAAmC,GAAG;AAAEC,EAAAA,KAAK,EAAE,CAAC;AAAEC,EAAAA,cAAc,EAAE,IAAA;AAAK,CAAC,CAAA;AAEvE,MAAMC,mBAAmB,gBAAGC,aAAa,CAAsBJ,cAAc,CAAC;;ACTxEK,MAAAA,eAAe,GAAGA,MAAM;EACjC,MAAM;AAAEJ,IAAAA,KAAK,GAAG,CAAC;AAAEC,IAAAA,cAAc,GAAG,IAAA;AAAK,GAAC,GAAGI,cAAK,CAACC,UAAU,CAACJ,mBAAmB,CAAC,CAAA;EAElF,OAAO;IAAEF,KAAK;AAAEC,IAAAA,cAAAA;GAAgB,CAAA;AACpC;;ACMA;AACA;AACA;AACO,MAAMM,oBAAyD,GAAGA,CAAC;EAAEC,QAAQ;AAAER,EAAAA,KAAAA;AAAM,CAAC,KAAK;EAC9F,MAAM;AAAEA,IAAAA,KAAK,EAAES,YAAAA;GAAc,GAAGL,eAAe,EAAE,CAAA;AAEjD,EAAA,MAAMM,gBAAgB,GAAGV,KAAK,IAAIS,YAAY,GAAG,CAAC,CAAA;AAClD;EACA,MAAME,SAAS,GAAGD,gBAAgB,GAAG1B,iBAAiB,GAAGA,iBAAiB,GAAG0B,gBAAgB,CAAA;AAC7F,EAAA,MAAMT,cAAc,GAAG,CAAIU,CAAAA,EAAAA,SAAS,CAAoB,CAAA,CAAA;AAExD,EAAA,oBACIC,GAAA,CAACV,mBAAmB,CAACW,QAAQ,EAAA;AAACC,IAAAA,KAAK,EAAE;AAAEd,MAAAA,KAAK,EAAEW,SAAS;AAAEV,MAAAA,cAAAA;KAAiB;AAAAO,IAAAA,QAAA,EACrEA,QAAAA;AAAQ,GACiB,CAAC,CAAA;AAEvC;;;;"}
@@ -1,77 +0,0 @@
1
- import { B as ButtonRoot } from './ButtonRoot-bf682215.js';
2
- import { getRootClassName } from '@lumx/core/js/utils/className';
3
- import { u as useTheme, T as ThemeProvider } from './ThemeContext-3181f000.js';
4
- import { f as forwardRef } from './forwardRef-d0e90329.js';
5
- import { jsx } from 'react/jsx-runtime';
6
- import { Tooltip } from './components/tooltip-31181a24.js';
7
- import { Emphasis, Size, Theme } from '@lumx/core/js/constants';
8
- import { I as Icon } from './index-745f94ee.js';
9
-
10
- /**
11
- * Component display name.
12
- */
13
- const COMPONENT_NAME = 'IconButton';
14
-
15
- /**
16
- * Component default class name and class prefix.
17
- */
18
- const CLASSNAME = getRootClassName(COMPONENT_NAME);
19
-
20
- /**
21
- * Component default props.
22
- */
23
- const DEFAULT_PROPS = {
24
- emphasis: Emphasis.high,
25
- size: Size.m
26
- };
27
-
28
- /**
29
- * IconButton component.
30
- *
31
- * @param props Component props.
32
- * @param ref Component ref.
33
- * @return React element.
34
- */
35
- const IconButton = forwardRef((props, ref) => {
36
- const defaultTheme = useTheme() || Theme.light;
37
- const {
38
- emphasis = DEFAULT_PROPS.emphasis,
39
- image,
40
- icon,
41
- label,
42
- size = DEFAULT_PROPS.size,
43
- theme = defaultTheme,
44
- tooltipProps,
45
- hideTooltip,
46
- ...forwardedProps
47
- } = props;
48
- return /*#__PURE__*/jsx(Tooltip, {
49
- label: hideTooltip ? '' : label,
50
- ...tooltipProps,
51
- children: /*#__PURE__*/jsx(ButtonRoot, {
52
- ref: ref,
53
- emphasis,
54
- size,
55
- theme,
56
- ...forwardedProps,
57
- "aria-label": label,
58
- variant: "icon",
59
- children: image ? /*#__PURE__*/jsx("img", {
60
- // no need to set alt as an aria-label is already set on the button
61
- alt: "",
62
- src: image
63
- }) : /*#__PURE__*/jsx(ThemeProvider, {
64
- value: undefined,
65
- children: /*#__PURE__*/jsx(Icon, {
66
- icon: icon
67
- })
68
- })
69
- })
70
- });
71
- });
72
- IconButton.displayName = COMPONENT_NAME;
73
- IconButton.className = CLASSNAME;
74
- IconButton.defaultProps = DEFAULT_PROPS;
75
-
76
- export { IconButton as I };
77
- //# sourceMappingURL=IconButton-351389b0.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"IconButton-351389b0.js","sources":["../../src/components/button/IconButton.tsx"],"sourcesContent":["import { Emphasis, Icon, Size, Theme, ThemeProvider, Tooltip, TooltipProps } from '@lumx/react';\nimport { BaseButtonProps, ButtonRoot } from '@lumx/react/components/button/ButtonRoot';\nimport { getRootClassName } from '@lumx/core/js/utils/className';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\nexport interface IconButtonProps extends BaseButtonProps {\n /**\n * Icon (SVG path).\n * If `image` is also set, `image` will be used instead.\n */\n icon?: string;\n /**\n * Image (image url).\n * Has priority over `icon`.\n */\n image?: string;\n /**\n * Label text (required for a11y purpose).\n * If you really don't want an aria-label, you can set an empty label (this is not recommended).\n */\n label: string;\n /**\n * Props to pass to the tooltip.\n * If undefined or if tooltipProps.label is undefined, the label prop will be used as tooltip label.\n * */\n tooltipProps?: Partial<TooltipProps>;\n /** Whether the tooltip should be hidden or not. */\n hideTooltip?: boolean;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'IconButton';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<IconButtonProps> = {\n emphasis: Emphasis.high,\n size: Size.m,\n};\n\n/**\n * IconButton component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const IconButton = forwardRef<IconButtonProps, HTMLButtonElement>((props, ref) => {\n const defaultTheme = useTheme() || Theme.light;\n const {\n emphasis = DEFAULT_PROPS.emphasis,\n image,\n icon,\n label,\n size = DEFAULT_PROPS.size,\n theme = defaultTheme,\n tooltipProps,\n hideTooltip,\n ...forwardedProps\n } = props;\n\n return (\n <Tooltip label={hideTooltip ? '' : label} {...tooltipProps}>\n <ButtonRoot ref={ref} {...{ emphasis, size, theme, ...forwardedProps }} aria-label={label} variant=\"icon\">\n {image ? (\n <img\n // no need to set alt as an aria-label is already set on the button\n alt=\"\"\n src={image}\n />\n ) : (\n <ThemeProvider value={undefined}>\n <Icon icon={icon as string} />\n </ThemeProvider>\n )}\n </ButtonRoot>\n </Tooltip>\n );\n});\nIconButton.displayName = COMPONENT_NAME;\nIconButton.className = CLASSNAME;\nIconButton.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","emphasis","Emphasis","high","size","Size","m","IconButton","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","image","icon","label","theme","tooltipProps","hideTooltip","forwardedProps","_jsx","Tooltip","children","ButtonRoot","variant","alt","src","ThemeProvider","value","undefined","Icon","displayName","className","defaultProps"],"mappings":";;;;;;;;;AA+BA;AACA;AACA;AACA,MAAMA,cAAc,GAAG,YAAY,CAAA;;AAEnC;AACA;AACA;AACA,MAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,CAAC,CAAA;;AAElD;AACA;AACA;AACA,MAAMG,aAAuC,GAAG;EAC5CC,QAAQ,EAAEC,QAAQ,CAACC,IAAI;EACvBC,IAAI,EAAEC,IAAI,CAACC,CAAAA;AACf,CAAC,CAAA;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMC,UAAU,GAAGC,UAAU,CAAqC,CAACC,KAAK,EAAEC,GAAG,KAAK;EACrF,MAAMC,YAAY,GAAGC,QAAQ,EAAE,IAAIC,KAAK,CAACC,KAAK,CAAA;EAC9C,MAAM;IACFb,QAAQ,GAAGD,aAAa,CAACC,QAAQ;IACjCc,KAAK;IACLC,IAAI;IACJC,KAAK;IACLb,IAAI,GAAGJ,aAAa,CAACI,IAAI;AACzBc,IAAAA,KAAK,GAAGP,YAAY;IACpBQ,YAAY;IACZC,WAAW;IACX,GAAGC,cAAAA;AACP,GAAC,GAAGZ,KAAK,CAAA;EAET,oBACIa,GAAA,CAACC,OAAO,EAAA;AAACN,IAAAA,KAAK,EAAEG,WAAW,GAAG,EAAE,GAAGH,KAAM;AAAA,IAAA,GAAKE,YAAY;IAAAK,QAAA,eACtDF,GAAA,CAACG,UAAU,EAAA;AAACf,MAAAA,GAAG,EAAEA,GAAI;MAAOT,QAAQ;MAAEG,IAAI;MAAEc,KAAK;AAAE,MAAA,GAAGG,cAAc;AAAI,MAAA,YAAA,EAAYJ,KAAM;AAACS,MAAAA,OAAO,EAAC,MAAM;MAAAF,QAAA,EACpGT,KAAK,gBACFO,GAAA,CAAA,KAAA,EAAA;AACI;AACAK,QAAAA,GAAG,EAAC,EAAE;AACNC,QAAAA,GAAG,EAAEb,KAAAA;AAAM,OACd,CAAC,gBAEFO,GAAA,CAACO,aAAa,EAAA;AAACC,QAAAA,KAAK,EAAEC,SAAU;QAAAP,QAAA,eAC5BF,GAAA,CAACU,IAAI,EAAA;AAAChB,UAAAA,IAAI,EAAEA,IAAAA;SAAiB,CAAA;OAClB,CAAA;KAEX,CAAA;AAAC,GACR,CAAC,CAAA;AAElB,CAAC,EAAC;AACFT,UAAU,CAAC0B,WAAW,GAAGpC,cAAc,CAAA;AACvCU,UAAU,CAAC2B,SAAS,GAAGpC,SAAS,CAAA;AAChCS,UAAU,CAAC4B,YAAY,GAAGnC,aAAa;;;;"}
@@ -1,75 +0,0 @@
1
- import { c as classNames } from './forwardRef-d0e90329.js';
2
- import { jsxs, jsx } from 'react/jsx-runtime';
3
- import { u as useTheme } from './ThemeContext-3181f000.js';
4
- import { FlexBox } from './components/flex-box-93b97715.js';
5
- import { T as Text } from './index-ab520e78.js';
6
-
7
- /** Internal component used to render image captions */
8
- const ImageCaption = props => {
9
- const defaultTheme = useTheme();
10
- const {
11
- baseClassName,
12
- theme = defaultTheme,
13
- as = 'figcaption',
14
- title,
15
- titleProps,
16
- description,
17
- descriptionProps,
18
- tags,
19
- captionStyle,
20
- align,
21
- truncate
22
- } = props;
23
- if (!title && !description && !tags) return null;
24
- const titleColor = {
25
- color: theme === 'dark' ? 'light' : 'dark'
26
- };
27
- const baseColor = {
28
- color: theme === 'dark' ? 'light' : 'dark',
29
- colorVariant: 'L2'
30
- };
31
-
32
- // Display description as string or HTML
33
- const descriptionContent = typeof description === 'string' ? {
34
- children: description
35
- } : {
36
- dangerouslySetInnerHTML: description
37
- };
38
- return /*#__PURE__*/jsxs(FlexBox, {
39
- as: as,
40
- className: classNames(baseClassName && `${baseClassName}__wrapper`),
41
- style: captionStyle,
42
- orientation: "vertical",
43
- vAlign: align,
44
- hAlign: align === 'center' ? align : undefined,
45
- gap: "regular",
46
- children: [(title || description) && /*#__PURE__*/jsxs(Text, {
47
- as: "p",
48
- className: classNames(baseClassName && `${baseClassName}__caption`),
49
- truncate: truncate,
50
- ...baseColor,
51
- children: [title && /*#__PURE__*/jsx(Text, {
52
- ...titleProps,
53
- as: "span",
54
- className: classNames(titleProps?.className, baseClassName && `${baseClassName}__title`),
55
- typography: "subtitle1",
56
- ...titleColor,
57
- children: title
58
- }), ' ', description && /*#__PURE__*/jsx(Text, {
59
- ...descriptionProps,
60
- as: "span",
61
- className: classNames(descriptionProps?.className, baseClassName && `${baseClassName}__description`),
62
- typography: "body1",
63
- ...descriptionContent
64
- })]
65
- }), tags && /*#__PURE__*/jsx(FlexBox, {
66
- className: classNames(baseClassName && `${baseClassName}__tags`),
67
- orientation: "horizontal",
68
- vAlign: align,
69
- children: tags
70
- })]
71
- });
72
- };
73
-
74
- export { ImageCaption as I };
75
- //# sourceMappingURL=ImageCaption-4109b433.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ImageCaption-4109b433.js","sources":["../../src/components/image-block/ImageCaption.tsx"],"sourcesContent":["import { CSSProperties, ReactNode } from 'react';\n\nimport { FlexBox, HorizontalAlignment, Text, TextProps, useTheme } from '@lumx/react';\nimport { HasPolymorphicAs, HasTheme } from '@lumx/react/utils/type';\nimport classNames from 'classnames';\n\ntype As = 'div' | 'figcaption';\n\ntype ForwardedTextProps = Omit<TextProps, 'as' | 'typography' | 'color' | 'colorVariant'>;\n\nexport type ImageCaptionMetadata = {\n /** Image title to display in the caption. */\n title?: string;\n /** Props to pass to the title. */\n titleProps?: ForwardedTextProps;\n /** Image description. Can be either a string, or sanitized html. */\n description?: string | { __html: string };\n /** Props to pass to the title. */\n descriptionProps?: ForwardedTextProps;\n /** Tag content. */\n tags?: ReactNode;\n /** Caption custom CSS style. */\n captionStyle?: CSSProperties;\n};\n\nexport type ImageCaptionProps<AS extends As = 'figcaption'> = HasTheme &\n HasPolymorphicAs<AS> &\n ImageCaptionMetadata & {\n /** Base className for sub elements */\n baseClassName?: string;\n /** Alignment. */\n align?: HorizontalAlignment;\n /** Truncate text on title & description (no line wrapping). */\n truncate?: TextProps['truncate'];\n };\n\n/** Internal component used to render image captions */\nexport const ImageCaption = <AS extends As>(props: ImageCaptionProps<AS>) => {\n const defaultTheme = useTheme();\n const {\n baseClassName,\n theme = defaultTheme,\n as = 'figcaption',\n title,\n titleProps,\n description,\n descriptionProps,\n tags,\n captionStyle,\n align,\n truncate,\n } = props;\n if (!title && !description && !tags) return null;\n\n const titleColor = { color: theme === 'dark' ? 'light' : 'dark' } as const;\n const baseColor = { color: theme === 'dark' ? 'light' : 'dark', colorVariant: 'L2' } as const;\n\n // Display description as string or HTML\n const descriptionContent =\n typeof description === 'string' ? { children: description } : { dangerouslySetInnerHTML: description };\n\n return (\n <FlexBox\n as={as}\n className={classNames(baseClassName && `${baseClassName}__wrapper`)}\n style={captionStyle}\n orientation=\"vertical\"\n vAlign={align}\n hAlign={align === 'center' ? align : undefined}\n gap=\"regular\"\n >\n {(title || description) && (\n <Text\n as=\"p\"\n className={classNames(baseClassName && `${baseClassName}__caption`)}\n truncate={truncate}\n {...baseColor}\n >\n {title && (\n <Text\n {...titleProps}\n as=\"span\"\n className={classNames(titleProps?.className, baseClassName && `${baseClassName}__title`)}\n typography=\"subtitle1\"\n {...titleColor}\n >\n {title}\n </Text>\n )}{' '}\n {description && (\n <Text\n {...descriptionProps}\n as=\"span\"\n className={classNames(\n descriptionProps?.className,\n baseClassName && `${baseClassName}__description`,\n )}\n typography=\"body1\"\n {...descriptionContent}\n />\n )}\n </Text>\n )}\n {tags && (\n <FlexBox\n className={classNames(baseClassName && `${baseClassName}__tags`)}\n orientation=\"horizontal\"\n vAlign={align}\n >\n {tags}\n </FlexBox>\n )}\n </FlexBox>\n );\n};\n"],"names":["ImageCaption","props","defaultTheme","useTheme","baseClassName","theme","as","title","titleProps","description","descriptionProps","tags","captionStyle","align","truncate","titleColor","color","baseColor","colorVariant","descriptionContent","children","dangerouslySetInnerHTML","_jsxs","FlexBox","className","classNames","style","orientation","vAlign","hAlign","undefined","gap","Text","_jsx","typography"],"mappings":"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"}