@transferwise/components 46.160.0 → 46.160.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (121) hide show
  1. package/build/ExpressiveMoneyInput/Chevron/Chevron.js +10 -2
  2. package/build/ExpressiveMoneyInput/Chevron/Chevron.js.map +1 -1
  3. package/build/ExpressiveMoneyInput/Chevron/Chevron.mjs +11 -3
  4. package/build/ExpressiveMoneyInput/Chevron/Chevron.mjs.map +1 -1
  5. package/build/ProcessIndicator/ProcessIndicator.js +1 -1
  6. package/build/ProcessIndicator/ProcessIndicator.js.map +1 -1
  7. package/build/ProcessIndicator/ProcessIndicator.mjs +1 -1
  8. package/build/ProcessIndicator/ProcessIndicator.mjs.map +1 -1
  9. package/build/Prompt/CriticalBanner/CriticalBanner.js +10 -1
  10. package/build/Prompt/CriticalBanner/CriticalBanner.js.map +1 -1
  11. package/build/Prompt/CriticalBanner/CriticalBanner.mjs +10 -1
  12. package/build/Prompt/CriticalBanner/CriticalBanner.mjs.map +1 -1
  13. package/build/common/Panel/Panel.js +13 -25
  14. package/build/common/Panel/Panel.js.map +1 -1
  15. package/build/common/Panel/Panel.mjs +10 -22
  16. package/build/common/Panel/Panel.mjs.map +1 -1
  17. package/build/common/Panel/Panel.positionUtils.js +68 -0
  18. package/build/common/Panel/Panel.positionUtils.js.map +1 -0
  19. package/build/common/Panel/Panel.positionUtils.mjs +63 -0
  20. package/build/common/Panel/Panel.positionUtils.mjs.map +1 -0
  21. package/build/common/PropsValues/position.js +0 -25
  22. package/build/common/PropsValues/position.js.map +1 -1
  23. package/build/common/PropsValues/position.mjs +1 -24
  24. package/build/common/PropsValues/position.mjs.map +1 -1
  25. package/build/main.css +102 -68
  26. package/build/styles/AvatarView/AvatarView.css +8 -0
  27. package/build/styles/AvatarView/Dot/Dot.css +8 -0
  28. package/build/styles/CheckboxButton/CheckboxButton.css +3 -0
  29. package/build/styles/Nudge/Nudge.css +4 -38
  30. package/build/styles/Prompt/CriticalBanner/CriticalBanner.css +34 -0
  31. package/build/styles/SlidingPanel/SlidingPanel.css +8 -0
  32. package/build/styles/UploadInput/UploadItem/UploadItem.css +4 -5
  33. package/build/styles/_deprecated/Badge/Badge.css +4 -2
  34. package/build/styles/common/Panel/Panel.css +12 -4
  35. package/build/styles/css/accordion.css +3 -0
  36. package/build/styles/css/buttons.css +1 -7
  37. package/build/styles/css/chevron.css +3 -0
  38. package/build/styles/css/neptune.css +25 -19
  39. package/build/styles/css/process.css +15 -9
  40. package/build/styles/css/tick.css +6 -3
  41. package/build/styles/main.css +102 -68
  42. package/build/styles/styles/less/accordion.css +3 -0
  43. package/build/styles/styles/less/buttons.css +1 -7
  44. package/build/styles/styles/less/chevron.css +3 -0
  45. package/build/styles/styles/less/neptune.css +25 -19
  46. package/build/styles/styles/less/process.css +15 -9
  47. package/build/styles/styles/less/tick.css +6 -3
  48. package/build/types/ExpressiveMoneyInput/Chevron/Chevron.d.ts.map +1 -1
  49. package/build/types/Prompt/CriticalBanner/CriticalBanner.d.ts +6 -1
  50. package/build/types/Prompt/CriticalBanner/CriticalBanner.d.ts.map +1 -1
  51. package/build/types/common/Panel/Panel.d.ts +1 -1
  52. package/build/types/common/Panel/Panel.d.ts.map +1 -1
  53. package/build/types/common/Panel/Panel.positionUtils.d.ts +7 -0
  54. package/build/types/common/Panel/Panel.positionUtils.d.ts.map +1 -0
  55. package/build/types/common/PropsValues/position.d.ts +0 -13
  56. package/build/types/common/PropsValues/position.d.ts.map +1 -1
  57. package/build/types/common/ResponsivePanel/ResponsivePanel.d.ts +1 -1
  58. package/package.json +5 -5
  59. package/src/AvatarView/AvatarView.css +8 -0
  60. package/src/AvatarView/Dot/Dot.css +8 -0
  61. package/src/AvatarView/Dot/Dot.less +7 -1
  62. package/src/Button/_stories/Button.test.story.tsx +1 -1
  63. package/src/Checkbox/_stories/Checkbox.story.tsx +1 -1
  64. package/src/Checkbox/_stories/Checkbox.test.story.tsx +3 -2
  65. package/src/CheckboxButton/CheckboxButton.css +3 -0
  66. package/src/CheckboxButton/CheckboxButton.less +4 -0
  67. package/src/Chevron/_stories/Chevron.test.story.tsx +2 -2
  68. package/src/ExpressiveMoneyInput/Chevron/Chevron.tsx +8 -3
  69. package/src/Header/_stories/Header.test.story.tsx +1 -1
  70. package/src/Info/_stories/Info.rtl.test.story.tsx +35 -10
  71. package/src/Info/_stories/Info.story.tsx +1 -1
  72. package/src/Inputs/SelectInput/_stories/SelectInput.test.story.tsx +1 -1
  73. package/src/ListItem/_stories/subcomponents.tsx +1 -1
  74. package/src/Loader/_stories/Loader.test.story.tsx +23 -0
  75. package/src/MoneyInput/_stories/MoneyInput.rtl.test.story.tsx +1 -1
  76. package/src/Nudge/Nudge.css +4 -38
  77. package/src/Nudge/Nudge.less +4 -4
  78. package/src/Nudge/_stories/Nudge.test.story.tsx +29 -12
  79. package/src/PhoneNumberInput/_stories/{PhoneNumberInput.test.story.tsx → PhoneNumberInput.rtl.test.story.tsx} +18 -10
  80. package/src/ProcessIndicator/ProcessIndicator.tsx +1 -1
  81. package/src/ProcessIndicator/_stories/ProcessIndicator.test.story.tsx +32 -0
  82. package/src/ProgressBar/_stories/ProgressBar.test.story.tsx +33 -19
  83. package/src/Prompt/CriticalBanner/CriticalBanner.css +34 -0
  84. package/src/Prompt/CriticalBanner/CriticalBanner.less +45 -0
  85. package/src/Prompt/CriticalBanner/CriticalBanner.test.tsx +26 -3
  86. package/src/Prompt/CriticalBanner/CriticalBanner.tsx +15 -1
  87. package/src/Prompt/CriticalBanner/_stories/CriticalBanner.accessibility.docs.mdx +4 -1
  88. package/src/Prompt/CriticalBanner/_stories/CriticalBanner.story.tsx +52 -0
  89. package/src/Prompt/CriticalBanner/_stories/CriticalBanner.test.story.tsx +22 -1
  90. package/src/SlidingPanel/SlidingPanel.css +8 -0
  91. package/src/SlidingPanel/SlidingPanel.less +8 -0
  92. package/src/SlidingPanel/_stories/SlidingPanel.rtl.test.story.tsx +4 -3
  93. package/src/Snackbar/_stories/Snackbar.rtl.test.story.tsx +14 -16
  94. package/src/Snackbar/_stories/Snackbar.story.tsx +1 -1
  95. package/src/Snackbar/_stories/Snackbar.test.story.tsx +1 -1
  96. package/src/StatusIcon/_stories/StatusIcon.test.story.tsx +12 -4
  97. package/src/UploadInput/UploadItem/UploadItem.css +4 -5
  98. package/src/UploadInput/UploadItem/UploadItem.less +7 -6
  99. package/src/UploadInput/_stories/UploadInput.test.story.tsx +1 -1
  100. package/src/_deprecated/Badge/Badge.css +4 -2
  101. package/src/_deprecated/Badge/Badge.less +7 -14
  102. package/src/_deprecated/CriticalBanner/_stories/CriticalCommsBanner.test.story.tsx +0 -16
  103. package/src/_deprecated/OverlayHeader/_stories/OverlayHeader.test.story.tsx +15 -0
  104. package/src/common/Panel/Panel.css +12 -4
  105. package/src/common/Panel/Panel.less +27 -9
  106. package/src/common/Panel/Panel.positionUtils.ts +79 -0
  107. package/src/common/Panel/Panel.test.tsx +40 -0
  108. package/src/common/Panel/Panel.tsx +13 -24
  109. package/src/common/Panel/_stories/Panel.rtl.test.story.tsx +110 -0
  110. package/src/common/PropsValues/position.ts +0 -50
  111. package/src/main.css +102 -68
  112. package/src/styles/less/accordion.css +3 -0
  113. package/src/styles/less/buttons.css +1 -7
  114. package/src/styles/less/buttons.less +3 -11
  115. package/src/styles/less/chevron.css +3 -0
  116. package/src/styles/less/chevron.less +4 -0
  117. package/src/styles/less/neptune.css +25 -19
  118. package/src/styles/less/process.css +15 -9
  119. package/src/styles/less/process.less +13 -6
  120. package/src/styles/less/tick.css +6 -3
  121. package/src/styles/less/tick.less +7 -3
