@studiometa/ui 1.0.0-alpha.0 → 1.0.0-alpha.11

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 (273) hide show
  1. package/README.md +6 -4
  2. package/atoms/Action/Action.d.ts +4 -6
  3. package/atoms/Action/Action.js +25 -60
  4. package/atoms/Action/Action.js.map +2 -2
  5. package/atoms/Action/ActionEvent.d.ts +55 -0
  6. package/atoms/Action/ActionEvent.js +130 -0
  7. package/atoms/Action/ActionEvent.js.map +7 -0
  8. package/atoms/AnchorScrollTo/AnchorScrollTo.d.ts +3 -3
  9. package/atoms/AnchorScrollTo/AnchorScrollTo.js +1 -3
  10. package/atoms/AnchorScrollTo/AnchorScrollTo.js.map +2 -2
  11. package/atoms/Data/DataBind.d.ts +2 -2
  12. package/atoms/Data/DataBind.js +22 -12
  13. package/atoms/Data/DataBind.js.map +2 -2
  14. package/atoms/Data/DataComputed.js +3 -3
  15. package/atoms/Data/DataComputed.js.map +2 -2
  16. package/atoms/Data/DataEffect.js +2 -2
  17. package/atoms/Data/DataEffect.js.map +2 -2
  18. package/atoms/Data/DataModel.d.ts +1 -0
  19. package/atoms/Data/DataModel.js +13 -3
  20. package/atoms/Data/DataModel.js.map +2 -2
  21. package/atoms/Figure/AbstractFigure.d.ts +41 -0
  22. package/atoms/Figure/AbstractFigure.js +65 -0
  23. package/atoms/Figure/AbstractFigure.js.map +7 -0
  24. package/atoms/Figure/AbstractFigureDynamic.d.ts +29 -0
  25. package/atoms/Figure/AbstractFigureDynamic.js +48 -0
  26. package/atoms/Figure/AbstractFigureDynamic.js.map +7 -0
  27. package/atoms/Figure/Figure.d.ts +4 -35
  28. package/atoms/Figure/Figure.js +5 -68
  29. package/atoms/Figure/Figure.js.map +2 -2
  30. package/atoms/Figure/FigureShopify.d.ts +23 -0
  31. package/atoms/Figure/FigureShopify.js +38 -0
  32. package/atoms/Figure/FigureShopify.js.map +7 -0
  33. package/atoms/Figure/FigureTwicpics.d.ts +3 -19
  34. package/atoms/Figure/FigureTwicpics.js +10 -32
  35. package/atoms/Figure/FigureTwicpics.js.map +2 -2
  36. package/atoms/Figure/index.d.ts +1 -0
  37. package/atoms/Figure/index.js +1 -0
  38. package/atoms/Figure/index.js.map +2 -2
  39. package/atoms/Figure/utils.d.ts +8 -0
  40. package/atoms/Figure/utils.js +15 -0
  41. package/atoms/Figure/utils.js.map +7 -0
  42. package/atoms/FigureVideo/FigureVideo.js +1 -1
  43. package/atoms/FigureVideo/FigureVideo.js.map +1 -1
  44. package/atoms/FigureVideo/FigureVideoTwicpics.js +1 -1
  45. package/atoms/FigureVideo/FigureVideoTwicpics.js.map +1 -1
  46. package/atoms/LazyInclude/LazyInclude.d.ts +3 -1
  47. package/atoms/LazyInclude/LazyInclude.js +1 -1
  48. package/atoms/LazyInclude/LazyInclude.js.map +2 -2
  49. package/atoms/ScrollAnimation/ScrollAnimationChildWithEase.d.ts +1 -1
  50. package/atoms/ScrollAnimation/ScrollAnimationWithEase.d.ts +1 -1
  51. package/decorators/withTransition.d.ts +1 -0
  52. package/decorators/withTransition.js +47 -23
  53. package/decorators/withTransition.js.map +2 -2
  54. package/molecules/Accordion/AccordionCore.d.ts +6 -2
  55. package/molecules/Accordion/AccordionCore.js +2 -2
  56. package/molecules/Accordion/AccordionCore.js.map +2 -2
  57. package/molecules/AnchorNav/AnchorNav.d.ts +6 -2
  58. package/molecules/AnchorNav/AnchorNav.js +4 -4
  59. package/molecules/AnchorNav/AnchorNav.js.map +2 -2
  60. package/molecules/AnchorNav/AnchorNavLink.d.ts +1 -1
  61. package/molecules/Menu/Menu.d.ts +11 -4
  62. package/molecules/Menu/Menu.js +7 -9
  63. package/molecules/Menu/Menu.js.map +2 -2
  64. package/molecules/Menu/MenuBtn.d.ts +9 -3
  65. package/molecules/Menu/MenuBtn.js +3 -3
  66. package/molecules/Menu/MenuBtn.js.map +2 -2
  67. package/molecules/Menu/MenuList.d.ts +1 -1
  68. package/molecules/Slider/Slider.d.ts +6 -2
  69. package/molecules/Slider/Slider.js +2 -2
  70. package/molecules/Slider/Slider.js.map +2 -2
  71. package/molecules/Slider/SliderDots.d.ts +5 -2
  72. package/molecules/Slider/SliderDots.js +1 -1
  73. package/molecules/Slider/SliderDots.js.map +2 -2
  74. package/molecules/Slider/SliderDrag.d.ts +3 -1
  75. package/molecules/Slider/SliderDrag.js +1 -1
  76. package/molecules/Slider/SliderDrag.js.map +2 -2
  77. package/molecules/Sticky/Sticky.d.ts +3 -1
  78. package/molecules/Sticky/Sticky.js +1 -1
  79. package/molecules/Sticky/Sticky.js.map +2 -2
  80. package/molecules/Tabs/Tabs.d.ts +4 -1
  81. package/molecules/Tabs/Tabs.js +1 -1
  82. package/molecules/Tabs/Tabs.js.map +2 -2
  83. package/molecules/index.d.ts +2 -3
  84. package/molecules/index.js +2 -3
  85. package/molecules/index.js.map +2 -2
  86. package/organisms/Frame/Frame.d.ts +11 -3
  87. package/organisms/Frame/Frame.js +14 -16
  88. package/organisms/Frame/Frame.js.map +2 -2
  89. package/organisms/Frame/FrameTarget.d.ts +1 -1
  90. package/package.json +2 -2
  91. package/primitives/Transition/Transition.d.ts +1 -1
  92. package/atoms/Action/Action.cjs +0 -115
  93. package/atoms/Action/Action.cjs.map +0 -7
  94. package/atoms/Action/Target.cjs +0 -35
  95. package/atoms/Action/Target.cjs.map +0 -7
  96. package/atoms/Action/index.cjs +0 -22
  97. package/atoms/Action/index.cjs.map +0 -7
  98. package/atoms/AnchorScrollTo/AnchorScrollTo.cjs +0 -52
  99. package/atoms/AnchorScrollTo/AnchorScrollTo.cjs.map +0 -7
  100. package/atoms/AnchorScrollTo/index.cjs +0 -21
  101. package/atoms/AnchorScrollTo/index.cjs.map +0 -7
  102. package/atoms/CircularMarquee/CircularMarquee.cjs +0 -69
  103. package/atoms/CircularMarquee/CircularMarquee.cjs.map +0 -7
  104. package/atoms/CircularMarquee/index.cjs +0 -21
  105. package/atoms/CircularMarquee/index.cjs.map +0 -7
  106. package/atoms/Cursor/Cursor.cjs +0 -137
  107. package/atoms/Cursor/Cursor.cjs.map +0 -7
  108. package/atoms/Cursor/index.cjs +0 -21
  109. package/atoms/Cursor/index.cjs.map +0 -7
  110. package/atoms/Data/DataBind.cjs +0 -124
  111. package/atoms/Data/DataBind.cjs.map +0 -7
  112. package/atoms/Data/DataComputed.cjs +0 -49
  113. package/atoms/Data/DataComputed.cjs.map +0 -7
  114. package/atoms/Data/DataEffect.cjs +0 -47
  115. package/atoms/Data/DataEffect.cjs.map +0 -7
  116. package/atoms/Data/DataModel.cjs +0 -38
  117. package/atoms/Data/DataModel.cjs.map +0 -7
  118. package/atoms/Data/index.cjs +0 -24
  119. package/atoms/Data/index.cjs.map +0 -7
  120. package/atoms/Data/utils.cjs +0 -46
  121. package/atoms/Data/utils.cjs.map +0 -7
  122. package/atoms/Figure/Figure.cjs +0 -105
  123. package/atoms/Figure/Figure.cjs.map +0 -7
  124. package/atoms/Figure/FigureTwicpics.cjs +0 -123
  125. package/atoms/Figure/FigureTwicpics.cjs.map +0 -7
  126. package/atoms/Figure/index.cjs +0 -22
  127. package/atoms/Figure/index.cjs.map +0 -7
  128. package/atoms/FigureVideo/FigureVideo.cjs +0 -132
  129. package/atoms/FigureVideo/FigureVideo.cjs.map +0 -7
  130. package/atoms/FigureVideo/FigureVideoTwicpics.cjs +0 -153
  131. package/atoms/FigureVideo/FigureVideoTwicpics.cjs.map +0 -7
  132. package/atoms/FigureVideo/index.cjs +0 -22
  133. package/atoms/FigureVideo/index.cjs.map +0 -7
  134. package/atoms/LargeText/LargeText.cjs +0 -109
  135. package/atoms/LargeText/LargeText.cjs.map +0 -7
  136. package/atoms/LargeText/index.cjs +0 -21
  137. package/atoms/LargeText/index.cjs.map +0 -7
  138. package/atoms/LazyInclude/LazyInclude.cjs +0 -78
  139. package/atoms/LazyInclude/LazyInclude.cjs.map +0 -7
  140. package/atoms/LazyInclude/index.cjs +0 -21
  141. package/atoms/LazyInclude/index.cjs.map +0 -7
  142. package/atoms/Prefetch/AbstractPrefetch.cjs +0 -86
  143. package/atoms/Prefetch/AbstractPrefetch.cjs.map +0 -7
  144. package/atoms/Prefetch/PrefetchWhenOver.cjs +0 -42
  145. package/atoms/Prefetch/PrefetchWhenOver.cjs.map +0 -7
  146. package/atoms/Prefetch/PrefetchWhenVisible.cjs +0 -43
  147. package/atoms/Prefetch/PrefetchWhenVisible.cjs.map +0 -7
  148. package/atoms/Prefetch/index.cjs +0 -23
  149. package/atoms/Prefetch/index.cjs.map +0 -7
  150. package/atoms/ScrollAnimation/AbstractScrollAnimation.cjs +0 -95
  151. package/atoms/ScrollAnimation/AbstractScrollAnimation.cjs.map +0 -7
  152. package/atoms/ScrollAnimation/ScrollAnimation.cjs +0 -44
  153. package/atoms/ScrollAnimation/ScrollAnimation.cjs.map +0 -7
  154. package/atoms/ScrollAnimation/ScrollAnimationChild.cjs +0 -84
  155. package/atoms/ScrollAnimation/ScrollAnimationChild.cjs.map +0 -7
  156. package/atoms/ScrollAnimation/ScrollAnimationChildWithEase.cjs +0 -37
  157. package/atoms/ScrollAnimation/ScrollAnimationChildWithEase.cjs.map +0 -7
  158. package/atoms/ScrollAnimation/ScrollAnimationParent.cjs +0 -50
  159. package/atoms/ScrollAnimation/ScrollAnimationParent.cjs.map +0 -7
  160. package/atoms/ScrollAnimation/ScrollAnimationWithEase.cjs +0 -37
  161. package/atoms/ScrollAnimation/ScrollAnimationWithEase.cjs.map +0 -7
  162. package/atoms/ScrollAnimation/animationScrollWithEase.cjs +0 -59
  163. package/atoms/ScrollAnimation/animationScrollWithEase.cjs.map +0 -7
  164. package/atoms/ScrollAnimation/index.cjs +0 -27
  165. package/atoms/ScrollAnimation/index.cjs.map +0 -7
  166. package/atoms/ScrollReveal/ScrollReveal.cjs +0 -81
  167. package/atoms/ScrollReveal/ScrollReveal.cjs.map +0 -7
  168. package/atoms/ScrollReveal/index.cjs +0 -21
  169. package/atoms/ScrollReveal/index.cjs.map +0 -7
  170. package/atoms/index.cjs +0 -32
  171. package/atoms/index.cjs.map +0 -7
  172. package/decorators/index.cjs +0 -22
  173. package/decorators/index.cjs.map +0 -7
  174. package/decorators/withDeprecation.cjs +0 -47
  175. package/decorators/withDeprecation.cjs.map +0 -7
  176. package/decorators/withTransition.cjs +0 -86
  177. package/decorators/withTransition.cjs.map +0 -7
  178. package/index.cjs +0 -25
  179. package/index.cjs.map +0 -7
  180. package/molecules/Accordion/Accordion.cjs +0 -36
  181. package/molecules/Accordion/Accordion.cjs.map +0 -7
  182. package/molecules/Accordion/AccordionCore.cjs +0 -58
  183. package/molecules/Accordion/AccordionCore.cjs.map +0 -7
  184. package/molecules/Accordion/AccordionItem.cjs +0 -206
  185. package/molecules/Accordion/AccordionItem.cjs.map +0 -7
  186. package/molecules/Accordion/index.cjs +0 -22
  187. package/molecules/Accordion/index.cjs.map +0 -7
  188. package/molecules/AnchorNav/AnchorNav.cjs +0 -63
  189. package/molecules/AnchorNav/AnchorNav.cjs.map +0 -7
  190. package/molecules/AnchorNav/AnchorNavLink.cjs +0 -40
  191. package/molecules/AnchorNav/AnchorNavLink.cjs.map +0 -7
  192. package/molecules/AnchorNav/AnchorNavTarget.cjs +0 -35
  193. package/molecules/AnchorNav/AnchorNavTarget.cjs.map +0 -7
  194. package/molecules/AnchorNav/index.cjs +0 -23
  195. package/molecules/AnchorNav/index.cjs.map +0 -7
  196. package/molecules/Menu/Menu.cjs +0 -177
  197. package/molecules/Menu/Menu.cjs.map +0 -7
  198. package/molecules/Menu/MenuBtn.cjs +0 -66
  199. package/molecules/Menu/MenuBtn.cjs.map +0 -7
  200. package/molecules/Menu/MenuList.cjs +0 -165
  201. package/molecules/Menu/MenuList.cjs.map +0 -7
  202. package/molecules/Menu/index.cjs +0 -23
  203. package/molecules/Menu/index.cjs.map +0 -7
  204. package/molecules/Modal/Modal.cjs +0 -219
  205. package/molecules/Modal/Modal.cjs.map +0 -7
  206. package/molecules/Modal/ModalWithTransition.cjs +0 -69
  207. package/molecules/Modal/ModalWithTransition.cjs.map +0 -7
  208. package/molecules/Modal/index.cjs +0 -22
  209. package/molecules/Modal/index.cjs.map +0 -7
  210. package/molecules/Panel/Panel.cjs +0 -137
  211. package/molecules/Panel/Panel.cjs.map +0 -7
  212. package/molecules/Panel/index.cjs +0 -21
  213. package/molecules/Panel/index.cjs.map +0 -7
  214. package/molecules/Slider/AbstractSliderChild.cjs +0 -88
  215. package/molecules/Slider/AbstractSliderChild.cjs.map +0 -7
  216. package/molecules/Slider/Slider.cjs +0 -404
  217. package/molecules/Slider/Slider.cjs.map +0 -7
  218. package/molecules/Slider/SliderBtn.cjs +0 -71
  219. package/molecules/Slider/SliderBtn.cjs.map +0 -7
  220. package/molecules/Slider/SliderCount.cjs +0 -44
  221. package/molecules/Slider/SliderCount.cjs.map +0 -7
  222. package/molecules/Slider/SliderDots.cjs +0 -64
  223. package/molecules/Slider/SliderDots.cjs.map +0 -7
  224. package/molecules/Slider/SliderDrag.cjs +0 -66
  225. package/molecules/Slider/SliderDrag.cjs.map +0 -7
  226. package/molecules/Slider/SliderItem.cjs +0 -177
  227. package/molecules/Slider/SliderItem.cjs.map +0 -7
  228. package/molecules/Slider/SliderProgress.cjs +0 -49
  229. package/molecules/Slider/SliderProgress.cjs.map +0 -7
  230. package/molecules/Slider/index.cjs +0 -28
  231. package/molecules/Slider/index.cjs.map +0 -7
  232. package/molecules/Sticky/Sticky.cjs +0 -177
  233. package/molecules/Sticky/Sticky.cjs.map +0 -7
  234. package/molecules/Sticky/index.cjs +0 -21
  235. package/molecules/Sticky/index.cjs.map +0 -7
  236. package/molecules/TableOfContent/TableOfContent.cjs +0 -72
  237. package/molecules/TableOfContent/TableOfContent.cjs.map +0 -7
  238. package/molecules/TableOfContent/TableOfContentAnchor.cjs +0 -76
  239. package/molecules/TableOfContent/TableOfContentAnchor.cjs.map +0 -7
  240. package/molecules/TableOfContent/index.cjs +0 -22
  241. package/molecules/TableOfContent/index.cjs.map +0 -7
  242. package/molecules/Tabs/Tabs.cjs +0 -153
  243. package/molecules/Tabs/Tabs.cjs.map +0 -7
  244. package/molecules/Tabs/index.cjs +0 -21
  245. package/molecules/Tabs/index.cjs.map +0 -7
  246. package/molecules/index.cjs +0 -30
  247. package/molecules/index.cjs.map +0 -7
  248. package/organisms/Frame/Frame.cjs +0 -220
  249. package/organisms/Frame/Frame.cjs.map +0 -7
  250. package/organisms/Frame/FrameAnchor.cjs +0 -41
  251. package/organisms/Frame/FrameAnchor.cjs.map +0 -7
  252. package/organisms/Frame/FrameForm.cjs +0 -41
  253. package/organisms/Frame/FrameForm.cjs.map +0 -7
  254. package/organisms/Frame/FrameTarget.cjs +0 -114
  255. package/organisms/Frame/FrameTarget.cjs.map +0 -7
  256. package/organisms/Frame/index.cjs +0 -24
  257. package/organisms/Frame/index.cjs.map +0 -7
  258. package/organisms/index.cjs +0 -21
  259. package/organisms/index.cjs.map +0 -7
  260. package/primitives/Draggable/Draggable.cjs +0 -65
  261. package/primitives/Draggable/Draggable.cjs.map +0 -7
  262. package/primitives/Draggable/index.cjs +0 -21
  263. package/primitives/Draggable/index.cjs.map +0 -7
  264. package/primitives/Sentinel/Sentinel.cjs +0 -35
  265. package/primitives/Sentinel/Sentinel.cjs.map +0 -7
  266. package/primitives/Sentinel/index.cjs +0 -21
  267. package/primitives/Sentinel/index.cjs.map +0 -7
  268. package/primitives/Transition/Transition.cjs +0 -36
  269. package/primitives/Transition/Transition.cjs.map +0 -7
  270. package/primitives/Transition/index.cjs +0 -21
  271. package/primitives/Transition/index.cjs.map +0 -7
  272. package/primitives/index.cjs +0 -23
  273. package/primitives/index.cjs.map +0 -7
