@vibe/core 3.53.0-alpha-528cd.0 → 3.53.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 (192) hide show
  1. package/dist/components/Accordion/index.d.ts +2 -2
  2. package/dist/components/AlertBanner/index.d.ts +4 -4
  3. package/dist/components/AttentionBox/index.d.ts +2 -2
  4. package/dist/components/Avatar/index.d.ts +1 -1
  5. package/dist/components/AvatarGroup/index.d.ts +1 -1
  6. package/dist/components/Badge/index.d.ts +1 -1
  7. package/dist/components/Box/index.d.ts +1 -1
  8. package/dist/components/BreadcrumbsBar/index.d.ts +4 -4
  9. package/dist/components/Button/index.d.ts +1 -1
  10. package/dist/components/ButtonGroup/index.d.ts +1 -1
  11. package/dist/components/Checkbox/index.d.ts +1 -1
  12. package/dist/components/Chips/index.d.ts +1 -1
  13. package/dist/components/Clickable/index.d.ts +1 -1
  14. package/dist/components/ColorPicker/index.d.ts +2 -2
  15. package/dist/components/Combobox/index.d.ts +1 -1
  16. package/dist/components/Counter/index.d.ts +1 -1
  17. package/dist/components/DatePicker/index.d.ts +1 -1
  18. package/dist/components/Dialog/Dialog.d.ts +4 -0
  19. package/dist/components/Dialog/index.d.ts +1 -1
  20. package/dist/components/DialogContentContainer/index.d.ts +1 -1
  21. package/dist/components/Divider/index.d.ts +1 -1
  22. package/dist/components/EditableHeading/index.d.ts +1 -1
  23. package/dist/components/EditableText/index.d.ts +1 -1
  24. package/dist/components/ExpandCollapse/index.d.ts +1 -1
  25. package/dist/components/FieldLabel/FieldLabel.d.ts +4 -0
  26. package/dist/components/Flex/index.d.ts +1 -1
  27. package/dist/components/FormattedNumber/index.d.ts +1 -1
  28. package/dist/components/Heading/index.d.ts +1 -1
  29. package/dist/components/HiddenText/index.d.ts +1 -1
  30. package/dist/components/Icon/index.d.ts +2 -2
  31. package/dist/components/IconButton/index.d.ts +1 -1
  32. package/dist/components/Label/index.d.ts +1 -1
  33. package/dist/components/LayerProvider/index.d.ts +1 -1
  34. package/dist/components/LegacyModal/index.d.ts +5 -5
  35. package/dist/components/Link/index.d.ts +1 -1
  36. package/dist/components/List/index.d.ts +1 -1
  37. package/dist/components/ListItem/index.d.ts +1 -1
  38. package/dist/components/ListItemAvatar/index.d.ts +1 -1
  39. package/dist/components/ListItemIcon/index.d.ts +1 -1
  40. package/dist/components/ListTitle/index.d.ts +1 -1
  41. package/dist/components/Loader/index.d.ts +1 -1
  42. package/dist/components/Menu/index.d.ts +6 -6
  43. package/dist/components/MenuButton/index.d.ts +1 -1
  44. package/dist/components/Modal/Modal/index.d.ts +1 -1
  45. package/dist/components/Modal/ModalContent/index.d.ts +1 -1
  46. package/dist/components/Modal/ModalHeader/index.d.ts +1 -1
  47. package/dist/components/Modal/ModalMedia/index.d.ts +1 -1
  48. package/dist/components/Modal/footers/index.d.ts +2 -2
  49. package/dist/components/Modal/layouts/index.d.ts +3 -3
  50. package/dist/components/MultiStepIndicator/index.d.ts +1 -1
  51. package/dist/components/ProgressBars/index.d.ts +1 -1
  52. package/dist/components/RadioButton/index.d.ts +1 -1
  53. package/dist/components/Refable/Refable.d.ts +4 -0
  54. package/dist/components/Skeleton/index.d.ts +1 -1
  55. package/dist/components/Slider/index.d.ts +1 -1
  56. package/dist/components/SplitButton/index.d.ts +2 -2
  57. package/dist/components/Steps/index.d.ts +1 -1
  58. package/dist/components/Table/index.d.ts +7 -7
  59. package/dist/components/Tabs/index.d.ts +5 -5
  60. package/dist/components/Text/index.d.ts +1 -1
  61. package/dist/components/TextField/index.d.ts +1 -1
  62. package/dist/components/TextWithHighlight/index.d.ts +1 -1
  63. package/dist/components/ThemeProvider/index.d.ts +1 -1
  64. package/dist/components/Tipseen/index.d.ts +5 -5
  65. package/dist/components/Toast/Toast.d.ts +2 -2
  66. package/dist/components/Toast/index.d.ts +3 -3
  67. package/dist/components/Toggle/index.d.ts +1 -1
  68. package/dist/components/Tooltip/index.d.ts +1 -1
  69. package/dist/components/VirtualizedGrid/index.d.ts +1 -1
  70. package/dist/components/VirtualizedList/VirtualizedList.types.d.ts +1 -1
  71. package/dist/components/VirtualizedList/index.d.ts +1 -1
  72. package/dist/metadata.json +147 -115
  73. package/dist/mocked_classnames/components/Accordion/index.d.ts +2 -2
  74. package/dist/mocked_classnames/components/AlertBanner/index.d.ts +4 -4
  75. package/dist/mocked_classnames/components/AttentionBox/index.d.ts +2 -2
  76. package/dist/mocked_classnames/components/Avatar/index.d.ts +1 -1
  77. package/dist/mocked_classnames/components/AvatarGroup/index.d.ts +1 -1
  78. package/dist/mocked_classnames/components/Badge/index.d.ts +1 -1
  79. package/dist/mocked_classnames/components/Box/index.d.ts +1 -1
  80. package/dist/mocked_classnames/components/BreadcrumbsBar/index.d.ts +4 -4
  81. package/dist/mocked_classnames/components/Button/index.d.ts +1 -1
  82. package/dist/mocked_classnames/components/ButtonGroup/index.d.ts +1 -1
  83. package/dist/mocked_classnames/components/Checkbox/index.d.ts +1 -1
  84. package/dist/mocked_classnames/components/Chips/index.d.ts +1 -1
  85. package/dist/mocked_classnames/components/Clickable/index.d.ts +1 -1
  86. package/dist/mocked_classnames/components/ColorPicker/index.d.ts +2 -2
  87. package/dist/mocked_classnames/components/Combobox/index.d.ts +1 -1
  88. package/dist/mocked_classnames/components/Counter/index.d.ts +1 -1
  89. package/dist/mocked_classnames/components/DatePicker/index.d.ts +1 -1
  90. package/dist/mocked_classnames/components/Dialog/Dialog.d.ts +4 -0
  91. package/dist/mocked_classnames/components/Dialog/index.d.ts +1 -1
  92. package/dist/mocked_classnames/components/DialogContentContainer/index.d.ts +1 -1
  93. package/dist/mocked_classnames/components/Divider/index.d.ts +1 -1
  94. package/dist/mocked_classnames/components/EditableHeading/index.d.ts +1 -1
  95. package/dist/mocked_classnames/components/EditableText/index.d.ts +1 -1
  96. package/dist/mocked_classnames/components/ExpandCollapse/index.d.ts +1 -1
  97. package/dist/mocked_classnames/components/FieldLabel/FieldLabel.d.ts +4 -0
  98. package/dist/mocked_classnames/components/Flex/index.d.ts +1 -1
  99. package/dist/mocked_classnames/components/FormattedNumber/index.d.ts +1 -1
  100. package/dist/mocked_classnames/components/Heading/index.d.ts +1 -1
  101. package/dist/mocked_classnames/components/HiddenText/index.d.ts +1 -1
  102. package/dist/mocked_classnames/components/Icon/index.d.ts +2 -2
  103. package/dist/mocked_classnames/components/IconButton/index.d.ts +1 -1
  104. package/dist/mocked_classnames/components/Label/index.d.ts +1 -1
  105. package/dist/mocked_classnames/components/LayerProvider/index.d.ts +1 -1
  106. package/dist/mocked_classnames/components/LegacyModal/index.d.ts +5 -5
  107. package/dist/mocked_classnames/components/Link/index.d.ts +1 -1
  108. package/dist/mocked_classnames/components/List/index.d.ts +1 -1
  109. package/dist/mocked_classnames/components/ListItem/index.d.ts +1 -1
  110. package/dist/mocked_classnames/components/ListItemAvatar/index.d.ts +1 -1
  111. package/dist/mocked_classnames/components/ListItemIcon/index.d.ts +1 -1
  112. package/dist/mocked_classnames/components/ListTitle/index.d.ts +1 -1
  113. package/dist/mocked_classnames/components/Loader/index.d.ts +1 -1
  114. package/dist/mocked_classnames/components/Menu/index.d.ts +6 -6
  115. package/dist/mocked_classnames/components/MenuButton/index.d.ts +1 -1
  116. package/dist/mocked_classnames/components/Modal/Modal/index.d.ts +1 -1
  117. package/dist/mocked_classnames/components/Modal/ModalContent/index.d.ts +1 -1
  118. package/dist/mocked_classnames/components/Modal/ModalHeader/index.d.ts +1 -1
  119. package/dist/mocked_classnames/components/Modal/ModalMedia/index.d.ts +1 -1
  120. package/dist/mocked_classnames/components/Modal/footers/index.d.ts +2 -2
  121. package/dist/mocked_classnames/components/Modal/layouts/index.d.ts +3 -3
  122. package/dist/mocked_classnames/components/MultiStepIndicator/index.d.ts +1 -1
  123. package/dist/mocked_classnames/components/ProgressBars/index.d.ts +1 -1
  124. package/dist/mocked_classnames/components/RadioButton/index.d.ts +1 -1
  125. package/dist/mocked_classnames/components/Refable/Refable.d.ts +4 -0
  126. package/dist/mocked_classnames/components/Skeleton/index.d.ts +1 -1
  127. package/dist/mocked_classnames/components/Slider/index.d.ts +1 -1
  128. package/dist/mocked_classnames/components/SplitButton/index.d.ts +2 -2
  129. package/dist/mocked_classnames/components/Steps/index.d.ts +1 -1
  130. package/dist/mocked_classnames/components/Table/index.d.ts +7 -7
  131. package/dist/mocked_classnames/components/Tabs/index.d.ts +5 -5
  132. package/dist/mocked_classnames/components/Text/index.d.ts +1 -1
  133. package/dist/mocked_classnames/components/TextField/index.d.ts +1 -1
  134. package/dist/mocked_classnames/components/TextWithHighlight/index.d.ts +1 -1
  135. package/dist/mocked_classnames/components/ThemeProvider/index.d.ts +1 -1
  136. package/dist/mocked_classnames/components/Tipseen/index.d.ts +5 -5
  137. package/dist/mocked_classnames/components/Toast/Toast.d.ts +2 -2
  138. package/dist/mocked_classnames/components/Toast/index.d.ts +3 -3
  139. package/dist/mocked_classnames/components/Toggle/index.d.ts +1 -1
  140. package/dist/mocked_classnames/components/Tooltip/index.d.ts +1 -1
  141. package/dist/mocked_classnames/components/VirtualizedGrid/index.d.ts +1 -1
  142. package/dist/mocked_classnames/components/VirtualizedList/VirtualizedList.types.d.ts +1 -1
  143. package/dist/mocked_classnames/components/VirtualizedList/index.d.ts +1 -1
  144. package/dist/mocked_classnames/src/components/AlertBanner/AlertBannerButton/AlertBannerButton.js +1 -1
  145. package/dist/mocked_classnames/src/components/AlertBanner/AlertBannerButton/AlertBannerButton.js.map +1 -1
  146. package/dist/mocked_classnames/src/components/Button/Button.js +1 -1
  147. package/dist/mocked_classnames/src/components/Button/Button.js.map +1 -1
  148. package/dist/mocked_classnames/src/components/Counter/Counter.js +1 -1
  149. package/dist/mocked_classnames/src/components/Counter/Counter.js.map +1 -1
  150. package/dist/mocked_classnames/src/components/Dialog/Dialog.js +1 -1
  151. package/dist/mocked_classnames/src/components/Dialog/Dialog.js.map +1 -1
  152. package/dist/mocked_classnames/src/components/Dialog/DialogContent/DialogContent.js +1 -1
  153. package/dist/mocked_classnames/src/components/Dialog/DialogContent/DialogContent.js.map +1 -1
  154. package/dist/mocked_classnames/src/components/FieldLabel/FieldLabel.js +1 -1
  155. package/dist/mocked_classnames/src/components/FieldLabel/FieldLabel.js.map +1 -1
  156. package/dist/mocked_classnames/src/components/Refable/Refable.js +1 -1
  157. package/dist/mocked_classnames/src/components/Refable/Refable.js.map +1 -1
  158. package/dist/mocked_classnames/src/components/SplitButton/SplitButton.js +1 -1
  159. package/dist/mocked_classnames/src/components/SplitButton/SplitButton.js.map +1 -1
  160. package/dist/mocked_classnames/src/components/Toast/Toast.js +1 -1
  161. package/dist/mocked_classnames/src/components/Toast/Toast.js.map +1 -1
  162. package/dist/mocked_classnames/src/components/Toast/ToastButton/ToastButton.js +1 -1
  163. package/dist/mocked_classnames/src/components/Toast/ToastButton/ToastButton.js.map +1 -1
  164. package/dist/mocked_classnames/src/tests/interactionsTests.js +1 -1
  165. package/dist/mocked_classnames/src/tests/interactionsTests.js.map +1 -1
  166. package/dist/mocked_classnames/tests/interactions-utils.d.ts +1 -1
  167. package/dist/mocked_classnames/types/index.d.ts +2 -2
  168. package/dist/src/components/AlertBanner/AlertBannerButton/AlertBannerButton.js +1 -1
  169. package/dist/src/components/AlertBanner/AlertBannerButton/AlertBannerButton.js.map +1 -1
  170. package/dist/src/components/Button/Button.js +1 -1
  171. package/dist/src/components/Button/Button.js.map +1 -1
  172. package/dist/src/components/Counter/Counter.js +1 -1
  173. package/dist/src/components/Counter/Counter.js.map +1 -1
  174. package/dist/src/components/Dialog/Dialog.js +1 -1
  175. package/dist/src/components/Dialog/Dialog.js.map +1 -1
  176. package/dist/src/components/Dialog/DialogContent/DialogContent.js +1 -1
  177. package/dist/src/components/Dialog/DialogContent/DialogContent.js.map +1 -1
  178. package/dist/src/components/FieldLabel/FieldLabel.js +1 -1
  179. package/dist/src/components/FieldLabel/FieldLabel.js.map +1 -1
  180. package/dist/src/components/Refable/Refable.js +1 -1
  181. package/dist/src/components/Refable/Refable.js.map +1 -1
  182. package/dist/src/components/SplitButton/SplitButton.js +1 -1
  183. package/dist/src/components/SplitButton/SplitButton.js.map +1 -1
  184. package/dist/src/components/Toast/Toast.js +1 -1
  185. package/dist/src/components/Toast/Toast.js.map +1 -1
  186. package/dist/src/components/Toast/ToastButton/ToastButton.js +1 -1
  187. package/dist/src/components/Toast/ToastButton/ToastButton.js.map +1 -1
  188. package/dist/src/tests/interactionsTests.js +1 -1
  189. package/dist/src/tests/interactionsTests.js.map +1 -1
  190. package/dist/tests/interactions-utils.d.ts +1 -1
  191. package/dist/types/index.d.ts +2 -2
  192. package/package.json +34 -28