@@ -1 +1 @@
1
- {"version":3,"file":"Panel.mjs","sources":["../../../src/common/Panel/Panel.tsx"],"sourcesContent":["import {\n arrow as arrowMiddleware,\n autoUpdate,\n flip as flipMiddleware,\n offset,\n type Placement,\n shift,\n size as sizeMiddleware,\n useFloating,\n} from '@floating-ui/react';\nimport { clsx } from 'clsx';\nimport {\n CSSProperties,\n HTMLAttributes,\n PropsWithChildren,\n RefObject,\n SyntheticEvent,\n forwardRef,\n useContext,\n useRef,\n} from 'react';\n\nimport { Position, type FloatingPlacement, positionToPlacement } from '..';\nimport Dimmer from '../../Dimmer';\nimport { OverlayIdContext } from '../../Provider/overlay/OverlayIdProvider';\n\nconst POPOVER_OFFSET = 16;\n\n// By default the flip positioning explores only the opposite alternative. So if left is passed and there's no enough space\n// the right one gets chosen. If there's no space on both sides popover goes back to the initially chosen one left.\n// This mapping forces popover to try the four available positions before going back to the initial chosen one.\nconst fallbackPlacements: Record<Placement, Placement[]> = {\n [Position.TOP]: [Position.BOTTOM, Position.RIGHT, Position.LEFT],\n [Position.BOTTOM]: [Position.TOP, Position.RIGHT, Position.LEFT],\n [Position.LEFT]: [Position.RIGHT, Position.TOP, Position.BOTTOM],\n [Position.RIGHT]: [Position.LEFT, Position.TOP, Position.BOTTOM],\n 'top-start': ['bottom-start', 'top-end', 'bottom-end'],\n 'top-end': ['bottom-end', 'top-start', 'bottom-start'],\n 'bottom-start': ['top-start', 'bottom-end', 'top-end'],\n 'bottom-end': ['top-end', 'bottom-start', 'top-start'],\n 'left-start': ['right-start', 'left-end', 'right-end'],\n 'left-end': ['right-end', 'left-start', 'right-start'],\n 'right-start': ['left-start', 'right-end', 'left-end'],\n 'right-end': ['left-end', 'right-start', 'left-start'],\n};\n\nexport type PanelProps = PropsWithChildren<{\n arrow?: boolean;\n flip?: boolean;\n altAxis?: boolean;\n open?: boolean;\n onClose?: (event: Event | SyntheticEvent) => void;\n position?: FloatingPlacement;\n anchorRef: RefObject<Element | null>;\n anchorWidth?: boolean;\n considerHeight?: boolean;\n}> &\n HTMLAttributes<HTMLDivElement>;\n\nconst Panel = forwardRef<HTMLDivElement, PanelProps>(function Panel(\n {\n arrow = false,\n flip = true,\n altAxis = false,\n children,\n open = false,\n onClose,\n position = Position.BOTTOM,\n anchorRef,\n anchorWidth = false,\n considerHeight = false,\n ...rest\n }: PanelProps,\n reference,\n) {\n const arrowRef = useRef<HTMLDivElement | null>(null);\n const floatingPlacement = positionToPlacement(position);\n\n const middleware = [];\n\n if (arrow) {\n middleware.push(offset(POPOVER_OFFSET));\n }\n\n if (flip && fallbackPlacements[floatingPlacement]) {\n middleware.push(\n flipMiddleware({\n fallbackPlacements: fallbackPlacements[floatingPlacement],\n }),\n );\n }\n\n if (altAxis) {\n middleware.push(shift());\n }\n\n if (arrow) {\n middleware.push(arrowMiddleware({ element: arrowRef, padding: 8 }));\n }\n\n if (considerHeight) {\n middleware.push(\n sizeMiddleware({\n padding: POPOVER_OFFSET,\n apply: ({ elements, availableHeight }) => {\n elements.floating.style.setProperty(\n '--np-panel-available-height',\n `${availableHeight}px`,\n );\n },\n }),\n );\n }\n\n const { refs, floatingStyles, placement, middlewareData } = useFloating({\n placement: floatingPlacement,\n middleware,\n elements: {\n reference: anchorRef.current,\n },\n whileElementsMounted: open ? autoUpdate : undefined,\n });\n\n const arrowStyle: CSSProperties = {\n ...(middlewareData.arrow?.x != null ? { left: middlewareData.arrow.x } : {}),\n ...(middlewareData.arrow?.y != null ? { top: middlewareData.arrow.y } : {}),\n };\n\n const contentStyle: CSSProperties = {\n ...(anchorWidth ? { width: anchorRef.current?.clientWidth } : undefined),\n };\n\n const overlayId = useContext(OverlayIdContext);\n\n return (\n <Dimmer open={open} transparent fadeContentOnEnter fadeContentOnExit onClose={onClose}>\n <div\n id={overlayId}\n {...rest}\n ref={refs.setFloating}\n role=\"dialog\"\n style={floatingStyles}\n data-popper-placement={placement}\n className={clsx('np-panel', { 'np-panel--open': open }, rest.className)}\n >\n <div ref={reference} style={contentStyle} className={clsx('np-panel__content')}>\n {children}\n {/* Arrow has to stay inside content to get the same animations as the \"dialog\" and to get hidden when panel is closed. */}\n {arrow && <div ref={arrowRef} className={clsx('np-panel__arrow')} style={arrowStyle} />}\n </div>\n </div>\n </Dimmer>\n );\n});\n\nexport default Panel;\n"],"names":["POPOVER_OFFSET","fallbackPlacements","Position","TOP","BOTTOM","RIGHT","LEFT","Panel","forwardRef","arrow","flip","altAxis","children","open","onClose","position","anchorRef","anchorWidth","considerHeight","rest","reference","arrowRef","useRef","floatingPlacement","positionToPlacement","middleware","push","offset","flipMiddleware","shift","arrowMiddleware","element","padding","sizeMiddleware","apply","elements","availableHeight","floating","style","setProperty","refs","floatingStyles","placement","middlewareData","useFloating","current","whileElementsMounted","autoUpdate","undefined","arrowStyle","x","left","y","top","contentStyle","width","clientWidth","overlayId","useContext","OverlayIdContext","_jsx","Dimmer","transparent","fadeContentOnEnter","fadeContentOnExit","id","ref","setFloating","role","className","clsx","_jsxs"],"mappings":"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"}
1
+ {"version":3,"file":"Panel.mjs","sources":["../../../src/common/Panel/Panel.tsx"],"sourcesContent":["import {\n arrow as arrowMiddleware,\n autoUpdate,\n flip as flipMiddleware,\n offset,\n shift,\n size as sizeMiddleware,\n useFloating,\n} from '@floating-ui/react';\nimport { clsx } from 'clsx';\nimport {\n CSSProperties,\n HTMLAttributes,\n PropsWithChildren,\n RefObject,\n SyntheticEvent,\n forwardRef,\n useContext,\n useRef,\n} from 'react';\n\nimport { OverlayIdContext } from '../../Provider/overlay/OverlayIdProvider';\nimport Dimmer from '../../Dimmer';\nimport useDirection from '../hooks/useDirection';\nimport { Position } from '..';\nimport {\n type FloatingPlacement,\n POPOVER_OFFSET,\n fallbackPlacements,\n mirrorPositionForRtl,\n positionToPlacement,\n} from './Panel.positionUtils';\n\nexport type PanelProps = PropsWithChildren<{\n arrow?: boolean;\n flip?: boolean;\n altAxis?: boolean;\n open?: boolean;\n onClose?: (event: Event | SyntheticEvent) => void;\n position?: FloatingPlacement;\n anchorRef: RefObject<Element | null>;\n anchorWidth?: boolean;\n considerHeight?: boolean;\n}> &\n HTMLAttributes<HTMLDivElement>;\n\nconst Panel = forwardRef<HTMLDivElement, PanelProps>(function Panel(\n {\n arrow = false,\n flip = true,\n altAxis = false,\n children,\n open = false,\n onClose,\n position = Position.BOTTOM,\n anchorRef,\n anchorWidth = false,\n considerHeight = false,\n ...rest\n }: PanelProps,\n reference,\n) {\n const arrowRef = useRef<HTMLDivElement | null>(null);\n const { isRTL } = useDirection();\n const resolvedPosition = isRTL ? mirrorPositionForRtl(position) : position;\n const floatingPlacement = positionToPlacement(resolvedPosition);\n\n const middleware = [];\n\n if (arrow) {\n middleware.push(offset(POPOVER_OFFSET));\n }\n\n if (flip && fallbackPlacements[floatingPlacement]) {\n middleware.push(\n flipMiddleware({\n fallbackPlacements: fallbackPlacements[floatingPlacement],\n }),\n );\n }\n\n if (altAxis) {\n middleware.push(shift());\n }\n\n if (arrow) {\n middleware.push(arrowMiddleware({ element: arrowRef, padding: 8 }));\n }\n\n if (considerHeight) {\n middleware.push(\n sizeMiddleware({\n padding: POPOVER_OFFSET,\n apply: ({ elements, availableHeight }) => {\n elements.floating.style.setProperty(\n '--np-panel-available-height',\n `${availableHeight}px`,\n );\n },\n }),\n );\n }\n\n const { refs, floatingStyles, placement, middlewareData } = useFloating({\n placement: floatingPlacement,\n middleware,\n elements: {\n reference: anchorRef.current,\n },\n whileElementsMounted: open ? autoUpdate : undefined,\n });\n\n const arrowStyle: CSSProperties = {\n ...(middlewareData.arrow?.x != null ? { left: middlewareData.arrow.x } : {}),\n ...(middlewareData.arrow?.y != null ? { top: middlewareData.arrow.y } : {}),\n };\n\n const contentStyle: CSSProperties = {\n ...(anchorWidth ? { width: anchorRef.current?.clientWidth } : undefined),\n };\n\n const overlayId = useContext(OverlayIdContext);\n\n return (\n <Dimmer open={open} transparent fadeContentOnEnter fadeContentOnExit onClose={onClose}>\n <div\n id={overlayId}\n {...rest}\n ref={refs.setFloating}\n role=\"dialog\"\n style={floatingStyles}\n data-popper-placement={placement}\n className={clsx('np-panel', { 'np-panel--open': open }, rest.className)}\n >\n <div ref={reference} style={contentStyle} className={clsx('np-panel__content')}>\n {children}\n {/* Arrow has to stay inside content to get the same animations as the \"dialog\" and to get hidden when panel is closed. */}\n {arrow && <div ref={arrowRef} className={clsx('np-panel__arrow')} style={arrowStyle} />}\n </div>\n </div>\n </Dimmer>\n );\n});\n\nexport default Panel;\n"],"names":["Panel","forwardRef","arrow","flip","altAxis","children","open","onClose","position","Position","BOTTOM","anchorRef","anchorWidth","considerHeight","rest","reference","arrowRef","useRef","isRTL","useDirection","resolvedPosition","mirrorPositionForRtl","floatingPlacement","positionToPlacement","middleware","push","offset","POPOVER_OFFSET","fallbackPlacements","flipMiddleware","shift","arrowMiddleware","element","padding","sizeMiddleware","apply","elements","availableHeight","floating","style","setProperty","refs","floatingStyles","placement","middlewareData","useFloating","current","whileElementsMounted","autoUpdate","undefined","arrowStyle","x","left","y","top","contentStyle","width","clientWidth","overlayId","useContext","OverlayIdContext","_jsx","Dimmer","transparent","fadeContentOnEnter","fadeContentOnExit","id","ref","setFloating","role","className","clsx","_jsxs"],"mappings":"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"}
@@ -0,0 +1,68 @@
1
+ 'use strict';
2
+
3
+ const POPOVER_OFFSET = 16;
4
+ // By default the flip positioning explores only the opposite alternative. So if left is passed and there's no enough space
5
+ // the right one gets chosen. If there's no space on both sides popover goes back to the initially chosen one left.
6
+ // This mapping forces popover to try the four available positions before going back to the initial chosen one.
7
+ const fallbackPlacements = {
8
+ top: ['bottom', 'right', 'left'],
9
+ bottom: ['top', 'right', 'left'],
10
+ left: ['right', 'top', 'bottom'],
11
+ right: ['left', 'top', 'bottom'],
12
+ 'top-start': ['bottom-start', 'top-end', 'bottom-end'],
13
+ 'top-end': ['bottom-end', 'top-start', 'bottom-start'],
14
+ 'bottom-start': ['top-start', 'bottom-end', 'top-end'],
15
+ 'bottom-end': ['top-end', 'bottom-start', 'top-start'],
16
+ 'left-start': ['right-start', 'left-end', 'right-end'],
17
+ 'left-end': ['right-end', 'left-start', 'right-start'],
18
+ 'right-start': ['left-start', 'right-end', 'left-end'],
19
+ 'right-end': ['left-end', 'right-start', 'left-start']
20
+ };
21
+ const positionToPlacement = position => {
22
+ switch (position) {
23
+ case 'top-left':
24
+ return 'top-start';
25
+ case 'top-right':
26
+ return 'top-end';
27
+ case 'bottom-left':
28
+ return 'bottom-start';
29
+ case 'bottom-right':
30
+ return 'bottom-end';
31
+ case 'left-top':
32
+ return 'left-start';
33
+ case 'left-bottom':
34
+ return 'left-end';
35
+ case 'right-top':
36
+ return 'right-start';
37
+ case 'right-bottom':
38
+ return 'right-end';
39
+ default:
40
+ return position;
41
+ }
42
+ };
43
+ const mirrorPositionForRtl = position => {
44
+ switch (position) {
45
+ case 'left':
46
+ return 'right';
47
+ case 'right':
48
+ return 'left';
49
+ case 'left-top':
50
+ return 'right-top';
51
+ case 'left-bottom':
52
+ return 'right-bottom';
53
+ case 'right-top':
54
+ return 'left-top';
55
+ case 'right-bottom':
56
+ return 'left-bottom';
57
+ default:
58
+ // top-left/top-right/bottom-left/bottom-right map to start/end via
59
+ // positionToPlacement, and floating-ui already flips start/end in RTL.
60
+ return position;
61
+ }
62
+ };
63
+
64
+ exports.POPOVER_OFFSET = POPOVER_OFFSET;
65
+ exports.fallbackPlacements = fallbackPlacements;
66
+ exports.mirrorPositionForRtl = mirrorPositionForRtl;
67
+ exports.positionToPlacement = positionToPlacement;
68
+ //# sourceMappingURL=Panel.positionUtils.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Panel.positionUtils.js","sources":["../../../src/common/Panel/Panel.positionUtils.ts"],"sourcesContent":["import type { Placement } from '@floating-ui/react';\n\nexport type FloatingPlacement =\n | 'top'\n | 'right'\n | 'bottom'\n | 'left'\n | 'top-left'\n | 'top-right'\n | 'right-top'\n | 'right-bottom'\n | 'bottom-left'\n | 'bottom-right'\n | 'left-top'\n | 'left-bottom';\n\nexport const POPOVER_OFFSET = 16;\n\n// By default the flip positioning explores only the opposite alternative. So if left is passed and there's no enough space\n// the right one gets chosen. If there's no space on both sides popover goes back to the initially chosen one left.\n// This mapping forces popover to try the four available positions before going back to the initial chosen one.\nexport const fallbackPlacements: Record<Placement, Placement[]> = {\n top: ['bottom', 'right', 'left'],\n bottom: ['top', 'right', 'left'],\n left: ['right', 'top', 'bottom'],\n right: ['left', 'top', 'bottom'],\n 'top-start': ['bottom-start', 'top-end', 'bottom-end'],\n 'top-end': ['bottom-end', 'top-start', 'bottom-start'],\n 'bottom-start': ['top-start', 'bottom-end', 'top-end'],\n 'bottom-end': ['top-end', 'bottom-start', 'top-start'],\n 'left-start': ['right-start', 'left-end', 'right-end'],\n 'left-end': ['right-end', 'left-start', 'right-start'],\n 'right-start': ['left-start', 'right-end', 'left-end'],\n 'right-end': ['left-end', 'right-start', 'left-start'],\n};\n\nexport const positionToPlacement = (position: FloatingPlacement): Placement => {\n switch (position) {\n case 'top-left':\n return 'top-start';\n case 'top-right':\n return 'top-end';\n case 'bottom-left':\n return 'bottom-start';\n case 'bottom-right':\n return 'bottom-end';\n case 'left-top':\n return 'left-start';\n case 'left-bottom':\n return 'left-end';\n case 'right-top':\n return 'right-start';\n case 'right-bottom':\n return 'right-end';\n default:\n return position;\n }\n};\n\nexport const mirrorPositionForRtl = (position: FloatingPlacement): FloatingPlacement => {\n switch (position) {\n case 'left':\n return 'right';\n case 'right':\n return 'left';\n case 'left-top':\n return 'right-top';\n case 'left-bottom':\n return 'right-bottom';\n case 'right-top':\n return 'left-top';\n case 'right-bottom':\n return 'left-bottom';\n default:\n // top-left/top-right/bottom-left/bottom-right map to start/end via\n // positionToPlacement, and floating-ui already flips start/end in RTL.\n return position;\n }\n};\n"],"names":["POPOVER_OFFSET","fallbackPlacements","top","bottom","left","right","positionToPlacement","position","mirrorPositionForRtl"],"mappings":";;AAgBO,MAAMA,cAAc,GAAG;AAE9B;AACA;AACA;AACO,MAAMC,kBAAkB,GAAmC;AAChEC,EAAAA,GAAG,EAAE,CAAC,QAAQ,EAAE,OAAO,EAAE,MAAM,CAAC;AAChCC,EAAAA,MAAM,EAAE,CAAC,KAAK,EAAE,OAAO,EAAE,MAAM,CAAC;AAChCC,EAAAA,IAAI,EAAE,CAAC,OAAO,EAAE,KAAK,EAAE,QAAQ,CAAC;AAChCC,EAAAA,KAAK,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,QAAQ,CAAC;AAChC,EAAA,WAAW,EAAE,CAAC,cAAc,EAAE,SAAS,EAAE,YAAY,CAAC;AACtD,EAAA,SAAS,EAAE,CAAC,YAAY,EAAE,WAAW,EAAE,cAAc,CAAC;AACtD,EAAA,cAAc,EAAE,CAAC,WAAW,EAAE,YAAY,EAAE,SAAS,CAAC;AACtD,EAAA,YAAY,EAAE,CAAC,SAAS,EAAE,cAAc,EAAE,WAAW,CAAC;AACtD,EAAA,YAAY,EAAE,CAAC,aAAa,EAAE,UAAU,EAAE,WAAW,CAAC;AACtD,EAAA,UAAU,EAAE,CAAC,WAAW,EAAE,YAAY,EAAE,aAAa,CAAC;AACtD,EAAA,aAAa,EAAE,CAAC,YAAY,EAAE,WAAW,EAAE,UAAU,CAAC;AACtD,EAAA,WAAW,EAAE,CAAC,UAAU,EAAE,aAAa,EAAE,YAAY;;AAGhD,MAAMC,mBAAmB,GAAIC,QAA2B,IAAe;AAC5E,EAAA,QAAQA,QAAQ;AACd,IAAA,KAAK,UAAU;AACb,MAAA,OAAO,WAAW;AACpB,IAAA,KAAK,WAAW;AACd,MAAA,OAAO,SAAS;AAClB,IAAA,KAAK,aAAa;AAChB,MAAA,OAAO,cAAc;AACvB,IAAA,KAAK,cAAc;AACjB,MAAA,OAAO,YAAY;AACrB,IAAA,KAAK,UAAU;AACb,MAAA,OAAO,YAAY;AACrB,IAAA,KAAK,aAAa;AAChB,MAAA,OAAO,UAAU;AACnB,IAAA,KAAK,WAAW;AACd,MAAA,OAAO,aAAa;AACtB,IAAA,KAAK,cAAc;AACjB,MAAA,OAAO,WAAW;AACpB,IAAA;AACE,MAAA,OAAOA,QAAQ;AACnB;AACF;AAEO,MAAMC,oBAAoB,GAAID,QAA2B,IAAuB;AACrF,EAAA,QAAQA,QAAQ;AACd,IAAA,KAAK,MAAM;AACT,MAAA,OAAO,OAAO;AAChB,IAAA,KAAK,OAAO;AACV,MAAA,OAAO,MAAM;AACf,IAAA,KAAK,UAAU;AACb,MAAA,OAAO,WAAW;AACpB,IAAA,KAAK,aAAa;AAChB,MAAA,OAAO,cAAc;AACvB,IAAA,KAAK,WAAW;AACd,MAAA,OAAO,UAAU;AACnB,IAAA,KAAK,cAAc;AACjB,MAAA,OAAO,aAAa;AACtB,IAAA;AACE;AACA;AACA,MAAA,OAAOA,QAAQ;AACnB;AACF;;;;;;;"}
@@ -0,0 +1,63 @@
1
+ const POPOVER_OFFSET = 16;
2
+ // By default the flip positioning explores only the opposite alternative. So if left is passed and there's no enough space
3
+ // the right one gets chosen. If there's no space on both sides popover goes back to the initially chosen one left.
4
+ // This mapping forces popover to try the four available positions before going back to the initial chosen one.
5
+ const fallbackPlacements = {
6
+ top: ['bottom', 'right', 'left'],
7
+ bottom: ['top', 'right', 'left'],
8
+ left: ['right', 'top', 'bottom'],
9
+ right: ['left', 'top', 'bottom'],
10
+ 'top-start': ['bottom-start', 'top-end', 'bottom-end'],
11
+ 'top-end': ['bottom-end', 'top-start', 'bottom-start'],
12
+ 'bottom-start': ['top-start', 'bottom-end', 'top-end'],
13
+ 'bottom-end': ['top-end', 'bottom-start', 'top-start'],
14
+ 'left-start': ['right-start', 'left-end', 'right-end'],
15
+ 'left-end': ['right-end', 'left-start', 'right-start'],
16
+ 'right-start': ['left-start', 'right-end', 'left-end'],
17
+ 'right-end': ['left-end', 'right-start', 'left-start']
18
+ };
19
+ const positionToPlacement = position => {
20
+ switch (position) {
21
+ case 'top-left':
22
+ return 'top-start';
23
+ case 'top-right':
24
+ return 'top-end';
25
+ case 'bottom-left':
26
+ return 'bottom-start';
27
+ case 'bottom-right':
28
+ return 'bottom-end';
29
+ case 'left-top':
30
+ return 'left-start';
31
+ case 'left-bottom':
32
+ return 'left-end';
33
+ case 'right-top':
34
+ return 'right-start';
35
+ case 'right-bottom':
36
+ return 'right-end';
37
+ default:
38
+ return position;
39
+ }
40
+ };
41
+ const mirrorPositionForRtl = position => {
42
+ switch (position) {
43
+ case 'left':
44
+ return 'right';
45
+ case 'right':
46
+ return 'left';
47
+ case 'left-top':
48
+ return 'right-top';
49
+ case 'left-bottom':
50
+ return 'right-bottom';
51
+ case 'right-top':
52
+ return 'left-top';
53
+ case 'right-bottom':
54
+ return 'left-bottom';
55
+ default:
56
+ // top-left/top-right/bottom-left/bottom-right map to start/end via
57
+ // positionToPlacement, and floating-ui already flips start/end in RTL.
58
+ return position;
59
+ }
60
+ };
61
+
62
+ export { POPOVER_OFFSET, fallbackPlacements, mirrorPositionForRtl, positionToPlacement };
63
+ //# sourceMappingURL=Panel.positionUtils.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Panel.positionUtils.mjs","sources":["../../../src/common/Panel/Panel.positionUtils.ts"],"sourcesContent":["import type { Placement } from '@floating-ui/react';\n\nexport type FloatingPlacement =\n | 'top'\n | 'right'\n | 'bottom'\n | 'left'\n | 'top-left'\n | 'top-right'\n | 'right-top'\n | 'right-bottom'\n | 'bottom-left'\n | 'bottom-right'\n | 'left-top'\n | 'left-bottom';\n\nexport const POPOVER_OFFSET = 16;\n\n// By default the flip positioning explores only the opposite alternative. So if left is passed and there's no enough space\n// the right one gets chosen. If there's no space on both sides popover goes back to the initially chosen one left.\n// This mapping forces popover to try the four available positions before going back to the initial chosen one.\nexport const fallbackPlacements: Record<Placement, Placement[]> = {\n top: ['bottom', 'right', 'left'],\n bottom: ['top', 'right', 'left'],\n left: ['right', 'top', 'bottom'],\n right: ['left', 'top', 'bottom'],\n 'top-start': ['bottom-start', 'top-end', 'bottom-end'],\n 'top-end': ['bottom-end', 'top-start', 'bottom-start'],\n 'bottom-start': ['top-start', 'bottom-end', 'top-end'],\n 'bottom-end': ['top-end', 'bottom-start', 'top-start'],\n 'left-start': ['right-start', 'left-end', 'right-end'],\n 'left-end': ['right-end', 'left-start', 'right-start'],\n 'right-start': ['left-start', 'right-end', 'left-end'],\n 'right-end': ['left-end', 'right-start', 'left-start'],\n};\n\nexport const positionToPlacement = (position: FloatingPlacement): Placement => {\n switch (position) {\n case 'top-left':\n return 'top-start';\n case 'top-right':\n return 'top-end';\n case 'bottom-left':\n return 'bottom-start';\n case 'bottom-right':\n return 'bottom-end';\n case 'left-top':\n return 'left-start';\n case 'left-bottom':\n return 'left-end';\n case 'right-top':\n return 'right-start';\n case 'right-bottom':\n return 'right-end';\n default:\n return position;\n }\n};\n\nexport const mirrorPositionForRtl = (position: FloatingPlacement): FloatingPlacement => {\n switch (position) {\n case 'left':\n return 'right';\n case 'right':\n return 'left';\n case 'left-top':\n return 'right-top';\n case 'left-bottom':\n return 'right-bottom';\n case 'right-top':\n return 'left-top';\n case 'right-bottom':\n return 'left-bottom';\n default:\n // top-left/top-right/bottom-left/bottom-right map to start/end via\n // positionToPlacement, and floating-ui already flips start/end in RTL.\n return position;\n }\n};\n"],"names":["POPOVER_OFFSET","fallbackPlacements","top","bottom","left","right","positionToPlacement","position","mirrorPositionForRtl"],"mappings":"AAgBO,MAAMA,cAAc,GAAG;AAE9B;AACA;AACA;AACO,MAAMC,kBAAkB,GAAmC;AAChEC,EAAAA,GAAG,EAAE,CAAC,QAAQ,EAAE,OAAO,EAAE,MAAM,CAAC;AAChCC,EAAAA,MAAM,EAAE,CAAC,KAAK,EAAE,OAAO,EAAE,MAAM,CAAC;AAChCC,EAAAA,IAAI,EAAE,CAAC,OAAO,EAAE,KAAK,EAAE,QAAQ,CAAC;AAChCC,EAAAA,KAAK,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,QAAQ,CAAC;AAChC,EAAA,WAAW,EAAE,CAAC,cAAc,EAAE,SAAS,EAAE,YAAY,CAAC;AACtD,EAAA,SAAS,EAAE,CAAC,YAAY,EAAE,WAAW,EAAE,cAAc,CAAC;AACtD,EAAA,cAAc,EAAE,CAAC,WAAW,EAAE,YAAY,EAAE,SAAS,CAAC;AACtD,EAAA,YAAY,EAAE,CAAC,SAAS,EAAE,cAAc,EAAE,WAAW,CAAC;AACtD,EAAA,YAAY,EAAE,CAAC,aAAa,EAAE,UAAU,EAAE,WAAW,CAAC;AACtD,EAAA,UAAU,EAAE,CAAC,WAAW,EAAE,YAAY,EAAE,aAAa,CAAC;AACtD,EAAA,aAAa,EAAE,CAAC,YAAY,EAAE,WAAW,EAAE,UAAU,CAAC;AACtD,EAAA,WAAW,EAAE,CAAC,UAAU,EAAE,aAAa,EAAE,YAAY;;AAGhD,MAAMC,mBAAmB,GAAIC,QAA2B,IAAe;AAC5E,EAAA,QAAQA,QAAQ;AACd,IAAA,KAAK,UAAU;AACb,MAAA,OAAO,WAAW;AACpB,IAAA,KAAK,WAAW;AACd,MAAA,OAAO,SAAS;AAClB,IAAA,KAAK,aAAa;AAChB,MAAA,OAAO,cAAc;AACvB,IAAA,KAAK,cAAc;AACjB,MAAA,OAAO,YAAY;AACrB,IAAA,KAAK,UAAU;AACb,MAAA,OAAO,YAAY;AACrB,IAAA,KAAK,aAAa;AAChB,MAAA,OAAO,UAAU;AACnB,IAAA,KAAK,WAAW;AACd,MAAA,OAAO,aAAa;AACtB,IAAA,KAAK,cAAc;AACjB,MAAA,OAAO,WAAW;AACpB,IAAA;AACE,MAAA,OAAOA,QAAQ;AACnB;AACF;AAEO,MAAMC,oBAAoB,GAAID,QAA2B,IAAuB;AACrF,EAAA,QAAQA,QAAQ;AACd,IAAA,KAAK,MAAM;AACT,MAAA,OAAO,OAAO;AAChB,IAAA,KAAK,OAAO;AACV,MAAA,OAAO,MAAM;AACf,IAAA,KAAK,UAAU;AACb,MAAA,OAAO,WAAW;AACpB,IAAA,KAAK,aAAa;AAChB,MAAA,OAAO,cAAc;AACvB,IAAA,KAAK,WAAW;AACd,MAAA,OAAO,UAAU;AACnB,IAAA,KAAK,cAAc;AACjB,MAAA,OAAO,aAAa;AACtB,IAAA;AACE;AACA;AACA,MAAA,OAAOA,QAAQ;AACnB;AACF;;;;"}
@@ -16,29 +16,4 @@ exports.Position = void 0;
16
16
  Position["TOP_LEFT"] = "top-left";