@@ -1,66 +0,0 @@
1
- var __defProp = Object.defineProperty;
2
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
3
- var __getOwnPropNames = Object.getOwnPropertyNames;
4
- var __hasOwnProp = Object.prototype.hasOwnProperty;
5
- var __export = (target, all) => {
6
- for (var name in all)
7
- __defProp(target, name, { get: all[name], enumerable: true });
8
- };
9
- var __copyProps = (to, from, except, desc) => {
10
- if (from && typeof from === "object" || typeof from === "function") {
11
- for (let key of __getOwnPropNames(from))
12
- if (!__hasOwnProp.call(to, key) && key !== except)
13
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
14
- }
15
- return to;
16
- };
17
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
18
-
19
- // packages/ui/molecules/Menu/MenuBtn.ts
20
- var MenuBtn_exports = {};
21
- __export(MenuBtn_exports, {
22
- MenuBtn: () => MenuBtn
23
- });
24
- module.exports = __toCommonJS(MenuBtn_exports);
25
- var import_js_toolkit = require("@studiometa/js-toolkit");
26
- var MenuBtn = class extends import_js_toolkit.Base {
27
- /**
28
- * Config.
29
- */
30
- static config = {
31
- name: "MenuBtn"
32
- };
33
- /**
34
- * Wether the button is hovered or not.
35
- * @type {boolean}
36
- */
37
- isHover = false;
38
- /**
39
- * Dispatch the click event.
40
- * @param {MouseEvent} event
41
- * @returns {void}
42
- */
43
- onClick(event) {
44
- event.stopPropagation();
45
- }
46
- /**
47
- * Dispatch the mouseenter event.
48
- * @param {MouseEvent} event
49
- * @returns {void}
50
- */
51
- onMouseenter(event) {
52
- this.isHover = true;
53
- event.stopPropagation();
54
- }
55
- /**
56
- * Dispatch the mouseleave event.
57
- * @param {MouseEvent} event
58
- * @returns {void}
59
- */
60
- onMouseleave(event) {
61
- this.isHover = false;
62
- event.stopPropagation();
63
- }
64
- };
65
- if (module.exports.default) module.exports = module.exports.default;
66
- //# sourceMappingURL=MenuBtn.cjs.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../packages/ui/molecules/Menu/MenuBtn.ts"],
4
- "sourcesContent": ["import { Base } from '@studiometa/js-toolkit';\nimport type { BaseConfig, BaseProps } from '@studiometa/js-toolkit';\n\n/**\n * MenuBtn class.\n */\nexport class MenuBtn<T extends BaseProps = BaseProps> extends Base<T> {\n /**\n * Config.\n */\n static config: BaseConfig = {\n name: 'MenuBtn',\n };\n\n /**\n * Wether the button is hovered or not.\n * @type {boolean}\n */\n isHover = false;\n\n /**\n * Dispatch the click event.\n * @param {MouseEvent} event\n * @returns {void}\n */\n onClick(event) {\n event.stopPropagation();\n }\n\n /**\n * Dispatch the mouseenter event.\n * @param {MouseEvent} event\n * @returns {void}\n */\n onMouseenter(event) {\n this.isHover = true;\n event.stopPropagation();\n }\n\n /**\n * Dispatch the mouseleave event.\n * @param {MouseEvent} event\n * @returns {void}\n */\n onMouseleave(event) {\n this.isHover = false;\n event.stopPropagation();\n }\n}\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAAqB;AAMd,IAAM,UAAN,cAAuD,uBAAQ;AAAA;AAAA;AAAA;AAAA,EAIpE,OAAO,SAAqB;AAAA,IAC1B,MAAM;AAAA,EACR;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOV,QAAQ,OAAO;AACb,UAAM,gBAAgB;AAAA,EACxB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,aAAa,OAAO;AAClB,SAAK,UAAU;AACf,UAAM,gBAAgB;AAAA,EACxB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,aAAa,OAAO;AAClB,SAAK,UAAU;AACf,UAAM,gBAAgB;AAAA,EACxB;AACF;",
6
- "names": []
7
- }
@@ -1,165 +0,0 @@
1
- var __defProp = Object.defineProperty;
2
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
3
- var __getOwnPropNames = Object.getOwnPropertyNames;
4
- var __hasOwnProp = Object.prototype.hasOwnProperty;
5
- var __export = (target, all) => {
6
- for (var name in all)
7
- __defProp(target, name, { get: all[name], enumerable: true });
8
- };
9
- var __copyProps = (to, from, except, desc) => {
10
- if (from && typeof from === "object" || typeof from === "function") {
11
- for (let key of __getOwnPropNames(from))
12
- if (!__hasOwnProp.call(to, key) && key !== except)
13
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
14
- }
15
- return to;
16
- };
17
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
18
-
19
- // packages/ui/molecules/Menu/MenuList.ts
20
- var MenuList_exports = {};
21
- __export(MenuList_exports, {
22
- MenuList: () => MenuList
23
- });
24
- module.exports = __toCommonJS(MenuList_exports);
25
- var import_primitives = require("../../primitives/index.cjs");
26
- var FOCUSABLE_ELEMENTS = [
27
- "a[href]:not([inert])",
28
- "area[href]:not([inert])",
29
- "input:not([disabled]):not([inert])",
30
- "select:not([disabled]):not([inert])",
31
- "textarea:not([disabled]):not([inert])",
32
- "button:not([disabled]):not([inert])",
33
- "iframe:not([inert])",
34
- "audio:not([inert])",
35
- "video:not([inert])",
36
- "[contenteditable]:not([inert])",
37
- "[tabindex]:not([inert])"
38
- ].join(",");
39
- var MenuList = class _MenuList extends import_primitives.Transition {
40
- /**
41
- * Config.
42
- */
43
- static config = {
44
- ...import_primitives.Transition.config,
45
- name: "MenuList",
46
- emits: ["items-open", "items-close", "items-mouseleave"],
47
- components: {
48
- MenuList: _MenuList
49
- }
50
- };
51
- /**
52
- * Are the menu items visible?
53
- */
54
- isOpen = false;
55
- /**
56
- * Wether the component is hovered.
57
- */
58
- isHover = false;
59
- /**
60
- * Override `Transition` options.
61
- */
62
- // @ts-ignore
63
- get $options() {
64
- const options = super.$options;
65
- options.leaveKeep = true;
66
- options.enterKeep = true;
67
- return options;
68
- }
69
- /**
70
- * Update tab indexes on mount.
71
- */
72
- mounted() {
73
- this.__updateTabIndexes("close");
74
- }
75
- /**
76
- * Set hover state.
77
- */
78
- onMouseenter() {
79
- this.isHover = true;
80
- }
81
- /**
82
- * Unset hover state.
83
- */
84
- onMouseleave() {
85
- this.isHover = false;
86
- }
87
- /**
88
- * Display the menu items.
89
- */
90
- open() {
91
- if (this.isOpen) {
92
- return;
93
- }
94
- const clickOutsideHandler = (event) => {
95
- if (!this.$el.contains(event.target)) {
96
- document.removeEventListener("click", clickOutsideHandler);
97
- this.close();
98
- }
99
- };
100
- document.addEventListener("click", clickOutsideHandler);
101
- this.__updateTabIndexes("open");
102
- this.$el.setAttribute("aria-hidden", "false");
103
- this.isOpen = true;
104
- this.enter();
105
- this.$emit("items-open");
106
- }
107
- /**
108
- * Hide the menu items.
109
- */
110
- close() {
111
- if (!this.isOpen) {
112
- return;
113
- }
114
- this.$children.MenuList.forEach((menuItem) => {
115
- menuItem.close();
116
- });
117
- if (document.activeElement instanceof HTMLElement && this.$el.contains(document.activeElement)) {
118
- document.activeElement.blur();
119
- }
120
- this.$el.setAttribute("aria-hidden", "true");
121
- this.__updateTabIndexes("close");
122
- this.isOpen = false;
123
- this.leave();
124
- this.$emit("items-close");
125
- }
126
- /**
127
- * Toggle the menu items.
128
- */
129
- toggle() {
130
- if (this.isOpen) {
131
- this.close();
132
- } else {
133
- this.open();
134
- }
135
- }
136
- /**
137
- * Update `tabindex` attribute of child focusable elements.
138
- * @private
139
- */
140
- __updateTabIndexes(mode = "open") {
141
- const focusableItems = Array.from(this.$el.querySelectorAll(FOCUSABLE_ELEMENTS)).filter(
142
- (item) => this.__filterFocusableItems(item)
143
- );
144
- focusableItems.forEach((item) => {
145
- if (mode === "close") {
146
- item.setAttribute("tabindex", "-1");
147
- } else {
148
- item.removeAttribute("tabindex");
149
- }
150
- });
151
- }
152
- /**
153
- * Filter out items which are inside a child `MenuList` instance.
154
- * @private
155
- */
156
- __filterFocusableItems(item) {
157
- let ancestor = item.parentElement;
158
- while (ancestor && (!ancestor.__base__ || !ancestor.__base__.has(this.constructor))) {
159
- ancestor = ancestor.parentElement;
160
- }
161
- return ancestor === null || ancestor === this.$el;
162
- }
163
- };
164
- if (module.exports.default) module.exports = module.exports.default;
165
- //# sourceMappingURL=MenuList.cjs.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../packages/ui/molecules/Menu/MenuList.ts"],
4
- "sourcesContent": ["import type { BaseConfig, BaseProps } from '@studiometa/js-toolkit';\nimport { Transition } from '../../primitives/index.js';\n\nconst FOCUSABLE_ELEMENTS = [\n 'a[href]:not([inert])',\n 'area[href]:not([inert])',\n 'input:not([disabled]):not([inert])',\n 'select:not([disabled]):not([inert])',\n 'textarea:not([disabled]):not([inert])',\n 'button:not([disabled]):not([inert])',\n 'iframe:not([inert])',\n 'audio:not([inert])',\n 'video:not([inert])',\n '[contenteditable]:not([inert])',\n '[tabindex]:not([inert])',\n].join(',');\n\nexport interface MenuListProps extends BaseProps {\n $children: {\n // eslint-disable-next-line no-use-before-define\n MenuList: MenuList[];\n };\n}\n\n/**\n * MenuList class.\n */\nexport class MenuList<T extends BaseProps = BaseProps> extends Transition<T & MenuListProps> {\n /**\n * Config.\n */\n static config: BaseConfig = {\n ...Transition.config,\n name: 'MenuList',\n emits: ['items-open', 'items-close', 'items-mouseleave'],\n components: {\n MenuList,\n },\n };\n\n /**\n * Are the menu items visible?\n */\n isOpen = false;\n\n /**\n * Wether the component is hovered.\n */\n isHover = false;\n\n /**\n * Override `Transition` options.\n */\n // @ts-ignore\n get $options() {\n const options = super.$options;\n\n options.leaveKeep = true;\n options.enterKeep = true;\n\n return options;\n }\n\n /**\n * Update tab indexes on mount.\n */\n mounted() {\n this.__updateTabIndexes('close');\n }\n\n /**\n * Set hover state.\n */\n onMouseenter() {\n this.isHover = true;\n }\n\n /**\n * Unset hover state.\n */\n onMouseleave() {\n this.isHover = false;\n }\n\n /**\n * Display the menu items.\n */\n open() {\n if (this.isOpen) {\n return;\n }\n\n // @todo Remove event listener when the close method is called.\n const clickOutsideHandler = (event) => {\n if (!this.$el.contains(event.target)) {\n document.removeEventListener('click', clickOutsideHandler);\n this.close();\n }\n };\n document.addEventListener('click', clickOutsideHandler);\n\n this.__updateTabIndexes('open');\n this.$el.setAttribute('aria-hidden', 'false');\n this.isOpen = true;\n this.enter();\n this.$emit('items-open');\n }\n\n /**\n * Hide the menu items.\n */\n close() {\n if (!this.isOpen) {\n return;\n }\n\n // Close child menu items.\n this.$children.MenuList.forEach((menuItem) => {\n menuItem.close();\n });\n\n if (\n document.activeElement instanceof HTMLElement &&\n this.$el.contains(document.activeElement)\n ) {\n document.activeElement.blur();\n }\n\n this.$el.setAttribute('aria-hidden', 'true');\n this.__updateTabIndexes('close');\n this.isOpen = false;\n this.leave();\n this.$emit('items-close');\n }\n\n /**\n * Toggle the menu items.\n */\n toggle() {\n if (this.isOpen) {\n this.close();\n } else {\n this.open();\n }\n }\n\n /**\n * Update `tabindex` attribute of child focusable elements.\n * @private\n */\n __updateTabIndexes(mode: 'open' | 'close' = 'open') {\n const focusableItems = Array.from(this.$el.querySelectorAll(FOCUSABLE_ELEMENTS)).filter(\n (item) => this.__filterFocusableItems(item as HTMLElement),\n );\n\n focusableItems.forEach((item) => {\n if (mode === 'close') {\n item.setAttribute('tabindex', '-1');\n } else {\n item.removeAttribute('tabindex');\n }\n });\n }\n\n /**\n * Filter out items which are inside a child `MenuList` instance.\n * @private\n */\n __filterFocusableItems(item: HTMLElement): boolean {\n let ancestor = item.parentElement;\n\n // @ts-ignore\n while (ancestor && (!ancestor.__base__ || !ancestor.__base__.has(this.constructor))) {\n ancestor = ancestor.parentElement;\n }\n\n return ancestor === null || ancestor === this.$el;\n }\n}\n"],
5
- "mappings": "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",
6
- "names": []
7
- }
@@ -1,23 +0,0 @@
1
- var __defProp = Object.defineProperty;
2
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
3
- var __getOwnPropNames = Object.getOwnPropertyNames;
4
- var __hasOwnProp = Object.prototype.hasOwnProperty;
5
- var __copyProps = (to, from, except, desc) => {
6
- if (from && typeof from === "object" || typeof from === "function") {
7
- for (let key of __getOwnPropNames(from))
8
- if (!__hasOwnProp.call(to, key) && key !== except)
9
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
10
- }
11
- return to;
12
- };
13
- var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
14
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
15
-
16
- // packages/ui/molecules/Menu/index.ts
17
- var Menu_exports = {};
18
- module.exports = __toCommonJS(Menu_exports);
19
- __reExport(Menu_exports, require("./Menu.cjs"), module.exports);
20
- __reExport(Menu_exports, require("./MenuBtn.cjs"), module.exports);
21
- __reExport(Menu_exports, require("./MenuList.cjs"), module.exports);
22
- if (module.exports.default) module.exports = module.exports.default;
23
- //# sourceMappingURL=index.cjs.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../packages/ui/molecules/Menu/index.ts"],
4
- "sourcesContent": ["export * from './Menu.js';\nexport * from './MenuBtn.js';\nexport * from './MenuList.js';\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;AAAA;AAAA;AAAA,yBAAc,uBAAd;AACA,yBAAc,0BADd;AAEA,yBAAc,2BAFd;",
6
- "names": []
7
- }
@@ -1,219 +0,0 @@
1
- var __defProp = Object.defineProperty;
2
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
3
- var __getOwnPropNames = Object.getOwnPropertyNames;
4
- var __hasOwnProp = Object.prototype.hasOwnProperty;
5
- var __export = (target, all) => {
6
- for (var name in all)
7
- __defProp(target, name, { get: all[name], enumerable: true });
8
- };
9
- var __copyProps = (to, from, except, desc) => {
10
- if (from && typeof from === "object" || typeof from === "function") {
11
- for (let key of __getOwnPropNames(from))
12
- if (!__hasOwnProp.call(to, key) && key !== except)
13
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
14
- }
15
- return to;
16
- };
17
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
18
-
19
- // packages/ui/molecules/Modal/Modal.ts
20
- var Modal_exports = {};
21
- __export(Modal_exports, {
22
- Modal: () => Modal
23
- });
24
- module.exports = __toCommonJS(Modal_exports);
25
- var import_js_toolkit = require("@studiometa/js-toolkit");
26
- var import_utils = require("@studiometa/js-toolkit/utils");
27
- var Modal = class extends import_js_toolkit.Base {
28
- /**
29
- * Config.
30
- */
31
- static config = {
32
- name: "Modal",
33
- refs: ["close[]", "container", "content", "modal", "open[]", "overlay"],
34
- emits: ["open", "close"],
35
- options: {
36
- move: String,
37
- autofocus: { type: String, default: "[autofocus]" },
38
- styles: {
39
- type: Object,
40
- default: () => ({
41
- modal: {
42
- closed: {
43
- opacity: "0",
44
- pointerEvents: "none",
45
- visibility: "hidden"
46
- }
47
- }
48
- })
49
- },
50
- scrollLock: {
51
- type: Boolean,
52
- default: true
53
- }
54
- }
55
- };
56
- /**
57
- * Wether the modal is open or not.
58
- */
59
- isOpen = false;
60
- /**
61
- * @private
62
- */
63
- __refsBackup;
64
- /**
65
- * @private
66
- */
67
- __refModalPlaceholder;
68
- /**
69
- * @private
70
- */
71
- __refModalParentBackup;
72
- /**
73
- * @private
74
- */
75
- __refModalUnbindGetRefFilter;
76
- /**
77
- * Open the modal on click on the `open` ref.
78
- */
79
- get onOpenClick() {
80
- return this.open;
81
- }
82
- /**
83
- * Close the modal on click on the `close` ref.
84
- */
85
- get onCloseClick() {
86
- return this.close;
87
- }
88
- /**
89
- * Close the modal on click on the `overlay` ref.
90
- * @returns {Function} The component's `close` method.
91
- */
92
- get onOverlayClick() {
93
- return this.close;
94
- }
95
- /**
96
- * Initialize the component's behaviours.
97
- */
98
- mounted() {
99
- this.isOpen = false;
100
- this.close();
101
- if (this.$options.move) {
102
- const target = document.querySelector(this.$options.move) || document.body;
103
- this.__refsBackup = this.$refs;
104
- this.__refModalPlaceholder = document.createComment("");
105
- this.__refModalParentBackup = this.$refs.modal.parentElement || this.$el;
106
- this.__refModalParentBackup.insertBefore(this.__refModalPlaceholder, this.$refs.modal);
107
- target.append(this.$refs.modal);
108
- }
109
- }
110
- /**
111
- * Add the moved refs to `this.$refs` when using the `move` options.
112
- */
113
- get $refs() {
114
- const $refs = super.$refs;
115
- if (this.$options.move && this.__refsBackup) {
116
- Object.entries(this.__refsBackup).forEach(([key, ref]) => {
117
- if (!$refs[key]) {
118
- $refs[key] = ref;
119
- }
120
- });
121
- }
122
- return $refs;
123
- }
124
- /**
125
- * Unbind all events on destroy.
126
- */
127
- destroyed() {
128
- this.close();
129
- if (this.$options.move && this.__refModalParentBackup) {
130
- this.__refModalParentBackup.insertBefore(this.$refs.modal, this.__refModalPlaceholder);
131
- this.__refModalPlaceholder.remove();
132
- delete this.__refModalPlaceholder;
133
- delete this.__refModalParentBackup;
134
- }
135
- return this;
136
- }
137
- /**
138
- * Close the modal on `ESC` and trap the tabulation.
139
- */
140
- keyed({ event, isUp, isDown, ESC }) {
141
- if (!this.isOpen) {
142
- return;
143
- }
144
- if (isDown) {
145
- (0, import_utils.trapFocus)(this.$refs.modal, event);
146
- }
147
- if (ESC && isUp) {
148
- this.close();
149
- }
150
- }
151
- /**
152
- * Open the modal.
153
- */
154
- async open() {
155
- if (this.isOpen) {
156
- return Promise.resolve();
157
- }
158
- this.$refs.modal.setAttribute("aria-hidden", "false");
159
- if (this.$options.scrollLock) {
160
- document.documentElement.style.overflow = "hidden";
161
- }
162
- this.isOpen = true;
163
- this.$emit("open");
164
- const refs = this.$refs;
165
- return Promise.all(
166
- Object.entries(this.$options.styles).map(
167
- ([refName, { open, active, closed } = { open: "", active: "", closed: "" }]) => (0, import_utils.transition)(
168
- refs[refName],
169
- {
170
- from: closed,
171
- active,
172
- to: open
173
- },
174
- "keep"
175
- )
176
- )
177
- ).then(() => {
178
- if (this.$options.autofocus && this.$refs.modal.querySelector(this.$options.autofocus)) {
179
- (0, import_utils.saveActiveElement)();
180
- const autofocusElement = this.$refs.modal.querySelector(
181
- this.$options.autofocus
182
- );
183
- autofocusElement.focus();
184
- }
185
- return Promise.resolve();
186
- });
187
- }
188
- /**
189
- * Close the modal.
190
- */
191
- async close() {
192
- if (!this.isOpen) {
193
- return Promise.resolve();
194
- }
195
- this.$refs.modal.setAttribute("aria-hidden", "true");
196
- if (this.$options.scrollLock) {
197
- document.documentElement.style.overflow = "";
198
- }
199
- this.isOpen = false;
200
- (0, import_utils.untrapFocus)();
201
- this.$emit("close");
202
- const refs = this.$refs;
203
- return Promise.all(
204
- Object.entries(this.$options.styles).map(
205
- ([refName, { open, active, closed } = { open: "", active: "", closed: "" }]) => (0, import_utils.transition)(
206
- refs[refName],
207
- {
208
- from: open,
209
- active,
210
- to: closed
211
- },
212
- "keep"
213
- )
214
- )
215
- ).then(() => Promise.resolve());
216
- }
217
- };
218
- if (module.exports.default) module.exports = module.exports.default;
219
- //# sourceMappingURL=Modal.cjs.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../packages/ui/molecules/Modal/Modal.ts"],
4
- "sourcesContent": ["import { Base, KeyServiceProps } from '@studiometa/js-toolkit';\nimport type { BaseProps, BaseConfig } from '@studiometa/js-toolkit';\nimport {\n transition,\n trapFocus as trap,\n untrapFocus as untrap,\n saveActiveElement,\n} from '@studiometa/js-toolkit/utils';\n\ntype ModalStates = Partial<\n Record<'open' | 'active' | 'closed', string | Partial<CSSStyleDeclaration>>\n>;\n// eslint-disable-next-line no-use-before-define\ntype ModalStylesOption = Partial<Record<keyof ModalProps['$refs'], ModalStates>>;\n\nexport interface ModalProps extends BaseProps {\n $refs: {\n close: HTMLElement[];\n container: HTMLElement;\n content: HTMLElement;\n modal: HTMLElement;\n open: HTMLElement[];\n overlay: HTMLElement;\n };\n $options: {\n /**\n * A selector where to move the modal to.\n */\n move: string;\n /**\n * A selector for the element to set the focus to when the modal opens.\n */\n autofocus: string;\n /**\n * Lock or allow scroll in the documentElement.\n */\n scrollLock: boolean;\n /**\n * The styles for the different state of the modal.\n */\n styles: ModalStylesOption;\n };\n}\n\n/**\n * Modal class.\n */\nexport class Modal<T extends BaseProps = BaseProps> extends Base<T & ModalProps> {\n /**\n * Config.\n */\n static config: BaseConfig = {\n name: 'Modal',\n refs: ['close[]', 'container', 'content', 'modal', 'open[]', 'overlay'],\n emits: ['open', 'close'],\n options: {\n move: String,\n autofocus: { type: String, default: '[autofocus]' },\n styles: {\n type: Object,\n default: (): ModalStylesOption => ({\n modal: {\n closed: {\n opacity: '0',\n pointerEvents: 'none',\n visibility: 'hidden',\n },\n },\n }),\n },\n scrollLock: {\n type: Boolean,\n default: true,\n },\n },\n };\n\n /**\n * Wether the modal is open or not.\n */\n isOpen = false;\n\n /**\n * @private\n */\n __refsBackup: (T & ModalProps)['$refs'];\n\n /**\n * @private\n */\n __refModalPlaceholder: Comment;\n\n /**\n * @private\n */\n __refModalParentBackup: HTMLElement;\n\n /**\n * @private\n */\n __refModalUnbindGetRefFilter: () => void;\n\n /**\n * Open the modal on click on the `open` ref.\n */\n get onOpenClick() {\n return this.open;\n }\n\n /**\n * Close the modal on click on the `close` ref.\n */\n get onCloseClick() {\n return this.close;\n }\n\n /**\n * Close the modal on click on the `overlay` ref.\n * @returns {Function} The component's `close` method.\n */\n get onOverlayClick() {\n return this.close;\n }\n\n /**\n * Initialize the component's behaviours.\n */\n mounted() {\n this.isOpen = false;\n this.close();\n\n if (this.$options.move) {\n const target = document.querySelector(this.$options.move) || document.body;\n\n this.__refsBackup = this.$refs;\n this.__refModalPlaceholder = document.createComment('');\n this.__refModalParentBackup = this.$refs.modal.parentElement || this.$el;\n this.__refModalParentBackup.insertBefore(this.__refModalPlaceholder, this.$refs.modal);\n\n target.append(this.$refs.modal);\n }\n }\n\n /**\n * Add the moved refs to `this.$refs` when using the `move` options.\n */\n get $refs() {\n const $refs = super.$refs;\n\n if (this.$options.move && this.__refsBackup) {\n Object.entries(this.__refsBackup).forEach(([key, ref]) => {\n if (!$refs[key]) {\n // @ts-ignore\n $refs[key] = ref;\n }\n });\n }\n\n return $refs;\n }\n\n /**\n * Unbind all events on destroy.\n */\n destroyed() {\n this.close();\n\n if (this.$options.move && this.__refModalParentBackup) {\n this.__refModalParentBackup.insertBefore(this.$refs.modal, this.__refModalPlaceholder);\n this.__refModalPlaceholder.remove();\n delete this.__refModalPlaceholder;\n delete this.__refModalParentBackup;\n }\n\n return this;\n }\n\n /**\n * Close the modal on `ESC` and trap the tabulation.\n */\n keyed({ event, isUp, isDown, ESC }: KeyServiceProps) {\n if (!this.isOpen) {\n return;\n }\n\n if (isDown) {\n trap(this.$refs.modal, event);\n }\n\n if (ESC && isUp) {\n this.close();\n }\n }\n\n /**\n * Open the modal.\n */\n async open() {\n if (this.isOpen) {\n return Promise.resolve();\n }\n\n this.$refs.modal.setAttribute('aria-hidden', 'false');\n\n if (this.$options.scrollLock) {\n document.documentElement.style.overflow = 'hidden';\n }\n\n this.isOpen = true;\n this.$emit('open');\n\n /** @type {ModalRefs} */\n const refs = this.$refs;\n\n return Promise.all(\n Object.entries(this.$options.styles).map(\n ([refName, { open, active, closed } = { open: '', active: '', closed: '' }]) =>\n transition(\n refs[refName],\n {\n from: closed,\n active,\n to: open,\n },\n 'keep',\n ),\n ),\n ).then(() => {\n if (this.$options.autofocus && this.$refs.modal.querySelector(this.$options.autofocus)) {\n saveActiveElement();\n const autofocusElement = this.$refs.modal.querySelector(\n this.$options.autofocus,\n ) as HTMLElement;\n autofocusElement.focus();\n }\n return Promise.resolve();\n });\n }\n\n /**\n * Close the modal.\n */\n async close() {\n if (!this.isOpen) {\n return Promise.resolve();\n }\n\n this.$refs.modal.setAttribute('aria-hidden', 'true');\n\n if (this.$options.scrollLock) {\n document.documentElement.style.overflow = '';\n }\n\n this.isOpen = false;\n untrap();\n this.$emit('close');\n\n const refs = this.$refs;\n\n return Promise.all(\n Object.entries(this.$options.styles).map(\n ([refName, { open, active, closed } = { open: '', active: '', closed: '' }]) =>\n transition(\n refs[refName],\n {\n from: open,\n active,\n to: closed,\n },\n 'keep',\n ),\n ),\n ).then(() => Promise.resolve());\n }\n}\n"],
5
- "mappings": "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",
6
- "names": ["trap", "untrap"]
7
- }
@@ -1,69 +0,0 @@
1
- var __defProp = Object.defineProperty;
2
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
3
- var __getOwnPropNames = Object.getOwnPropertyNames;
4
- var __hasOwnProp = Object.prototype.hasOwnProperty;
5
- var __export = (target, all) => {
6
- for (var name in all)
7
- __defProp(target, name, { get: all[name], enumerable: true });
8
- };
9
- var __copyProps = (to, from, except, desc) => {
10
- if (from && typeof from === "object" || typeof from === "function") {
11
- for (let key of __getOwnPropNames(from))
12
- if (!__hasOwnProp.call(to, key) && key !== except)
13
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
14
- }
15
- return to;
16
- };
17
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
18
-
19
- // packages/ui/molecules/Modal/ModalWithTransition.ts
20
- var ModalWithTransition_exports = {};
21
- __export(ModalWithTransition_exports, {
22
- ModalWithTransition: () => ModalWithTransition
23
- });
24
- module.exports = __toCommonJS(ModalWithTransition_exports);
25
- var import_Modal = require("./Modal.cjs");
26
- var ModalWithTransition = class extends import_Modal.Modal {
27
- /**
28
- * Modal options.
29
- */
30
- static config = {
31
- name: "ModalWithTransition",
32
- options: {
33
- styles: {
34
- type: Object,
35
- /**
36
- * @returns {ModalStylesOption}
37
- */
38
- default: () => ({
39
- modal: {
40
- closed: {
41
- opacity: "0",
42
- pointerEvents: "none"
43
- },
44
- active: "transition duration-500 ease-out-expo"
45
- },
46
- overlay: {
47
- closed: "opacity-0",
48
- active: "transition duration-500 ease-out-expo"
49
- },
50
- container: {
51
- closed: "transform scale-95 opacity-0",
52
- active: "transition duration-500 ease-out-expo"
53
- }
54
- })
55
- }
56
- }
57
- };
58
- open() {
59
- this.$refs.modal.style.visibility = "";
60
- return super.open();
61
- }
62
- async close() {
63
- await super.close();
64
- this.$refs.modal.style.visibility = "hidden";
65
- return Promise.resolve();
66
- }
67
- };
68
- if (module.exports.default) module.exports = module.exports.default;
69
- //# sourceMappingURL=ModalWithTransition.cjs.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../packages/ui/molecules/Modal/ModalWithTransition.ts"],
4
- "sourcesContent": ["import type { BaseProps, BaseConfig } from '@studiometa/js-toolkit';\nimport { Modal } from './Modal.js';\n\n/**\n * ModalWithTransition class.\n */\nexport class ModalWithTransition<T extends BaseProps = BaseProps> extends Modal<T> {\n /**\n * Modal options.\n */\n static config: BaseConfig = {\n name: 'ModalWithTransition',\n options: {\n styles: {\n type: Object,\n /**\n * @returns {ModalStylesOption}\n */\n default: () => ({\n modal: {\n closed: {\n opacity: '0',\n pointerEvents: 'none',\n },\n active: 'transition duration-500 ease-out-expo',\n },\n overlay: {\n closed: 'opacity-0',\n active: 'transition duration-500 ease-out-expo',\n },\n container: {\n closed: 'transform scale-95 opacity-0',\n active: 'transition duration-500 ease-out-expo',\n },\n }),\n },\n },\n };\n\n open() {\n this.$refs.modal.style.visibility = '';\n return super.open();\n }\n\n async close() {\n await super.close();\n this.$refs.modal.style.visibility = 'hidden';\n return Promise.resolve();\n }\n}\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAsB;AAKf,IAAM,sBAAN,cAAmE,mBAAS;AAAA;AAAA;AAAA;AAAA,EAIjF,OAAO,SAAqB;AAAA,IAC1B,MAAM;AAAA,IACN,SAAS;AAAA,MACP,QAAQ;AAAA,QACN,MAAM;AAAA;AAAA;AAAA;AAAA,QAIN,SAAS,OAAO;AAAA,UACd,OAAO;AAAA,YACL,QAAQ;AAAA,cACN,SAAS;AAAA,cACT,eAAe;AAAA,YACjB;AAAA,YACA,QAAQ;AAAA,UACV;AAAA,UACA,SAAS;AAAA,YACP,QAAQ;AAAA,YACR,QAAQ;AAAA,UACV;AAAA,UACA,WAAW;AAAA,YACT,QAAQ;AAAA,YACR,QAAQ;AAAA,UACV;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAAA,EAEA,OAAO;AACL,SAAK,MAAM,MAAM,MAAM,aAAa;AACpC,WAAO,MAAM,KAAK;AAAA,EACpB;AAAA,EAEA,MAAM,QAAQ;AACZ,UAAM,MAAM,MAAM;AAClB,SAAK,MAAM,MAAM,MAAM,aAAa;AACpC,WAAO,QAAQ,QAAQ;AAAA,EACzB;AACF;",
6
- "names": []
7
- }
@@ -1,22 +0,0 @@
1
- var __defProp = Object.defineProperty;
2
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
3
- var __getOwnPropNames = Object.getOwnPropertyNames;
4
- var __hasOwnProp = Object.prototype.hasOwnProperty;
5
- var __copyProps = (to, from, except, desc) => {
6
- if (from && typeof from === "object" || typeof from === "function") {
7
- for (let key of __getOwnPropNames(from))
8
- if (!__hasOwnProp.call(to, key) && key !== except)
9
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
10
- }
11
- return to;
12
- };
13
- var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
14
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
15
-
16
- // packages/ui/molecules/Modal/index.ts
17
- var Modal_exports = {};
18
- module.exports = __toCommonJS(Modal_exports);
19
- __reExport(Modal_exports, require("./Modal.cjs"), module.exports);
20
- __reExport(Modal_exports, require("./ModalWithTransition.cjs"), module.exports);
21
- if (module.exports.default) module.exports = module.exports.default;
22
- //# sourceMappingURL=index.cjs.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../packages/ui/molecules/Modal/index.ts"],
4
- "sourcesContent": ["export * from './Modal.js';\nexport * from './ModalWithTransition.js';\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;AAAA;AAAA;AAAA,0BAAc,wBAAd;AACA,0BAAc,sCADd;",
6
- "names": []
7
- }