@studiometa/js-toolkit 2.0.0-beta.9 → 2.0.0-rc.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (179) hide show
  1. package/Base/index.cjs +285 -0
  2. package/Base/index.d.ts +11 -2
  3. package/Base/index.js +114 -197
  4. package/Base/managers/ChildrenManager.cjs +146 -0
  5. package/Base/managers/ChildrenManager.d.ts +9 -1
  6. package/Base/managers/ChildrenManager.js +60 -59
  7. package/Base/managers/EventsManager.cjs +183 -0
  8. package/Base/managers/EventsManager.js +72 -112
  9. package/Base/managers/OptionsManager.cjs +174 -0
  10. package/Base/managers/OptionsManager.d.ts +9 -5
  11. package/Base/managers/OptionsManager.js +60 -90
  12. package/Base/managers/RefsManager.cjs +99 -0
  13. package/Base/managers/RefsManager.js +28 -38
  14. package/Base/managers/ServicesManager.cjs +131 -0
  15. package/Base/managers/ServicesManager.js +39 -67
  16. package/Base/utils.cjs +41 -0
  17. package/Base/utils.js +12 -11
  18. package/decorators/index.cjs +45 -0
  19. package/decorators/index.d.ts +1 -0
  20. package/decorators/index.js +20 -8
  21. package/decorators/withBreakpointManager.cjs +85 -0
  22. package/decorators/withBreakpointManager.js +18 -39
  23. package/decorators/withBreakpointObserver.cjs +115 -0
  24. package/decorators/withBreakpointObserver.js +44 -86
  25. package/decorators/withDrag.cjs +53 -0
  26. package/decorators/withDrag.js +24 -26
  27. package/decorators/withExtraConfig.cjs +43 -0
  28. package/decorators/withExtraConfig.js +17 -12
  29. package/decorators/withFreezedOptions.cjs +36 -0
  30. package/decorators/withFreezedOptions.d.ts +14 -0
  31. package/decorators/withFreezedOptions.js +14 -0
  32. package/decorators/withIntersectionObserver.cjs +62 -0
  33. package/decorators/withIntersectionObserver.js +29 -32
  34. package/decorators/withMountWhenInView.cjs +69 -0
  35. package/decorators/withMountWhenInView.js +31 -52
  36. package/decorators/withScrolledInView.cjs +114 -0
  37. package/decorators/withScrolledInView.js +35 -39
  38. package/decorators/withVue2.cjs +60 -0
  39. package/decorators/withVue2.js +26 -32
  40. package/helpers/createApp.cjs +52 -0
  41. package/helpers/createApp.d.ts +2 -2
  42. package/helpers/createApp.js +12 -12
  43. package/helpers/importOnInteraction.cjs +52 -0
  44. package/helpers/importOnInteraction.js +17 -18
  45. package/helpers/importWhenIdle.cjs +49 -0
  46. package/helpers/importWhenIdle.js +14 -17
  47. package/helpers/importWhenVisible.cjs +50 -0
  48. package/helpers/importWhenVisible.js +16 -18
  49. package/helpers/index.cjs +35 -0
  50. package/helpers/index.js +10 -4
  51. package/helpers/utils.cjs +35 -0
  52. package/helpers/utils.js +7 -6
  53. package/index.cjs +33 -0
  54. package/index.js +7 -4
  55. package/package.json +14 -4
  56. package/services/Service.cjs +76 -0
  57. package/services/Service.js +19 -32
  58. package/services/drag.cjs +213 -0
  59. package/services/drag.d.ts +1 -0
  60. package/services/drag.js +64 -68
  61. package/services/index.cjs +41 -0
  62. package/services/index.js +16 -7
  63. package/services/key.cjs +104 -0
  64. package/services/key.js +28 -36
  65. package/services/load.cjs +72 -0
  66. package/services/load.js +17 -19
  67. package/services/pointer.cjs +162 -0
  68. package/services/pointer.js +43 -60
  69. package/services/raf.cjs +83 -0
  70. package/services/raf.js +20 -28
  71. package/services/resize.cjs +108 -0
  72. package/services/resize.js +33 -42
  73. package/services/scroll.cjs +131 -0
  74. package/services/scroll.js +26 -35
  75. package/utils/collide/boundingRectToCircle.cjs +34 -0
  76. package/utils/collide/boundingRectToCircle.d.ts +1 -1
  77. package/utils/collide/boundingRectToCircle.js +7 -10
  78. package/utils/collide/collideCircleCircle.cjs +34 -0
  79. package/utils/collide/collideCircleCircle.js +8 -7
  80. package/utils/collide/collideCircleRect.cjs +46 -0
  81. package/utils/collide/collideCircleRect.js +10 -12
  82. package/utils/collide/collidePointCircle.cjs +31 -0
  83. package/utils/collide/collidePointCircle.js +8 -5
  84. package/utils/collide/collidePointRect.cjs +28 -0
  85. package/utils/collide/collidePointRect.js +5 -2
  86. package/utils/collide/collideRectRect.cjs +28 -0
  87. package/utils/collide/collideRectRect.js +5 -2
  88. package/utils/collide/index.cjs +39 -0
  89. package/utils/collide/index.js +14 -6
  90. package/utils/css/classes.cjs +47 -0
  91. package/utils/css/classes.d.ts +10 -9
  92. package/utils/css/classes.js +18 -14
  93. package/utils/css/index.cjs +38 -0
  94. package/utils/css/index.d.ts +2 -2
  95. package/utils/css/index.js +13 -6
  96. package/utils/css/matrix.cjs +30 -0
  97. package/utils/css/matrix.js +7 -5
  98. package/utils/css/styles.cjs +44 -0
  99. package/utils/css/styles.d.ts +6 -18
  100. package/utils/css/styles.js +12 -12
  101. package/utils/css/transition.cjs +120 -0
  102. package/utils/css/transition.d.ts +15 -9
  103. package/utils/css/transition.js +70 -119
  104. package/utils/debounce.cjs +34 -0
  105. package/utils/debounce.js +7 -9
  106. package/utils/focusTrap.cjs +82 -0
  107. package/utils/focusTrap.js +30 -21
  108. package/utils/history.cjs +89 -0
  109. package/utils/history.js +28 -57
  110. package/utils/index.cjs +54 -0
  111. package/utils/index.d.ts +4 -1
  112. package/utils/index.js +32 -11
  113. package/utils/keyCodes.cjs +35 -0
  114. package/utils/keyCodes.js +5 -2
  115. package/utils/math/clamp.cjs +28 -0
  116. package/utils/math/clamp.js +5 -2
  117. package/utils/math/clamp01.cjs +32 -0
  118. package/utils/math/clamp01.js +6 -3
  119. package/utils/math/damp.cjs +28 -0
  120. package/utils/math/damp.js +5 -4
  121. package/utils/math/ease.cjs +88 -0
  122. package/utils/math/ease.js +50 -25
  123. package/utils/math/index.cjs +43 -0
  124. package/utils/math/index.js +17 -8
  125. package/utils/math/inertiaFinalValue.cjs +37 -0
  126. package/utils/math/inertiaFinalValue.js +8 -10
  127. package/utils/math/lerp.cjs +28 -0
  128. package/utils/math/lerp.js +5 -2
  129. package/utils/math/map.cjs +28 -0
  130. package/utils/math/map.js +5 -2
  131. package/utils/math/round.cjs +28 -0
  132. package/utils/math/round.js +5 -3
  133. package/utils/memoize.cjs +43 -0
  134. package/utils/memoize.js +10 -19
  135. package/utils/nextFrame.cjs +38 -0
  136. package/utils/nextFrame.d.ts +4 -3
  137. package/utils/nextFrame.js +13 -10
  138. package/utils/nextMicrotask.cjs +28 -0
  139. package/utils/nextMicrotask.d.ts +8 -0
  140. package/utils/nextMicrotask.js +6 -0
  141. package/utils/nextTick.cjs +30 -0
  142. package/utils/nextTick.d.ts +8 -0
  143. package/utils/nextTick.js +8 -0
  144. package/utils/object/autoBind.cjs +49 -0
  145. package/utils/object/autoBind.js +12 -22
  146. package/utils/object/getAllProperties.cjs +37 -0
  147. package/utils/object/getAllProperties.js +10 -13
  148. package/utils/object/index.cjs +33 -0
  149. package/utils/object/index.js +8 -3
  150. package/utils/object/isObject.cjs +28 -0
  151. package/utils/object/isObject.js +6 -3
  152. package/utils/scrollTo.cjs +80 -0
  153. package/utils/scrollTo.js +20 -40
  154. package/utils/string/index.cjs +47 -0
  155. package/utils/string/index.js +22 -10
  156. package/utils/string/withLeadingCharacters.cjs +32 -0
  157. package/utils/string/withLeadingCharacters.js +7 -4
  158. package/utils/string/withLeadingSlash.cjs +32 -0
  159. package/utils/string/withLeadingSlash.js +7 -4
  160. package/utils/string/withTrailingCharacters.cjs +32 -0
  161. package/utils/string/withTrailingCharacters.js +7 -4
  162. package/utils/string/withTrailingSlash.cjs +32 -0
  163. package/utils/string/withTrailingSlash.js +7 -4
  164. package/utils/string/withoutLeadingCharacters.cjs +28 -0
  165. package/utils/string/withoutLeadingCharacters.js +6 -3
  166. package/utils/string/withoutLeadingCharactersRecursive.cjs +37 -0
  167. package/utils/string/withoutLeadingCharactersRecursive.js +8 -7
  168. package/utils/string/withoutLeadingSlash.cjs +32 -0
  169. package/utils/string/withoutLeadingSlash.js +7 -4
  170. package/utils/string/withoutTrailingCharacters.cjs +28 -0
  171. package/utils/string/withoutTrailingCharacters.js +6 -3
  172. package/utils/string/withoutTrailingCharactersRecursive.cjs +37 -0
  173. package/utils/string/withoutTrailingCharactersRecursive.js +8 -7
  174. package/utils/string/withoutTrailingSlash.cjs +32 -0
  175. package/utils/string/withoutTrailingSlash.js +7 -4
  176. package/utils/throttle.cjs +36 -0
  177. package/utils/throttle.js +9 -9
  178. package/index.modern.js +0 -1
  179. package/index.umd.js +0 -1