17
17
  Position["TOP_RIGHT"] = "top-right";
18
18
  })(exports.Position || (exports.Position = {}));
19
- /** Maps Neptune position values to floating-ui Placement */
20
- const positionToPlacement = position => {
21
- switch (position) {
22
- case 'top-left':
23
- return 'top-start';
24
- case 'top-right':
25
- return 'top-end';
26
- case 'bottom-left':
27
- return 'bottom-start';
28
- case 'bottom-right':
29
- return 'bottom-end';
30
- case 'left-top':
31
- return 'left-start';
32
- case 'left-bottom':
33
- return 'left-end';
34
- case 'right-top':
35
- return 'right-start';
36
- case 'right-bottom':
37
- return 'right-end';
38
- default:
39
- return position;
40
- }
41
- };
42
-
43
- exports.positionToPlacement = positionToPlacement;
44
19
  //# sourceMappingURL=position.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"position.js","sources":["../../../src/common/PropsValues/position.ts"],"sourcesContent":["import type { Placement } from '@floating-ui/react';\n\nexport enum Position {\n BOTTOM = 'bottom',\n BOTTOM_LEFT = 'bottom-left',\n BOTTOM_RIGHT = 'bottom-right',\n CENTER = 'center',\n LEFT = 'left',\n LEFT_BOTTOM = 'left-bottom',\n LEFT_TOP = 'left-top',\n RIGHT = 'right',\n RIGHT_BOTTOM = 'right-bottom',\n RIGHT_TOP = 'right-top',\n TOP = 'top',\n TOP_LEFT = 'top-left',\n TOP_RIGHT = 'top-right',\n}\n\nexport type PositionCenter = 'center';\nexport type PositionTop = 'top';\nexport type PositionRight = 'right';\nexport type PositionBottom = 'bottom';\nexport type PositionLeft = 'left';\n\nexport type PositionTopLeft = 'top-left';\nexport type PositionTopRight = 'top-right';\nexport type PositionBottomLeft = 'bottom-left';\nexport type PositionBottomRight = 'bottom-right';\nexport type PositionLeftTop = 'left-top';\nexport type PositionLeftBottom = 'left-bottom';\nexport type PositionRightTop = 'right-top';\nexport type PositionRightBottom = 'right-bottom';\n\n/** Neptune position values that can be converted to floating-ui Placement */\nexport type FloatingPlacement =\n | PositionTop\n | PositionRight\n | PositionBottom\n | PositionLeft\n | PositionTopLeft\n | PositionTopRight\n | PositionRightTop\n | PositionRightBottom\n | PositionBottomLeft\n | PositionBottomRight\n | PositionLeftTop\n | PositionLeftBottom;\n\n/** Maps Neptune position values to floating-ui Placement */\nexport const positionToPlacement = (position: FloatingPlacement): Placement => {\n switch (position) {\n case 'top-left':\n return 'top-start';\n case 'top-right':\n return 'top-end';\n case 'bottom-left':\n return 'bottom-start';\n case 'bottom-right':\n return 'bottom-end';\n case 'left-top':\n return 'left-start';\n case 'left-bottom':\n return 'left-end';\n case 'right-top':\n return 'right-start';\n case 'right-bottom':\n return 'right-end';\n default:\n return position;\n }\n};\n"],"names":["Position","positionToPlacement","position"],"mappings":";;AAEYA;AAAZ,CAAA,UAAYA,QAAQ,EAAA;AAClBA,EAAAA,QAAA,CAAA,QAAA,CAAA,GAAA,QAAiB;AACjBA,EAAAA,QAAA,CAAA,aAAA,CAAA,GAAA,aAA2B;AAC3BA,EAAAA,QAAA,CAAA,cAAA,CAAA,GAAA,cAA6B;AAC7BA,EAAAA,QAAA,CAAA,QAAA,CAAA,GAAA,QAAiB;AACjBA,EAAAA,QAAA,CAAA,MAAA,CAAA,GAAA,MAAa;AACbA,EAAAA,QAAA,CAAA,aAAA,CAAA,GAAA,aAA2B;AAC3BA,EAAAA,QAAA,CAAA,UAAA,CAAA,GAAA,UAAqB;AACrBA,EAAAA,QAAA,CAAA,OAAA,CAAA,GAAA,OAAe;AACfA,EAAAA,QAAA,CAAA,cAAA,CAAA,GAAA,cAA6B;AAC7BA,EAAAA,QAAA,CAAA,WAAA,CAAA,GAAA,WAAuB;AACvBA,EAAAA,QAAA,CAAA,KAAA,CAAA,GAAA,KAAW;AACXA,EAAAA,QAAA,CAAA,UAAA,CAAA,GAAA,UAAqB;AACrBA,EAAAA,QAAA,CAAA,WAAA,CAAA,GAAA,WAAuB;AACzB,CAAC,EAdWA,gBAAQ,KAARA,gBAAQ,GAAA,EAAA,CAAA,CAAA;AA8CpB;AACO,MAAMC,mBAAmB,GAAIC,QAA2B,IAAe;AAC5E,EAAA,QAAQA,QAAQ;AACd,IAAA,KAAK,UAAU;AACb,MAAA,OAAO,WAAW;AACpB,IAAA,KAAK,WAAW;AACd,MAAA,OAAO,SAAS;AAClB,IAAA,KAAK,aAAa;AAChB,MAAA,OAAO,cAAc;AACvB,IAAA,KAAK,cAAc;AACjB,MAAA,OAAO,YAAY;AACrB,IAAA,KAAK,UAAU;AACb,MAAA,OAAO,YAAY;AACrB,IAAA,KAAK,aAAa;AAChB,MAAA,OAAO,UAAU;AACnB,IAAA,KAAK,WAAW;AACd,MAAA,OAAO,aAAa;AACtB,IAAA,KAAK,cAAc;AACjB,MAAA,OAAO,WAAW;AACpB,IAAA;AACE,MAAA,OAAOA,QAAQ;AACnB;AACF;;;;"}