@@ -1,2 +1,2 @@
1
- import{slicedToArray as e,defineProperty as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{camelCase as o}from"lodash-es";import{getStyle as i}from"../../helpers/typesciptCssModulesHelper.js";import{getTestId as r,ComponentDefaultTestId as a}from"../../tests/testIds.js";import n from"classnames";import s,{useState as l,useRef as d,useCallback as m,useEffect as c,useMemo as u}from"react";import{SwitchTransition as f,CSSTransition as p}from"react-transition-group";import v from"../../hooks/useEventListener/index.js";import E from"../../hooks/useAfterFirstRender/index.js";import{NOOP as b}from"../../utils/function-utils.js";import{CounterSize as j,CounterColor as x,CounterType as h}from"./CounterConstants.js";import{withStaticPropsWithoutForwardRef as y}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import A from"./Counter.module.scss.js";var N=y((function(j){var x=j.className,h=j.counterClassName,y=j.count,N=void 0===y?0:y,k=j.size,C=void 0===k?"large":k,g=j.kind,w=void 0===g?"fill":g,L=j.color,M=void 0===L?"primary":L,R=j.maxDigits,z=void 0===R?3:R,D=j.ariaLabeledBy,P=void 0===D?"":D,T=j.ariaLabel,B=void 0===T?"":T,H=j.id,O=void 0===H?"":H,U=j.prefix,_=void 0===U?"":U,F=j.onMouseDown,I=void 0===F?b:F,S=j.noAnimation,q=void 0!==S&&S,G=j["data-testid"],J=l(!1),K=e(J,2),Q=K[0],V=K[1],W=d(null),X=d(null),Y=m((function(){V(!0)}),[V]),Z=m((function(){V(!1)}),[V]);v({eventName:"animationend",callback:Z,ref:W});var $=E();c((function(){$.current&&Y()}),[N,$,Y]),c((function(){z>0||console.error("Max digits must be a positive number")}),[z]);var ee=u((function(){return n(A.counter,i(A,o("size-"+C)),i(A,o("kind-"+w)),i(A,o("color-"+M)),t({},A.withAnimation,Q),h)}),[C,w,M,Q,h]),te="counter"+(O?"-".concat(O):""),oe=(null==N?void 0:(""+N).length)>z?"".concat(Math.pow(10,z)-1,"+"):N+"",ie=s.createElement("span",{id:te,"data-testid":G||r(a.COUNTER,O)},_+oe);return s.createElement("span",{className:x,"aria-label":"".concat(B," ").concat(oe),"aria-labelledby":P,onMouseDown:I},s.createElement("div",{className:ee,"aria-label":oe,ref:W},q?ie:s.createElement(f,{mode:"out-in"},s.createElement(p,{key:oe,nodeRef:X,classNames:{enter:A.fadeEnter,enterActive:A.fadeEnterActive,exit:A.fadeExit,exitActive:A.fadeExitActive},addEndListener:function(e,t){e.addEventListener("transitionend",t,!1)}},s.createElement("span",{ref:X,id:te,"data-testid":G||r(a.COUNTER,O)},_+oe)))))}),{sizes:j,colors:x,kinds:h});export{N as default};
1
+ import{slicedToArray as e,defineProperty as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{camelCase as o}from"lodash-es";import{getStyle as i}from"../../helpers/typesciptCssModulesHelper.js";import{getTestId as r,ComponentDefaultTestId as a}from"../../tests/testIds.js";import n from"classnames";import s,{useState as l,useRef as d,useCallback as m,useEffect as c,useMemo as u}from"react";import{SwitchTransition as p,CSSTransition as f}from"react-transition-group";import v from"../../hooks/useEventListener/index.js";import E from"../../hooks/useAfterFirstRender/index.js";import{NOOP as b}from"../../utils/function-utils.js";import{CounterSize as j,CounterColor as x,CounterType as h}from"./CounterConstants.js";import{withStaticPropsWithoutForwardRef as y}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import A from"./Counter.module.scss.js";var N=y((function(j){var x=j.className,h=j.counterClassName,y=j.count,N=void 0===y?0:y,k=j.size,C=void 0===k?"large":k,g=j.kind,w=void 0===g?"fill":g,L=j.color,M=void 0===L?"primary":L,z=j.maxDigits,D=void 0===z?3:z,P=j.ariaLabeledBy,R=void 0===P?"":P,T=j.ariaLabel,B=void 0===T?"":T,H=j.id,O=void 0===H?"":H,U=j.prefix,_=void 0===U?"":U,F=j.onMouseDown,I=void 0===F?b:F,S=j.noAnimation,q=void 0!==S&&S,G=j["data-testid"],J=l(!1),K=e(J,2),Q=K[0],V=K[1],W=d(null),X=m((function(){V(!0)}),[V]),Y=m((function(){V(!1)}),[V]);v({eventName:"animationend",callback:Y,ref:W});var Z=E();c((function(){Z.current&&X()}),[N,Z,X]),c((function(){D>0||console.error("Max digits must be a positive number")}),[D]);var $=u((function(){return n(A.counter,i(A,o("size-"+C)),i(A,o("kind-"+w)),i(A,o("color-"+M)),t({},A.withAnimation,Q),h)}),[C,w,M,Q,h]),ee="counter"+(O?"-".concat(O):""),te=(null==N?void 0:(""+N).length)>D?"".concat(Math.pow(10,D)-1,"+"):N+"",oe=s.createElement("span",{id:ee,"data-testid":G||r(a.COUNTER,O)},_+te);return s.createElement("span",{className:x,"aria-label":"".concat(B," ").concat(te),"aria-labelledby":R,onMouseDown:I},s.createElement("div",{className:$,"aria-label":te,ref:W},q?oe:s.createElement(p,{mode:"out-in"},s.createElement(f,{key:te,classNames:{enter:A.fadeEnter,enterActive:A.fadeEnterActive,exit:A.fadeExit,exitActive:A.fadeExitActive},addEndListener:function(e,t){e.addEventListener("transitionend",t,!1)}},s.createElement("span",{id:ee,"data-testid":G||r(a.COUNTER,O)},_+te)))))}),{sizes:j,colors:x,kinds:h});export{N as default};
2
2
  //# sourceMappingURL=Counter.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Counter.js","sources":["../../../../src/components/Counter/Counter.tsx"],"sourcesContent":["import { camelCase } from \"lodash-es\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { CSSTransition, SwitchTransition } from \"react-transition-group\";\nimport useEventListener from \"../../hooks/useEventListener\";\nimport useAfterFirstRender from \"../../hooks/useAfterFirstRender\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport {\n CounterColor as CounterColorEnum,\n CounterSize as CounterSizeEnum,\n CounterType as CounterTypeEnum\n} from \"./CounterConstants\";\nimport { CounterColor, CounterSize, CounterType } from \"./Counter.types\";\nimport { VibeComponentProps, withStaticPropsWithoutForwardRef } from \"../../types\";\nimport styles from \"./Counter.module.scss\";\n\nexport interface CounterProps extends VibeComponentProps {\n /**\n * The ID of the element describing the counter.\n */\n ariaLabeledBy?: string;\n /**\n * Class name applied to the counter element.\n */\n counterClassName?: string;\n /**\n * The numeric value displayed in the counter.\n */\n count?: number;\n /**\n * The label of the counter for accessibility.\n */\n ariaLabel?: string;\n /**\n * The size of the counter.\n */\n size?: CounterSize;\n /**\n * The visual style of the counter.\n */\n kind?: CounterType;\n /**\n * The color of the counter.\n */\n color?: CounterColor;\n /**\n * The maximum number of digits displayed before truncation.\n */\n maxDigits?: number;\n /**\n * Text prepended to the counter value.\n */\n prefix?: string;\n /**\n * Callback fired when the counter is clicked.\n */\n onMouseDown?: (event: React.MouseEvent<HTMLSpanElement>) => void;\n /**\n * If true, disables counter animations.\n */\n noAnimation?: boolean;\n}\n\nconst Counter = ({\n className,\n counterClassName,\n count = 0,\n size = \"large\",\n kind = \"fill\",\n color = \"primary\",\n maxDigits = 3,\n ariaLabeledBy = \"\",\n ariaLabel = \"\",\n id = \"\",\n prefix = \"\",\n onMouseDown = NOOP,\n noAnimation = false,\n \"data-testid\": dataTestId\n}: CounterProps) => {\n const [countChangeAnimationState, setCountChangeAnimationState] = useState(false);\n\n const ref = useRef<HTMLDivElement>(null);\n const nodeRef = useRef<HTMLSpanElement>(null);\n\n const setCountChangedAnimationActive = useCallback(() => {\n setCountChangeAnimationState(true);\n }, [setCountChangeAnimationState]);\n\n const setCountChangedAnimationNotActive = useCallback(() => {\n setCountChangeAnimationState(false);\n }, [setCountChangeAnimationState]);\n\n useEventListener({\n eventName: \"animationend\",\n callback: setCountChangedAnimationNotActive,\n ref\n });\n\n const isAfterFirstRender = useAfterFirstRender();\n\n useEffect(() => {\n if (isAfterFirstRender.current) {\n setCountChangedAnimationActive();\n }\n }, [count, isAfterFirstRender, setCountChangedAnimationActive]);\n\n useEffect(() => {\n if (maxDigits <= 0) {\n console.error(\"Max digits must be a positive number\");\n }\n }, [maxDigits]);\n\n const classNames = useMemo(() => {\n return cx(\n styles.counter,\n getStyle(styles, camelCase(\"size-\" + size)),\n getStyle(styles, camelCase(\"kind-\" + kind)),\n getStyle(styles, camelCase(\"color-\" + color)),\n {\n [styles.withAnimation]: countChangeAnimationState\n },\n counterClassName\n );\n }, [size, kind, color, countChangeAnimationState, counterClassName]);\n\n const counterId = \"counter\" + (id ? `-${id}` : \"\");\n const countText = count?.toString().length > maxDigits ? `${10 ** maxDigits - 1}+` : String(count);\n const counter = (\n <span id={counterId} data-testid={dataTestId || getTestId(ComponentDefaultTestId.COUNTER, id)}>\n {prefix + countText}\n </span>\n );\n\n return (\n <span\n className={className}\n aria-label={`${ariaLabel} ${countText}`}\n aria-labelledby={ariaLabeledBy}\n onMouseDown={onMouseDown}\n >\n <div className={classNames} aria-label={countText} ref={ref}>\n {noAnimation ? (\n counter\n ) : (\n <SwitchTransition mode=\"out-in\">\n <CSSTransition\n key={countText}\n nodeRef={nodeRef}\n classNames={{\n enter: styles.fadeEnter,\n enterActive: styles.fadeEnterActive,\n exit: styles.fadeExit,\n exitActive: styles.fadeExitActive\n }}\n // @ts-expect-error @definitelyTyped typings expecting a single parameter for some reason when the function passed here is called with two parameters\n // See https://github.com/reactjs/react-transition-group/blob/c89f807067b32eea6f68fd6c622190d88ced82e2/src/Transition.js#L522-L534\n addEndListener={(node: HTMLElement, done: () => void) => {\n node.addEventListener(\"transitionend\", done, false);\n }}\n >\n <span\n ref={nodeRef}\n id={counterId}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.COUNTER, id)}\n >\n {prefix + countText}\n </span>\n </CSSTransition>\n </SwitchTransition>\n )}\n </div>\n </span>\n );\n};\n\ninterface CounterStaticProps {\n sizes: typeof CounterSizeEnum;\n colors: typeof CounterColorEnum;\n kinds: typeof CounterTypeEnum;\n}\n\nexport default withStaticPropsWithoutForwardRef<CounterProps, CounterStaticProps>(Counter, {\n sizes: CounterSizeEnum,\n colors: CounterColorEnum,\n kinds: CounterTypeEnum\n});\n"],"names":["withStaticPropsWithoutForwardRef","_ref","className","counterClassName","_ref$count","count","_ref$size","size","_ref$kind","kind","_ref$color","color","_ref$maxDigits","maxDigits","_ref$ariaLabeledBy","ariaLabeledBy","_ref$ariaLabel","ariaLabel","_ref$id","id","_ref$prefix","prefix","_ref$onMouseDown","onMouseDown","NOOP","_ref$noAnimation","noAnimation","dataTestId","_useState","useState","_useState2","_slicedToArray","countChangeAnimationState","setCountChangeAnimationState","ref","useRef","nodeRef","setCountChangedAnimationActive","useCallback","setCountChangedAnimationNotActive","useEventListener","eventName","callback","isAfterFirstRender","useAfterFirstRender","useEffect","current","console","error","classNames","useMemo","cx","styles","counter","getStyle","camelCase","_defineProperty","withAnimation","counterId","concat","countText","length","Math","pow","String","React","createElement","getTestId","ComponentDefaultTestId","COUNTER","SwitchTransition","mode","CSSTransition","key","enter","fadeEnter","enterActive","fadeEnterActive","exit","fadeExit","exitActive","fadeExitActive","addEndListener","node","done","addEventListener","sizes","CounterSizeEnum","colors","CounterColorEnum","kinds","CounterTypeEnum"],"mappings":"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"}
1
+ {"version":3,"file":"Counter.js","sources":["../../../../src/components/Counter/Counter.tsx"],"sourcesContent":["import { camelCase } from \"lodash-es\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { CSSTransition, SwitchTransition } from \"react-transition-group\";\nimport useEventListener from \"../../hooks/useEventListener\";\nimport useAfterFirstRender from \"../../hooks/useAfterFirstRender\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport {\n CounterColor as CounterColorEnum,\n CounterSize as CounterSizeEnum,\n CounterType as CounterTypeEnum\n} from \"./CounterConstants\";\nimport { CounterColor, CounterSize, CounterType } from \"./Counter.types\";\nimport { VibeComponentProps, withStaticPropsWithoutForwardRef } from \"../../types\";\nimport styles from \"./Counter.module.scss\";\n\nexport interface CounterProps extends VibeComponentProps {\n /**\n * The ID of the element describing the counter.\n */\n ariaLabeledBy?: string;\n /**\n * Class name applied to the counter element.\n */\n counterClassName?: string;\n /**\n * The numeric value displayed in the counter.\n */\n count?: number;\n /**\n * The label of the counter for accessibility.\n */\n ariaLabel?: string;\n /**\n * The size of the counter.\n */\n size?: CounterSize;\n /**\n * The visual style of the counter.\n */\n kind?: CounterType;\n /**\n * The color of the counter.\n */\n color?: CounterColor;\n /**\n * The maximum number of digits displayed before truncation.\n */\n maxDigits?: number;\n /**\n * Text prepended to the counter value.\n */\n prefix?: string;\n /**\n * Callback fired when the counter is clicked.\n */\n onMouseDown?: (event: React.MouseEvent<HTMLSpanElement>) => void;\n /**\n * If true, disables counter animations.\n */\n noAnimation?: boolean;\n}\n\nconst Counter = ({\n className,\n counterClassName,\n count = 0,\n size = \"large\",\n kind = \"fill\",\n color = \"primary\",\n maxDigits = 3,\n ariaLabeledBy = \"\",\n ariaLabel = \"\",\n id = \"\",\n prefix = \"\",\n onMouseDown = NOOP,\n noAnimation = false,\n \"data-testid\": dataTestId\n}: CounterProps) => {\n const [countChangeAnimationState, setCountChangeAnimationState] = useState(false);\n\n const ref = useRef<HTMLDivElement>(null);\n\n const setCountChangedAnimationActive = useCallback(() => {\n setCountChangeAnimationState(true);\n }, [setCountChangeAnimationState]);\n\n const setCountChangedAnimationNotActive = useCallback(() => {\n setCountChangeAnimationState(false);\n }, [setCountChangeAnimationState]);\n\n useEventListener({\n eventName: \"animationend\",\n callback: setCountChangedAnimationNotActive,\n ref\n });\n\n const isAfterFirstRender = useAfterFirstRender();\n\n useEffect(() => {\n if (isAfterFirstRender.current) {\n setCountChangedAnimationActive();\n }\n }, [count, isAfterFirstRender, setCountChangedAnimationActive]);\n\n useEffect(() => {\n if (maxDigits <= 0) {\n console.error(\"Max digits must be a positive number\");\n }\n }, [maxDigits]);\n\n const classNames = useMemo(() => {\n return cx(\n styles.counter,\n getStyle(styles, camelCase(\"size-\" + size)),\n getStyle(styles, camelCase(\"kind-\" + kind)),\n getStyle(styles, camelCase(\"color-\" + color)),\n {\n [styles.withAnimation]: countChangeAnimationState\n },\n counterClassName\n );\n }, [size, kind, color, countChangeAnimationState, counterClassName]);\n\n const counterId = \"counter\" + (id ? `-${id}` : \"\");\n const countText = count?.toString().length > maxDigits ? `${10 ** maxDigits - 1}+` : String(count);\n const counter = (\n <span id={counterId} data-testid={dataTestId || getTestId(ComponentDefaultTestId.COUNTER, id)}>\n {prefix + countText}\n </span>\n );\n\n return (\n <span\n className={className}\n aria-label={`${ariaLabel} ${countText}`}\n aria-labelledby={ariaLabeledBy}\n onMouseDown={onMouseDown}\n >\n <div className={classNames} aria-label={countText} ref={ref}>\n {noAnimation ? (\n counter\n ) : (\n <SwitchTransition mode=\"out-in\">\n <CSSTransition\n key={countText}\n classNames={{\n enter: styles.fadeEnter,\n enterActive: styles.fadeEnterActive,\n exit: styles.fadeExit,\n exitActive: styles.fadeExitActive\n }}\n // @ts-expect-error @definitelyTyped typings expecting a single parameter for some reason when the function passed here is called with two parameters\n // See https://github.com/reactjs/react-transition-group/blob/c89f807067b32eea6f68fd6c622190d88ced82e2/src/Transition.js#L522-L534\n addEndListener={(node: HTMLElement, done: () => void) => {\n node.addEventListener(\"transitionend\", done, false);\n }}\n >\n <span id={counterId} data-testid={dataTestId || getTestId(ComponentDefaultTestId.COUNTER, id)}>\n {prefix + countText}\n </span>\n </CSSTransition>\n </SwitchTransition>\n )}\n </div>\n </span>\n );\n};\n\ninterface CounterStaticProps {\n sizes: typeof CounterSizeEnum;\n colors: typeof CounterColorEnum;\n kinds: typeof CounterTypeEnum;\n}\n\nexport default withStaticPropsWithoutForwardRef<CounterProps, CounterStaticProps>(Counter, {\n sizes: CounterSizeEnum,\n colors: CounterColorEnum,\n kinds: CounterTypeEnum\n});\n"],"names":["withStaticPropsWithoutForwardRef","_ref","className","counterClassName","_ref$count","count","_ref$size","size","_ref$kind","kind","_ref$color","color","_ref$maxDigits","maxDigits","_ref$ariaLabeledBy","ariaLabeledBy","_ref$ariaLabel","ariaLabel","_ref$id","id","_ref$prefix","prefix","_ref$onMouseDown","onMouseDown","NOOP","_ref$noAnimation","noAnimation","dataTestId","_useState","useState","_useState2","_slicedToArray","countChangeAnimationState","setCountChangeAnimationState","ref","useRef","setCountChangedAnimationActive","useCallback","setCountChangedAnimationNotActive","useEventListener","eventName","callback","isAfterFirstRender","useAfterFirstRender","useEffect","current","console","error","classNames","useMemo","cx","styles","counter","getStyle","camelCase","_defineProperty","withAnimation","counterId","concat","countText","length","Math","pow","String","React","createElement","getTestId","ComponentDefaultTestId","COUNTER","SwitchTransition","mode","CSSTransition","key","enter","fadeEnter","enterActive","fadeEnterActive","exit","fadeExit","exitActive","fadeExitActive","addEndListener","node","done","addEventListener","sizes","CounterSizeEnum","colors","CounterColorEnum","kinds","CounterTypeEnum"],"mappings":"43BAiEA,IAgHeA,EAAAA,GAhHC,SAAHC,GAeM,IAdjBC,EAASD,EAATC,UACAC,EAAgBF,EAAhBE,iBAAgBC,EAAAH,EAChBI,MAAAA,OAAQ,IAAHD,EAAG,EAACA,EAAAE,EAAAL,EACTM,KAAAA,OAAO,IAAHD,EAAG,QAAOA,EAAAE,EAAAP,EACdQ,KAAAA,OAAO,IAAHD,EAAG,OAAMA,EAAAE,EAAAT,EACbU,MAAAA,OAAQ,IAAHD,EAAG,UAASA,EAAAE,EAAAX,EACjBY,UAAAA,OAAY,IAAHD,EAAG,EAACA,EAAAE,EAAAb,EACbc,cAAAA,OAAgB,IAAHD,EAAG,GAAEA,EAAAE,EAAAf,EAClBgB,UAAAA,OAAY,IAAHD,EAAG,GAAEA,EAAAE,EAAAjB,EACdkB,GAAAA,OAAK,IAAHD,EAAG,GAAEA,EAAAE,EAAAnB,EACPoB,OAAAA,OAAS,IAAHD,EAAG,GAAEA,EAAAE,EAAArB,EACXsB,YAAAA,OAAcC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAxB,EAClByB,YAAAA,OAAc,IAAHD,GAAQA,EACJE,EAAU1B,EAAzB,eAEA2B,EAAkEC,GAAS,GAAMC,EAAAC,EAAAH,EAAA,GAA1EI,EAAyBF,EAAA,GAAEG,EAA4BH,EAAA,GAExDI,EAAMC,EAAuB,MAE7BC,EAAiCC,GAAY,WACjDJ,GAA6B,EAC/B,GAAG,CAACA,IAEEK,EAAoCD,GAAY,WACpDJ,GAA6B,EAC/B,GAAG,CAACA,IAEJM,EAAiB,CACfC,UAAW,eACXC,SAAUH,EACVJ,IAAAA,IAGF,IAAMQ,EAAqBC,IAE3BC,GAAU,WACJF,EAAmBG,SACrBT,GAEH,GAAE,CAAC/B,EAAOqC,EAAoBN,IAE/BQ,GAAU,WACJ/B,EAAa,GACfiC,QAAQC,MAAM,uCAElB,GAAG,CAAClC,IAEJ,IAAMmC,EAAaC,GAAQ,WACzB,OAAOC,EACLC,EAAOC,QACPC,EAASF,EAAQG,EAAU,QAAU/C,IACrC8C,EAASF,EAAQG,EAAU,QAAU7C,IACrC4C,EAASF,EAAQG,EAAU,SAAW3C,IAAO4C,EAAA,CAAA,EAE1CJ,EAAOK,cAAgBxB,GAE1B7B,EAEJ,GAAG,CAACI,EAAME,EAAME,EAAOqB,EAA2B7B,IAE5CsD,GAAY,WAAatC,EAAEuC,IAAAA,OAAOvC,GAAO,IACzCwC,IAAYtD,aAAK,GAALA,MAAkBuD,QAAS/C,EAAS,GAAA6C,OAAMG,KAAAC,IAAA,GAAMjD,GAAY,OAAcR,EAAP0D,GAC/EX,GACJY,EAAMC,cAAA,OAAA,CAAA9C,GAAIsC,GAAS,cAAe9B,GAAcuC,EAAUC,EAAuBC,QAASjD,IACvFE,EAASsC,IAId,OACEK,EACEC,cAAA,OAAA,CAAA/D,UAAWA,yBACIe,OAASyC,OAAIC,IACX,kBAAA5C,EACjBQ,YAAaA,GAEbyC,EAAKC,cAAA,MAAA,CAAA/D,UAAW8C,EAAwB,aAAAW,GAAWzB,IAAKA,GACrDR,EACC0B,GAEAY,EAAAC,cAACI,EAAgB,CAACC,KAAK,UACrBN,EAAAC,cAACM,EACC,CAAAC,IAAKb,GACLX,WAAY,CACVyB,MAAOtB,EAAOuB,UACdC,YAAaxB,EAAOyB,gBACpBC,KAAM1B,EAAO2B,SACbC,WAAY5B,EAAO6B,gBAIrBC,eAAgB,SAACC,EAAmBC,GAClCD,EAAKE,iBAAiB,gBAAiBD,GAAM,EAC/C,GAEAnB,EAAMC,cAAA,OAAA,CAAA9C,GAAIsC,GAAwB,cAAA9B,GAAcuC,EAAUC,EAAuBC,QAASjD,IACvFE,EAASsC,OAQ1B,GAQ2F,CACzF0B,MAAOC,EACPC,OAAQC,EACRC,MAAOC"}
@@ -1,2 +1,2 @@
1
- import{inherits as e,createClass as o,toConsumableArray as n,classCallCheck as t,callSuper as i}from"../../../_virtual/_rollupPluginBabelHelpers.js";import s from"classnames";import r,{PureComponent as a}from"react";import{createPortal as l}from"react-dom";import{Manager as u,Reference as h,Popper as d}from"react-popper";import{isFunction as c}from"lodash-es";import{NOOP as p,convertToArray as m,chainFunctions as g}from"../../utils/function-utils.js";import f from"./DialogContent/DialogContent.js";import{isInsideClass as v}from"../../utils/dom-utils.js";import{Refable as D}from"../Refable/Refable.js";import{HideShowEvent as y,DialogPosition as w,AnimationType as E}from"./DialogConstants.js";import k from"./Dialog.module.scss.js";import{getTestId as C,ComponentDefaultTestId as T}from"../../tests/testIds.js";import S from"../LayerProvider/LayerContext.js";import{isClient as b}from"../../utils/ssr-utils.js";import{createObserveContentResizeModifier as O}from"./modifiers/observeContentResizeModifier.js";var M=function(p){function g(e){var o;return t(this,g),(o=i(this,g,[e])).state={shouldUseDerivedStateFromProps:e.useDerivedStateFromProps,isOpen:e.shouldShowOnMount},o.onMouseEnter=o.onMouseEnter.bind(o),o.onMouseLeave=o.onMouseLeave.bind(o),o.onMouseDown=o.onMouseDown.bind(o),o.onClick=o.onClick.bind(o),o.onFocus=o.onFocus.bind(o),o.onBlur=o.onBlur.bind(o),o.isShown=o.isShown.bind(o),o.onEsc=o.onEsc.bind(o),o.onClickOutside=o.onClickOutside.bind(o),o.onDialogEnter=o.onDialogEnter.bind(o),o.onDialogLeave=o.onDialogLeave.bind(o),o.getContainer=o.getContainer.bind(o),o.onContentClick=o.onContentClick.bind(o),o.onKeyDown=o.onKeyDown.bind(o),o.closeDialogOnEscape=o.closeDialogOnEscape.bind(o),o.onContextMenu=o.onContextMenu.bind(o),o.hideTimeout=null,o.showTimeout=null,o}return e(g,a),o(g,[{key:"closeDialogOnEscape",value:function(e){if(this.state.isOpen)switch(e.key){case"Escape":this.hideDialogIfNeeded(e,y.ESCAPE_KEY);break;case"Tab":this.handleEvent(y.TAB_KEY,e.target,e);break;case"Enter":this.handleEvent(y.ENTER,e.target,e)}}},{key:"componentDidMount",value:function(){var e=this.props,o=e.shouldCallbackOnMount,n=e.onDialogDidShow,t=this.state.isOpen;b()&&document.addEventListener("keyup",this.closeDialogOnEscape),o&&t&&n&&n()}},{key:"componentWillUnmount",value:function(){b()&&document.removeEventListener("keyup",this.closeDialogOnEscape),this.showTimeout&&(clearTimeout(this.showTimeout),this.showTimeout=null),this.hideTimeout&&(clearTimeout(this.hideTimeout),this.hideTimeout=null)}},{key:"getContainer",value:function(){var e=document.querySelector(this.props.containerSelector);if(!(e&&e instanceof Element)){var o=this.context.layerRef;return(null==o?void 0:o.current)?o.current:document.body}return e}},{key:"showDialog",value:function(e,o){var n=this,t=this.props,i=t.instantShowAndHide,s=t.getDynamicShowDelay,r=t.showDelay,a=(arguments.length>2&&void 0!==arguments[2]?arguments[2]:{}).preventAnimation;if(s){var l=s();r=l.showDelay||0,a=a||l.preventAnimation}i?(this.onShowDialog(e,o),this.setState({isOpen:!0,preventAnimation:a}),this.showTimeout=null):this.showTimeout=setTimeout((function(){n.onShowDialog(e,o),n.showTimeout=null,n.setState({isOpen:!0,preventAnimation:a})}),r)}},{key:"onShowDialog",value:function(e,o){this.isShown()||(0,this.props.onDialogDidShow)(e,o)}},{key:"showDialogIfNeeded",value:function(e,o){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};this.props.disable||(this.hideTimeout&&(clearTimeout(this.hideTimeout),this.hideTimeout=null),this.showTimeout||this.showDialog(e,o,n))}},{key:"hideDialog",value:function(e,o){var n=this,t=this.props,i=t.hideDelay;t.instantShowAndHide?(this.onHideDialog(e,o),this.setState({isOpen:!1}),this.hideTimeout=null):this.hideTimeout=setTimeout((function(){n.onHideDialog(e,o),n.setState({isOpen:!1}),n.hideTimeout=null}),i)}},{key:"onHideDialog",value:function(e,o){var n=this.props.onDialogDidHide;n&&n(e,o)}},{key:"hideDialogIfNeeded",value:function(e,o){this.showTimeout&&(clearTimeout(this.showTimeout),this.showTimeout=null),this.hideTimeout||this.hideDialog(e,o)}},{key:"handleEvent",value:function(e,o,n){var t=this.props,i=t.showTriggerIgnoreClass,s=t.hideTriggerIgnoreClass;return!this.isShowTrigger(e)||this.isShown()||v(o,i)?this.isHideTrigger(e)&&!v(o,s)?this.hideDialogIfNeeded(n,e):void 0:this.showDialogIfNeeded(n,e)}},{key:"isShown",value:function(){return this.state.isOpen||this.props.open}},{key:"isShowTrigger",value:function(e){var o=this.props,n=o.addKeyboardHideShowTriggersByDefault,t=m(o.showTrigger);return!(!n||"focus"!==e||-1>=t.indexOf("mouseenter"))||t.indexOf(e)>-1}},{key:"isHideTrigger",value:function(e){var o=this.props,n=o.addKeyboardHideShowTriggersByDefault,t=m(o.hideTrigger);return!(!n||"blur"!==e||-1>=t.indexOf("mouseleave"))||t.indexOf(e)>-1}},{key:"onMouseEnter",value:function(e){this.handleEvent("mouseenter",e.target,e)}},{key:"onMouseLeave",value:function(e){this.handleEvent("mouseleave",e.target,e)}},{key:"onClick",value:function(e){e.button||this.handleEvent("click",e.target,e)}},{key:"onKeyDown",value:function(e){"Enter"===e.key&&this.handleEvent("enter",e.target,e),"Tab"===e.key&&this.handleEvent("tab",e.target,e)}},{key:"onMouseDown",value:function(e){e.button||this.handleEvent("mousedown",e.target,e)}},{key:"onFocus",value:function(e){this.handleEvent("focus",e.target,e)}},{key:"onBlur",value:function(e){this.handleEvent("blur",e.relatedTarget,e)}},{key:"onEsc",value:function(e){this.handleEvent("esckey",e.target,e)}},{key:"onContextMenu",value:function(e){var o=this.isShown();(this.isShowTrigger("contextmenu")&&!o||this.isHideTrigger("contextmenu")&&o)&&e.preventDefault(),this.handleEvent("contextmenu",e.target,e)}},{key:"onClickOutside",value:function(e){var o=this.props.onClickOutside;this.handleEvent("clickoutside",e.target,e),o(e)}},{key:"onDialogEnter",value:function(e){this.props.showOnDialogEnter&&this.showDialogIfNeeded(e,"DialogEnter")}},{key:"onDialogLeave",value:function(e){this.props.showOnDialogEnter&&this.hideDialogIfNeeded(e,"DialogLeave")}},{key:"onContentClick",value:function(e){var o=this.props.onContentClick;this.handleEvent("onContentClick",e.target,e),o(e)}},{key:"render",value:function(){var e=this,o=this.props,t=o.wrapperClassName,i=o.content,a=o.startingEdge,p=o.children,m=o.preventAnimationOnMount,g=o.animationType,v=o.position,y=o.showDelay,w=o.moveBy,E=o.modifiers,S=o.tooltip,M=o.tooltipClassName,H=o.referenceWrapperClassName,L=o.zIndex,A=o.hideWhenReferenceHidden,N=o.disableContainerScroll,I=o.containerSelector,R=o.observeContentResize,j=this.state.preventAnimation,B=o["data-testid"]||C(T.DIALOG,o.id),P=m||j?void 0:g,F=c(i)?i():i;return F?r.createElement(u,null,r.createElement(h,null,(function(o){var n=o.ref;return r.createElement(D,{className:s(H),ref:n,onBlur:x("onBlur",e,e.props),onKeyDown:x("onKeyDown",e,e.props),onClick:x("onClick",e,e.props),onFocus:x("onFocus",e,e.props),onMouseDown:x("onMouseDown",e,e.props),onMouseEnter:x("onMouseEnter",e,e.props),onMouseLeave:x("onMouseLeave",e,e.props),onContextMenu:x("onContextMenu",e,e.props)},p)})),b()&&l(r.createElement(d,{placement:v,modifiers:[{name:"offset",options:{offset:[w.secondary,w.main]}},{name:"zIndex",enabled:!0,phase:"write",fn:function(e){var o=e.state;return L&&(o.styles.popper.zIndex=L+""),o}},{name:"rotator",enabled:!0,phase:"write",fn:function(e){var o=e.state;return o.styles.arrow?(o.styles.arrow.transform="".concat(o.styles.arrow.transform," rotate(45deg)"),o):o}},O(R)].concat(n(E))},(function(o){var n=o.placement,i=o.style,l=o.ref,u=o.arrowProps,h=o.isReferenceHidden;if(!e.isShown()&&n)return null;if(A&&h){var d=new CustomEvent("onReferenceHidden");e.hideDialog(d,"onReferenceHidden")}return r.createElement(f,{"data-testid":B,isReferenceHidden:A&&h,onMouseEnter:e.onDialogEnter,onMouseLeave:e.onDialogLeave,onClickOutside:e.onClickOutside,onContextMenu:e.onContextMenu,onEsc:e.onEsc,animationType:P,position:n,wrapperClassName:t,startingEdge:a,isOpen:e.isShown(),showDelay:y,styleObject:i,ref:l,onClick:e.onContentClick,hasTooltip:!!S,containerSelector:I,disableContainerScroll:N},F,S&&r.createElement("div",{style:u.style,ref:u.ref,className:s(k.arrow,M),"data-placement":n}))})),this.getContainer())):p}}],[{key:"getDerivedStateFromProps",value:function(e,o){return o.shouldUseDerivedStateFromProps?{isOpen:e.isOpen}:null}}])}();function x(e,o,n){return g([n[e],o[e]],!0)}M.hideShowTriggers=y,M.positions=w,M.animationTypes=E,M.defaultProps={position:"top",modifiers:[],moveBy:{main:0,secondary:0},showDelay:100,hideDelay:100,showTrigger:M.hideShowTriggers.MOUSE_ENTER,hideTrigger:M.hideShowTriggers.MOUSE_LEAVE,showOnDialogEnter:!1,shouldShowOnMount:!1,disable:!1,open:!1,animationType:M.animationTypes.EXPAND,preventAnimationOnMount:!1,tooltip:!1,onDialogDidShow:p,onDialogDidHide:p,onClickOutside:p,onContentClick:p,useDerivedStateFromProps:!1,hideWhenReferenceHidden:!1,shouldCallbackOnMount:!1,instantShowAndHide:!1,addKeyboardHideShowTriggersByDefault:!1,observeContentResize:!1},M.contextType=S;export{M as default};
1
+ import{inherits as e,createClass as o,toConsumableArray as n,classCallCheck as t,callSuper as i}from"../../../_virtual/_rollupPluginBabelHelpers.js";import s from"classnames";import r,{PureComponent as a}from"react";import{createPortal as l}from"react-dom";import{Manager as u,Reference as h,Popper as d}from"react-popper";import{isFunction as c}from"lodash-es";import{NOOP as p,convertToArray as m,chainFunctions as g}from"../../utils/function-utils.js";import f from"./DialogContent/DialogContent.js";import{isInsideClass as v}from"../../utils/dom-utils.js";import{Refable as D}from"../Refable/Refable.js";import{HideShowEvent as w,DialogPosition as y,AnimationType as E}from"./DialogConstants.js";import k from"./Dialog.module.scss.js";import{getTestId as C,ComponentDefaultTestId as T}from"../../tests/testIds.js";import S from"../LayerProvider/LayerContext.js";import{isClient as b}from"../../utils/ssr-utils.js";import{createObserveContentResizeModifier as O}from"./modifiers/observeContentResizeModifier.js";var M=function(p){function g(e){var o;return t(this,g),(o=i(this,g,[e])).state={shouldUseDerivedStateFromProps:e.useDerivedStateFromProps,isOpen:e.shouldShowOnMount},o.onMouseEnter=o.onMouseEnter.bind(o),o.onMouseLeave=o.onMouseLeave.bind(o),o.onMouseDown=o.onMouseDown.bind(o),o.onClick=o.onClick.bind(o),o.onFocus=o.onFocus.bind(o),o.onBlur=o.onBlur.bind(o),o.isShown=o.isShown.bind(o),o.onEsc=o.onEsc.bind(o),o.onClickOutside=o.onClickOutside.bind(o),o.onDialogEnter=o.onDialogEnter.bind(o),o.onDialogLeave=o.onDialogLeave.bind(o),o.getContainer=o.getContainer.bind(o),o.onContentClick=o.onContentClick.bind(o),o.onKeyDown=o.onKeyDown.bind(o),o.closeDialogOnEscape=o.closeDialogOnEscape.bind(o),o.onContextMenu=o.onContextMenu.bind(o),o.hideTimeout=null,o.showTimeout=null,o}return e(g,a),o(g,[{key:"closeDialogOnEscape",value:function(e){if(this.state.isOpen)switch(e.key){case"Escape":this.hideDialogIfNeeded(e,w.ESCAPE_KEY);break;case"Tab":this.handleEvent(w.TAB_KEY,e.target,e);break;case"Enter":this.handleEvent(w.ENTER,e.target,e)}}},{key:"componentDidMount",value:function(){var e=this.props,o=e.shouldCallbackOnMount,n=e.onDialogDidShow,t=this.state.isOpen;b()&&document.addEventListener("keyup",this.closeDialogOnEscape),o&&t&&n&&n()}},{key:"componentWillUnmount",value:function(){b()&&document.removeEventListener("keyup",this.closeDialogOnEscape),this.showTimeout&&(clearTimeout(this.showTimeout),this.showTimeout=null),this.hideTimeout&&(clearTimeout(this.hideTimeout),this.hideTimeout=null)}},{key:"getContainer",value:function(){var e=document.querySelector(this.props.containerSelector);if(!(e&&e instanceof Element)){var o=this.context.layerRef;return(null==o?void 0:o.current)?o.current:document.body}return e}},{key:"showDialog",value:function(e,o){var n=this,t=this.props,i=t.instantShowAndHide,s=t.getDynamicShowDelay,r=t.showDelay,a=(arguments.length>2&&void 0!==arguments[2]?arguments[2]:{}).preventAnimation;if(s){var l=s();r=l.showDelay||0,a=a||l.preventAnimation}i?(this.onShowDialog(e,o),this.setState({isOpen:!0,preventAnimation:a}),this.showTimeout=null):this.showTimeout=setTimeout((function(){n.onShowDialog(e,o),n.showTimeout=null,n.setState({isOpen:!0,preventAnimation:a})}),r)}},{key:"onShowDialog",value:function(e,o){this.isShown()||(0,this.props.onDialogDidShow)(e,o)}},{key:"showDialogIfNeeded",value:function(e,o){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};this.props.disable||(this.hideTimeout&&(clearTimeout(this.hideTimeout),this.hideTimeout=null),this.showTimeout||this.showDialog(e,o,n))}},{key:"hideDialog",value:function(e,o){var n=this,t=this.props,i=t.hideDelay;t.instantShowAndHide?(this.onHideDialog(e,o),this.setState({isOpen:!1}),this.hideTimeout=null):this.hideTimeout=setTimeout((function(){n.onHideDialog(e,o),n.setState({isOpen:!1}),n.hideTimeout=null}),i)}},{key:"onHideDialog",value:function(e,o){var n=this.props.onDialogDidHide;n&&n(e,o)}},{key:"hideDialogIfNeeded",value:function(e,o){this.showTimeout&&(clearTimeout(this.showTimeout),this.showTimeout=null),this.hideTimeout||this.hideDialog(e,o)}},{key:"handleEvent",value:function(e,o,n){var t=this.props,i=t.showTriggerIgnoreClass,s=t.hideTriggerIgnoreClass;return!this.isShowTrigger(e)||this.isShown()||v(o,i)?this.isHideTrigger(e)&&!v(o,s)?this.hideDialogIfNeeded(n,e):void 0:this.showDialogIfNeeded(n,e)}},{key:"isShown",value:function(){return this.state.isOpen||this.props.open}},{key:"isShowTrigger",value:function(e){var o=this.props,n=o.addKeyboardHideShowTriggersByDefault,t=m(o.showTrigger);return!(!n||"focus"!==e||-1>=t.indexOf("mouseenter"))||t.indexOf(e)>-1}},{key:"isHideTrigger",value:function(e){var o=this.props,n=o.addKeyboardHideShowTriggersByDefault,t=m(o.hideTrigger);return!(!n||"blur"!==e||-1>=t.indexOf("mouseleave"))||t.indexOf(e)>-1}},{key:"onMouseEnter",value:function(e){this.handleEvent("mouseenter",e.target,e)}},{key:"onMouseLeave",value:function(e){this.handleEvent("mouseleave",e.target,e)}},{key:"onClick",value:function(e){e.button||this.handleEvent("click",e.target,e)}},{key:"onKeyDown",value:function(e){"Enter"===e.key&&this.handleEvent("enter",e.target,e),"Tab"===e.key&&this.handleEvent("tab",e.target,e)}},{key:"onMouseDown",value:function(e){e.button||this.handleEvent("mousedown",e.target,e)}},{key:"onFocus",value:function(e){this.handleEvent("focus",e.target,e)}},{key:"onBlur",value:function(e){this.handleEvent("blur",e.relatedTarget,e)}},{key:"onEsc",value:function(e){this.handleEvent("esckey",e.target,e)}},{key:"onContextMenu",value:function(e){var o=this.isShown();(this.isShowTrigger("contextmenu")&&!o||this.isHideTrigger("contextmenu")&&o)&&e.preventDefault(),this.handleEvent("contextmenu",e.target,e)}},{key:"onClickOutside",value:function(e){var o=this.props.onClickOutside;this.handleEvent("clickoutside",e.target,e),o(e)}},{key:"onDialogEnter",value:function(e){this.props.showOnDialogEnter&&this.showDialogIfNeeded(e,"DialogEnter")}},{key:"onDialogLeave",value:function(e){this.props.showOnDialogEnter&&this.hideDialogIfNeeded(e,"DialogLeave")}},{key:"onContentClick",value:function(e){var o=this.props.onContentClick;this.handleEvent("onContentClick",e.target,e),o(e)}},{key:"render",value:function(){var e=this,o=this.props,t=o.wrapperClassName,i=o.content,a=o.startingEdge,p=o.children,m=o.preventAnimationOnMount,g=o.animationType,v=o.position,w=o.showDelay,y=o.moveBy,E=o.modifiers,S=o.tooltip,M=o.tooltipClassName,H=o.referenceWrapperClassName,L=o.referenceWrapperElement,A=o.zIndex,N=o.hideWhenReferenceHidden,I=o.disableContainerScroll,R=o.containerSelector,j=o.observeContentResize,B=this.state.preventAnimation,P=o["data-testid"]||C(T.DIALOG,o.id),F=m||B?void 0:g,K=c(i)?i():i;return K?r.createElement(u,null,r.createElement(h,null,(function(o){var n=o.ref;return r.createElement(D,{className:s(H),wrapperElement:L,ref:n,onBlur:x("onBlur",e,e.props),onKeyDown:x("onKeyDown",e,e.props),onClick:x("onClick",e,e.props),onFocus:x("onFocus",e,e.props),onMouseDown:x("onMouseDown",e,e.props),onMouseEnter:x("onMouseEnter",e,e.props),onMouseLeave:x("onMouseLeave",e,e.props),onContextMenu:x("onContextMenu",e,e.props)},p)})),b()&&l(r.createElement(d,{placement:v,modifiers:[{name:"offset",options:{offset:[y.secondary,y.main]}},{name:"zIndex",enabled:!0,phase:"write",fn:function(e){var o=e.state;return A&&(o.styles.popper.zIndex=A+""),o}},{name:"rotator",enabled:!0,phase:"write",fn:function(e){var o=e.state;return o.styles.arrow?(o.styles.arrow.transform="".concat(o.styles.arrow.transform," rotate(45deg)"),o):o}},O(j)].concat(n(E))},(function(o){var n=o.placement,i=o.style,l=o.ref,u=o.arrowProps,h=o.isReferenceHidden;if(!e.isShown()&&n)return null;if(N&&h){var d=new CustomEvent("onReferenceHidden");e.hideDialog(d,"onReferenceHidden")}return r.createElement(f,{"data-testid":P,isReferenceHidden:N&&h,onMouseEnter:e.onDialogEnter,onMouseLeave:e.onDialogLeave,onClickOutside:e.onClickOutside,onContextMenu:e.onContextMenu,onEsc:e.onEsc,animationType:F,position:n,wrapperClassName:t,startingEdge:a,isOpen:e.isShown(),showDelay:w,styleObject:i,ref:l,onClick:e.onContentClick,hasTooltip:!!S,containerSelector:R,disableContainerScroll:I},K,S&&r.createElement("div",{style:u.style,ref:u.ref,className:s(k.arrow,M),"data-placement":n}))})),this.getContainer())):p}}],[{key:"getDerivedStateFromProps",value:function(e,o){return o.shouldUseDerivedStateFromProps?{isOpen:e.isOpen}:null}}])}();function x(e,o,n){return g([n[e],o[e]],!0)}M.hideShowTriggers=w,M.positions=y,M.animationTypes=E,M.defaultProps={position:"top",modifiers:[],moveBy:{main:0,secondary:0},showDelay:100,hideDelay:100,showTrigger:M.hideShowTriggers.MOUSE_ENTER,hideTrigger:M.hideShowTriggers.MOUSE_LEAVE,showOnDialogEnter:!1,shouldShowOnMount:!1,disable:!1,open:!1,animationType:M.animationTypes.EXPAND,preventAnimationOnMount:!1,tooltip:!1,onDialogDidShow:p,onDialogDidHide:p,onClickOutside:p,onContentClick:p,useDerivedStateFromProps:!1,hideWhenReferenceHidden:!1,shouldCallbackOnMount:!1,instantShowAndHide:!1,addKeyboardHideShowTriggersByDefault:!1,observeContentResize:!1},M.contextType=S;export{M as default};
2
2
  //# sourceMappingURL=Dialog.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Dialog.js","sources":["../../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { PureComponent, ReactElement } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { Manager, Modifier, Popper, Reference } from \"react-popper\";\nimport { isFunction } from \"lodash-es\";\nimport { chainFunctions, convertToArray, NOOP } from \"../../utils/function-utils\";\nimport DialogContent from \"./DialogContent/DialogContent\";\nimport { isInsideClass } from \"../../utils/dom-utils\";\nimport { Refable } from \"../Refable/Refable\";\nimport {\n AnimationType as AnimationTypeEnum,\n HideShowEvent as DialogTriggerEventEnum,\n DialogPosition as DialogPositionEnum\n} from \"./DialogConstants\";\nimport { VibeComponentProps } from \"../../types\";\nimport * as PopperJS from \"@popperjs/core\";\nimport styles from \"./Dialog.module.scss\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { DialogAnimationType, DialogPosition, DialogTriggerEvent } from \"./Dialog.types\";\nimport LayerContext from \"../LayerProvider/LayerContext\";\nimport { isClient } from \"../../utils/ssr-utils\";\nimport { createObserveContentResizeModifier } from \"./modifiers/observeContentResizeModifier\";\n\nexport interface DialogProps extends VibeComponentProps {\n /**\n * Class name applied to the reference wrapper element.\n */\n referenceWrapperClassName?: string;\n /**\n * The placement of the dialog relative to the reference element.\n */\n position?: DialogPosition;\n /**\n * Custom Popper.js modifiers.\n * https://popper.js.org/docs/v2/modifiers/\n */\n modifiers?: Modifier<any>[];\n /**\n * The starting edge of the dialog.\n */\n startingEdge?: string;\n /**\n * Offset values for positioning adjustments.\n * `main` - horizontal offset\n * `secondary` - vertical offset\n */\n moveBy?: { main?: number; secondary?: number };\n /**\n * Delay in milliseconds before showing the dialog.\n */\n showDelay?: number;\n /**\n * Delay in milliseconds before hiding the dialog.\n */\n hideDelay?: number;\n /**\n * Events that trigger showing the dialog.\n */\n showTrigger?: DialogTriggerEvent | DialogTriggerEvent[];\n /**\n * Events that trigger hiding the dialog.\n */\n hideTrigger?: DialogTriggerEvent | DialogTriggerEvent[];\n /**\n * If true, prevents closing the dialog when the mouse enters it.\n */\n showOnDialogEnter?: boolean;\n /**\n * If true, shows the dialog when the component mounts.\n */\n shouldShowOnMount?: boolean;\n /**\n * If true, disables opening the dialog.\n */\n disable?: boolean;\n /**\n * Controls the open state of the dialog.\n */\n open?: boolean;\n /**\n * Derived state control for managing dialog visibility.\n */\n isOpen?: boolean;\n /**\n * Classes that prevent showing the dialog when present.\n */\n showTriggerIgnoreClass?: string | Array<string>;\n /**\n * Classes that prevent hiding the dialog when present.\n */\n hideTriggerIgnoreClass?: string | Array<string>;\n /**\n * The animation type used for the dialog.\n */\n animationType?: DialogAnimationType;\n /**\n * Class name applied to the dialog content container.\n */\n wrapperClassName?: string;\n /**\n * If true, prevents animation when mounting.\n */\n preventAnimationOnMount?: boolean;\n /**\n * The CSS selector of the container where the dialog is rendered.\n */\n containerSelector?: string;\n /**\n * If true, positions the tooltip element.\n */\n tooltip?: boolean;\n /**\n * Class name applied to the tooltip element.\n */\n tooltipClassName?: string;\n /**\n * Callback fired when the dialog is shown.\n */\n onDialogDidShow?: (event?: DialogEvent, eventName?: DialogTriggerEvent | string) => void;\n /**\n * Callback fired when the dialog is hidden.\n */\n onDialogDidHide?: (event: DialogEvent, eventName: DialogTriggerEvent | string) => void;\n /**\n * Callback fired when clicking outside the dialog.\n */\n onClickOutside?: (event: React.MouseEvent) => void;\n /**\n * Callback fired when clicking inside the dialog content.\n */\n onContentClick?: (event: React.MouseEvent) => void;\n /**\n * The z-index applied to the dialog.\n */\n zIndex?: number;\n /**\n * If true, uses derived state from props.\n */\n useDerivedStateFromProps?: boolean;\n /**\n * If true, makes the dialog disappear when the reference element is hidden.\n */\n hideWhenReferenceHidden?: boolean;\n /**\n * If true, triggers the callback when the dialog mounts.\n */\n shouldCallbackOnMount?: boolean;\n /**\n * If true, instantly shows and hides the dialog without delay.\n */\n instantShowAndHide?: boolean;\n /**\n * Callback to dynamically adjust show delay and animation behavior.\n */\n getDynamicShowDelay?: () => { showDelay: number; preventAnimation: boolean };\n /**\n * The content displayed inside the dialog.\n */\n content?: (() => JSX.Element) | JSX.Element;\n /**\n * The element to position the dialog beside.\n */\n children?: ReactElement | ReactElement[] | string;\n /**\n * If true, keyboard focus/blur events behave like mouse enter/leave.\n */\n addKeyboardHideShowTriggersByDefault?: boolean;\n /**\n * If true, disables scrolling for the container element.\n */\n disableContainerScroll?: boolean | string;\n /**\n * Enables the observation of content resize for the popper element.\n * When set to `true`, a ResizeObserver is attached to the popper content,\n * automatically triggering repositioning when the size of the content changes.\n *\n * This is useful for dialogs, tooltips, or popovers with dynamic content\n * that may grow or shrink without a re-render being triggered.\n */\n observeContentResize?: boolean;\n}\n\nexport interface DialogState {\n /**\n * If true, the dialog is open.\n */\n isOpen?: boolean;\n /**\n * If true, the dialog state is derived from props.\n */\n shouldUseDerivedStateFromProps?: boolean;\n /**\n * If true, prevents animation when opening or closing the dialog.\n */\n preventAnimation?: boolean;\n}\n\nexport type DialogEvent = React.MouseEvent | React.KeyboardEvent | KeyboardEvent | React.FocusEvent | CustomEvent;\n\nexport default class Dialog extends PureComponent<DialogProps, DialogState> {\n static hideShowTriggers = DialogTriggerEventEnum;\n static positions = DialogPositionEnum;\n static animationTypes = AnimationTypeEnum;\n static defaultProps = {\n position: \"top\",\n modifiers: [] as Modifier<any>[],\n moveBy: { main: 0, secondary: 0 },\n showDelay: 100,\n hideDelay: 100,\n showTrigger: Dialog.hideShowTriggers.MOUSE_ENTER,\n hideTrigger: Dialog.hideShowTriggers.MOUSE_LEAVE,\n showOnDialogEnter: false,\n shouldShowOnMount: false,\n disable: false,\n open: false,\n animationType: Dialog.animationTypes.EXPAND,\n preventAnimationOnMount: false,\n tooltip: false,\n onDialogDidShow: NOOP,\n onDialogDidHide: NOOP,\n onClickOutside: NOOP,\n onContentClick: NOOP,\n useDerivedStateFromProps: false,\n hideWhenReferenceHidden: false,\n shouldCallbackOnMount: false,\n instantShowAndHide: false,\n addKeyboardHideShowTriggersByDefault: false,\n observeContentResize: false\n };\n private showTimeout: NodeJS.Timeout;\n private hideTimeout: NodeJS.Timeout;\n context!: React.ContextType<typeof LayerContext>;\n\n constructor(props: DialogProps) {\n super(props);\n this.state = {\n shouldUseDerivedStateFromProps: props.useDerivedStateFromProps,\n isOpen: props.shouldShowOnMount\n };\n\n // Binding section.\n this.onMouseEnter = this.onMouseEnter.bind(this);\n this.onMouseLeave = this.onMouseLeave.bind(this);\n this.onMouseDown = this.onMouseDown.bind(this);\n this.onClick = this.onClick.bind(this);\n this.onFocus = this.onFocus.bind(this);\n this.onBlur = this.onBlur.bind(this);\n this.isShown = this.isShown.bind(this);\n this.onEsc = this.onEsc.bind(this);\n this.onClickOutside = this.onClickOutside.bind(this);\n this.onDialogEnter = this.onDialogEnter.bind(this);\n this.onDialogLeave = this.onDialogLeave.bind(this);\n this.getContainer = this.getContainer.bind(this);\n this.onContentClick = this.onContentClick.bind(this);\n this.onKeyDown = this.onKeyDown.bind(this);\n this.closeDialogOnEscape = this.closeDialogOnEscape.bind(this);\n this.onContextMenu = this.onContextMenu.bind(this);\n\n // Timeouts\n this.hideTimeout = null;\n this.showTimeout = null;\n }\n\n closeDialogOnEscape(event: KeyboardEvent) {\n const { isOpen } = this.state;\n if (!isOpen) {\n return;\n }\n switch (event.key) {\n case \"Escape\":\n this.hideDialogIfNeeded(event, DialogTriggerEventEnum.ESCAPE_KEY);\n break;\n case \"Tab\":\n this.handleEvent(DialogTriggerEventEnum.TAB_KEY, event.target, event);\n break;\n case \"Enter\":\n this.handleEvent(DialogTriggerEventEnum.ENTER, event.target, event);\n break;\n default:\n break;\n }\n }\n\n componentDidMount() {\n const { shouldCallbackOnMount, onDialogDidShow } = this.props;\n const { isOpen } = this.state;\n if (isClient()) {\n document.addEventListener(\"keyup\", this.closeDialogOnEscape);\n }\n if (shouldCallbackOnMount && isOpen) {\n onDialogDidShow && onDialogDidShow();\n }\n }\n\n componentWillUnmount() {\n if (isClient()) {\n document.removeEventListener(\"keyup\", this.closeDialogOnEscape);\n }\n if (this.showTimeout) {\n clearTimeout(this.showTimeout);\n this.showTimeout = null;\n }\n if (this.hideTimeout) {\n clearTimeout(this.hideTimeout);\n this.hideTimeout = null;\n }\n }\n\n static getDerivedStateFromProps(nextProps: DialogProps, state: DialogState): DialogState {\n if (state.shouldUseDerivedStateFromProps) {\n return { isOpen: nextProps.isOpen };\n }\n return null;\n }\n\n getContainer() {\n const { containerSelector } = this.props;\n const containerElement = document.querySelector(containerSelector);\n if (!containerElement || !(containerElement instanceof Element)) {\n const { layerRef } = this.context;\n if (layerRef?.current) {\n return layerRef.current;\n }\n return document.body;\n }\n return containerElement;\n }\n\n showDialog(event: DialogEvent, eventName: DialogTriggerEvent | string, options: { preventAnimation?: boolean } = {}) {\n const { showDelay, instantShowAndHide, getDynamicShowDelay } = this.props;\n let finalShowDelay = showDelay;\n let preventAnimation = options.preventAnimation;\n if (getDynamicShowDelay) {\n const dynamicDelayObj = getDynamicShowDelay();\n finalShowDelay = dynamicDelayObj.showDelay || 0;\n preventAnimation = preventAnimation || dynamicDelayObj.preventAnimation;\n }\n\n if (instantShowAndHide) {\n this.onShowDialog(event, eventName);\n this.setState({ isOpen: true, preventAnimation });\n this.showTimeout = null;\n } else {\n this.showTimeout = setTimeout(() => {\n this.onShowDialog(event, eventName);\n this.showTimeout = null;\n this.setState({ isOpen: true, preventAnimation });\n }, finalShowDelay);\n }\n }\n\n onShowDialog(event: DialogEvent, eventName: DialogTriggerEvent | string) {\n if (this.isShown()) return;\n const { onDialogDidShow } = this.props;\n onDialogDidShow(event, eventName);\n }\n\n showDialogIfNeeded(event: DialogEvent, eventName: DialogTriggerEvent | string, options = {}) {\n const { disable } = this.props;\n if (disable) {\n return;\n }\n\n if (this.hideTimeout) {\n clearTimeout(this.hideTimeout);\n this.hideTimeout = null;\n }\n\n if (!this.showTimeout) {\n this.showDialog(event, eventName, options);\n }\n }\n\n hideDialog(event: DialogEvent, eventName: DialogTriggerEvent | string) {\n const { hideDelay, instantShowAndHide } = this.props;\n if (instantShowAndHide) {\n this.onHideDialog(event, eventName);\n this.setState({ isOpen: false });\n this.hideTimeout = null;\n } else {\n this.hideTimeout = setTimeout(() => {\n this.onHideDialog(event, eventName);\n this.setState({ isOpen: false });\n this.hideTimeout = null;\n }, hideDelay);\n }\n }\n\n onHideDialog(event: DialogEvent, eventName: DialogTriggerEvent | string) {\n const { onDialogDidHide } = this.props;\n if (onDialogDidHide) onDialogDidHide(event, eventName);\n }\n\n hideDialogIfNeeded(event: DialogEvent, eventName: DialogTriggerEvent | string) {\n if (this.showTimeout) {\n clearTimeout(this.showTimeout);\n this.showTimeout = null;\n }\n\n if (this.hideTimeout) {\n return;\n }\n this.hideDialog(event, eventName);\n }\n\n handleEvent(eventName: DialogTriggerEvent, target: EventTarget, event: DialogEvent) {\n const { showTriggerIgnoreClass, hideTriggerIgnoreClass } = this.props;\n if (\n this.isShowTrigger(eventName) &&\n !this.isShown() &&\n !isInsideClass(target as HTMLElement, showTriggerIgnoreClass)\n ) {\n return this.showDialogIfNeeded(event, eventName);\n }\n\n if (this.isHideTrigger(eventName) && !isInsideClass(target as HTMLElement, hideTriggerIgnoreClass)) {\n return this.hideDialogIfNeeded(event, eventName);\n }\n }\n\n isShown() {\n const { isOpen } = this.state;\n const { open } = this.props;\n\n return isOpen || open;\n }\n\n isShowTrigger(eventName: DialogTriggerEvent) {\n const { showTrigger, addKeyboardHideShowTriggersByDefault } = this.props;\n const showTriggersArray = convertToArray(showTrigger);\n\n if (addKeyboardHideShowTriggersByDefault) {\n if (eventName === \"focus\" && showTriggersArray.indexOf(\"mouseenter\") > -1) {\n return true;\n }\n }\n\n return showTriggersArray.indexOf(eventName) > -1;\n }\n\n isHideTrigger(eventName: DialogTriggerEvent) {\n const { hideTrigger, addKeyboardHideShowTriggersByDefault } = this.props;\n const hideTriggersArray = convertToArray(hideTrigger);\n\n if (addKeyboardHideShowTriggersByDefault) {\n if (eventName === \"blur\" && hideTriggersArray.indexOf(\"mouseleave\") > -1) {\n return true;\n }\n }\n\n return hideTriggersArray.indexOf(eventName) > -1;\n }\n\n onMouseEnter(e: React.MouseEvent) {\n this.handleEvent(\"mouseenter\", e.target, e);\n }\n\n onMouseLeave(e: React.MouseEvent) {\n this.handleEvent(\"mouseleave\", e.target, e);\n }\n\n onClick(e: React.MouseEvent) {\n if (e.button) return;\n this.handleEvent(\"click\", e.target, e);\n }\n\n onKeyDown(event: React.KeyboardEvent) {\n if (event.key === \"Enter\") {\n this.handleEvent(\"enter\", event.target, event);\n }\n\n if (event.key === \"Tab\") {\n this.handleEvent(\"tab\", event.target, event);\n }\n }\n\n onMouseDown(e: React.MouseEvent) {\n if (e.button) return;\n this.handleEvent(\"mousedown\", e.target, e);\n }\n\n onFocus(e: React.FocusEvent) {\n this.handleEvent(\"focus\", e.target, e);\n }\n\n onBlur(e: React.FocusEvent) {\n this.handleEvent(\"blur\", e.relatedTarget, e);\n }\n\n onEsc(e: React.KeyboardEvent) {\n this.handleEvent(\"esckey\", e.target, e);\n }\n\n onContextMenu(e: React.MouseEvent) {\n const isShown = this.isShown();\n if ((this.isShowTrigger(\"contextmenu\") && !isShown) || (this.isHideTrigger(\"contextmenu\") && isShown)) {\n e.preventDefault();\n }\n this.handleEvent(\"contextmenu\", e.target, e);\n }\n\n onClickOutside(event: React.MouseEvent) {\n const { onClickOutside } = this.props;\n this.handleEvent(\"clickoutside\", event.target, event);\n onClickOutside(event);\n }\n\n onDialogEnter(event: React.MouseEvent) {\n const { showOnDialogEnter } = this.props;\n if (showOnDialogEnter) this.showDialogIfNeeded(event, \"DialogEnter\");\n }\n\n onDialogLeave(event: React.MouseEvent) {\n const { showOnDialogEnter } = this.props;\n if (showOnDialogEnter) this.hideDialogIfNeeded(event, \"DialogLeave\");\n }\n\n onContentClick(e: React.MouseEvent) {\n const { onContentClick } = this.props;\n this.handleEvent(\"onContentClick\", e.target, e);\n onContentClick(e);\n }\n\n render() {\n const {\n wrapperClassName,\n content,\n startingEdge,\n children,\n preventAnimationOnMount,\n animationType,\n position,\n showDelay,\n moveBy,\n modifiers,\n tooltip,\n tooltipClassName,\n referenceWrapperClassName,\n zIndex,\n hideWhenReferenceHidden,\n disableContainerScroll,\n containerSelector,\n observeContentResize,\n id,\n \"data-testid\": dataTestId\n } = this.props;\n const { preventAnimation } = this.state;\n const overrideDataTestId = dataTestId || getTestId(ComponentDefaultTestId.DIALOG, id);\n\n const animationTypeCalculated = preventAnimationOnMount || preventAnimation ? undefined : animationType;\n const contentRendered = isFunction(content) ? content() : content;\n\n if (!contentRendered) {\n return children;\n }\n return (\n <Manager>\n <Reference>\n {({ ref }) => {\n return (\n <Refable\n className={cx(referenceWrapperClassName)}\n ref={ref}\n onBlur={chainOnPropsAndInstance(\"onBlur\", this, this.props)}\n onKeyDown={chainOnPropsAndInstance(\"onKeyDown\", this, this.props)}\n onClick={chainOnPropsAndInstance(\"onClick\", this, this.props)}\n onFocus={chainOnPropsAndInstance(\"onFocus\", this, this.props)}\n onMouseDown={chainOnPropsAndInstance(\"onMouseDown\", this, this.props)}\n onMouseEnter={chainOnPropsAndInstance(\"onMouseEnter\", this, this.props)}\n onMouseLeave={chainOnPropsAndInstance(\"onMouseLeave\", this, this.props)}\n onContextMenu={chainOnPropsAndInstance(\"onContextMenu\", this, this.props)}\n >\n {children}\n </Refable>\n );\n }}\n </Reference>\n {isClient() &&\n createPortal(\n <Popper\n placement={position as unknown as PopperJS.Placement}\n modifiers={[\n {\n name: \"offset\",\n options: {\n offset: [moveBy.secondary, moveBy.main]\n }\n },\n {\n name: \"zIndex\",\n enabled: true,\n phase: \"write\",\n fn({ state }) {\n if (zIndex) {\n state.styles.popper.zIndex = String(zIndex);\n }\n return state;\n }\n },\n {\n name: \"rotator\",\n enabled: true,\n phase: \"write\",\n fn({ state }) {\n if (!state.styles.arrow) {\n return state;\n }\n // const reg = new RegExp(\n // /translate\\(([0-9].*)px, ([0-9].*)px\\)/\n // );\n // const transform = state.styles.arrow.transform;\n // const res = reg.exec(transform);\n // state.styles.popper.transformOrigin = `${100 -\n // res[1]}% ${100 - res[2]}%`;\n state.styles.arrow.transform = `${state.styles.arrow.transform} rotate(45deg)`;\n return state;\n }\n },\n createObserveContentResizeModifier(observeContentResize),\n ...modifiers\n ]}\n >\n {({ placement, style, ref, arrowProps, isReferenceHidden }) => {\n if (!this.isShown() && placement) {\n return null;\n }\n\n if (hideWhenReferenceHidden && isReferenceHidden) {\n const event = new CustomEvent(\"onReferenceHidden\");\n this.hideDialog(event, \"onReferenceHidden\");\n }\n\n return (\n <DialogContent\n data-testid={overrideDataTestId}\n isReferenceHidden={hideWhenReferenceHidden && isReferenceHidden}\n onMouseEnter={this.onDialogEnter}\n onMouseLeave={this.onDialogLeave}\n onClickOutside={this.onClickOutside}\n onContextMenu={this.onContextMenu}\n onEsc={this.onEsc}\n animationType={animationTypeCalculated}\n position={placement}\n wrapperClassName={wrapperClassName}\n startingEdge={startingEdge}\n isOpen={this.isShown()}\n showDelay={showDelay}\n styleObject={style}\n ref={ref}\n onClick={this.onContentClick}\n hasTooltip={!!tooltip}\n containerSelector={containerSelector}\n disableContainerScroll={disableContainerScroll}\n >\n {contentRendered}\n {tooltip && (\n <div\n style={arrowProps.style}\n ref={arrowProps.ref}\n className={cx(styles.arrow, tooltipClassName)}\n data-placement={placement}\n />\n )}\n </DialogContent>\n );\n }}\n </Popper>,\n this.getContainer()\n )}\n </Manager>\n );\n }\n}\n\nfunction chainOnPropsAndInstance(name: string, instance: Dialog, props: DialogProps) {\n // @ts-ignore\n return chainFunctions([props[name], instance[name]], true);\n}\n\nDialog.contextType = LayerContext;\n"],"names":["Dialog","_PureComponent","props","_this","_classCallCheck","_callSuper","state","shouldUseDerivedStateFromProps","useDerivedStateFromProps","isOpen","shouldShowOnMount","onMouseEnter","bind","onMouseLeave","onMouseDown","onClick","onFocus","onBlur","isShown","onEsc","onClickOutside","onDialogEnter","onDialogLeave","getContainer","onContentClick","onKeyDown","closeDialogOnEscape","onContextMenu","hideTimeout","showTimeout","_inherits","PureComponent","_createClass","key","value","event","this","hideDialogIfNeeded","DialogTriggerEventEnum","ESCAPE_KEY","handleEvent","TAB_KEY","target","ENTER","_this$props","shouldCallbackOnMount","onDialogDidShow","isClient","document","addEventListener","removeEventListener","clearTimeout","containerElement","querySelector","containerSelector","Element","layerRef","context","current","body","eventName","_this2","_this$props2","instantShowAndHide","getDynamicShowDelay","finalShowDelay","showDelay","preventAnimation","dynamicDelayObj","onShowDialog","setState","setTimeout","options","arguments","length","undefined","disable","showDialog","_this3","_this$props3","hideDelay","onHideDialog","onDialogDidHide","hideDialog","_this$props4","showTriggerIgnoreClass","hideTriggerIgnoreClass","isShowTrigger","isInsideClass","isHideTrigger","showDialogIfNeeded","open","_this$props5","addKeyboardHideShowTriggersByDefault","showTriggersArray","convertToArray","showTrigger","indexOf","_this$props6","hideTriggersArray","hideTrigger","e","button","relatedTarget","preventDefault","showOnDialogEnter","_this4","_this$props7","wrapperClassName","content","startingEdge","children","preventAnimationOnMount","animationType","position","moveBy","modifiers","tooltip","tooltipClassName","referenceWrapperClassName","zIndex","hideWhenReferenceHidden","disableContainerScroll","observeContentResize","overrideDataTestId","getTestId","ComponentDefaultTestId","DIALOG","id","animationTypeCalculated","contentRendered","isFunction","React","Manager","createElement","Reference","_ref","ref","Refable","className","cx","chainOnPropsAndInstance","createPortal","Popper","placement","name","offset","secondary","main","enabled","phase","fn","_ref2","styles","popper","String","_ref3","arrow","transform","concat","createObserveContentResizeModifier","_toConsumableArray","_ref4","style","arrowProps","isReferenceHidden","CustomEvent","DialogContent","styleObject","hasTooltip","nextProps","instance","chainFunctions","hideShowTriggers","positions","DialogPositionEnum","animationTypes","AnimationTypeEnum","defaultProps","MOUSE_ENTER","MOUSE_LEAVE","EXPAND","NOOP","contextType","LayerContext"],"mappings":"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"}