@@ -0,0 +1,44 @@
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __getProtoOf = Object.getPrototypeOf;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __export = (target, all) => {
8
+ for (var name in all)
9
+ __defProp(target, name, { get: all[name], enumerable: true });
10
+ };
11
+ var __copyProps = (to, from, except, desc) => {
12
+ if (from && typeof from === "object" || typeof from === "function") {
13
+ for (let key of __getOwnPropNames(from))
14
+ if (!__hasOwnProp.call(to, key) && key !== except)
15
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
16
+ }
17
+ return to;
18
+ };
19
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
20
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
21
+
22
+ // packages/js-toolkit/utils/css/styles.js
23
+ var styles_exports = {};
24
+ __export(styles_exports, {
25
+ add: () => add,
26
+ remove: () => remove
27
+ });
28
+ module.exports = __toCommonJS(styles_exports);
29
+ var import_isObject = __toESM(require("../object/isObject.cjs"), 1);
30
+ function setStyles(element, styles, method = "add") {
31
+ if (!element || !styles || !(0, import_isObject.default)(styles)) {
32
+ return;
33
+ }
34
+ Object.entries(styles).forEach(([prop, value]) => {
35
+ element.style[prop] = method === "add" ? value : "";
36
+ });
37
+ }
38
+ function add(element, styles) {
39
+ setStyles(element, styles);
40
+ }
41
+ function remove(element, styles) {
42
+ setStyles(element, styles, "remove");
43
+ }
44
+ if (module.exports.default) module.exports = module.exports.default;
@@ -1,28 +1,16 @@
1
- /**
2
- * @typedef {Record<string, string | null> & Partial<CSSStyleDeclaration>} CssStyleObject
3
- */
4
- /**
5
- * Manage a list of style properties on an element.
6
- *
7
- * @param {HTMLElement} element The element to update.
8
- * @param {CssStyleObject} styles An object of styles properties and values.
9
- * @param {String} method The method to use: add or remove.
10
- */
11
- export default function setStyles(element: HTMLElement, styles: CssStyleObject, method?: string): void;
12
1
  /**
13
2
  * Add styles to an element.
14
3
  *
15
- * @param {HTMLElement} element The element to update.
16
- * @param {CssStyleObject} styles A string of class names.
4
+ * @param {HTMLElement} element The element to update.
5
+ * @param {Partial<CSSStyleDeclaration>} styles A string of class names.
17
6
  * @return {void}
18
7
  */