1
+ {"version":3,"file":"position.js","sources":["../../../src/common/PropsValues/position.ts"],"sourcesContent":["export enum Position {\n BOTTOM = 'bottom',\n BOTTOM_LEFT = 'bottom-left',\n BOTTOM_RIGHT = 'bottom-right',\n CENTER = 'center',\n LEFT = 'left',\n LEFT_BOTTOM = 'left-bottom',\n LEFT_TOP = 'left-top',\n RIGHT = 'right',\n RIGHT_BOTTOM = 'right-bottom',\n RIGHT_TOP = 'right-top',\n TOP = 'top',\n TOP_LEFT = 'top-left',\n TOP_RIGHT = 'top-right',\n}\n\nexport type PositionCenter = 'center';\nexport type PositionTop = 'top';\nexport type PositionRight = 'right';\nexport type PositionBottom = 'bottom';\nexport type PositionLeft = 'left';\n"],"names":["Position"],"mappings":";;AAAYA;AAAZ,CAAA,UAAYA,QAAQ,EAAA;AAClBA,EAAAA,QAAA,CAAA,QAAA,CAAA,GAAA,QAAiB;AACjBA,EAAAA,QAAA,CAAA,aAAA,CAAA,GAAA,aAA2B;AAC3BA,EAAAA,QAAA,CAAA,cAAA,CAAA,GAAA,cAA6B;AAC7BA,EAAAA,QAAA,CAAA,QAAA,CAAA,GAAA,QAAiB;AACjBA,EAAAA,QAAA,CAAA,MAAA,CAAA,GAAA,MAAa;AACbA,EAAAA,QAAA,CAAA,aAAA,CAAA,GAAA,aAA2B;AAC3BA,EAAAA,QAAA,CAAA,UAAA,CAAA,GAAA,UAAqB;AACrBA,EAAAA,QAAA,CAAA,OAAA,CAAA,GAAA,OAAe;AACfA,EAAAA,QAAA,CAAA,cAAA,CAAA,GAAA,cAA6B;AAC7BA,EAAAA,QAAA,CAAA,WAAA,CAAA,GAAA,WAAuB;AACvBA,EAAAA,QAAA,CAAA,KAAA,CAAA,GAAA,KAAW;AACXA,EAAAA,QAAA,CAAA,UAAA,CAAA,GAAA,UAAqB;AACrBA,EAAAA,QAAA,CAAA,WAAA,CAAA,GAAA,WAAuB;AACzB,CAAC,EAdWA,gBAAQ,KAARA,gBAAQ,GAAA,EAAA,CAAA,CAAA;;"}
@@ -14,29 +14,6 @@ var Position;
14
14
  Position["TOP_LEFT"] = "top-left";