1
+ {"version":3,"file":"Dialog.js","sources":["../../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { PureComponent, ReactElement } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { Manager, Modifier, Popper, Reference } from \"react-popper\";\nimport { isFunction } from \"lodash-es\";\nimport { chainFunctions, convertToArray, NOOP } from \"../../utils/function-utils\";\nimport DialogContent from \"./DialogContent/DialogContent\";\nimport { isInsideClass } from \"../../utils/dom-utils\";\nimport { Refable } from \"../Refable/Refable\";\nimport {\n AnimationType as AnimationTypeEnum,\n HideShowEvent as DialogTriggerEventEnum,\n DialogPosition as DialogPositionEnum\n} from \"./DialogConstants\";\nimport { VibeComponentProps } from \"../../types\";\nimport * as PopperJS from \"@popperjs/core\";\nimport styles from \"./Dialog.module.scss\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { DialogAnimationType, DialogPosition, DialogTriggerEvent } from \"./Dialog.types\";\nimport LayerContext from \"../LayerProvider/LayerContext\";\nimport { isClient } from \"../../utils/ssr-utils\";\nimport { createObserveContentResizeModifier } from \"./modifiers/observeContentResizeModifier\";\n\nexport interface DialogProps extends VibeComponentProps {\n /**\n * Class name applied to the reference wrapper element.\n */\n referenceWrapperClassName?: string;\n /**\n * The wrapper element type to use for React components. Defaults to \"span\".\n */\n referenceWrapperElement?: \"span\" | \"div\";\n /**\n * The placement of the dialog relative to the reference element.\n */\n position?: DialogPosition;\n /**\n * Custom Popper.js modifiers.\n * https://popper.js.org/docs/v2/modifiers/\n */\n modifiers?: Modifier<any>[];\n /**\n * The starting edge of the dialog.\n */\n startingEdge?: string;\n /**\n * Offset values for positioning adjustments.\n * `main` - horizontal offset\n * `secondary` - vertical offset\n */\n moveBy?: { main?: number; secondary?: number };\n /**\n * Delay in milliseconds before showing the dialog.\n */\n showDelay?: number;\n /**\n * Delay in milliseconds before hiding the dialog.\n */\n hideDelay?: number;\n /**\n * Events that trigger showing the dialog.\n */\n showTrigger?: DialogTriggerEvent | DialogTriggerEvent[];\n /**\n * Events that trigger hiding the dialog.\n */\n hideTrigger?: DialogTriggerEvent | DialogTriggerEvent[];\n /**\n * If true, prevents closing the dialog when the mouse enters it.\n */\n showOnDialogEnter?: boolean;\n /**\n * If true, shows the dialog when the component mounts.\n */\n shouldShowOnMount?: boolean;\n /**\n * If true, disables opening the dialog.\n */\n disable?: boolean;\n /**\n * Controls the open state of the dialog.\n */\n open?: boolean;\n /**\n * Derived state control for managing dialog visibility.\n */\n isOpen?: boolean;\n /**\n * Classes that prevent showing the dialog when present.\n */\n showTriggerIgnoreClass?: string | Array<string>;\n /**\n * Classes that prevent hiding the dialog when present.\n */\n hideTriggerIgnoreClass?: string | Array<string>;\n /**\n * The animation type used for the dialog.\n */\n animationType?: DialogAnimationType;\n /**\n * Class name applied to the dialog content container.\n */\n wrapperClassName?: string;\n /**\n * If true, prevents animation when mounting.\n */\n preventAnimationOnMount?: boolean;\n /**\n * The CSS selector of the container where the dialog is rendered.\n */\n containerSelector?: string;\n /**\n * If true, positions the tooltip element.\n */\n tooltip?: boolean;\n /**\n * Class name applied to the tooltip element.\n */\n tooltipClassName?: string;\n /**\n * Callback fired when the dialog is shown.\n */\n onDialogDidShow?: (event?: DialogEvent, eventName?: DialogTriggerEvent | string) => void;\n /**\n * Callback fired when the dialog is hidden.\n */\n onDialogDidHide?: (event: DialogEvent, eventName: DialogTriggerEvent | string) => void;\n /**\n * Callback fired when clicking outside the dialog.\n */\n onClickOutside?: (event: React.MouseEvent) => void;\n /**\n * Callback fired when clicking inside the dialog content.\n */\n onContentClick?: (event: React.MouseEvent) => void;\n /**\n * The z-index applied to the dialog.\n */\n zIndex?: number;\n /**\n * If true, uses derived state from props.\n */\n useDerivedStateFromProps?: boolean;\n /**\n * If true, makes the dialog disappear when the reference element is hidden.\n */\n hideWhenReferenceHidden?: boolean;\n /**\n * If true, triggers the callback when the dialog mounts.\n */\n shouldCallbackOnMount?: boolean;\n /**\n * If true, instantly shows and hides the dialog without delay.\n */\n instantShowAndHide?: boolean;\n /**\n * Callback to dynamically adjust show delay and animation behavior.\n */\n getDynamicShowDelay?: () => { showDelay: number; preventAnimation: boolean };\n /**\n * The content displayed inside the dialog.\n */\n content?: (() => JSX.Element) | JSX.Element;\n /**\n * The element to position the dialog beside.\n */\n children?: ReactElement | ReactElement[] | string;\n /**\n * If true, keyboard focus/blur events behave like mouse enter/leave.\n */\n addKeyboardHideShowTriggersByDefault?: boolean;\n /**\n * If true, disables scrolling for the container element.\n */\n disableContainerScroll?: boolean | string;\n /**\n * Enables the observation of content resize for the popper element.\n * When set to `true`, a ResizeObserver is attached to the popper content,\n * automatically triggering repositioning when the size of the content changes.\n *\n * This is useful for dialogs, tooltips, or popovers with dynamic content\n * that may grow or shrink without a re-render being triggered.\n */\n observeContentResize?: boolean;\n}\n\nexport interface DialogState {\n /**\n * If true, the dialog is open.\n */\n isOpen?: boolean;\n /**\n * If true, the dialog state is derived from props.\n */\n shouldUseDerivedStateFromProps?: boolean;\n /**\n * If true, prevents animation when opening or closing the dialog.\n */\n preventAnimation?: boolean;\n}\n\nexport type DialogEvent = React.MouseEvent | React.KeyboardEvent | KeyboardEvent | React.FocusEvent | CustomEvent;\n\nexport default class Dialog extends PureComponent<DialogProps, DialogState> {\n static hideShowTriggers = DialogTriggerEventEnum;\n static positions = DialogPositionEnum;\n static animationTypes = AnimationTypeEnum;\n static defaultProps = {\n position: \"top\",\n modifiers: [] as Modifier<any>[],\n moveBy: { main: 0, secondary: 0 },\n showDelay: 100,\n hideDelay: 100,\n showTrigger: Dialog.hideShowTriggers.MOUSE_ENTER,\n hideTrigger: Dialog.hideShowTriggers.MOUSE_LEAVE,\n showOnDialogEnter: false,\n shouldShowOnMount: false,\n disable: false,\n open: false,\n animationType: Dialog.animationTypes.EXPAND,\n preventAnimationOnMount: false,\n tooltip: false,\n onDialogDidShow: NOOP,\n onDialogDidHide: NOOP,\n onClickOutside: NOOP,\n onContentClick: NOOP,\n useDerivedStateFromProps: false,\n hideWhenReferenceHidden: false,\n shouldCallbackOnMount: false,\n instantShowAndHide: false,\n addKeyboardHideShowTriggersByDefault: false,\n observeContentResize: false\n };\n private showTimeout: NodeJS.Timeout;\n private hideTimeout: NodeJS.Timeout;\n context!: React.ContextType<typeof LayerContext>;\n\n constructor(props: DialogProps) {\n super(props);\n this.state = {\n shouldUseDerivedStateFromProps: props.useDerivedStateFromProps,\n isOpen: props.shouldShowOnMount\n };\n\n // Binding section.\n this.onMouseEnter = this.onMouseEnter.bind(this);\n this.onMouseLeave = this.onMouseLeave.bind(this);\n this.onMouseDown = this.onMouseDown.bind(this);\n this.onClick = this.onClick.bind(this);\n this.onFocus = this.onFocus.bind(this);\n this.onBlur = this.onBlur.bind(this);\n this.isShown = this.isShown.bind(this);\n this.onEsc = this.onEsc.bind(this);\n this.onClickOutside = this.onClickOutside.bind(this);\n this.onDialogEnter = this.onDialogEnter.bind(this);\n this.onDialogLeave = this.onDialogLeave.bind(this);\n this.getContainer = this.getContainer.bind(this);\n this.onContentClick = this.onContentClick.bind(this);\n this.onKeyDown = this.onKeyDown.bind(this);\n this.closeDialogOnEscape = this.closeDialogOnEscape.bind(this);\n this.onContextMenu = this.onContextMenu.bind(this);\n\n // Timeouts\n this.hideTimeout = null;\n this.showTimeout = null;\n }\n\n closeDialogOnEscape(event: KeyboardEvent) {\n const { isOpen } = this.state;\n if (!isOpen) {\n return;\n }\n switch (event.key) {\n case \"Escape\":\n this.hideDialogIfNeeded(event, DialogTriggerEventEnum.ESCAPE_KEY);\n break;\n case \"Tab\":\n this.handleEvent(DialogTriggerEventEnum.TAB_KEY, event.target, event);\n break;\n case \"Enter\":\n this.handleEvent(DialogTriggerEventEnum.ENTER, event.target, event);\n break;\n default:\n break;\n }\n }\n\n componentDidMount() {\n const { shouldCallbackOnMount, onDialogDidShow } = this.props;\n const { isOpen } = this.state;\n if (isClient()) {\n document.addEventListener(\"keyup\", this.closeDialogOnEscape);\n }\n if (shouldCallbackOnMount && isOpen) {\n onDialogDidShow && onDialogDidShow();\n }\n }\n\n componentWillUnmount() {\n if (isClient()) {\n document.removeEventListener(\"keyup\", this.closeDialogOnEscape);\n }\n if (this.showTimeout) {\n clearTimeout(this.showTimeout);\n this.showTimeout = null;\n }\n if (this.hideTimeout) {\n clearTimeout(this.hideTimeout);\n this.hideTimeout = null;\n }\n }\n\n static getDerivedStateFromProps(nextProps: DialogProps, state: DialogState): DialogState {\n if (state.shouldUseDerivedStateFromProps) {\n return { isOpen: nextProps.isOpen };\n }\n return null;\n }\n\n getContainer() {\n const { containerSelector } = this.props;\n const containerElement = document.querySelector(containerSelector);\n if (!containerElement || !(containerElement instanceof Element)) {\n const { layerRef } = this.context;\n if (layerRef?.current) {\n return layerRef.current;\n }\n return document.body;\n }\n return containerElement;\n }\n\n showDialog(event: DialogEvent, eventName: DialogTriggerEvent | string, options: { preventAnimation?: boolean } = {}) {\n const { showDelay, instantShowAndHide, getDynamicShowDelay } = this.props;\n let finalShowDelay = showDelay;\n let preventAnimation = options.preventAnimation;\n if (getDynamicShowDelay) {\n const dynamicDelayObj = getDynamicShowDelay();\n finalShowDelay = dynamicDelayObj.showDelay || 0;\n preventAnimation = preventAnimation || dynamicDelayObj.preventAnimation;\n }\n\n if (instantShowAndHide) {\n this.onShowDialog(event, eventName);\n this.setState({ isOpen: true, preventAnimation });\n this.showTimeout = null;\n } else {\n this.showTimeout = setTimeout(() => {\n this.onShowDialog(event, eventName);\n this.showTimeout = null;\n this.setState({ isOpen: true, preventAnimation });\n }, finalShowDelay);\n }\n }\n\n onShowDialog(event: DialogEvent, eventName: DialogTriggerEvent | string) {\n if (this.isShown()) return;\n const { onDialogDidShow } = this.props;\n onDialogDidShow(event, eventName);\n }\n\n showDialogIfNeeded(event: DialogEvent, eventName: DialogTriggerEvent | string, options = {}) {\n const { disable } = this.props;\n if (disable) {\n return;\n }\n\n if (this.hideTimeout) {\n clearTimeout(this.hideTimeout);\n this.hideTimeout = null;\n }\n\n if (!this.showTimeout) {\n this.showDialog(event, eventName, options);\n }\n }\n\n hideDialog(event: DialogEvent, eventName: DialogTriggerEvent | string) {\n const { hideDelay, instantShowAndHide } = this.props;\n if (instantShowAndHide) {\n this.onHideDialog(event, eventName);\n this.setState({ isOpen: false });\n this.hideTimeout = null;\n } else {\n this.hideTimeout = setTimeout(() => {\n this.onHideDialog(event, eventName);\n this.setState({ isOpen: false });\n this.hideTimeout = null;\n }, hideDelay);\n }\n }\n\n onHideDialog(event: DialogEvent, eventName: DialogTriggerEvent | string) {\n const { onDialogDidHide } = this.props;\n if (onDialogDidHide) onDialogDidHide(event, eventName);\n }\n\n hideDialogIfNeeded(event: DialogEvent, eventName: DialogTriggerEvent | string) {\n if (this.showTimeout) {\n clearTimeout(this.showTimeout);\n this.showTimeout = null;\n }\n\n if (this.hideTimeout) {\n return;\n }\n this.hideDialog(event, eventName);\n }\n\n handleEvent(eventName: DialogTriggerEvent, target: EventTarget, event: DialogEvent) {\n const { showTriggerIgnoreClass, hideTriggerIgnoreClass } = this.props;\n if (\n this.isShowTrigger(eventName) &&\n !this.isShown() &&\n !isInsideClass(target as HTMLElement, showTriggerIgnoreClass)\n ) {\n return this.showDialogIfNeeded(event, eventName);\n }\n\n if (this.isHideTrigger(eventName) && !isInsideClass(target as HTMLElement, hideTriggerIgnoreClass)) {\n return this.hideDialogIfNeeded(event, eventName);\n }\n }\n\n isShown() {\n const { isOpen } = this.state;\n const { open } = this.props;\n\n return isOpen || open;\n }\n\n isShowTrigger(eventName: DialogTriggerEvent) {\n const { showTrigger, addKeyboardHideShowTriggersByDefault } = this.props;\n const showTriggersArray = convertToArray(showTrigger);\n\n if (addKeyboardHideShowTriggersByDefault) {\n if (eventName === \"focus\" && showTriggersArray.indexOf(\"mouseenter\") > -1) {\n return true;\n }\n }\n\n return showTriggersArray.indexOf(eventName) > -1;\n }\n\n isHideTrigger(eventName: DialogTriggerEvent) {\n const { hideTrigger, addKeyboardHideShowTriggersByDefault } = this.props;\n const hideTriggersArray = convertToArray(hideTrigger);\n\n if (addKeyboardHideShowTriggersByDefault) {\n if (eventName === \"blur\" && hideTriggersArray.indexOf(\"mouseleave\") > -1) {\n return true;\n }\n }\n\n return hideTriggersArray.indexOf(eventName) > -1;\n }\n\n onMouseEnter(e: React.MouseEvent) {\n this.handleEvent(\"mouseenter\", e.target, e);\n }\n\n onMouseLeave(e: React.MouseEvent) {\n this.handleEvent(\"mouseleave\", e.target, e);\n }\n\n onClick(e: React.MouseEvent) {\n if (e.button) return;\n this.handleEvent(\"click\", e.target, e);\n }\n\n onKeyDown(event: React.KeyboardEvent) {\n if (event.key === \"Enter\") {\n this.handleEvent(\"enter\", event.target, event);\n }\n\n if (event.key === \"Tab\") {\n this.handleEvent(\"tab\", event.target, event);\n }\n }\n\n onMouseDown(e: React.MouseEvent) {\n if (e.button) return;\n this.handleEvent(\"mousedown\", e.target, e);\n }\n\n onFocus(e: React.FocusEvent) {\n this.handleEvent(\"focus\", e.target, e);\n }\n\n onBlur(e: React.FocusEvent) {\n this.handleEvent(\"blur\", e.relatedTarget, e);\n }\n\n onEsc(e: React.KeyboardEvent) {\n this.handleEvent(\"esckey\", e.target, e);\n }\n\n onContextMenu(e: React.MouseEvent) {\n const isShown = this.isShown();\n if ((this.isShowTrigger(\"contextmenu\") && !isShown) || (this.isHideTrigger(\"contextmenu\") && isShown)) {\n e.preventDefault();\n }\n this.handleEvent(\"contextmenu\", e.target, e);\n }\n\n onClickOutside(event: React.MouseEvent) {\n const { onClickOutside } = this.props;\n this.handleEvent(\"clickoutside\", event.target, event);\n onClickOutside(event);\n }\n\n onDialogEnter(event: React.MouseEvent) {\n const { showOnDialogEnter } = this.props;\n if (showOnDialogEnter) this.showDialogIfNeeded(event, \"DialogEnter\");\n }\n\n onDialogLeave(event: React.MouseEvent) {\n const { showOnDialogEnter } = this.props;\n if (showOnDialogEnter) this.hideDialogIfNeeded(event, \"DialogLeave\");\n }\n\n onContentClick(e: React.MouseEvent) {\n const { onContentClick } = this.props;\n this.handleEvent(\"onContentClick\", e.target, e);\n onContentClick(e);\n }\n\n render() {\n const {\n wrapperClassName,\n content,\n startingEdge,\n children,\n preventAnimationOnMount,\n animationType,\n position,\n showDelay,\n moveBy,\n modifiers,\n tooltip,\n tooltipClassName,\n referenceWrapperClassName,\n referenceWrapperElement,\n zIndex,\n hideWhenReferenceHidden,\n disableContainerScroll,\n containerSelector,\n observeContentResize,\n id,\n \"data-testid\": dataTestId\n } = this.props;\n const { preventAnimation } = this.state;\n const overrideDataTestId = dataTestId || getTestId(ComponentDefaultTestId.DIALOG, id);\n\n const animationTypeCalculated = preventAnimationOnMount || preventAnimation ? undefined : animationType;\n const contentRendered = isFunction(content) ? content() : content;\n\n if (!contentRendered) {\n return children;\n }\n return (\n <Manager>\n <Reference>\n {({ ref }) => {\n return (\n <Refable\n className={cx(referenceWrapperClassName)}\n wrapperElement={referenceWrapperElement}\n ref={ref}\n onBlur={chainOnPropsAndInstance(\"onBlur\", this, this.props)}\n onKeyDown={chainOnPropsAndInstance(\"onKeyDown\", this, this.props)}\n onClick={chainOnPropsAndInstance(\"onClick\", this, this.props)}\n onFocus={chainOnPropsAndInstance(\"onFocus\", this, this.props)}\n onMouseDown={chainOnPropsAndInstance(\"onMouseDown\", this, this.props)}\n onMouseEnter={chainOnPropsAndInstance(\"onMouseEnter\", this, this.props)}\n onMouseLeave={chainOnPropsAndInstance(\"onMouseLeave\", this, this.props)}\n onContextMenu={chainOnPropsAndInstance(\"onContextMenu\", this, this.props)}\n >\n {children}\n </Refable>\n );\n }}\n </Reference>\n {isClient() &&\n createPortal(\n <Popper\n placement={position as unknown as PopperJS.Placement}\n modifiers={[\n {\n name: \"offset\",\n options: {\n offset: [moveBy.secondary, moveBy.main]\n }\n },\n {\n name: \"zIndex\",\n enabled: true,\n phase: \"write\",\n fn({ state }) {\n if (zIndex) {\n state.styles.popper.zIndex = String(zIndex);\n }\n return state;\n }\n },\n {\n name: \"rotator\",\n enabled: true,\n phase: \"write\",\n fn({ state }) {\n if (!state.styles.arrow) {\n return state;\n }\n // const reg = new RegExp(\n // /translate\\(([0-9].*)px, ([0-9].*)px\\)/\n // );\n // const transform = state.styles.arrow.transform;\n // const res = reg.exec(transform);\n // state.styles.popper.transformOrigin = `${100 -\n // res[1]}% ${100 - res[2]}%`;\n state.styles.arrow.transform = `${state.styles.arrow.transform} rotate(45deg)`;\n return state;\n }\n },\n createObserveContentResizeModifier(observeContentResize),\n ...modifiers\n ]}\n >\n {({ placement, style, ref, arrowProps, isReferenceHidden }) => {\n if (!this.isShown() && placement) {\n return null;\n }\n\n if (hideWhenReferenceHidden && isReferenceHidden) {\n const event = new CustomEvent(\"onReferenceHidden\");\n this.hideDialog(event, \"onReferenceHidden\");\n }\n\n return (\n <DialogContent\n data-testid={overrideDataTestId}\n isReferenceHidden={hideWhenReferenceHidden && isReferenceHidden}\n onMouseEnter={this.onDialogEnter}\n onMouseLeave={this.onDialogLeave}\n onClickOutside={this.onClickOutside}\n onContextMenu={this.onContextMenu}\n onEsc={this.onEsc}\n animationType={animationTypeCalculated}\n position={placement}\n wrapperClassName={wrapperClassName}\n startingEdge={startingEdge}\n isOpen={this.isShown()}\n showDelay={showDelay}\n styleObject={style}\n ref={ref}\n onClick={this.onContentClick}\n hasTooltip={!!tooltip}\n containerSelector={containerSelector}\n disableContainerScroll={disableContainerScroll}\n >\n {contentRendered}\n {tooltip && (\n <div\n style={arrowProps.style}\n ref={arrowProps.ref}\n className={cx(styles.arrow, tooltipClassName)}\n data-placement={placement}\n />\n )}\n </DialogContent>\n );\n }}\n </Popper>,\n this.getContainer()\n )}\n </Manager>\n );\n }\n}\n\nfunction chainOnPropsAndInstance(name: string, instance: Dialog, props: DialogProps) {\n // @ts-ignore\n return chainFunctions([props[name], instance[name]], true);\n}\n\nDialog.contextType = LayerContext;\n"],"names":["Dialog","_PureComponent","props","_this","_classCallCheck","_callSuper","state","shouldUseDerivedStateFromProps","useDerivedStateFromProps","isOpen","shouldShowOnMount","onMouseEnter","bind","onMouseLeave","onMouseDown","onClick","onFocus","onBlur","isShown","onEsc","onClickOutside","onDialogEnter","onDialogLeave","getContainer","onContentClick","onKeyDown","closeDialogOnEscape","onContextMenu","hideTimeout","showTimeout","_inherits","PureComponent","_createClass","key","value","event","this","hideDialogIfNeeded","DialogTriggerEventEnum","ESCAPE_KEY","handleEvent","TAB_KEY","target","ENTER","_this$props","shouldCallbackOnMount","onDialogDidShow","isClient","document","addEventListener","removeEventListener","clearTimeout","containerElement","querySelector","containerSelector","Element","layerRef","context","current","body","eventName","_this2","_this$props2","instantShowAndHide","getDynamicShowDelay","finalShowDelay","showDelay","preventAnimation","dynamicDelayObj","onShowDialog","setState","setTimeout","options","arguments","length","undefined","disable","showDialog","_this3","_this$props3","hideDelay","onHideDialog","onDialogDidHide","hideDialog","_this$props4","showTriggerIgnoreClass","hideTriggerIgnoreClass","isShowTrigger","isInsideClass","isHideTrigger","showDialogIfNeeded","open","_this$props5","addKeyboardHideShowTriggersByDefault","showTriggersArray","convertToArray","showTrigger","indexOf","_this$props6","hideTriggersArray","hideTrigger","e","button","relatedTarget","preventDefault","showOnDialogEnter","_this4","_this$props7","wrapperClassName","content","startingEdge","children","preventAnimationOnMount","animationType","position","moveBy","modifiers","tooltip","tooltipClassName","referenceWrapperClassName","referenceWrapperElement","zIndex","hideWhenReferenceHidden","disableContainerScroll","observeContentResize","overrideDataTestId","getTestId","ComponentDefaultTestId","DIALOG","id","animationTypeCalculated","contentRendered","isFunction","React","Manager","createElement","Reference","_ref","ref","Refable","className","cx","wrapperElement","chainOnPropsAndInstance","createPortal","Popper","placement","name","offset","secondary","main","enabled","phase","fn","_ref2","styles","popper","String","_ref3","arrow","transform","concat","createObserveContentResizeModifier","_toConsumableArray","_ref4","style","arrowProps","isReferenceHidden","CustomEvent","DialogContent","styleObject","hasTooltip","nextProps","instance","chainFunctions","hideShowTriggers","positions","DialogPositionEnum","animationTypes","AnimationTypeEnum","defaultProps","MOUSE_ENTER","MOUSE_LEAVE","EXPAND","NOOP","contextType","LayerContext"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{defineProperty as e}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import o,{forwardRef as t,useRef as a,useCallback as s,useEffect as r,cloneElement as i}from"react";import n from"classnames";import{camelCase as p}from"lodash-es";import{CSSTransition as l}from"react-transition-group";import c from"../../../hooks/useClickOutside/index.js";import{chainFunctions as d,NOOP as m}from"../../../utils/function-utils.js";import u from"../../../hooks/useKeyEvent/index.js";import{keyCodes as f}from"../../../constants/keyCodes.js";import"../../../constants/sizes.js";import{getStyle as v}from"../../../helpers/typesciptCssModulesHelper.js";import y from"./DialogContent.module.scss.js";import k from"../../../hooks/useDisableScroll/index.js";var C={},x=[f.ESCAPE],h=t((function(t,f){var h=t.onEsc,E=void 0===h?m:h,b=t.children,j=t.position,A=t.wrapperClassName,N=t.isOpen,g=void 0!==N&&N,M=t.startingEdge,S=t.animationType,w=void 0===S?"expand":S,O=t.onMouseEnter,D=void 0===O?m:O,H=t.onMouseLeave,L=void 0===H?m:H,P=t.onClickOutside,T=void 0===P?m:P,R=t.onClick,_=void 0===R?m:R,z=t.onContextMenu,B=void 0===z?m:z,K=t.showDelay,W=t.styleObject,q=void 0===W?C:W,F=t.isReferenceHidden,G=t.hasTooltip,I=void 0!==G&&G,J=t.containerSelector,Q=t.disableContainerScroll,U=void 0!==Q&&Q,V=t["data-testid"],X=a(null),Y=s((function(e){if(g)return T(e,"clickoutside")}),[g,T]),Z=s((function(e){g&&B(e)}),[g,B]);u({keys:x,callback:E}),c({callback:Y,ref:X}),c({eventName:"contextmenu",callback:Z,ref:X});var $=k("string"==typeof U?U:J),ee=$.disableScroll,oe=$.enableScroll;r((function(){U&&(g?ee():oe())}),[U,ee,oe,g]);var te={classNames:void 0};switch(w){case"expand":te.classNames={appear:y.expandAppear,appearActive:y.expandAppearActive,exit:y.expandExit};break;case"opacity-and-slide":te.classNames={appear:y.opacitySlideAppear,appearActive:y.opacitySlideAppearActive}}return o.createElement("span",{className:n("monday-style-dialog-content-wrapper",y.contentWrapper,A),ref:f,"data-testid":V,style:q,onClickCapture:_,"data-popper-reference-hidden":F},o.createElement(l,{classNames:te.classNames,nodeRef:X,in:g,appear:!!w,timeout:K},o.createElement("div",{className:n(y.contentComponent,v(y,p(j)),e(e({},v(y,p("edge-"+M)),M),y.hasTooltip,I)),ref:X},o.Children.toArray(b).map((function(e){return i(e,{onMouseEnter:d([e.props.onMouseEnter,D]),onMouseLeave:d([e.props.onMouseLeave,L])})})))))}));export{h as default};
1
+ import{defineProperty as e}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import o,{forwardRef as t,useRef as a,useCallback as r,useEffect as i,cloneElement as s}from"react";import n from"classnames";import{camelCase as p}from"lodash-es";import{CSSTransition as l}from"react-transition-group";import c from"../../../hooks/useClickOutside/index.js";import{chainFunctions as d,NOOP as m}from"../../../utils/function-utils.js";import u from"../../../hooks/useKeyEvent/index.js";import{keyCodes as f}from"../../../constants/keyCodes.js";import"../../../constants/sizes.js";import{getStyle as v}from"../../../helpers/typesciptCssModulesHelper.js";import y from"./DialogContent.module.scss.js";import k from"../../../hooks/useDisableScroll/index.js";var C={},x=[f.ESCAPE],h=t((function(t,f){var h=t.onEsc,E=void 0===h?m:h,b=t.children,j=t.position,A=t.wrapperClassName,g=t.isOpen,M=void 0!==g&&g,S=t.startingEdge,N=t.animationType,O=void 0===N?"expand":N,w=t.onMouseEnter,D=void 0===w?m:w,H=t.onMouseLeave,L=void 0===H?m:H,P=t.onClickOutside,T=void 0===P?m:P,_=t.onClick,z=void 0===_?m:_,B=t.onContextMenu,K=void 0===B?m:B,R=t.showDelay,W=t.styleObject,q=void 0===W?C:W,F=t.isReferenceHidden,G=t.hasTooltip,I=void 0!==G&&G,J=t.containerSelector,Q=t.disableContainerScroll,U=void 0!==Q&&Q,V=t["data-testid"],X=a(null),Y=r((function(e){if(M)return T(e,"clickoutside")}),[M,T]),Z=r((function(e){M&&K(e)}),[M,K]);u({keys:x,callback:E}),c({callback:Y,ref:X}),c({eventName:"contextmenu",callback:Z,ref:X});var $=k("string"==typeof U?U:J),ee=$.disableScroll,oe=$.enableScroll;i((function(){U&&(M?ee():oe())}),[U,ee,oe,M]);var te={classNames:void 0};switch(O){case"expand":te.classNames={appear:y.expandAppear,appearActive:y.expandAppearActive,exit:y.expandExit};break;case"opacity-and-slide":te.classNames={appear:y.opacitySlideAppear,appearActive:y.opacitySlideAppearActive}}return o.createElement("span",{className:n("monday-style-dialog-content-wrapper",y.contentWrapper,A),ref:f,"data-testid":V,style:q,onClickCapture:z,"data-popper-reference-hidden":F},o.createElement(l,Object.assign({},te,{in:M,appear:!!O,timeout:R}),o.createElement("div",{className:n(y.contentComponent,v(y,p(j)),e(e({},v(y,p("edge-"+S)),S),y.hasTooltip,I)),ref:X},o.Children.toArray(b).map((function(e){return s(e,{onMouseEnter:d([e.props.onMouseEnter,D]),onMouseLeave:d([e.props.onMouseLeave,L])})})))))}));export{h as default};
2
2
  //# sourceMappingURL=DialogContent.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"DialogContent.js","sources":["../../../../../src/components/Dialog/DialogContent/DialogContent.tsx"],"sourcesContent":["import React, { cloneElement, CSSProperties, forwardRef, ReactElement, useCallback, useEffect, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { camelCase } from \"lodash-es\";\nimport { CSSTransition } from \"react-transition-group\";\nimport { CSSTransitionProps } from \"react-transition-group/CSSTransition\";\nimport useClickOutside from \"../../../hooks/useClickOutside\";\nimport { chainFunctions, NOOP } from \"../../../utils/function-utils\";\nimport useKeyEvent from \"../../../hooks/useKeyEvent\";\nimport { VibeComponentProps } from \"../../../types\";\nimport { keyCodes } from \"../../../constants\";\nimport { DialogAnimationType, DialogTriggerEvent } from \"../Dialog.types\";\nimport * as PopperJS from \"@popperjs/core\";\nimport { getStyle } from \"../../../helpers/typesciptCssModulesHelper\";\nimport styles from \"./DialogContent.module.scss\";\nimport useDisableScroll from \"../../../hooks/useDisableScroll\";\n\nconst EMPTY_OBJECT = {};\nconst ESCAPE_KEYS = [keyCodes.ESCAPE];\n\nexport interface DialogContentProps extends VibeComponentProps {\n /**\n * The content inside the dialog.\n */\n children?: ReactElement | ReactElement[];\n /**\n * The placement of the dialog relative to the reference element.\n */\n position?: PopperJS.Placement;\n /**\n * Class name applied to the dialog wrapper.\n */\n wrapperClassName?: string;\n /**\n * If true, the dialog is open.\n */\n isOpen?: boolean;\n // TODO: [breaking] use type\n /**\n * The starting edge of the dialog.\n */\n startingEdge?: any;\n /**\n * The animation type used for showing/hiding the dialog.\n */\n animationType?: DialogAnimationType;\n /**\n * Callback fired when the Escape key is pressed.\n */\n onEsc?: (event: React.KeyboardEvent) => void;\n /**\n * Callback fired when the mouse enters the dialog.\n */\n onMouseEnter?: (event: React.MouseEvent) => void;\n /**\n * Callback fired when the mouse leaves the dialog.\n */\n onMouseLeave?: (event: React.MouseEvent) => void;\n /**\n * Callback fired when clicking outside the dialog.\n */\n onClickOutside?: (event: React.MouseEvent, hideShowEvent: DialogTriggerEvent) => void;\n /**\n * Callback fired when clicking inside the dialog.\n */\n onClick?: (event: React.MouseEvent) => void;\n /**\n * Delay before showing the dialog.\n */\n showDelay?: number;\n /**\n * Inline styles applied to the dialog.\n */\n styleObject?: CSSProperties;\n /**\n * If true, hides the reference element when the dialog is shown.\n */\n isReferenceHidden?: boolean;\n /**\n * If true, applies tooltip arrow to the dialog.\n */\n hasTooltip?: boolean;\n /**\n * The CSS selector of the container where the dialog should be rendered.\n */\n containerSelector?: string;\n /**\n * If true, disables scrolling in the container when the dialog is open.\n */\n disableContainerScroll?: boolean | string;\n /**\n * Callback fired when the context menu (right-click) event occurs outside the dialog.\n */\n onContextMenu?: (e: React.MouseEvent) => void;\n}\n\nconst DialogContent = forwardRef(\n (\n {\n onEsc = NOOP,\n children,\n position,\n wrapperClassName,\n isOpen = false,\n startingEdge,\n animationType = \"expand\",\n onMouseEnter = NOOP,\n onMouseLeave = NOOP,\n onClickOutside = NOOP,\n onClick = NOOP,\n onContextMenu = NOOP,\n showDelay,\n styleObject = EMPTY_OBJECT,\n isReferenceHidden,\n hasTooltip = false,\n containerSelector,\n disableContainerScroll = false,\n \"data-testid\": dataTestId\n }: DialogContentProps,\n forwardRef: React.ForwardedRef<HTMLElement>\n ) => {\n const ref = useRef<HTMLDivElement>(null);\n const onOutSideClick = useCallback(\n (event: React.MouseEvent) => {\n if (isOpen) {\n return onClickOutside(event, \"clickoutside\");\n }\n },\n [isOpen, onClickOutside]\n );\n const overrideOnContextMenu = useCallback(\n (event: React.MouseEvent) => {\n if (isOpen) {\n onContextMenu(event);\n }\n },\n [isOpen, onContextMenu]\n );\n useKeyEvent({ keys: ESCAPE_KEYS, callback: onEsc });\n useClickOutside({ callback: onOutSideClick, ref });\n useClickOutside({ eventName: \"contextmenu\", callback: overrideOnContextMenu, ref });\n const selectorToDisable = typeof disableContainerScroll === \"string\" ? disableContainerScroll : containerSelector;\n const { disableScroll, enableScroll } = useDisableScroll(selectorToDisable);\n\n useEffect(() => {\n if (disableContainerScroll) {\n if (isOpen) {\n disableScroll();\n } else {\n enableScroll();\n }\n }\n }, [disableContainerScroll, disableScroll, enableScroll, isOpen]);\n\n const transitionOptions: Partial<CSSTransitionProps> = { classNames: undefined };\n\n switch (animationType) {\n case \"expand\":\n transitionOptions.classNames = {\n appear: styles.expandAppear,\n appearActive: styles.expandAppearActive,\n exit: styles.expandExit\n };\n break;\n case \"opacity-and-slide\":\n transitionOptions.classNames = {\n appear: styles.opacitySlideAppear,\n appearActive: styles.opacitySlideAppearActive\n };\n break;\n }\n return (\n <span\n // don't remove old classname - override from Monolith\n className={cx(\"monday-style-dialog-content-wrapper\", styles.contentWrapper, wrapperClassName)}\n ref={forwardRef}\n data-testid={dataTestId}\n style={styleObject}\n onClickCapture={onClick}\n data-popper-reference-hidden={isReferenceHidden}\n >\n <CSSTransition\n classNames={transitionOptions.classNames}\n nodeRef={ref}\n in={isOpen}\n appear={!!animationType}\n timeout={showDelay}\n >\n <div\n className={cx(styles.contentComponent, getStyle(styles, camelCase(position)), {\n [getStyle(styles, camelCase(\"edge-\" + startingEdge))]: startingEdge,\n [styles.hasTooltip]: hasTooltip\n })}\n ref={ref}\n >\n {React.Children.toArray(children).map((child: ReactElement) => {\n return cloneElement(child, {\n onMouseEnter: chainFunctions([child.props.onMouseEnter, onMouseEnter]),\n onMouseLeave: chainFunctions([child.props.onMouseLeave, onMouseLeave])\n });\n })}\n </div>\n </CSSTransition>\n </span>\n );\n }\n);\n\nexport default DialogContent;\n"],"names":["EMPTY_OBJECT","ESCAPE_KEYS","keyCodes","ESCAPE","DialogContent","forwardRef","_ref","_ref$onEsc","onEsc","NOOP","children","position","wrapperClassName","_ref$isOpen","isOpen","startingEdge","_ref$animationType","animationType","_ref$onMouseEnter","onMouseEnter","_ref$onMouseLeave","onMouseLeave","_ref$onClickOutside","onClickOutside","_ref$onClick","onClick","_ref$onContextMenu","onContextMenu","showDelay","_ref$styleObject","styleObject","isReferenceHidden","_ref$hasTooltip","hasTooltip","containerSelector","_ref$disableContainer","disableContainerScroll","dataTestId","ref","useRef","onOutSideClick","useCallback","event","overrideOnContextMenu","useKeyEvent","keys","callback","useClickOutside","eventName","_useDisableScroll","useDisableScroll","disableScroll","enableScroll","useEffect","transitionOptions","classNames","undefined","appear","styles","expandAppear","appearActive","expandAppearActive","exit","expandExit","opacitySlideAppear","opacitySlideAppearActive","React","createElement","className","cx","contentWrapper","style","onClickCapture","CSSTransition","nodeRef","in","timeout","contentComponent","getStyle","camelCase","_defineProperty","Children","toArray","map","child","cloneElement","chainFunctions","props"],"mappings":"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"}
1
+ {"version":3,"file":"DialogContent.js","sources":["../../../../../src/components/Dialog/DialogContent/DialogContent.tsx"],"sourcesContent":["import React, { cloneElement, CSSProperties, forwardRef, ReactElement, useCallback, useEffect, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { camelCase } from \"lodash-es\";\nimport { CSSTransition } from \"react-transition-group\";\nimport { CSSTransitionProps } from \"react-transition-group/CSSTransition\";\nimport useClickOutside from \"../../../hooks/useClickOutside\";\nimport { chainFunctions, NOOP } from \"../../../utils/function-utils\";\nimport useKeyEvent from \"../../../hooks/useKeyEvent\";\nimport { VibeComponentProps } from \"../../../types\";\nimport { keyCodes } from \"../../../constants\";\nimport { DialogAnimationType, DialogTriggerEvent } from \"../Dialog.types\";\nimport * as PopperJS from \"@popperjs/core\";\nimport { getStyle } from \"../../../helpers/typesciptCssModulesHelper\";\nimport styles from \"./DialogContent.module.scss\";\nimport useDisableScroll from \"../../../hooks/useDisableScroll\";\n\nconst EMPTY_OBJECT = {};\nconst ESCAPE_KEYS = [keyCodes.ESCAPE];\n\nexport interface DialogContentProps extends VibeComponentProps {\n /**\n * The content inside the dialog.\n */\n children?: ReactElement | ReactElement[];\n /**\n * The placement of the dialog relative to the reference element.\n */\n position?: PopperJS.Placement;\n /**\n * Class name applied to the dialog wrapper.\n */\n wrapperClassName?: string;\n /**\n * If true, the dialog is open.\n */\n isOpen?: boolean;\n // TODO: [breaking] use type\n /**\n * The starting edge of the dialog.\n */\n startingEdge?: any;\n /**\n * The animation type used for showing/hiding the dialog.\n */\n animationType?: DialogAnimationType;\n /**\n * Callback fired when the Escape key is pressed.\n */\n onEsc?: (event: React.KeyboardEvent) => void;\n /**\n * Callback fired when the mouse enters the dialog.\n */\n onMouseEnter?: (event: React.MouseEvent) => void;\n /**\n * Callback fired when the mouse leaves the dialog.\n */\n onMouseLeave?: (event: React.MouseEvent) => void;\n /**\n * Callback fired when clicking outside the dialog.\n */\n onClickOutside?: (event: React.MouseEvent, hideShowEvent: DialogTriggerEvent) => void;\n /**\n * Callback fired when clicking inside the dialog.\n */\n onClick?: (event: React.MouseEvent) => void;\n /**\n * Delay before showing the dialog.\n */\n showDelay?: number;\n /**\n * Inline styles applied to the dialog.\n */\n styleObject?: CSSProperties;\n /**\n * If true, hides the reference element when the dialog is shown.\n */\n isReferenceHidden?: boolean;\n /**\n * If true, applies tooltip arrow to the dialog.\n */\n hasTooltip?: boolean;\n /**\n * The CSS selector of the container where the dialog should be rendered.\n */\n containerSelector?: string;\n /**\n * If true, disables scrolling in the container when the dialog is open.\n */\n disableContainerScroll?: boolean | string;\n /**\n * Callback fired when the context menu (right-click) event occurs outside the dialog.\n */\n onContextMenu?: (e: React.MouseEvent) => void;\n}\n\nconst DialogContent = forwardRef(\n (\n {\n onEsc = NOOP,\n children,\n position,\n wrapperClassName,\n isOpen = false,\n startingEdge,\n animationType = \"expand\",\n onMouseEnter = NOOP,\n onMouseLeave = NOOP,\n onClickOutside = NOOP,\n onClick = NOOP,\n onContextMenu = NOOP,\n showDelay,\n styleObject = EMPTY_OBJECT,\n isReferenceHidden,\n hasTooltip = false,\n containerSelector,\n disableContainerScroll = false,\n \"data-testid\": dataTestId\n }: DialogContentProps,\n forwardRef: React.ForwardedRef<HTMLElement>\n ) => {\n const ref = useRef(null);\n const onOutSideClick = useCallback(\n (event: React.MouseEvent) => {\n if (isOpen) {\n return onClickOutside(event, \"clickoutside\");\n }\n },\n [isOpen, onClickOutside]\n );\n const overrideOnContextMenu = useCallback(\n (event: React.MouseEvent) => {\n if (isOpen) {\n onContextMenu(event);\n }\n },\n [isOpen, onContextMenu]\n );\n useKeyEvent({ keys: ESCAPE_KEYS, callback: onEsc });\n useClickOutside({ callback: onOutSideClick, ref });\n useClickOutside({ eventName: \"contextmenu\", callback: overrideOnContextMenu, ref });\n const selectorToDisable = typeof disableContainerScroll === \"string\" ? disableContainerScroll : containerSelector;\n const { disableScroll, enableScroll } = useDisableScroll(selectorToDisable);\n\n useEffect(() => {\n if (disableContainerScroll) {\n if (isOpen) {\n disableScroll();\n } else {\n enableScroll();\n }\n }\n }, [disableContainerScroll, disableScroll, enableScroll, isOpen]);\n\n const transitionOptions: Partial<CSSTransitionProps> = { classNames: undefined };\n\n switch (animationType) {\n case \"expand\":\n transitionOptions.classNames = {\n appear: styles.expandAppear,\n appearActive: styles.expandAppearActive,\n exit: styles.expandExit\n };\n break;\n case \"opacity-and-slide\":\n transitionOptions.classNames = {\n appear: styles.opacitySlideAppear,\n appearActive: styles.opacitySlideAppearActive\n };\n break;\n }\n return (\n <span\n // don't remove old classname - override from Monolith\n className={cx(\"monday-style-dialog-content-wrapper\", styles.contentWrapper, wrapperClassName)}\n ref={forwardRef}\n data-testid={dataTestId}\n style={styleObject}\n onClickCapture={onClick}\n data-popper-reference-hidden={isReferenceHidden}\n >\n <CSSTransition {...transitionOptions} in={isOpen} appear={!!animationType} timeout={showDelay}>\n <div\n className={cx(styles.contentComponent, getStyle(styles, camelCase(position)), {\n [getStyle(styles, camelCase(\"edge-\" + startingEdge))]: startingEdge,\n [styles.hasTooltip]: hasTooltip\n })}\n ref={ref}\n >\n {React.Children.toArray(children).map((child: ReactElement) => {\n return cloneElement(child, {\n onMouseEnter: chainFunctions([child.props.onMouseEnter, onMouseEnter]),\n onMouseLeave: chainFunctions([child.props.onMouseLeave, onMouseLeave])\n });\n })}\n </div>\n </CSSTransition>\n </span>\n );\n }\n);\n\nexport default DialogContent;\n"],"names":["EMPTY_OBJECT","ESCAPE_KEYS","keyCodes","ESCAPE","DialogContent","forwardRef","_ref","_ref$onEsc","onEsc","NOOP","children","position","wrapperClassName","_ref$isOpen","isOpen","startingEdge","_ref$animationType","animationType","_ref$onMouseEnter","onMouseEnter","_ref$onMouseLeave","onMouseLeave","_ref$onClickOutside","onClickOutside","_ref$onClick","onClick","_ref$onContextMenu","onContextMenu","showDelay","_ref$styleObject","styleObject","isReferenceHidden","_ref$hasTooltip","hasTooltip","containerSelector","_ref$disableContainer","disableContainerScroll","dataTestId","ref","useRef","onOutSideClick","useCallback","event","overrideOnContextMenu","useKeyEvent","keys","callback","useClickOutside","eventName","_useDisableScroll","useDisableScroll","disableScroll","enableScroll","useEffect","transitionOptions","classNames","undefined","appear","styles","expandAppear","appearActive","expandAppearActive","exit","expandExit","opacitySlideAppear","opacitySlideAppearActive","React","createElement","className","cx","contentWrapper","style","onClickCapture","CSSTransition","Object","assign","in","timeout","contentComponent","getStyle","camelCase","_defineProperty","Children","toArray","map","child","cloneElement","chainFunctions","props"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import e from"classnames";import o,{forwardRef as a}from"react";import l from"../Icon/Icon.js";import r from"./FieldLabel.module.scss.js";var n=a((function(a,n){var t=a.icon,m=void 0===t?"":t,s=a.labelText,c=void 0===s?"":s,i=a.labelFor,d=void 0===i?"":i,p=a.iconClassName,b=void 0===p?"":p,f=a.labelClassName,v=void 0===f?"":f,u=a.required,N=void 0!==u&&u;return c?o.createElement("section",{className:e(r.labelComponentWrapper)},o.createElement(l,{icon:m,className:e(r.labelComponentIcon,b),id:d,iconType:"font"}),o.createElement("label",{htmlFor:d,ref:n,className:e(r.labelComponentText,v)},c,N&&o.createElement("span",{className:r.required}," *"))):null}));export{n as default};
1
+ import e from"classnames";import o,{forwardRef as a}from"react";import l from"../Icon/Icon.js";import r from"./FieldLabel.module.scss.js";var t=a((function(a,t){var m=a.icon,n=void 0===m?"":m,i=a.labelText,s=void 0===i?"":i,c=a.labelFor,d=void 0===c?"":c,p=a.iconClassName,v=void 0===p?"":p,b=a.labelClassName,f=void 0===b?"":b,u=a.required,N=void 0!==u&&u,C=a.id,E=void 0===C?"":C,F=a.htmlFor,x=void 0===F?"":F;return s?o.createElement("section",{className:e(r.labelComponentWrapper)},o.createElement(l,{icon:n,className:e(r.labelComponentIcon,v),id:d,iconType:"font"}),o.createElement("label",{id:E,htmlFor:d||x,ref:t,className:e(r.labelComponentText,f)},s,N&&o.createElement("span",{className:r.required}," *"))):null}));export{t as default};
2
2
  //# sourceMappingURL=FieldLabel.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"FieldLabel.js","sources":["../../../../src/components/FieldLabel/FieldLabel.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { FC, ForwardedRef, forwardRef } from \"react\";\nimport Icon from \"../Icon/Icon\";\nimport VibeComponentProps from \"../../types/VibeComponentProps\";\nimport styles from \"./FieldLabel.module.scss\";\n\nexport interface FieldLabelProps extends VibeComponentProps {\n /**\n * The icon displayed next to the label.\n */\n icon?: string | React.FunctionComponent | null;\n /**\n * The text content of the label.\n */\n labelText?: string;\n /**\n * The ID of the associated input element.\n */\n labelFor?: string;\n /**\n * Class name applied to the icon.\n */\n iconClassName?: string;\n /**\n * Class name applied to the label text.\n */\n labelClassName?: string;\n /**\n * If true, displays an asterisk to indicate a required field.\n */\n required?: boolean;\n}\n\nconst FieldLabel: FC<FieldLabelProps> = forwardRef(\n (\n { icon = \"\", labelText = \"\", labelFor = \"\", iconClassName = \"\", labelClassName = \"\", required = false },\n ref: ForwardedRef<HTMLLabelElement>\n ) => {\n if (!labelText) {\n return null;\n }\n\n return (\n <section className={cx(styles.labelComponentWrapper)}>\n <Icon icon={icon} className={cx(styles.labelComponentIcon, iconClassName)} id={labelFor} iconType=\"font\" />\n <label htmlFor={labelFor} ref={ref} className={cx(styles.labelComponentText, labelClassName)}>\n {labelText}\n {required && <span className={styles.required}> *</span>}\n </label>\n </section>\n );\n }\n);\n\nexport default FieldLabel;\n"],"names":["FieldLabel","forwardRef","_ref","ref","_ref$icon","icon","_ref$labelText","labelText","_ref$labelFor","labelFor","_ref$iconClassName","iconClassName","_ref$labelClassName","labelClassName","_ref$required","required","React","className","cx","styles","labelComponentWrapper","createElement","Icon","labelComponentIcon","id","iconType","htmlFor","labelComponentText"],"mappings":"0IAiCMA,IAAAA,EAAkCC,GACtC,SAAAC,EAEEC,GACE,IAAAC,EAAAF,EAFAG,KAAAA,OAAO,IAAHD,EAAG,GAAEA,EAAAE,EAAAJ,EAAEK,UAAAA,OAAY,IAAHD,EAAG,GAAEA,EAAAE,EAAAN,EAAEO,SAAAA,OAAW,IAAHD,EAAG,GAAEA,EAAAE,EAAAR,EAAES,cAAAA,OAAgB,IAAHD,EAAG,GAAEA,EAAAE,EAAAV,EAAEW,eAAAA,OAAiB,IAAHD,EAAG,GAAEA,EAAAE,EAAAZ,EAAEa,SAAAA,OAAW,IAAHD,GAAQA,EAGrG,OAAKP,EAKHS,2BAASC,UAAWC,EAAGC,EAAOC,wBAC5BJ,EAACK,cAAAC,EAAK,CAAAjB,KAAMA,EAAMY,UAAWC,EAAGC,EAAOI,mBAAoBZ,GAAgBa,GAAIf,EAAUgB,SAAS,SAClGT,EAAAK,cAAA,QAAA,CAAOK,QAASjB,EAAUN,IAAKA,EAAKc,UAAWC,EAAGC,EAAOQ,mBAAoBd,IAC1EN,EACAQ,GAAYC,EAAMK,cAAA,OAAA,CAAAJ,UAAWE,EAAOJ,UAAmB,QARrD,IAYX"}
1
+ {"version":3,"file":"FieldLabel.js","sources":["../../../../src/components/FieldLabel/FieldLabel.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { FC, ForwardedRef, forwardRef } from \"react\";\nimport Icon from \"../Icon/Icon\";\nimport VibeComponentProps from \"../../types/VibeComponentProps\";\nimport styles from \"./FieldLabel.module.scss\";\n\nexport interface FieldLabelProps extends VibeComponentProps {\n /**\n * The icon displayed next to the label.\n */\n icon?: string | React.FunctionComponent | null;\n /**\n * The text content of the label.\n */\n labelText?: string;\n /**\n * The ID of the associated input element.\n */\n labelFor?: string;\n /**\n * Class name applied to the icon.\n */\n iconClassName?: string;\n /**\n * Class name applied to the label text.\n */\n labelClassName?: string;\n /**\n * If true, displays an asterisk to indicate a required field.\n */\n required?: boolean;\n /**\n * The HTML for attribute of the associated input element.\n */\n htmlFor?: string;\n}\n\nconst FieldLabel: FC<FieldLabelProps> = forwardRef(\n (\n {\n icon = \"\",\n labelText = \"\",\n labelFor = \"\",\n iconClassName = \"\",\n labelClassName = \"\",\n required = false,\n id = \"\",\n htmlFor = \"\"\n },\n ref: ForwardedRef<HTMLLabelElement>\n ) => {\n if (!labelText) {\n return null;\n }\n\n return (\n <section className={cx(styles.labelComponentWrapper)}>\n <Icon icon={icon} className={cx(styles.labelComponentIcon, iconClassName)} id={labelFor} iconType=\"font\" />\n <label\n id={id}\n htmlFor={labelFor || htmlFor}\n ref={ref}\n className={cx(styles.labelComponentText, labelClassName)}\n >\n {labelText}\n {required && <span className={styles.required}> *</span>}\n </label>\n </section>\n );\n }\n);\n\nexport default FieldLabel;\n"],"names":["FieldLabel","forwardRef","_ref","ref","_ref$icon","icon","_ref$labelText","labelText","_ref$labelFor","labelFor","_ref$iconClassName","iconClassName","_ref$labelClassName","labelClassName","_ref$required","required","_ref$id","id","_ref$htmlFor","htmlFor","React","className","cx","styles","labelComponentWrapper","createElement","Icon","labelComponentIcon","iconType","labelComponentText"],"mappings":"0IAqCMA,IAAAA,EAAkCC,GACtC,SAAAC,EAWEC,GACE,IAAAC,EAAAF,EAVAG,KAAAA,OAAO,IAAHD,EAAG,GAAEA,EAAAE,EAAAJ,EACTK,UAAAA,OAAY,IAAHD,EAAG,GAAEA,EAAAE,EAAAN,EACdO,SAAAA,OAAW,IAAHD,EAAG,GAAEA,EAAAE,EAAAR,EACbS,cAAAA,OAAgB,IAAHD,EAAG,GAAEA,EAAAE,EAAAV,EAClBW,eAAAA,OAAiB,IAAHD,EAAG,GAAEA,EAAAE,EAAAZ,EACnBa,SAAAA,OAAW,IAAHD,GAAQA,EAAAE,EAAAd,EAChBe,GAAAA,OAAK,IAAHD,EAAG,GAAEA,EAAAE,EAAAhB,EACPiB,QAAAA,OAAU,IAAHD,EAAG,GAAEA,EAId,OAAKX,EAKHa,2BAASC,UAAWC,EAAGC,EAAOC,wBAC5BJ,EAACK,cAAAC,EAAK,CAAArB,KAAMA,EAAMgB,UAAWC,EAAGC,EAAOI,mBAAoBhB,GAAgBM,GAAIR,EAAUmB,SAAS,SAClGR,EACEK,cAAA,QAAA,CAAAR,GAAIA,EACJE,QAASV,GAAYU,EACrBhB,IAAKA,EACLkB,UAAWC,EAAGC,EAAOM,mBAAoBhB,IAExCN,EACAQ,GAAYK,EAAMK,cAAA,OAAA,CAAAJ,UAAWE,EAAOR,UAAmB,QAbrD,IAiBX"}
@@ -1,2 +1,2 @@
1
- import{__rest as o}from"../../../_virtual/_tslib.js";import n from"react";import{chainRefFunctions as e,chainFunctions as r}from"../../utils/function-utils.js";var s=n.forwardRef((function(r,s){var i=r.children,p=o(r,["children"]);return n.Children.map(i,(function(o){return n.isValidElement(o)?"string"!=typeof o.type?n.createElement("span",Object.assign({ref:s},p),n.cloneElement(o,Object.assign({},o.props))):n.cloneElement(o,Object.assign(Object.assign(Object.assign({},p),o.props),{onClick:t("onClick",o.props,p),onBlur:t("onBlur",o.props,p),onMouseEnter:t("onMouseEnter",o.props,p),onMouseLeave:t("onMouseLeave",o.props,p),onMouseDown:t("onMouseDown",o.props,p),onFocus:t("onFocus",o.props,p),ref:e([o.ref,s])})):null}))}));function t(o,n,e){return r([n[o],e[o]],!0)}export{s as Refable};
1
+ import{__rest as e}from"../../../_virtual/_tslib.js";import n from"react";import{chainRefFunctions as o,chainFunctions as r}from"../../utils/function-utils.js";var s=n.forwardRef((function(r,s){var p=r.children,i=r.wrapperElement,l=void 0===i?"span":i,u=e(r,["children","wrapperElement"]);return n.Children.map(p,(function(e){return n.isValidElement(e)?"string"!=typeof e.type?n.createElement(l,Object.assign({ref:s},u),n.cloneElement(e,Object.assign({},e.props))):n.cloneElement(e,Object.assign(Object.assign(Object.assign({},u),e.props),{onClick:t("onClick",e.props,u),onBlur:t("onBlur",e.props,u),onMouseEnter:t("onMouseEnter",e.props,u),onMouseLeave:t("onMouseLeave",e.props,u),onMouseDown:t("onMouseDown",e.props,u),onFocus:t("onFocus",e.props,u),ref:o([e.ref,s])})):null}))}));function t(e,n,o){return r([n[e],o[e]],!0)}export{s as Refable};
2
2
  //# sourceMappingURL=Refable.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Refable.js","sources":["../../../../src/components/Refable/Refable.tsx"],"sourcesContent":["import React, { HTMLProps, MutableRefObject, ReactElement } from \"react\";\nimport { chainFunctions, chainRefFunctions } from \"../../utils/function-utils\";\nimport { VibeComponentProps } from \"../../types\";\n\nexport const Refable = React.forwardRef<\n ReactElement,\n React.PropsWithChildren<unknown & HTMLProps<any> & VibeComponentProps> & {\n children: ReactElement | ReactElement[] | string;\n }\n // @ts-expect-error React forwardRef type def doesn't seem to support multiple refs\n>(({ children, ...rest }, ref) => {\n return React.Children.map(children, child => {\n if (!React.isValidElement(child)) return null;\n\n if (typeof child.type !== \"string\") {\n return (\n <span ref={ref as MutableRefObject<any>} {...rest}>\n {React.cloneElement(child, { ...child.props })}\n </span>\n );\n }\n\n return React.cloneElement(child, {\n ...rest,\n ...child.props,\n onClick: getChainedFunction(\"onClick\", child.props, rest),\n onBlur: getChainedFunction(\"onBlur\", child.props, rest),\n onMouseEnter: getChainedFunction(\"onMouseEnter\", child.props, rest),\n onMouseLeave: getChainedFunction(\"onMouseLeave\", child.props, rest),\n onMouseDown: getChainedFunction(\"onMouseDown\", child.props, rest),\n onFocus: getChainedFunction(\"onFocus\", child.props, rest),\n // @ts-expect-error\n ref: chainRefFunctions([child.ref, ref as MutableRefObject<any>])\n });\n });\n});\n\nfunction getChainedFunction(\n name: keyof React.HTMLProps<unknown>,\n childProps: React.PropsWithChildren<React.HTMLProps<unknown>>,\n wrapperProps: React.HTMLProps<unknown>\n) {\n return chainFunctions([childProps[name], wrapperProps[name]], true);\n}\n"],"names":["Refable","React","forwardRef","_a","ref","children","rest","__rest","Children","map","child","isValidElement","type","cloneElement","props","Object","assign","onClick","getChainedFunction","onBlur","onMouseEnter","onMouseLeave","onMouseDown","onFocus","chainRefFunctions","name","childProps","wrapperProps","chainFunctions"],"mappings":"gKAIO,IAAMA,EAAUC,EAAMC,YAM3B,SAACC,EAAuBC,GAAvB,IAAEC,EAAmBF,EAAnBE,SAAaC,EAAIC,EAAAJ,EAAnB,cACD,OAAOF,EAAMO,SAASC,IAAIJ,GAAU,SAAAK,GAClC,OAAKT,EAAMU,eAAeD,GAEA,iBAAfA,EAAME,KAEbX,sCAAMG,IAAKA,GAAkCE,GAC1CL,EAAMY,aAAaH,mBAAYA,EAAMI,SAKrCb,EAAMY,aAAaH,EAAKK,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAC1BV,GACAI,EAAMI,OAAK,CACdG,QAASC,EAAmB,UAAWR,EAAMI,MAAOR,GACpDa,OAAQD,EAAmB,SAAUR,EAAMI,MAAOR,GAClDc,aAAcF,EAAmB,eAAgBR,EAAMI,MAAOR,GAC9De,aAAcH,EAAmB,eAAgBR,EAAMI,MAAOR,GAC9DgB,YAAaJ,EAAmB,cAAeR,EAAMI,MAAOR,GAC5DiB,QAASL,EAAmB,UAAWR,EAAMI,MAAOR,GAEpDF,IAAKoB,EAAkB,CAACd,EAAMN,IAAKA,OApBI,IAsB3C,GACF,IAEA,SAASc,EACPO,EACAC,EACAC,GAEA,OAAOC,EAAe,CAACF,EAAWD,GAAOE,EAAaF,KAAQ,EAChE"}
1
+ {"version":3,"file":"Refable.js","sources":["../../../../src/components/Refable/Refable.tsx"],"sourcesContent":["import React, { HTMLProps, MutableRefObject, ReactElement } from \"react\";\nimport { chainFunctions, chainRefFunctions } from \"../../utils/function-utils\";\nimport { VibeComponentProps } from \"../../types\";\n\nexport const Refable = React.forwardRef<\n ReactElement,\n React.PropsWithChildren<unknown & HTMLProps<any> & VibeComponentProps> & {\n children: ReactElement | ReactElement[] | string;\n /**\n * The wrapper element type to use for React components. Defaults to \"span\".\n */\n wrapperElement?: \"span\" | \"div\";\n }\n // @ts-expect-error React forwardRef type def doesn't seem to support multiple refs\n>(({ children, wrapperElement = \"span\", ...rest }, ref) => {\n return React.Children.map(children, child => {\n if (!React.isValidElement(child)) return null;\n\n if (typeof child.type !== \"string\") {\n const WrapperElement = wrapperElement;\n return (\n <WrapperElement ref={ref as MutableRefObject<any>} {...rest}>\n {React.cloneElement(child, { ...child.props })}\n </WrapperElement>\n );\n }\n\n return React.cloneElement(child, {\n ...rest,\n ...child.props,\n onClick: getChainedFunction(\"onClick\", child.props, rest),\n onBlur: getChainedFunction(\"onBlur\", child.props, rest),\n onMouseEnter: getChainedFunction(\"onMouseEnter\", child.props, rest),\n onMouseLeave: getChainedFunction(\"onMouseLeave\", child.props, rest),\n onMouseDown: getChainedFunction(\"onMouseDown\", child.props, rest),\n onFocus: getChainedFunction(\"onFocus\", child.props, rest),\n // @ts-expect-error\n ref: chainRefFunctions([child.ref, ref as MutableRefObject<any>])\n });\n });\n});\n\nfunction getChainedFunction(\n name: keyof React.HTMLProps<unknown>,\n childProps: React.PropsWithChildren<React.HTMLProps<unknown>>,\n wrapperProps: React.HTMLProps<unknown>\n) {\n return chainFunctions([childProps[name], wrapperProps[name]], true);\n}\n"],"names":["Refable","React","forwardRef","_a","ref","children","_a$wrapperElement","wrapperElement","rest","__rest","Children","map","child","isValidElement","type","Object","assign","cloneElement","props","onClick","getChainedFunction","onBlur","onMouseEnter","onMouseLeave","onMouseDown","onFocus","chainRefFunctions","name","childProps","wrapperProps","chainFunctions"],"mappings":"gKAIO,IAAMA,EAAUC,EAAMC,YAU3B,SAACC,EAAgDC,OAA9CC,IAAAA,SAAQC,IAAEC,eAAAA,OAAiB,IAAHD,EAAG,OAAMA,EAAKE,EAAxCC,EAAAN,EAAA,CAAA,WAAA,mBACD,OAAOF,EAAMS,SAASC,IAAIN,GAAU,SAAAO,GAClC,OAAKX,EAAMY,eAAeD,GAEA,iBAAfA,EAAME,KAGbb,gBAFqBM,EAENQ,OAAAC,OAAA,CAACZ,IAAKA,GAAkCI,GACpDP,EAAMgB,aAAaL,EAAYG,OAAAC,OAAA,GAAAJ,EAAMM,SAKrCjB,EAAMgB,aAAaL,EAAKG,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAC1BR,GACAI,EAAMM,OAAK,CACdC,QAASC,EAAmB,UAAWR,EAAMM,MAAOV,GACpDa,OAAQD,EAAmB,SAAUR,EAAMM,MAAOV,GAClDc,aAAcF,EAAmB,eAAgBR,EAAMM,MAAOV,GAC9De,aAAcH,EAAmB,eAAgBR,EAAMM,MAAOV,GAC9DgB,YAAaJ,EAAmB,cAAeR,EAAMM,MAAOV,GAC5DiB,QAASL,EAAmB,UAAWR,EAAMM,MAAOV,GAEpDJ,IAAKsB,EAAkB,CAACd,EAAMR,IAAKA,OArBI,IAuB3C,GACF,IAEA,SAASgB,EACPO,EACAC,EACAC,GAEA,OAAOC,EAAe,CAACF,EAAWD,GAAOE,EAAaF,KAAQ,EAChE"}
@@ -1,2 +1,2 @@
1
- import{slicedToArray as o,defineProperty as e,toConsumableArray as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{__rest as i}from"../../../_virtual/_tslib.js";import{camelCase as n}from"lodash-es";import{getStyle as a}from"../../helpers/typesciptCssModulesHelper.js";import{getTestId as r,ComponentDefaultTestId as s}from"../../tests/testIds.js";import l from"classnames";import d,{useState as c,useRef as m,useCallback as u,useMemo as p}from"react";import{SplitButtonSecondaryContentPosition as g,ENTER_KEYS as f,DEFAULT_DIALOG_SHOW_TRIGGER as v,DEFAULT_DIALOG_HIDE_TRIGGER as D,DIALOG_MOVE_BY as y,SECONDARY_BUTTON_ARIA_LABEL as C,SECONDARY_BUTTON_WRAPPER_CLASSNAME as N}from"./SplitButtonConstants.js";import{withStaticPropsWithoutForwardRef as h}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import{HideShowEvent as k,AnimationType as T}from"../Dialog/DialogConstants.js";import{NOOP as b}from"../../utils/function-utils.js";import{isInsideClass as S}from"../../utils/dom-utils.js";import j from"../../hooks/useKeyEvent/index.js";import P from"../../hooks/useEventListener/index.js";import I from"../Button/Button.js";import B from"../Dialog/Dialog.js";import E from"../DialogContentContainer/DialogContentContainer.js";import O from"./SplitButton.module.scss.js";import{ComponentVibeId as _}from"../../tests/constants.js";import z from"../../../icons/dist/react/DropdownChevronDown.js";var L=h((function(g){var h=g.secondaryDialogContent,L=g.onSecondaryDialogDidShow,w=void 0===L?b:L,A=g.onSecondaryDialogDidHide,x=void 0===A?b:A,R=g.shouldCloseOnClickInsideDialog,H=g.zIndex,U=void 0===H?null:H,F=g.secondaryDialogClassName,K=void 0===F?"":F,M=g.secondaryDialogPosition,W=void 0===M?"bottom-start":M,Y=g.dialogContainerSelector,V=g.dialogPaddingSize,X=void 0===V?"medium":V,q=g.disabled,G=g.loading,J=g.kind,Q=void 0===J?"primary":J,Z=g.color,$=void 0===Z?"primary":Z,oo=g.className,eo=g.leftIcon,to=g.rightIcon,io=g.onClick,no=g.children,ao=g.marginLeft,ro=g.marginRight,so=g.active,lo=g.id,co=g["data-testid"],mo=i(g,["secondaryDialogContent","onSecondaryDialogDidShow","onSecondaryDialogDidHide","shouldCloseOnClickInsideDialog","zIndex","secondaryDialogClassName","secondaryDialogPosition","dialogContainerSelector","dialogPaddingSize","disabled","success","loading","kind","color","className","leftIcon","rightIcon","onClick","children","marginLeft","marginRight","active","id","data-testid"]),uo=c(!1),po=o(uo,2),go=po[0],fo=po[1],vo=c(!1),Do=o(vo,2),yo=Do[0],Co=Do[1],No=c(!1),ho=o(No,2),ko=ho[0],To=ho[1],bo=m(null),So=m(null),jo=u((function(){return Co(!0)}),[Co]),Po=u((function(){return Co(!1)}),[Co]),Io=u((function(o){return!q&&!S(o.target,N)}),[q]),Bo=u((function(o){Io(o)&&To(!0)}),[To,Io]),Eo=u((function(){return To(!1)}),[To]),Oo=u((function(o){Io(o)&&To(!0)}),[To,Io]),_o=u((function(){fo(!0),w()}),[fo,w]),zo=u((function(o,e){fo(!1),x(),"esckey"===e&&So.current.focus()}),[fo,x]);P({eventName:"mouseenter",callback:jo,ref:bo}),P({eventName:"mouseleave",callback:Po,ref:bo}),P({eventName:"mousedown",callback:Bo,ref:bo}),P({eventName:"mouseup",callback:Eo,ref:bo}),P({eventName:"transitionend",callback:Eo,ref:bo}),j({keys:f,ref:bo,callback:Oo});var Lo=p((function(){return l(O.button,a(O,n("kind-"+Q)),a(O,n("color-"+$)),e(e(e(e(e({},O.mainActive,so),O.active,ko),O.splitContentOpen,go),O.hovered,yo),O.disabled,q),oo)}),[oo,Q,$,so,ko,go,yo,q]),wo=p((function(){return q?[]:v}),[q]),Ao=p((function(){return R?[].concat(t(D),[k.CONTENT_CLICK]):D}),[R]),xo=u((function(){var o="function"==typeof h?h():h;return d.createElement(E,{type:E.types.POPOVER,size:X},o)}),[h,X]),Ro=p((function(){return"bottom"===W?"":"bottom-start"===W?"bottom":"top"}),[W]);return d.createElement("div",{className:Lo,ref:bo,id:lo,"data-testid":co||r(s.SPLIT_BUTTON,lo),"data-vibe":_.SPLIT_BUTTON},d.createElement(I,Object.assign({},mo,{preventClickAnimation:!0,leftIcon:eo,rightIcon:to,rightFlat:!0,color:$,kind:Q,active:so,onClick:io,className:O.mainButton,marginLeft:ao,onFocus:jo,onBlur:Po,disabled:q,loading:G,"data-testid":r(s.SPLIT_BUTTON_PRIMARY_BUTTON,lo)}),no),d.createElement("div",{className:O.secondaryButtonWrapper},d.createElement(B,{wrapperClassName:K,zIndex:U,content:xo,position:W,containerSelector:Y,startingEdge:Ro,animationType:T.EXPAND,moveBy:y,onDialogDidShow:_o,onDialogDidHide:zo,showTrigger:wo,hideTrigger:Ao},d.createElement(I,Object.assign({},mo,{ref:So,preventClickAnimation:!0,leftFlat:!0,noSidePadding:!0,color:$,kind:Q,className:O.secondaryButton,active:go,marginRight:ro,onFocus:jo,onBlur:Po,disabled:q,ariaLabel:C,ariaHasPopup:!0,ariaExpanded:go,"data-testid":r(s.SPLIT_BUTTON_SECONDARY_BUTTON,lo)}),d.createElement("div",{className:O.secondaryButtonIconWrapper},d.createElement(z,{"aria-hidden":"true"}))))))}),{secondaryPositions:g,secondaryDialogPositions:g,sizes:I.sizes,colors:I.colors,kinds:I.kinds,inputTags:I.inputTags,dialogPaddingSizes:E.sizes});export{L as default};
1
+ import{slicedToArray as o,defineProperty as e,toConsumableArray as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{__rest as i}from"../../../_virtual/_tslib.js";import{camelCase as n}from"lodash-es";import{getStyle as a}from"../../helpers/typesciptCssModulesHelper.js";import{getTestId as r,ComponentDefaultTestId as s}from"../../tests/testIds.js";import l from"classnames";import d,{useState as c,useRef as m,useCallback as u,useMemo as g}from"react";import{SplitButtonSecondaryContentPosition as p,ENTER_KEYS as f,DEFAULT_DIALOG_SHOW_TRIGGER as D,DEFAULT_DIALOG_HIDE_TRIGGER as v,DIALOG_MOVE_BY as y,SECONDARY_BUTTON_ARIA_LABEL as C,SECONDARY_BUTTON_WRAPPER_CLASSNAME as T}from"./SplitButtonConstants.js";import{withStaticPropsWithoutForwardRef as S}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import{HideShowEvent as N,AnimationType as b}from"../Dialog/DialogConstants.js";import{NOOP as h}from"../../utils/function-utils.js";import{isInsideClass as k}from"../../utils/dom-utils.js";import P from"../../hooks/useKeyEvent/index.js";import j from"../../hooks/useEventListener/index.js";import I from"../Button/Button.js";import B from"../Dialog/Dialog.js";import O from"../DialogContentContainer/DialogContentContainer.js";import E from"./SplitButton.module.scss.js";import{ComponentVibeId as _}from"../../tests/constants.js";import z from"../../../icons/dist/react/DropdownChevronDown.js";var w=function(p){var S=p.secondaryDialogContent,w=p.onSecondaryDialogDidShow,L=void 0===w?h:w,A=p.onSecondaryDialogDidHide,x=void 0===A?h:A,R=p.shouldCloseOnClickInsideDialog,H=p.zIndex,U=void 0===H?null:H,M=p.secondaryDialogClassName,F=p.secondaryDialogPosition,K=void 0===F?"bottom-start":F,W=p.dialogContainerSelector,Y=p.dialogPaddingSize,V=void 0===Y?"medium":Y,X=p.disabled,q=p.loading,G=p.kind,J=p.color,Q=p.className,Z=p.leftIcon,$=p.rightIcon,oo=p.onClick,eo=p.children,to=p.marginLeft,io=p.marginRight,no=p.active,ao=p.id,ro=p["data-testid"],so=i(p,["secondaryDialogContent","onSecondaryDialogDidShow","onSecondaryDialogDidHide","shouldCloseOnClickInsideDialog","zIndex","secondaryDialogClassName","secondaryDialogPosition","dialogContainerSelector","dialogPaddingSize","disabled","success","loading","kind","color","className","leftIcon","rightIcon","onClick","children","marginLeft","marginRight","active","id","data-testid"]),lo=c(!1),co=o(lo,2),mo=co[0],uo=co[1],go=c(!1),po=o(go,2),fo=po[0],Do=po[1],vo=c(!1),yo=o(vo,2),Co=yo[0],To=yo[1],So=m(null),No=m(null),bo=u((function(){return Do(!0)}),[Do]),ho=u((function(){return Do(!1)}),[Do]),ko=u((function(o){return!X&&!k(o.target,T)}),[X]),Po=u((function(o){ko(o)&&To(!0)}),[To,ko]),jo=u((function(){return To(!1)}),[To]),Io=u((function(o){ko(o)&&To(!0)}),[To,ko]),Bo=u((function(){uo(!0),L()}),[uo,L]),Oo=u((function(o,e){uo(!1),x(),"esckey"===e&&No.current.focus()}),[uo,x]);j({eventName:"mouseenter",callback:bo,ref:So}),j({eventName:"mouseleave",callback:ho,ref:So}),j({eventName:"mousedown",callback:Po,ref:So}),j({eventName:"mouseup",callback:jo,ref:So}),j({eventName:"transitionend",callback:jo,ref:So}),P({keys:f,ref:So,callback:Io});var Eo=g((function(){return l(E.button,a(E,n("kind-"+G)),a(E,n("color-"+J)),e(e(e(e(e({},E.mainActive,no),E.active,Co),E.splitContentOpen,mo),E.hovered,fo),E.disabled,X),Q)}),[Q,G,J,no,Co,mo,fo,X]),_o=g((function(){return X?[]:D}),[X]),zo=g((function(){return R?[].concat(t(v),[N.CONTENT_CLICK]):v}),[R]),wo=u((function(){var o="function"==typeof S?S():S;return d.createElement(O,{type:O.types.POPOVER,size:V},o)}),[S,V]),Lo=g((function(){return"bottom"===K?"":"bottom-start"===K?"bottom":"top"}),[K]);return d.createElement("div",{className:Eo,ref:So,id:ao,"data-testid":ro||r(s.SPLIT_BUTTON,ao),"data-vibe":_.SPLIT_BUTTON},d.createElement(I,Object.assign({},so,{preventClickAnimation:!0,leftIcon:Z,rightIcon:$,rightFlat:!0,color:J,kind:G,active:no,onClick:oo,className:E.mainButton,marginLeft:to,onFocus:bo,onBlur:ho,disabled:X,loading:q,"data-testid":r(s.SPLIT_BUTTON_PRIMARY_BUTTON,ao)}),eo),d.createElement("div",{className:E.secondaryButtonWrapper},d.createElement(B,{wrapperClassName:M,zIndex:U,content:wo,position:K,containerSelector:W,startingEdge:Lo,animationType:b.EXPAND,moveBy:y,onDialogDidShow:Bo,onDialogDidHide:Oo,showTrigger:_o,hideTrigger:zo},d.createElement(I,Object.assign({},so,{ref:No,preventClickAnimation:!0,leftFlat:!0,noSidePadding:!0,color:J,kind:G,className:E.secondaryButton,active:mo,marginRight:io,onFocus:bo,onBlur:ho,disabled:X,ariaLabel:C,ariaHasPopup:!0,ariaExpanded:mo,"data-testid":r(s.SPLIT_BUTTON_SECONDARY_BUTTON,ao)}),d.createElement("div",{className:E.secondaryButtonIconWrapper},d.createElement(z,{"aria-hidden":"true"}))))))};w.defaultProps=Object.assign(Object.assign({},I.defaultProps),{onSecondaryDialogDidShow:h,onSecondaryDialogDidHide:h,zIndex:null,secondaryDialogClassName:"",secondaryDialogPosition:p.BOTTOM_START,dialogPaddingSize:O.sizes.MEDIUM});var L=S(w,{secondaryPositions:p,secondaryDialogPositions:p,sizes:I.sizes,colors:I.colors,kinds:I.kinds,inputTags:I.inputTags,dialogPaddingSizes:O.sizes});export{L as default};
2
2
  //# sourceMappingURL=SplitButton.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"SplitButton.js","sources":["../../../../src/components/SplitButton/SplitButton.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\nimport { camelCase } from \"lodash-es\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\n// Libraries import\nimport React, { ReactElement, useCallback, useMemo, useRef, useState } from \"react\";\n// Constants import\nimport {\n DEFAULT_DIALOG_HIDE_TRIGGER,\n DEFAULT_DIALOG_SHOW_TRIGGER,\n DIALOG_MOVE_BY,\n ENTER_KEYS,\n SECONDARY_BUTTON_ARIA_LABEL,\n SECONDARY_BUTTON_WRAPPER_CLASSNAME,\n SplitButtonSecondaryContentPosition,\n SplitButtonSecondaryContentPositionType\n} from \"./SplitButtonConstants\";\nimport { withStaticPropsWithoutForwardRef } from \"../../types\";\nimport { AnimationType, DialogPosition, HideShowEvent } from \"../Dialog/DialogConstants\";\n// Utils import\nimport { NOOP } from \"../../utils/function-utils\";\nimport { isInsideClass } from \"../../utils/dom-utils\";\n// Hooks import\nimport useKeyEvent from \"../../hooks/useKeyEvent\";\nimport useEventListener from \"../../hooks/useEventListener\";\n// Components import\nimport Button, { ButtonProps } from \"../Button/Button\";\nimport Dialog, { DialogEvent } from \"../Dialog/Dialog\";\nimport { DropdownChevronDown } from \"@vibe/icons\";\nimport DialogContentContainer from \"../DialogContentContainer/DialogContentContainer\";\nimport styles from \"./SplitButton.module.scss\";\nimport { DialogSize, DialogTriggerEvent } from \"../Dialog\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nexport interface SplitButtonProps extends ButtonProps {\n /**\n * The element or renderer that is displayed inside the dialog opened by clicking the secondary button.\n */\n secondaryDialogContent?: ReactElement | (() => string | ReactElement);\n /**\n * Callback fired when the secondary dialog is shown.\n */\n onSecondaryDialogDidShow?: () => void;\n /**\n * Callback fired when the secondary dialog is hidden.\n */\n onSecondaryDialogDidHide?: () => void;\n /**\n * The z-index applied to the secondary dialog.\n */\n zIndex?: number;\n /**\n * Class name applied to the wrapper of the secondary dialog.\n */\n secondaryDialogClassName?: string;\n /**\n * The position of the secondary dialog.\n */\n secondaryDialogPosition?: SplitButtonSecondaryContentPositionType;\n /**\n * The padding size inside the secondary dialog.\n */\n dialogPaddingSize?: DialogSize;\n /**\n * The CSS selector of the container where the dialog should be rendered.\n */\n dialogContainerSelector?: string;\n /**\n * If true, clicking inside the dialog will close it.\n */\n shouldCloseOnClickInsideDialog?: boolean;\n}\n\nconst SplitButton = ({\n secondaryDialogContent,\n onSecondaryDialogDidShow = NOOP,\n onSecondaryDialogDidHide = NOOP,\n shouldCloseOnClickInsideDialog,\n zIndex = null,\n secondaryDialogClassName = \"\",\n secondaryDialogPosition = \"bottom-start\",\n dialogContainerSelector,\n dialogPaddingSize = \"medium\",\n disabled,\n // success mode not working right now, need to fix it in different pr\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n success,\n loading,\n kind = \"primary\",\n color = \"primary\",\n className,\n leftIcon,\n rightIcon,\n onClick,\n children,\n marginLeft,\n marginRight,\n active,\n id,\n \"data-testid\": dataTestId,\n ...buttonProps\n}: SplitButtonProps) => {\n // State //\n const [isDialogOpen, setDialogOpen] = useState(false);\n const [isHovered, setIsHover] = useState(false);\n const [isActive, setIsActive] = useState(false);\n\n // Refs //\n const ref = useRef(null);\n const secondaryButtonRef = useRef(null);\n\n // Callbacks //\n const setHovered = useCallback(() => setIsHover(true), [setIsHover]);\n const setNotHovered = useCallback(() => setIsHover(false), [setIsHover]);\n\n const shouldSetActive = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n if (disabled) return false;\n return !isInsideClass(e.target as HTMLElement, SECONDARY_BUTTON_WRAPPER_CLASSNAME);\n },\n [disabled]\n );\n\n const setActive = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n if (!shouldSetActive(e)) return;\n setIsActive(true);\n },\n [setIsActive, shouldSetActive]\n );\n const setNotActive = useCallback(() => setIsActive(false), [setIsActive]);\n const setActiveOnEnter = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n if (!shouldSetActive(e)) return;\n setIsActive(true);\n },\n [setIsActive, shouldSetActive]\n );\n\n const showDialog = useCallback(() => {\n setDialogOpen(true);\n onSecondaryDialogDidShow();\n }, [setDialogOpen, onSecondaryDialogDidShow]);\n\n const hideDialog = useCallback(\n (_: DialogEvent, eventName: DialogTriggerEvent) => {\n setDialogOpen(false);\n onSecondaryDialogDidHide();\n if (eventName === \"esckey\") {\n secondaryButtonRef.current.focus();\n }\n },\n [setDialogOpen, onSecondaryDialogDidHide]\n );\n\n // Event listeners //\n\n // Used to set both buttons as hovered no matter what button was hovered\n useEventListener({ eventName: \"mouseenter\", callback: setHovered, ref });\n useEventListener({ eventName: \"mouseleave\", callback: setNotHovered, ref });\n\n useEventListener({ eventName: \"mousedown\", callback: setActive, ref });\n useEventListener({ eventName: \"mouseup\", callback: setNotActive, ref });\n\n // Used to finish active transition if clicked on enter\n useEventListener({ eventName: \"transitionend\", callback: setNotActive, ref });\n\n // Key events\n useKeyEvent({ keys: ENTER_KEYS, ref, callback: setActiveOnEnter });\n\n const classNames = useMemo(\n () =>\n cx(\n styles.button,\n getStyle(styles, camelCase(\"kind-\" + kind)),\n getStyle(styles, camelCase(\"color-\" + color)),\n {\n [styles.mainActive]: active,\n [styles.active]: isActive,\n [styles.splitContentOpen]: isDialogOpen,\n [styles.hovered]: isHovered,\n [styles.disabled]: disabled\n },\n className\n ),\n [className, kind, color, active, isActive, isDialogOpen, isHovered, disabled]\n );\n\n const dialogShowTrigger = useMemo(() => (disabled ? [] : DEFAULT_DIALOG_SHOW_TRIGGER), [disabled]);\n\n const dialogHideTrigger = useMemo(() => {\n if (shouldCloseOnClickInsideDialog) return [...DEFAULT_DIALOG_HIDE_TRIGGER, HideShowEvent.CONTENT_CLICK];\n return DEFAULT_DIALOG_HIDE_TRIGGER;\n }, [shouldCloseOnClickInsideDialog]);\n\n const actionsContent = useCallback(() => {\n const content = typeof secondaryDialogContent === \"function\" ? secondaryDialogContent() : secondaryDialogContent;\n return (\n <DialogContentContainer type={DialogContentContainer.types.POPOVER} size={dialogPaddingSize}>\n {content}\n </DialogContentContainer>\n );\n }, [secondaryDialogContent, dialogPaddingSize]);\n\n const animationEdgePosition = useMemo(() => {\n if (secondaryDialogPosition === \"bottom\") {\n return \"\";\n }\n if (secondaryDialogPosition === \"bottom-start\") {\n return \"bottom\";\n }\n\n return \"top\";\n }, [secondaryDialogPosition]);\n\n return (\n <div\n className={classNames}\n ref={ref}\n id={id}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.SPLIT_BUTTON, id)}\n data-vibe={ComponentVibeId.SPLIT_BUTTON}\n >\n <Button\n {\n ...buttonProps /* We are enriching button with other props so we must use spreading */\n }\n preventClickAnimation\n leftIcon={leftIcon}\n rightIcon={rightIcon}\n rightFlat\n color={color}\n kind={kind}\n active={active}\n onClick={onClick}\n className={styles.mainButton}\n marginLeft={marginLeft}\n onFocus={setHovered}\n onBlur={setNotHovered}\n disabled={disabled}\n loading={loading}\n data-testid={getTestId(ComponentDefaultTestId.SPLIT_BUTTON_PRIMARY_BUTTON, id)}\n >\n {children}\n </Button>\n <div className={styles.secondaryButtonWrapper}>\n <Dialog\n wrapperClassName={secondaryDialogClassName}\n zIndex={zIndex}\n content={actionsContent}\n position={secondaryDialogPosition as DialogPosition}\n containerSelector={dialogContainerSelector}\n startingEdge={animationEdgePosition}\n animationType={AnimationType.EXPAND}\n moveBy={DIALOG_MOVE_BY}\n onDialogDidShow={showDialog}\n onDialogDidHide={hideDialog}\n showTrigger={dialogShowTrigger}\n hideTrigger={dialogHideTrigger}\n >\n <Button\n {...buttonProps}\n ref={secondaryButtonRef}\n preventClickAnimation\n leftFlat\n noSidePadding\n color={color}\n kind={kind}\n className={styles.secondaryButton}\n active={isDialogOpen}\n marginRight={marginRight}\n onFocus={setHovered}\n onBlur={setNotHovered}\n disabled={disabled}\n ariaLabel={SECONDARY_BUTTON_ARIA_LABEL}\n ariaHasPopup\n ariaExpanded={isDialogOpen}\n data-testid={getTestId(ComponentDefaultTestId.SPLIT_BUTTON_SECONDARY_BUTTON, id)}\n >\n <div className={styles.secondaryButtonIconWrapper}>\n <DropdownChevronDown aria-hidden=\"true\" />\n </div>\n </Button>\n </Dialog>\n </div>\n </div>\n );\n};\n\ninterface SplitButtonStaticProps {\n secondaryPositions: typeof SplitButtonSecondaryContentPosition;\n secondaryDialogPositions: typeof SplitButtonSecondaryContentPosition;\n sizes: typeof Button.sizes;\n colors: typeof Button.colors;\n kinds: typeof Button.kinds;\n inputTags: typeof Button.inputTags;\n dialogPaddingSizes: typeof DialogContentContainer.sizes;\n}\n\nexport default withStaticPropsWithoutForwardRef<SplitButtonProps, SplitButtonStaticProps>(SplitButton, {\n secondaryPositions: SplitButtonSecondaryContentPosition,\n secondaryDialogPositions: SplitButtonSecondaryContentPosition,\n sizes: Button.sizes,\n colors: Button.colors,\n kinds: Button.kinds,\n inputTags: Button.inputTags,\n dialogPaddingSizes: DialogContentContainer.sizes\n});\n"],"names":["withStaticPropsWithoutForwardRef","_a","secondaryDialogContent","_a$onSecondaryDialogD","onSecondaryDialogDidShow","NOOP","_a$onSecondaryDialogD2","onSecondaryDialogDidHide","shouldCloseOnClickInsideDialog","_a$zIndex","zIndex","_a$secondaryDialogCla","secondaryDialogClassName","_a$secondaryDialogPos","secondaryDialogPosition","dialogContainerSelector","_a$dialogPaddingSize","dialogPaddingSize","disabled","loading","_a$kind","kind","_a$color","color","className","leftIcon","rightIcon","onClick","children","marginLeft","marginRight","active","id","dataTestId","buttonProps","__rest","_useState","useState","_useState2","_slicedToArray","isDialogOpen","setDialogOpen","_useState3","_useState4","isHovered","setIsHover","_useState5","_useState6","isActive","setIsActive","ref","useRef","secondaryButtonRef","setHovered","useCallback","setNotHovered","shouldSetActive","e","isInsideClass","target","SECONDARY_BUTTON_WRAPPER_CLASSNAME","setActive","setNotActive","setActiveOnEnter","showDialog","hideDialog","_","eventName","current","focus","useEventListener","callback","useKeyEvent","keys","ENTER_KEYS","classNames","useMemo","cx","styles","button","getStyle","camelCase","_defineProperty","mainActive","splitContentOpen","hovered","dialogShowTrigger","DEFAULT_DIALOG_SHOW_TRIGGER","dialogHideTrigger","concat","_toConsumableArray","DEFAULT_DIALOG_HIDE_TRIGGER","HideShowEvent","CONTENT_CLICK","actionsContent","content","React","createElement","DialogContentContainer","type","types","POPOVER","size","animationEdgePosition","getTestId","ComponentDefaultTestId","SPLIT_BUTTON","ComponentVibeId","Button","Object","assign","preventClickAnimation","rightFlat","mainButton","onFocus","onBlur","SPLIT_BUTTON_PRIMARY_BUTTON","secondaryButtonWrapper","Dialog","wrapperClassName","position","containerSelector","startingEdge","animationType","AnimationType","EXPAND","moveBy","DIALOG_MOVE_BY","onDialogDidShow","onDialogDidHide","showTrigger","hideTrigger","leftFlat","noSidePadding","secondaryButton","ariaLabel","SECONDARY_BUTTON_ARIA_LABEL","ariaHasPopup","ariaExpanded","SPLIT_BUTTON_SECONDARY_BUTTON","secondaryButtonIconWrapper","DropdownChevronDown","secondaryPositions","SplitButtonSecondaryContentPosition","secondaryDialogPositions","sizes","colors","kinds","inputTags","dialogPaddingSizes"],"mappings":"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"}
1
+ {"version":3,"file":"SplitButton.js","sources":["../../../../src/components/SplitButton/SplitButton.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\nimport { camelCase } from \"lodash-es\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\n// Libraries import\nimport React, { ReactElement, useCallback, useMemo, useRef, useState } from \"react\";\n// Constants import\nimport {\n DEFAULT_DIALOG_HIDE_TRIGGER,\n DEFAULT_DIALOG_SHOW_TRIGGER,\n DIALOG_MOVE_BY,\n ENTER_KEYS,\n SECONDARY_BUTTON_ARIA_LABEL,\n SECONDARY_BUTTON_WRAPPER_CLASSNAME,\n SplitButtonSecondaryContentPosition,\n SplitButtonSecondaryContentPositionType\n} from \"./SplitButtonConstants\";\nimport { withStaticPropsWithoutForwardRef } from \"../../types\";\nimport { AnimationType, DialogPosition, HideShowEvent } from \"../Dialog/DialogConstants\";\n// Utils import\nimport { NOOP } from \"../../utils/function-utils\";\nimport { isInsideClass } from \"../../utils/dom-utils\";\n// Hooks import\nimport useKeyEvent from \"../../hooks/useKeyEvent\";\nimport useEventListener from \"../../hooks/useEventListener\";\n// Components import\nimport Button, { ButtonProps } from \"../Button/Button\";\nimport Dialog, { DialogEvent } from \"../Dialog/Dialog\";\nimport { DropdownChevronDown } from \"@vibe/icons\";\nimport DialogContentContainer from \"../DialogContentContainer/DialogContentContainer\";\nimport styles from \"./SplitButton.module.scss\";\nimport { DialogSize, DialogTriggerEvent } from \"../Dialog\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nexport interface SplitButtonProps extends ButtonProps {\n /**\n * The element or renderer that is displayed inside the dialog opened by clicking the secondary button.\n */\n secondaryDialogContent?: ReactElement | (() => string | ReactElement);\n /**\n * Callback fired when the secondary dialog is shown.\n */\n onSecondaryDialogDidShow?: () => void;\n /**\n * Callback fired when the secondary dialog is hidden.\n */\n onSecondaryDialogDidHide?: () => void;\n /**\n * The z-index applied to the secondary dialog.\n */\n zIndex?: number;\n /**\n * Class name applied to the wrapper of the secondary dialog.\n */\n secondaryDialogClassName?: string;\n /**\n * The position of the secondary dialog.\n */\n secondaryDialogPosition?: SplitButtonSecondaryContentPositionType;\n /**\n * The padding size inside the secondary dialog.\n */\n dialogPaddingSize?: DialogSize;\n /**\n * The CSS selector of the container where the dialog should be rendered.\n */\n dialogContainerSelector?: string;\n /**\n * If true, clicking inside the dialog will close it.\n */\n shouldCloseOnClickInsideDialog?: boolean;\n}\n\nconst SplitButton = ({\n secondaryDialogContent,\n onSecondaryDialogDidShow = NOOP,\n onSecondaryDialogDidHide = NOOP,\n shouldCloseOnClickInsideDialog,\n zIndex = null,\n secondaryDialogClassName,\n secondaryDialogPosition = \"bottom-start\",\n dialogContainerSelector,\n dialogPaddingSize = \"medium\",\n disabled,\n // success mode not working right now, need to fix it in different pr\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n success,\n loading,\n kind,\n color,\n className,\n leftIcon,\n rightIcon,\n onClick,\n children,\n marginLeft,\n marginRight,\n active,\n id,\n \"data-testid\": dataTestId,\n ...buttonProps\n}: SplitButtonProps) => {\n // State //\n const [isDialogOpen, setDialogOpen] = useState(false);\n const [isHovered, setIsHover] = useState(false);\n const [isActive, setIsActive] = useState(false);\n\n // Refs //\n const ref = useRef(null);\n const secondaryButtonRef = useRef(null);\n\n // Callbacks //\n const setHovered = useCallback(() => setIsHover(true), [setIsHover]);\n const setNotHovered = useCallback(() => setIsHover(false), [setIsHover]);\n\n const shouldSetActive = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n if (disabled) return false;\n return !isInsideClass(e.target as HTMLElement, SECONDARY_BUTTON_WRAPPER_CLASSNAME);\n },\n [disabled]\n );\n\n const setActive = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n if (!shouldSetActive(e)) return;\n setIsActive(true);\n },\n [setIsActive, shouldSetActive]\n );\n const setNotActive = useCallback(() => setIsActive(false), [setIsActive]);\n const setActiveOnEnter = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n if (!shouldSetActive(e)) return;\n setIsActive(true);\n },\n [setIsActive, shouldSetActive]\n );\n\n const showDialog = useCallback(() => {\n setDialogOpen(true);\n onSecondaryDialogDidShow();\n }, [setDialogOpen, onSecondaryDialogDidShow]);\n\n const hideDialog = useCallback(\n (_: DialogEvent, eventName: DialogTriggerEvent) => {\n setDialogOpen(false);\n onSecondaryDialogDidHide();\n if (eventName === \"esckey\") {\n secondaryButtonRef.current.focus();\n }\n },\n [setDialogOpen, onSecondaryDialogDidHide]\n );\n\n // Event listeners //\n\n // Used to set both buttons as hovered no matter what button was hovered\n useEventListener({ eventName: \"mouseenter\", callback: setHovered, ref });\n useEventListener({ eventName: \"mouseleave\", callback: setNotHovered, ref });\n\n useEventListener({ eventName: \"mousedown\", callback: setActive, ref });\n useEventListener({ eventName: \"mouseup\", callback: setNotActive, ref });\n\n // Used to finish active transition if clicked on enter\n useEventListener({ eventName: \"transitionend\", callback: setNotActive, ref });\n\n // Key events\n useKeyEvent({ keys: ENTER_KEYS, ref, callback: setActiveOnEnter });\n\n const classNames = useMemo(\n () =>\n cx(\n styles.button,\n getStyle(styles, camelCase(\"kind-\" + kind)),\n getStyle(styles, camelCase(\"color-\" + color)),\n {\n [styles.mainActive]: active,\n [styles.active]: isActive,\n [styles.splitContentOpen]: isDialogOpen,\n [styles.hovered]: isHovered,\n [styles.disabled]: disabled\n },\n className\n ),\n [className, kind, color, active, isActive, isDialogOpen, isHovered, disabled]\n );\n\n const dialogShowTrigger = useMemo(() => (disabled ? [] : DEFAULT_DIALOG_SHOW_TRIGGER), [disabled]);\n\n const dialogHideTrigger = useMemo(() => {\n if (shouldCloseOnClickInsideDialog) return [...DEFAULT_DIALOG_HIDE_TRIGGER, HideShowEvent.CONTENT_CLICK];\n return DEFAULT_DIALOG_HIDE_TRIGGER;\n }, [shouldCloseOnClickInsideDialog]);\n\n const actionsContent = useCallback(() => {\n const content = typeof secondaryDialogContent === \"function\" ? secondaryDialogContent() : secondaryDialogContent;\n return (\n <DialogContentContainer type={DialogContentContainer.types.POPOVER} size={dialogPaddingSize}>\n {content}\n </DialogContentContainer>\n );\n }, [secondaryDialogContent, dialogPaddingSize]);\n\n const animationEdgePosition = useMemo(() => {\n if (secondaryDialogPosition === \"bottom\") {\n return \"\";\n }\n if (secondaryDialogPosition === \"bottom-start\") {\n return \"bottom\";\n }\n\n return \"top\";\n }, [secondaryDialogPosition]);\n\n return (\n <div\n className={classNames}\n ref={ref}\n id={id}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.SPLIT_BUTTON, id)}\n data-vibe={ComponentVibeId.SPLIT_BUTTON}\n >\n <Button\n {\n ...buttonProps /* We are enriching button with other props so we must use spreading */\n }\n preventClickAnimation\n leftIcon={leftIcon}\n rightIcon={rightIcon}\n rightFlat\n color={color}\n kind={kind}\n active={active}\n onClick={onClick}\n className={styles.mainButton}\n marginLeft={marginLeft}\n onFocus={setHovered}\n onBlur={setNotHovered}\n disabled={disabled}\n loading={loading}\n data-testid={getTestId(ComponentDefaultTestId.SPLIT_BUTTON_PRIMARY_BUTTON, id)}\n >\n {children}\n </Button>\n <div className={styles.secondaryButtonWrapper}>\n <Dialog\n wrapperClassName={secondaryDialogClassName}\n zIndex={zIndex}\n content={actionsContent}\n position={secondaryDialogPosition as DialogPosition}\n containerSelector={dialogContainerSelector}\n startingEdge={animationEdgePosition}\n animationType={AnimationType.EXPAND}\n moveBy={DIALOG_MOVE_BY}\n onDialogDidShow={showDialog}\n onDialogDidHide={hideDialog}\n showTrigger={dialogShowTrigger}\n hideTrigger={dialogHideTrigger}\n >\n <Button\n {...buttonProps}\n ref={secondaryButtonRef}\n preventClickAnimation\n leftFlat\n noSidePadding\n color={color}\n kind={kind}\n className={styles.secondaryButton}\n active={isDialogOpen}\n marginRight={marginRight}\n onFocus={setHovered}\n onBlur={setNotHovered}\n disabled={disabled}\n ariaLabel={SECONDARY_BUTTON_ARIA_LABEL}\n ariaHasPopup\n ariaExpanded={isDialogOpen}\n data-testid={getTestId(ComponentDefaultTestId.SPLIT_BUTTON_SECONDARY_BUTTON, id)}\n >\n <div className={styles.secondaryButtonIconWrapper}>\n <DropdownChevronDown aria-hidden=\"true\" />\n </div>\n </Button>\n </Dialog>\n </div>\n </div>\n );\n};\n\nSplitButton.defaultProps = {\n ...Button.defaultProps,\n onSecondaryDialogDidShow: NOOP,\n onSecondaryDialogDidHide: NOOP,\n zIndex: null,\n secondaryDialogClassName: \"\",\n secondaryDialogPosition: SplitButtonSecondaryContentPosition.BOTTOM_START,\n dialogPaddingSize: DialogContentContainer.sizes.MEDIUM\n};\n\ninterface SplitButtonStaticProps {\n secondaryPositions: typeof SplitButtonSecondaryContentPosition;\n secondaryDialogPositions: typeof SplitButtonSecondaryContentPosition;\n sizes: typeof Button.sizes;\n colors: typeof Button.colors;\n kinds: typeof Button.kinds;\n inputTags: typeof Button.inputTags;\n dialogPaddingSizes: typeof DialogContentContainer.sizes;\n}\n\nexport default withStaticPropsWithoutForwardRef<SplitButtonProps, SplitButtonStaticProps>(SplitButton, {\n secondaryPositions: SplitButtonSecondaryContentPosition,\n secondaryDialogPositions: SplitButtonSecondaryContentPosition,\n sizes: Button.sizes,\n colors: Button.colors,\n kinds: Button.kinds,\n inputTags: Button.inputTags,\n dialogPaddingSizes: DialogContentContainer.sizes\n});\n"],"names":["SplitButton","_a","secondaryDialogContent","_a$onSecondaryDialogD","onSecondaryDialogDidShow","NOOP","_a$onSecondaryDialogD2","onSecondaryDialogDidHide","shouldCloseOnClickInsideDialog","_a$zIndex","zIndex","secondaryDialogClassName","_a$secondaryDialogPos","secondaryDialogPosition","dialogContainerSelector","_a$dialogPaddingSize","dialogPaddingSize","disabled","loading","kind","color","className","leftIcon","rightIcon","onClick","children","marginLeft","marginRight","active","id","dataTestId","buttonProps","__rest","_useState","useState","_useState2","_slicedToArray","isDialogOpen","setDialogOpen","_useState3","_useState4","isHovered","setIsHover","_useState5","_useState6","isActive","setIsActive","ref","useRef","secondaryButtonRef","setHovered","useCallback","setNotHovered","shouldSetActive","e","isInsideClass","target","SECONDARY_BUTTON_WRAPPER_CLASSNAME","setActive","setNotActive","setActiveOnEnter","showDialog","hideDialog","_","eventName","current","focus","useEventListener","callback","useKeyEvent","keys","ENTER_KEYS","classNames","useMemo","cx","styles","button","getStyle","camelCase","_defineProperty","mainActive","splitContentOpen","hovered","dialogShowTrigger","DEFAULT_DIALOG_SHOW_TRIGGER","dialogHideTrigger","concat","_toConsumableArray","DEFAULT_DIALOG_HIDE_TRIGGER","HideShowEvent","CONTENT_CLICK","actionsContent","content","React","createElement","DialogContentContainer","type","types","POPOVER","size","animationEdgePosition","getTestId","ComponentDefaultTestId","SPLIT_BUTTON","ComponentVibeId","Button","Object","assign","preventClickAnimation","rightFlat","mainButton","onFocus","onBlur","SPLIT_BUTTON_PRIMARY_BUTTON","secondaryButtonWrapper","Dialog","wrapperClassName","position","containerSelector","startingEdge","animationType","AnimationType","EXPAND","moveBy","DIALOG_MOVE_BY","onDialogDidShow","onDialogDidHide","showTrigger","hideTrigger","leftFlat","noSidePadding","secondaryButton","ariaLabel","SECONDARY_BUTTON_ARIA_LABEL","ariaHasPopup","ariaExpanded","SPLIT_BUTTON_SECONDARY_BUTTON","secondaryButtonIconWrapper","DropdownChevronDown","defaultProps","SplitButtonSecondaryContentPosition","BOTTOM_START","sizes","MEDIUM","withStaticPropsWithoutForwardRef","secondaryPositions","secondaryDialogPositions","colors","kinds","inputTags","dialogPaddingSizes"],"mappings":"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"}