19
- export function add(element: HTMLElement, styles: CssStyleObject): void;
8
+ export function add(element: HTMLElement, styles: Partial<CSSStyleDeclaration>): void;
20
9
  /**
21
10
  * Remove class names from an element.
22
11
  *
23
- * @param {HTMLElement} element The element to update.
24
- * @param {CssStyleObject} styles A string of class names.
12
+ * @param {HTMLElement} element The element to update.
13
+ * @param {Partial<CSSStyleDeclaration>} styles A string of class names.
25
14
  * @return {void}
26
15
  */
27
- export function remove(element: HTMLElement, styles: CssStyleObject): void;
28
- export type CssStyleObject = Record<string, string | null> & Partial<CSSStyleDeclaration>;
16
+ export function remove(element: HTMLElement, styles: Partial<CSSStyleDeclaration>): void;
@@ -1,19 +1,19 @@
1
- import isObject from '../object/isObject.js';
2
- export default function setStyles(element, styles) {
3
- var method = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'add';
4
-
1
+ import isObject from "../object/isObject.js";
2
+ function setStyles(element, styles, method = "add") {
5
3
  if (!element || !styles || !isObject(styles)) {
6
4
  return;
7
5
  }
8
-
9
- Object.entries(styles).forEach(_ref => {
10
- var [prop, value] = _ref;
11
- element.style[prop] = method === 'add' ? value : '';
6
+ Object.entries(styles).forEach(([prop, value]) => {
7
+ element.style[prop] = method === "add" ? value : "";
12
8
  });
13
9
  }
14
- export function add(element, styles) {
10
+ function add(element, styles) {
15
11
  setStyles(element, styles);
16
12
  }
17
- export function remove(element, styles) {
18
- setStyles(element, styles, 'remove');
19
- }
13
+ function remove(element, styles) {
14
+ setStyles(element, styles, "remove");
15
+ }
16
+ export {
17
+ add,
18
+ remove
19
+ };
@@ -0,0 +1,120 @@
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __getProtoOf = Object.getPrototypeOf;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __copyProps = (to, from, except, desc) => {
13
+ if (from && typeof from === "object" || typeof from === "function") {
14
+ for (let key of __getOwnPropNames(from))
15
+ if (!__hasOwnProp.call(to, key) && key !== except)
16
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
+ }
18
+ return to;
19
+ };
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
21
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
22
+ var __publicField = (obj, key, value) => {
23
+ __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
24
+ return value;
25
+ };
26
+
27
+ // packages/js-toolkit/utils/css/transition.js
28
+ var transition_exports = {};
29
+ __export(transition_exports, {
30
+ default: () => transition,
31
+ setClassesOrStyles: () => setClassesOrStyles
32
+ });
33
+ module.exports = __toCommonJS(transition_exports);
34
+ var import_nextFrame = __toESM(require("../nextFrame.cjs"), 1);
35
+ var classes = __toESM(require("./classes.cjs"), 1);
36
+ var styles = __toESM(require("./styles.cjs"), 1);
37
+ var cache = /* @__PURE__ */ new WeakMap();
38
+ var Transition = class {
39
+ constructor(element) {
40
+ __publicField(this, "isTransitioning", false);
41
+ __publicField(this, "transitionEndHandler", null);
42
+ cache.set(element, this);
43
+ }
44
+ static getInstance(element) {
45
+ let instance = cache.get(element);
46
+ if (!instance) {
47
+ instance = new this(element);
48
+ }
49
+ return instance;
50
+ }
51
+ };
52
+ function setClassesOrStyles(element, classesOrStyles, method = "add") {
53
+ if (typeof classesOrStyles === "string" || Array.isArray(classesOrStyles)) {
54
+ classes[method](element, classesOrStyles);
55
+ } else {
56
+ styles[method](element, classesOrStyles);
57
+ }
58
+ }
59
+ function testTransition(element) {
60
+ if (typeof window === "undefined") {
61
+ return false;
62
+ }
63
+ const { transitionDuration } = window.getComputedStyle(element);
64
+ return !!transitionDuration && transitionDuration !== "0s";
65
+ }
66
+ async function start(element, classesOrStyles) {
67
+ const trs = Transition.getInstance(element);
68
+ trs.isTransitioning = true;
69
+ setClassesOrStyles(element, classesOrStyles.from);
70
+ await (0, import_nextFrame.default)();
71
+ setClassesOrStyles(element, classesOrStyles.active);
72
+ await (0, import_nextFrame.default)();
73
+ }
74
+ async function next(element, classesOrStyles) {
75
+ const hasTransition = testTransition(element);
76
+ return new Promise(async (resolve) => {
77
+ if (hasTransition) {
78
+ const trs = Transition.getInstance(element);
79
+ trs.transitionEndHandler = resolve;
80
+ element.addEventListener("transitionend", trs.transitionEndHandler, false);
81
+ }
82
+ setClassesOrStyles(element, classesOrStyles.from, "remove");
83
+ setClassesOrStyles(element, classesOrStyles.to);
84
+ await (0, import_nextFrame.default)();
85
+ if (!hasTransition) {
86
+ resolve();
87
+ }
88
+ });
89
+ }
90
+ function end(element, classesOrStyles, mode = "remove") {
91
+ const trs = Transition.getInstance(element);
92
+ element.removeEventListener("transitionend", trs.transitionEndHandler, false);
93
+ if (mode === "remove") {
94
+ setClassesOrStyles(element, classesOrStyles.to, "remove");
95
+ }
96
+ setClassesOrStyles(element, classesOrStyles.active, "remove");
97
+ trs.isTransitioning = false;
98
+ trs.transitionEndHandler = null;
99
+ }
100
+ async function transition(element, name, endMode = "remove") {
101
+ const classesOrStyles = typeof name === "string" ? {
102
+ from: `${name}-from`,
103
+ active: `${name}-active`,
104
+ to: `${name}-to`
105
+ } : {
106
+ from: "",
107
+ active: "",
108
+ to: "",
109
+ ...name
110
+ };
111
+ const trs = Transition.getInstance(element);
112
+ if (trs.isTransitioning) {
113
+ end(element, classesOrStyles);
114
+ }
115
+ await start(element, classesOrStyles);
116
+ await next(element, classesOrStyles);
117
+ end(element, classesOrStyles, endMode);
118
+ return Promise.resolve();
119
+ }
120
+ if (module.exports.default) module.exports = module.exports.default;
@@ -1,20 +1,26 @@
1
1
  /**
2
2
  * Update either the classes or the styles of an element with the given method.
3
3
  *
4
- * @param {HTMLElement} element The element to update.
5
- * @param {String|Object} classesOrStyles The classes or styles to apply.
6
- * @param {String} method The method to use, one of `add` or `remove`.
4
+ * @param {HTMLElement} element The element to update.
5
+ * @param {ClassesOrStyles} classesOrStyles The classes or styles to apply.
6
+ * @param {'add'|'remove'} method The method to use, one of `add` or `remove`.
7
7
  */
8
- export function setClassesOrStyles(element: HTMLElement, classesOrStyles: string | any, method?: string): void;
8
+ export function setClassesOrStyles(element: HTMLElement, classesOrStyles: ClassesOrStyles, method?: 'add' | 'remove'): void;
9
9
  /**
10
10
  * Manage CSS transition with class.
11
11
  *
12
12
  * This is heavily inspired by the Vue `<transition>` component
13
13
  * and the `@barba/css` package, many thanks to them!
14
14
  *
15
- * @param {HTMLElement} element The target element.
16
- * @param {String|Object} name The name of the transition or an object with the hooks classesOrStyles.
17
- * @param {String} endMode Whether to remove or keep the `to` classes/styles
18
- * @return {Promise} A promise resolving at the end of the transition.
15
+ * @param {HTMLElement} element The target element.
16
+ * @param {string|TransitionStyles} name The name of the transition or an object with the hooks classesOrStyles.
17
+ * @param {String} endMode Whether to remove or keep the `to` classes/styles
18
+ * @return {Promise<void>} A promise resolving at the end of the transition.
19
19
  */
20
- export default function transition(element: HTMLElement, name: string | any, endMode?: string): Promise<any>;
20
+ export default function transition(element: HTMLElement, name: string | TransitionStyles, endMode?: string): Promise<void>;
21
+ export type ClassesOrStyles = string | string[] | Partial<CSSStyleDeclaration>;
22
+ export type TransitionStyles = {
23
+ from?: ClassesOrStyles;
24
+ active?: ClassesOrStyles;
25
+ to?: ClassesOrStyles;
26
+ };
@@ -1,145 +1,96 @@
1
- import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
2
- import _defineProperty from "@babel/runtime/helpers/defineProperty";
3
-
4
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
5
-
6
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
7
-
8
- import nextFrame from '../nextFrame.js';
9
- import * as classes from './classes.js';
10
- import * as styles from './styles.js';
11
- var cache = new WeakMap();
12
-
1
+ var __defProp = Object.defineProperty;
2
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
+ var __publicField = (obj, key, value) => {
4
+ __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
+ return value;
6
+ };
7
+ import nextFrame from "../nextFrame.js";
8
+ import * as classes from "./classes.js";
9
+ import * as styles from "./styles.js";
10
+ const cache = /* @__PURE__ */ new WeakMap();
13
11
  class Transition {
14
12
  constructor(element) {
15
- _defineProperty(this, "isTransitioning", false);
16
-
17
- _defineProperty(this, "transitionEndHandler", null);
18
-
13
+ __publicField(this, "isTransitioning", false);
14
+ __publicField(this, "transitionEndHandler", null);
19
15
  cache.set(element, this);
20
16
  }
21
-
22
17
  static getInstance(element) {
23
- var instance = cache.get(element);
24
-
18
+ let instance = cache.get(element);
25
19
  if (!instance) {
26
20
  instance = new this(element);
27
21
  }
28
-
29
22
  return instance;
30
23
  }
31
-
32
24
  }
33
-
34
- export function setClassesOrStyles(element, classesOrStyles) {
35
- var method = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'add';
36
-
37
- if (typeof classesOrStyles === 'string') {
38
- classes[method](element, classesOrStyles, method);
25
+ function setClassesOrStyles(element, classesOrStyles, method = "add") {
26
+ if (typeof classesOrStyles === "string" || Array.isArray(classesOrStyles)) {
27
+ classes[method](element, classesOrStyles);
39
28
  } else {
40
- styles[method](element, classesOrStyles, method);
29
+ styles[method](element, classesOrStyles);
41
30
  }
42
31
  }
43
-
44
32
  function testTransition(element) {
45
- if (typeof window === 'undefined') {
33
+ if (typeof window === "undefined") {
46
34
  return false;
47
35
  }
48
-
49
- var {
50
- transitionDuration
51
- } = window.getComputedStyle(element);
52
- return !!transitionDuration && transitionDuration !== '0s';
36
+ const { transitionDuration } = window.getComputedStyle(element);
37
+ return !!transitionDuration && transitionDuration !== "0s";
53
38
  }
54
-
55
- function start(_x, _x2) {
56
- return _start.apply(this, arguments);
39
+ async function start(element, classesOrStyles) {
40
+ const trs = Transition.getInstance(element);
41
+ trs.isTransitioning = true;
42
+ setClassesOrStyles(element, classesOrStyles.from);
43
+ await nextFrame();
44
+ setClassesOrStyles(element, classesOrStyles.active);
45
+ await nextFrame();
57
46
  }
58
-
59
- function _start() {
60
- _start = _asyncToGenerator(function* (element, classesOrStyles) {
61
- var trs = Transition.getInstance(element);
62
- trs.isTransitioning = true;
63
- setClassesOrStyles(element, classesOrStyles.from);
64
- yield nextFrame();
65
- setClassesOrStyles(element, classesOrStyles.active);
66
- yield nextFrame();
67
- });
68
- return _start.apply(this, arguments);
69
- }
70
-
71
- function next(_x3, _x4) {
72
- return _next.apply(this, arguments);
73
- }
74
-
75
- function _next() {
76
- _next = _asyncToGenerator(function* (element, classesOrStyles) {
77
- var hasTransition = testTransition(element);
78
- return new Promise(function () {
79
- var _ref = _asyncToGenerator(function* (resolve) {
80
- if (hasTransition) {
81
- var trs = Transition.getInstance(element);
82
- trs.transitionEndHandler = resolve;
83
- element.addEventListener('transitionend', trs.transitionEndHandler, false);
84
- }
85
-
86
- setClassesOrStyles(element, classesOrStyles.from, 'remove');
87
- setClassesOrStyles(element, classesOrStyles.to);
88
- yield nextFrame();
89
-
90
- if (!hasTransition) {
91
- resolve();
92
- }
93
- });
94
-
95
- return function (_x7) {
96
- return _ref.apply(this, arguments);
97
- };
98
- }());
47
+ async function next(element, classesOrStyles) {
48
+ const hasTransition = testTransition(element);
49
+ return new Promise(async (resolve) => {
50
+ if (hasTransition) {
51
+ const trs = Transition.getInstance(element);
52
+ trs.transitionEndHandler = resolve;
53
+ element.addEventListener("transitionend", trs.transitionEndHandler, false);
54
+ }
55
+ setClassesOrStyles(element, classesOrStyles.from, "remove");
56
+ setClassesOrStyles(element, classesOrStyles.to);
57
+ await nextFrame();
58
+ if (!hasTransition) {
59
+ resolve();
60
+ }
99
61
  });
100
- return _next.apply(this, arguments);
101
62
  }
102
-
103
- function end(element, classesOrStyles) {
104
- var mode = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'remove';
105
- var trs = Transition.getInstance(element);
106
- element.removeEventListener('transitionend', trs.transitionEndHandler, false);
107
-
108
- if (mode === 'remove') {
109
- setClassesOrStyles(element, classesOrStyles.to, 'remove');
63
+ function end(element, classesOrStyles, mode = "remove") {
64
+ const trs = Transition.getInstance(element);
65
+ element.removeEventListener("transitionend", trs.transitionEndHandler, false);
66
+ if (mode === "remove") {
67
+ setClassesOrStyles(element, classesOrStyles.to, "remove");
110
68
  }
111
-
112
- setClassesOrStyles(element, classesOrStyles.active, 'remove');
69
+ setClassesOrStyles(element, classesOrStyles.active, "remove");
113
70
  trs.isTransitioning = false;
114
71
  trs.transitionEndHandler = null;
115
72
  }
116
-
117
- export default function transition(_x5, _x6) {
118
- return _transition.apply(this, arguments);
73
+ async function transition(element, name, endMode = "remove") {
74
+ const classesOrStyles = typeof name === "string" ? {
75
+ from: `${name}-from`,
76
+ active: `${name}-active`,
77
+ to: `${name}-to`
78
+ } : {
79
+ from: "",
80
+ active: "",
81
+ to: "",
82
+ ...name
83
+ };
84
+ const trs = Transition.getInstance(element);
85
+ if (trs.isTransitioning) {
86
+ end(element, classesOrStyles);
87
+ }
88
+ await start(element, classesOrStyles);
89
+ await next(element, classesOrStyles);
90
+ end(element, classesOrStyles, endMode);
91
+ return Promise.resolve();
119
92
  }
120
-
121
- function _transition() {
122
- _transition = _asyncToGenerator(function* (element, name) {
123
- var endMode = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'remove';
124
- var classesOrStyles = typeof name === 'string' ? {
125
- from: "".concat(name, "-from"),
126
- active: "".concat(name, "-active"),
127
- to: "".concat(name, "-to")
128
- } : _objectSpread({
129
- from: '',
130
- active: '',
131
- to: ''
132
- }, name);
133
- var trs = Transition.getInstance(element);
134
-
135
- if (trs.isTransitioning) {
136
- end(element, classesOrStyles);
137
- }
138
-
139
- yield start(element, classesOrStyles);
140
- yield next(element, classesOrStyles);
141
- end(element, classesOrStyles, endMode);
142
- return Promise.resolve();
143
- });
144
- return _transition.apply(this, arguments);
145
- }
93
+ export {
94
+ transition as default,
95
+ setClassesOrStyles
96
+ };
@@ -0,0 +1,34 @@
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/js-toolkit/utils/debounce.js
20
+ var debounce_exports = {};
21
+ __export(debounce_exports, {
22
+ default: () => debounce
23
+ });
24
+ module.exports = __toCommonJS(debounce_exports);
25
+ function debounce(fn, delay = 300) {
26
+ let timeout;
27
+ return function debounced(...args) {
28
+ clearTimeout(timeout);
29
+ timeout = setTimeout(() => {
30
+ fn(...args);
31
+ }, delay);
32
+ };
33
+ }
34
+ if (module.exports.default) module.exports = module.exports.default;
package/utils/debounce.js CHANGED
@@ -1,14 +1,12 @@
1
- export default function debounce(fn) {
2
- var delay = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 300;
3
- var timeout;
4
- return function debounced() {
5
- for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
6
- args[_key] = arguments[_key];
7
- }
8
-
1
+ function debounce(fn, delay = 300) {
2
+ let timeout;
3
+ return function debounced(...args) {
9
4
  clearTimeout(timeout);
10
5
  timeout = setTimeout(() => {
11
6
  fn(...args);
12
7
  }, delay);
13
8
  };
14
- }
9
+ }
10
+ export {
11
+ debounce as default
12
+ };
@@ -0,0 +1,82 @@
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __getProtoOf = Object.getPrototypeOf;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __export = (target, all) => {
8
+ for (var name in all)
9
+ __defProp(target, name, { get: all[name], enumerable: true });
10
+ };
11
+ var __copyProps = (to, from, except, desc) => {
12
+ if (from && typeof from === "object" || typeof from === "function") {
13
+ for (let key of __getOwnPropNames(from))
14
+ if (!__hasOwnProp.call(to, key) && key !== except)
15
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
16
+ }
17
+ return to;
18
+ };
19
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
20
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
21
+
22
+ // packages/js-toolkit/utils/focusTrap.js
23
+ var focusTrap_exports = {};
24
+ __export(focusTrap_exports, {
25
+ default: () => useFocusTrap,
26
+ saveActiveElement: () => saveActiveElement,
27
+ trap: () => trap,
28
+ untrap: () => untrap
29
+ });
30
+ module.exports = __toCommonJS(focusTrap_exports);
31
+ var import_keyCodes = __toESM(require("./keyCodes.cjs"), 1);
32
+ var FOCUSABLE_ELEMENTS = [
33
+ 'a[href]:not([tabindex^="-"]):not([inert])',
34
+ 'area[href]:not([tabindex^="-"]):not([inert])',
35
+ "input:not([disabled]):not([inert])",
36
+ "select:not([disabled]):not([inert])",
37
+ "textarea:not([disabled]):not([inert])",
38
+ "button:not([disabled]):not([inert])",
39
+ 'iframe:not([tabindex^="-"]):not([inert])',
40
+ 'audio:not([tabindex^="-"]):not([inert])',
41
+ 'video:not([tabindex^="-"]):not([inert])',
42
+ '[contenteditable]:not([tabindex^="-"]):not([inert])',
43
+ '[tabindex]:not([tabindex^="-"]):not([inert])'
44
+ ];
45
+ var focusedBefore;
46
+ function saveActiveElement() {
47
+ focusedBefore = document.activeElement;
48
+ }
49
+ function trap(element, event) {
50
+ if (event.keyCode !== import_keyCodes.default.TAB) {
51
+ return;
52
+ }
53
+ if (!focusedBefore) {
54
+ focusedBefore = document.activeElement;
55
+ }
56
+ const focusableChildren = Array.from(element.querySelectorAll(FOCUSABLE_ELEMENTS.join(", ")));
57
+ const focusedItemIndex = document.activeElement instanceof HTMLElement ? focusableChildren.indexOf(document.activeElement) : -1;
58
+ if (!focusableChildren.length) {
59
+ return;
60
+ }
61
+ if (focusedItemIndex < 0) {
62
+ focusableChildren[0].focus();
63
+ event.preventDefault();
64
+ }
65
+ if (event.shiftKey && focusedItemIndex === 0) {
66
+ focusableChildren[focusableChildren.length - 1].focus();
67
+ event.preventDefault();
68
+ } else if (!event.shiftKey && focusedItemIndex === focusableChildren.length - 1) {
69
+ focusableChildren[0].focus();
70
+ event.preventDefault();
71
+ }
72
+ }
73
+ function untrap() {
74
+ if (focusedBefore && typeof focusedBefore.focus === "function") {
75
+ focusedBefore.focus();
76
+ focusedBefore = null;
77
+ }
78
+ }
79
+ function useFocusTrap() {
80
+ return { trap, untrap, saveActiveElement };
81
+ }
82
+ if (module.exports.default) module.exports = module.exports.default;