15
15
  Position["TOP_RIGHT"] = "top-right";
16
16
  })(Position || (Position = {}));
17
- /** Maps Neptune position values to floating-ui Placement */
18
- const positionToPlacement = position => {
19
- switch (position) {
20
- case 'top-left':
21
- return 'top-start';
22
- case 'top-right':
23
- return 'top-end';
24
- case 'bottom-left':
25
- return 'bottom-start';
26
- case 'bottom-right':
27
- return 'bottom-end';
28
- case 'left-top':
29
- return 'left-start';
30
- case 'left-bottom':
31
- return 'left-end';
32
- case 'right-top':
33
- return 'right-start';
34
- case 'right-bottom':
35
- return 'right-end';
36
- default:
37
- return position;
38
- }
39
- };
40
17
 
41
- export { Position, positionToPlacement };
18
+ export { Position };
42
19
  //# sourceMappingURL=position.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"position.mjs","sources":["../../../src/common/PropsValues/position.ts"],"sourcesContent":["import type { Placement } from '@floating-ui/react';\n\nexport enum Position {\n BOTTOM = 'bottom',\n BOTTOM_LEFT = 'bottom-left',\n BOTTOM_RIGHT = 'bottom-right',\n CENTER = 'center',\n LEFT = 'left',\n LEFT_BOTTOM = 'left-bottom',\n LEFT_TOP = 'left-top',\n RIGHT = 'right',\n RIGHT_BOTTOM = 'right-bottom',\n RIGHT_TOP = 'right-top',\n TOP = 'top',\n TOP_LEFT = 'top-left',\n TOP_RIGHT = 'top-right',\n}\n\nexport type PositionCenter = 'center';\nexport type PositionTop = 'top';\nexport type PositionRight = 'right';\nexport type PositionBottom = 'bottom';\nexport type PositionLeft = 'left';\n\nexport type PositionTopLeft = 'top-left';\nexport type PositionTopRight = 'top-right';\nexport type PositionBottomLeft = 'bottom-left';\nexport type PositionBottomRight = 'bottom-right';\nexport type PositionLeftTop = 'left-top';\nexport type PositionLeftBottom = 'left-bottom';\nexport type PositionRightTop = 'right-top';\nexport type PositionRightBottom = 'right-bottom';\n\n/** Neptune position values that can be converted to floating-ui Placement */\nexport type FloatingPlacement =\n | PositionTop\n | PositionRight\n | PositionBottom\n | PositionLeft\n | PositionTopLeft\n | PositionTopRight\n | PositionRightTop\n | PositionRightBottom\n | PositionBottomLeft\n | PositionBottomRight\n | PositionLeftTop\n | PositionLeftBottom;\n\n/** Maps Neptune position values to floating-ui Placement */\nexport const positionToPlacement = (position: FloatingPlacement): Placement => {\n switch (position) {\n case 'top-left':\n return 'top-start';\n case 'top-right':\n return 'top-end';\n case 'bottom-left':\n return 'bottom-start';\n case 'bottom-right':\n return 'bottom-end';\n case 'left-top':\n return 'left-start';\n case 'left-bottom':\n return 'left-end';\n case 'right-top':\n return 'right-start';\n case 'right-bottom':\n return 'right-end';\n default:\n return position;\n }\n};\n"],"names":["Position","positionToPlacement","position"],"mappings":"IAEYA;AAAZ,CAAA,UAAYA,QAAQ,EAAA;AAClBA,EAAAA,QAAA,CAAA,QAAA,CAAA,GAAA,QAAiB;AACjBA,EAAAA,QAAA,CAAA,aAAA,CAAA,GAAA,aAA2B;AAC3BA,EAAAA,QAAA,CAAA,cAAA,CAAA,GAAA,cAA6B;AAC7BA,EAAAA,QAAA,CAAA,QAAA,CAAA,GAAA,QAAiB;AACjBA,EAAAA,QAAA,CAAA,MAAA,CAAA,GAAA,MAAa;AACbA,EAAAA,QAAA,CAAA,aAAA,CAAA,GAAA,aAA2B;AAC3BA,EAAAA,QAAA,CAAA,UAAA,CAAA,GAAA,UAAqB;AACrBA,EAAAA,QAAA,CAAA,OAAA,CAAA,GAAA,OAAe;AACfA,EAAAA,QAAA,CAAA,cAAA,CAAA,GAAA,cAA6B;AAC7BA,EAAAA,QAAA,CAAA,WAAA,CAAA,GAAA,WAAuB;AACvBA,EAAAA,QAAA,CAAA,KAAA,CAAA,GAAA,KAAW;AACXA,EAAAA,QAAA,CAAA,UAAA,CAAA,GAAA,UAAqB;AACrBA,EAAAA,QAAA,CAAA,WAAA,CAAA,GAAA,WAAuB;AACzB,CAAC,EAdWA,QAAQ,KAARA,QAAQ,GAAA,EAAA,CAAA,CAAA;AA8CpB;AACO,MAAMC,mBAAmB,GAAIC,QAA2B,IAAe;AAC5E,EAAA,QAAQA,QAAQ;AACd,IAAA,KAAK,UAAU;AACb,MAAA,OAAO,WAAW;AACpB,IAAA,KAAK,WAAW;AACd,MAAA,OAAO,SAAS;AAClB,IAAA,KAAK,aAAa;AAChB,MAAA,OAAO,cAAc;AACvB,IAAA,KAAK,cAAc;AACjB,MAAA,OAAO,YAAY;AACrB,IAAA,KAAK,UAAU;AACb,MAAA,OAAO,YAAY;AACrB,IAAA,KAAK,aAAa;AAChB,MAAA,OAAO,UAAU;AACnB,IAAA,KAAK,WAAW;AACd,MAAA,OAAO,aAAa;AACtB,IAAA,KAAK,cAAc;AACjB,MAAA,OAAO,WAAW;AACpB,IAAA;AACE,MAAA,OAAOA,QAAQ;AACnB;AACF;;;;"}
1
+ {"version":3,"file":"position.mjs","sources":["../../../src/common/PropsValues/position.ts"],"sourcesContent":["export enum Position {\n BOTTOM = 'bottom',\n BOTTOM_LEFT = 'bottom-left',\n BOTTOM_RIGHT = 'bottom-right',\n CENTER = 'center',\n LEFT = 'left',\n LEFT_BOTTOM = 'left-bottom',\n LEFT_TOP = 'left-top',\n RIGHT = 'right',\n RIGHT_BOTTOM = 'right-bottom',\n RIGHT_TOP = 'right-top',\n TOP = 'top',\n TOP_LEFT = 'top-left',\n TOP_RIGHT = 'top-right',\n}\n\nexport type PositionCenter = 'center';\nexport type PositionTop = 'top';\nexport type PositionRight = 'right';\nexport type PositionBottom = 'bottom';\nexport type PositionLeft = 'left';\n"],"names":["Position"],"mappings":"IAAYA;AAAZ,CAAA,UAAYA,QAAQ,EAAA;AAClBA,EAAAA,QAAA,CAAA,QAAA,CAAA,GAAA,QAAiB;AACjBA,EAAAA,QAAA,CAAA,aAAA,CAAA,GAAA,aAA2B;AAC3BA,EAAAA,QAAA,CAAA,cAAA,CAAA,GAAA,cAA6B;AAC7BA,EAAAA,QAAA,CAAA,QAAA,CAAA,GAAA,QAAiB;AACjBA,EAAAA,QAAA,CAAA,MAAA,CAAA,GAAA,MAAa;AACbA,EAAAA,QAAA,CAAA,aAAA,CAAA,GAAA,aAA2B;AAC3BA,EAAAA,QAAA,CAAA,UAAA,CAAA,GAAA,UAAqB;AACrBA,EAAAA,QAAA,CAAA,OAAA,CAAA,GAAA,OAAe;AACfA,EAAAA,QAAA,CAAA,cAAA,CAAA,GAAA,cAA6B;AAC7BA,EAAAA,QAAA,CAAA,WAAA,CAAA,GAAA,WAAuB;AACvBA,EAAAA,QAAA,CAAA,KAAA,CAAA,GAAA,KAAW;AACXA,EAAAA,QAAA,CAAA,UAAA,CAAA,GAAA,UAAqB;AACrBA,EAAAA,QAAA,CAAA,WAAA,CAAA,GAAA,WAAuB;AACzB,CAAC,EAdWA,QAAQ,KAARA,QAAQ,GAAA,EAAA,CAAA,CAAA;;;;"}