@studiometa/js-toolkit 3.0.0-beta.2 → 3.0.0-beta.4

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 (195) hide show
  1. package/Base/managers/EventsManager.js +1 -1
  2. package/Base/managers/EventsManager.js.map +2 -2
  3. package/decorators/index.d.ts +1 -0
  4. package/decorators/index.js +1 -0
  5. package/decorators/index.js.map +2 -2
  6. package/decorators/withBreakpointObserver.js +0 -2
  7. package/decorators/withBreakpointObserver.js.map +2 -2
  8. package/decorators/withDrag.js +1 -1
  9. package/decorators/withDrag.js.map +2 -2
  10. package/decorators/withIntersectionObserver.js +0 -2
  11. package/decorators/withIntersectionObserver.js.map +2 -2
  12. package/decorators/withMountOnMediaQuery.js +0 -2
  13. package/decorators/withMountOnMediaQuery.js.map +2 -2
  14. package/decorators/withMountWhenInView.js +0 -2
  15. package/decorators/withMountWhenInView.js.map +2 -2
  16. package/decorators/withMutation.d.ts +13 -0
  17. package/decorators/withMutation.js +34 -0
  18. package/decorators/withMutation.js.map +7 -0
  19. package/decorators/withRelativePointer.js +1 -1
  20. package/decorators/withRelativePointer.js.map +2 -2
  21. package/decorators/withScrolledInView/withScrolledInView.js +1 -1
  22. package/decorators/withScrolledInView/withScrolledInView.js.map +2 -2
  23. package/helpers/createApp.d.ts +1 -1
  24. package/helpers/createApp.js +20 -1
  25. package/helpers/createApp.js.map +2 -2
  26. package/helpers/getClosestParent.d.ts +1 -1
  27. package/helpers/getClosestParent.js +2 -2
  28. package/helpers/getClosestParent.js.map +2 -2
  29. package/helpers/getInstanceFromElement.d.ts +1 -1
  30. package/helpers/getInstanceFromElement.js +1 -1
  31. package/helpers/getInstanceFromElement.js.map +2 -2
  32. package/helpers/importOnInteraction.d.ts +1 -1
  33. package/helpers/importOnInteraction.js +1 -1
  34. package/helpers/importOnInteraction.js.map +2 -2
  35. package/helpers/importOnMediaQuery.d.ts +1 -1
  36. package/helpers/importOnMediaQuery.js +1 -1
  37. package/helpers/importOnMediaQuery.js.map +2 -2
  38. package/helpers/importWhenIdle.d.ts +1 -1
  39. package/helpers/importWhenIdle.js +1 -1
  40. package/helpers/importWhenIdle.js.map +2 -2
  41. package/helpers/importWhenPrefersMotion.d.ts +1 -1
  42. package/helpers/importWhenPrefersMotion.js +2 -2
  43. package/helpers/importWhenPrefersMotion.js.map +2 -2
  44. package/helpers/importWhenVisible.d.ts +1 -1
  45. package/helpers/importWhenVisible.js +1 -1
  46. package/helpers/importWhenVisible.js.map +2 -2
  47. package/helpers/index.d.ts +8 -8
  48. package/helpers/index.js +8 -18
  49. package/helpers/index.js.map +3 -3
  50. package/package.json +1 -1
  51. package/services/AbstractService.d.ts +9 -9
  52. package/services/AbstractService.js +10 -10
  53. package/services/AbstractService.js.map +3 -3
  54. package/services/DragService.js +7 -2
  55. package/services/DragService.js.map +2 -2
  56. package/services/KeyService.js +1 -1
  57. package/services/KeyService.js.map +2 -2
  58. package/services/MutationService.d.ts +20 -0
  59. package/services/MutationService.js +34 -0
  60. package/services/MutationService.js.map +7 -0
  61. package/services/PointerService.js +1 -1
  62. package/services/PointerService.js.map +2 -2
  63. package/services/ResizeService.js +2 -2
  64. package/services/ResizeService.js.map +2 -2
  65. package/services/ScrollService.js +1 -1
  66. package/services/ScrollService.js.map +2 -2
  67. package/services/index.d.ts +1 -0
  68. package/services/index.js +1 -0
  69. package/services/index.js.map +2 -2
  70. package/tsconfig.build.tsbuildinfo +1 -1
  71. package/utils/cache.d.ts +4 -0
  72. package/utils/cache.js +18 -0
  73. package/utils/cache.js.map +7 -0
  74. package/utils/collide/boundingRectToCircle.d.ts +1 -1
  75. package/utils/collide/boundingRectToCircle.js +1 -1
  76. package/utils/collide/boundingRectToCircle.js.map +2 -2
  77. package/utils/collide/collideCircleCircle.d.ts +1 -1
  78. package/utils/collide/collideCircleCircle.js +1 -1
  79. package/utils/collide/collideCircleCircle.js.map +2 -2
  80. package/utils/collide/collideCircleRect.d.ts +1 -1
  81. package/utils/collide/collideCircleRect.js +1 -1
  82. package/utils/collide/collideCircleRect.js.map +2 -2
  83. package/utils/collide/collidePointCircle.d.ts +1 -1
  84. package/utils/collide/collidePointCircle.js +1 -1
  85. package/utils/collide/collidePointCircle.js.map +2 -2
  86. package/utils/collide/collidePointRect.d.ts +1 -1
  87. package/utils/collide/collidePointRect.js +1 -1
  88. package/utils/collide/collidePointRect.js.map +2 -2
  89. package/utils/collide/collideRectRect.d.ts +1 -1
  90. package/utils/collide/collideRectRect.js +1 -1
  91. package/utils/collide/collideRectRect.js.map +2 -2
  92. package/utils/collide/index.d.ts +6 -6
  93. package/utils/collide/index.js +12 -12
  94. package/utils/collide/index.js.map +3 -3
  95. package/utils/css/animate.js.map +2 -2
  96. package/utils/css/getOffsetSizes.d.ts +1 -1
  97. package/utils/css/getOffsetSizes.js +1 -1
  98. package/utils/css/getOffsetSizes.js.map +2 -2
  99. package/utils/css/index.d.ts +3 -3
  100. package/utils/css/index.js +6 -6
  101. package/utils/css/index.js.map +3 -3
  102. package/utils/css/matrix.d.ts +1 -1
  103. package/utils/css/matrix.js +1 -1
  104. package/utils/css/matrix.js.map +2 -2
  105. package/utils/css/transition.d.ts +1 -1
  106. package/utils/css/transition.js +2 -2
  107. package/utils/css/transition.js.map +2 -2
  108. package/utils/debounce.d.ts +1 -1
  109. package/utils/debounce.js +1 -1
  110. package/utils/debounce.js.map +2 -2
  111. package/utils/dom/createElement.d.ts +10 -0
  112. package/utils/dom/createElement.js +21 -0
  113. package/utils/dom/createElement.js.map +7 -0
  114. package/utils/dom/index.d.ts +1 -0
  115. package/utils/dom/index.js +1 -0
  116. package/utils/dom/index.js.map +2 -2
  117. package/utils/getComponentResolver.d.ts +1 -1
  118. package/utils/getComponentResolver.js +1 -1
  119. package/utils/getComponentResolver.js.map +2 -2
  120. package/utils/index.d.ts +6 -5
  121. package/utils/index.js +11 -10
  122. package/utils/index.js.map +3 -3
  123. package/utils/keyCodes.d.ts +1 -2
  124. package/utils/keyCodes.js +2 -2
  125. package/utils/keyCodes.js.map +2 -2
  126. package/utils/math/clamp.d.ts +1 -1
  127. package/utils/math/clamp.js +1 -1
  128. package/utils/math/clamp.js.map +2 -2
  129. package/utils/math/clamp01.d.ts +1 -1
  130. package/utils/math/clamp01.js +2 -2
  131. package/utils/math/clamp01.js.map +2 -2
  132. package/utils/math/damp.d.ts +1 -1
  133. package/utils/math/damp.js +1 -1
  134. package/utils/math/damp.js.map +2 -2
  135. package/utils/math/index.d.ts +7 -7
  136. package/utils/math/index.js +14 -14
  137. package/utils/math/index.js.map +3 -3
  138. package/utils/math/inertiaFinalValue.d.ts +1 -1
  139. package/utils/math/inertiaFinalValue.js +2 -2
  140. package/utils/math/inertiaFinalValue.js.map +2 -2
  141. package/utils/math/lerp.d.ts +1 -1
  142. package/utils/math/lerp.js +1 -1
  143. package/utils/math/lerp.js.map +2 -2
  144. package/utils/math/map.d.ts +1 -1
  145. package/utils/math/map.js +1 -1
  146. package/utils/math/map.js.map +2 -2
  147. package/utils/math/round.d.ts +1 -1
  148. package/utils/math/round.js +1 -1
  149. package/utils/math/round.js.map +2 -2
  150. package/utils/memoize.d.ts +1 -1
  151. package/utils/memoize.js +1 -1
  152. package/utils/memoize.js.map +2 -2
  153. package/utils/object/getAllProperties.d.ts +1 -1
  154. package/utils/object/getAllProperties.js +1 -1
  155. package/utils/object/getAllProperties.js.map +2 -2
  156. package/utils/string/index.d.ts +10 -10
  157. package/utils/string/index.js +10 -22
  158. package/utils/string/index.js.map +3 -3
  159. package/utils/string/withLeadingCharacters.d.ts +1 -1
  160. package/utils/string/withLeadingCharacters.js +2 -2
  161. package/utils/string/withLeadingCharacters.js.map +2 -2
  162. package/utils/string/withLeadingSlash.d.ts +1 -1
  163. package/utils/string/withLeadingSlash.js +2 -2
  164. package/utils/string/withLeadingSlash.js.map +2 -2
  165. package/utils/string/withTrailingCharacters.d.ts +1 -1
  166. package/utils/string/withTrailingCharacters.js +2 -2
  167. package/utils/string/withTrailingCharacters.js.map +2 -2
  168. package/utils/string/withTrailingSlash.d.ts +1 -1
  169. package/utils/string/withTrailingSlash.js +2 -2
  170. package/utils/string/withTrailingSlash.js.map +2 -2
  171. package/utils/string/withoutLeadingCharacters.d.ts +1 -1
  172. package/utils/string/withoutLeadingCharacters.js +1 -1
  173. package/utils/string/withoutLeadingCharacters.js.map +2 -2
  174. package/utils/string/withoutLeadingCharactersRecursive.d.ts +1 -1
  175. package/utils/string/withoutLeadingCharactersRecursive.js +2 -2
  176. package/utils/string/withoutLeadingCharactersRecursive.js.map +2 -2
  177. package/utils/string/withoutLeadingSlash.d.ts +1 -1
  178. package/utils/string/withoutLeadingSlash.js +2 -2
  179. package/utils/string/withoutLeadingSlash.js.map +2 -2
  180. package/utils/string/withoutTrailingCharacters.d.ts +1 -1
  181. package/utils/string/withoutTrailingCharacters.js +1 -1
  182. package/utils/string/withoutTrailingCharacters.js.map +2 -2
  183. package/utils/string/withoutTrailingCharactersRecursive.d.ts +1 -1
  184. package/utils/string/withoutTrailingCharactersRecursive.js +2 -2
  185. package/utils/string/withoutTrailingCharactersRecursive.js.map +2 -2
  186. package/utils/string/withoutTrailingSlash.d.ts +1 -1
  187. package/utils/string/withoutTrailingSlash.js +2 -2
  188. package/utils/string/withoutTrailingSlash.js.map +2 -2
  189. package/utils/throttle.d.ts +1 -1
  190. package/utils/throttle.js +1 -1
  191. package/utils/throttle.js.map +2 -2
  192. package/utils/trapFocus.js +1 -1
  193. package/utils/trapFocus.js.map +2 -2
  194. package/utils/tween.js +1 -1
  195. package/utils/tween.js.map +1 -1
@@ -2,6 +2,6 @@ function withoutTrailingCharacters(string, characters) {
2
2
  return string.replace(new RegExp(`${characters}$`), "");
3
3
  }
4
4
  export {
5
- withoutTrailingCharacters as default
5
+ withoutTrailingCharacters
6
6
  };
7
7
  //# sourceMappingURL=withoutTrailingCharacters.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../packages/js-toolkit/utils/string/withoutTrailingCharacters.ts"],
4
- "sourcesContent": ["/**\n * Remove the given characters from the end of the given string.\n *\n * @param {string} string The string to modify.\n * @param {string} characters The characters to remove from the end.\n * @returns {string}\n */\nexport default function withoutTrailingCharacters(string: string, characters: string): string {\n return string.replace(new RegExp(`${characters}$`), '');\n}\n"],
5
- "mappings": "AAOe,SAAR,0BAA2C,QAAgB,YAA4B;AAC5F,SAAO,OAAO,QAAQ,IAAI,OAAO,GAAG,UAAU,GAAG,GAAG,EAAE;AACxD;",
4
+ "sourcesContent": ["/**\n * Remove the given characters from the end of the given string.\n *\n * @param {string} string The string to modify.\n * @param {string} characters The characters to remove from the end.\n * @returns {string}\n */\nexport function withoutTrailingCharacters(string: string, characters: string): string {\n return string.replace(new RegExp(`${characters}$`), '');\n}\n"],
5
+ "mappings": "AAOO,SAAS,0BAA0B,QAAgB,YAA4B;AACpF,SAAO,OAAO,QAAQ,IAAI,OAAO,GAAG,UAAU,GAAG,GAAG,EAAE;AACxD;",
6
6
  "names": []
7
7
  }
@@ -5,4 +5,4 @@
5
5
  * @param {string} characters The characters to add to the start.
6
6
  * @returns {string}
7
7
  */
8
- export default function withoutTrailingCharactersRecursive(string: string, characters: string): string;
8
+ export declare function withoutTrailingCharactersRecursive(string: string, characters: string): string;
@@ -1,4 +1,4 @@
1
- import withoutTrailingCharacters from "./withoutTrailingCharacters.js";
1
+ import { withoutTrailingCharacters } from "./withoutTrailingCharacters.js";
2
2
  function withoutTrailingCharactersRecursive(string, characters) {
3
3
  let str = withoutTrailingCharacters(string, characters);
4
4
  const regex = new RegExp(`${characters}$`);
@@ -8,6 +8,6 @@ function withoutTrailingCharactersRecursive(string, characters) {
8
8
  return str;
9
9
  }
10
10
  export {
11
- withoutTrailingCharactersRecursive as default
11
+ withoutTrailingCharactersRecursive
12
12
  };
13
13
  //# sourceMappingURL=withoutTrailingCharactersRecursive.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../packages/js-toolkit/utils/string/withoutTrailingCharactersRecursive.ts"],
4
- "sourcesContent": ["import withoutTrailingCharacters from './withoutTrailingCharacters.js';\n\n/**\n * Remove the given characters to the start of the given string recursively.\n *\n * @param {string} string The string to modify.\n * @param {string} characters The characters to add to the start.\n * @returns {string}\n */\nexport default function withoutTrailingCharactersRecursive(\n string: string,\n characters: string,\n): string {\n let str = withoutTrailingCharacters(string, characters);\n const regex = new RegExp(`${characters}$`);\n\n while (regex.test(str)) {\n str = withoutTrailingCharacters(str, characters);\n }\n\n return str;\n}\n"],
5
- "mappings": "AAAA,OAAO,+BAA+B;AASvB,SAAR,mCACL,QACA,YACQ;AACR,MAAI,MAAM,0BAA0B,QAAQ,UAAU;AACtD,QAAM,QAAQ,IAAI,OAAO,GAAG,UAAU,GAAG;AAEzC,SAAO,MAAM,KAAK,GAAG,GAAG;AACtB,UAAM,0BAA0B,KAAK,UAAU;AAAA,EACjD;AAEA,SAAO;AACT;",
4
+ "sourcesContent": ["import { withoutTrailingCharacters } from './withoutTrailingCharacters.js';\n\n/**\n * Remove the given characters to the start of the given string recursively.\n *\n * @param {string} string The string to modify.\n * @param {string} characters The characters to add to the start.\n * @returns {string}\n */\nexport function withoutTrailingCharactersRecursive(string: string, characters: string): string {\n let str = withoutTrailingCharacters(string, characters);\n const regex = new RegExp(`${characters}$`);\n\n while (regex.test(str)) {\n str = withoutTrailingCharacters(str, characters);\n }\n\n return str;\n}\n"],
5
+ "mappings": "AAAA,SAAS,iCAAiC;AASnC,SAAS,mCAAmC,QAAgB,YAA4B;AAC7F,MAAI,MAAM,0BAA0B,QAAQ,UAAU;AACtD,QAAM,QAAQ,IAAI,OAAO,GAAG,UAAU,GAAG;AAEzC,SAAO,MAAM,KAAK,GAAG,GAAG;AACtB,UAAM,0BAA0B,KAAK,UAAU;AAAA,EACjD;AAEA,SAAO;AACT;",
6
6
  "names": []
7
7
  }
@@ -4,4 +4,4 @@
4
4
  * @param {string} string The string to modify.
5
5
  * @returns {string} The string without trailing slash.
6
6
  */
7
- export default function withoutTrailingSlash(string: string): string;
7
+ export declare function withoutTrailingSlash(string: string): string;
@@ -1,8 +1,8 @@
1
- import withoutTrailingCharacters from "./withoutTrailingCharacters.js";
1
+ import { withoutTrailingCharacters } from "./withoutTrailingCharacters.js";
2
2
  function withoutTrailingSlash(string) {
3
3
  return withoutTrailingCharacters(string, "/");
4
4
  }
5
5
  export {
6
- withoutTrailingSlash as default
6
+ withoutTrailingSlash
7
7
  };
8
8
  //# sourceMappingURL=withoutTrailingSlash.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../packages/js-toolkit/utils/string/withoutTrailingSlash.ts"],
4
- "sourcesContent": ["import withoutTrailingCharacters from './withoutTrailingCharacters.js';\n\n/**\n * Remove the trailing slash from a string.\n *\n * @param {string} string The string to modify.\n * @returns {string} The string without trailing slash.\n */\nexport default function withoutTrailingSlash(string: string): string {\n return withoutTrailingCharacters(string, '/');\n}\n"],
5
- "mappings": "AAAA,OAAO,+BAA+B;AAQvB,SAAR,qBAAsC,QAAwB;AACnE,SAAO,0BAA0B,QAAQ,GAAG;AAC9C;",
4
+ "sourcesContent": ["import { withoutTrailingCharacters } from './withoutTrailingCharacters.js';\n\n/**\n * Remove the trailing slash from a string.\n *\n * @param {string} string The string to modify.\n * @returns {string} The string without trailing slash.\n */\nexport function withoutTrailingSlash(string: string): string {\n return withoutTrailingCharacters(string, '/');\n}\n"],
5
+ "mappings": "AAAA,SAAS,iCAAiC;AAQnC,SAAS,qBAAqB,QAAwB;AAC3D,SAAO,0BAA0B,QAAQ,GAAG;AAC9C;",
6
6
  "names": []
7
7
  }
@@ -5,4 +5,4 @@
5
5
  * @param {number} [delay] The delay in ms
6
6
  * @returns {Function} The throttled function.
7
7
  */
8
- export default function throttle(fn: (...args: unknown[]) => void, delay?: number): (...args: unknown[]) => void;
8
+ export declare function throttle(fn: (...args: unknown[]) => void, delay?: number): (...args: unknown[]) => void;
package/utils/throttle.js CHANGED
@@ -10,6 +10,6 @@ function throttle(fn, delay = 16) {
10
10
  };
11
11
  }
12
12
  export {
13
- throttle as default
13
+ throttle
14
14
  };
15
15
  //# sourceMappingURL=throttle.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../packages/js-toolkit/utils/throttle.ts"],
4
- "sourcesContent": ["/**\n * Simple throttling helper that limits a function to only run once every {delay}ms.\n *\n * @param {Function} fn The function to throttle\n * @param {number} [delay] The delay in ms\n * @returns {Function} The throttled function.\n */\nexport default function throttle(\n fn: (...args: unknown[]) => void,\n delay = 16,\n): (...args: unknown[]) => void {\n let lastCall = 0;\n return function throttled(...args) {\n const now = Date.now();\n if (now - lastCall < delay) {\n return;\n }\n lastCall = now;\n // eslint-disable-next-line consistent-return\n return fn(...args);\n };\n}\n"],
5
- "mappings": "AAOe,SAAR,SACL,IACA,QAAQ,IACsB;AAC9B,MAAI,WAAW;AACf,SAAO,SAAS,aAAa,MAAM;AACjC,UAAM,MAAM,KAAK,IAAI;AACrB,QAAI,MAAM,WAAW,OAAO;AAC1B;AAAA,IACF;AACA,eAAW;AAEX,WAAO,GAAG,GAAG,IAAI;AAAA,EACnB;AACF;",
4
+ "sourcesContent": ["/**\n * Simple throttling helper that limits a function to only run once every {delay}ms.\n *\n * @param {Function} fn The function to throttle\n * @param {number} [delay] The delay in ms\n * @returns {Function} The throttled function.\n */\nexport function throttle(\n fn: (...args: unknown[]) => void,\n delay = 16,\n): (...args: unknown[]) => void {\n let lastCall = 0;\n return function throttled(...args) {\n const now = Date.now();\n if (now - lastCall < delay) {\n return;\n }\n lastCall = now;\n // eslint-disable-next-line consistent-return\n return fn(...args);\n };\n}\n"],
5
+ "mappings": "AAOO,SAAS,SACd,IACA,QAAQ,IACsB;AAC9B,MAAI,WAAW;AACf,SAAO,SAAS,aAAa,MAAM;AACjC,UAAM,MAAM,KAAK,IAAI;AACrB,QAAI,MAAM,WAAW,OAAO;AAC1B;AAAA,IACF;AACA,eAAW;AAEX,WAAO,GAAG,GAAG,IAAI;AAAA,EACnB;AACF;",
6
6
  "names": []
7
7
  }
@@ -1,4 +1,4 @@
1
- import keyCodes from "./keyCodes.js";
1
+ import { keyCodes } from "./keyCodes.js";
2
2
  import { isFunction } from "./is.js";
3
3
  const FOCUSABLE_ELEMENTS = [
4
4
  'a[href]:not([tabindex^="-"]):not([inert])',
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../packages/js-toolkit/utils/trapFocus.ts"],
4
- "sourcesContent": ["import keyCodes from './keyCodes.js';\nimport { isFunction } from './is.js';\n\nconst FOCUSABLE_ELEMENTS = [\n 'a[href]:not([tabindex^=\"-\"]):not([inert])',\n 'area[href]:not([tabindex^=\"-\"]):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([tabindex^=\"-\"]):not([inert])',\n 'audio:not([tabindex^=\"-\"]):not([inert])',\n 'video:not([tabindex^=\"-\"]):not([inert])',\n '[contenteditable]:not([tabindex^=\"-\"]):not([inert])',\n '[tabindex]:not([tabindex^=\"-\"]):not([inert])',\n];\n\nlet focusedBefore;\n\n/**\n * Save the current active element.\n */\nexport function saveActiveElement() {\n focusedBefore = document.activeElement;\n}\n\n/**\n * Trap tab navigation inside the given element.\n *\n * @param {HTMLElement} element The element in which to trap the tabulations.\n * @param {KeyboardEvent} event The keydown or keyup event.\n */\nexport function trapFocus(element: HTMLElement, event: KeyboardEvent) {\n if (event.keyCode !== keyCodes.TAB) {\n return;\n }\n\n // Save the previous focused element\n if (!focusedBefore) {\n focusedBefore = document.activeElement;\n }\n\n const focusableChildren: HTMLElement[] = Array.from(\n element.querySelectorAll(FOCUSABLE_ELEMENTS.join(', ')),\n ) as HTMLElement[];\n const focusedItemIndex =\n document.activeElement instanceof HTMLElement\n ? focusableChildren.indexOf(document.activeElement)\n : -1;\n\n if (!focusableChildren.length) {\n return;\n }\n\n if (focusedItemIndex < 0) {\n focusableChildren[0].focus();\n event.preventDefault();\n }\n\n // If the SHIFT key is being pressed while tabbing (moving backwards) and\n // the currently focused item is the first one, move the focus to the last\n // focusable item from the dialog element\n if (event.shiftKey && focusedItemIndex === 0) {\n focusableChildren.at(-1).focus();\n event.preventDefault();\n }\n\n // If the SHIFT key is not being pressed (moving forwards) and the currently\n // focused item is the last one, move the focus to the first focusable item\n // from the dialog element\n else if (!event.shiftKey && focusedItemIndex === focusableChildren.length - 1) {\n focusableChildren[0].focus();\n event.preventDefault();\n }\n}\n\n/**\n * Untrap the tab navigation.\n */\nexport function untrapFocus() {\n if (focusedBefore && isFunction(focusedBefore.focus)) {\n focusedBefore.focus();\n focusedBefore = null;\n }\n}\n"],
5
- "mappings": "AAAA,OAAO,cAAc;AACrB,SAAS,kBAAkB;AAE3B,MAAM,qBAAqB;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAEA,IAAI;AAKG,SAAS,oBAAoB;AAClC,kBAAgB,SAAS;AAC3B;AAQO,SAAS,UAAU,SAAsB,OAAsB;AACpE,MAAI,MAAM,YAAY,SAAS,KAAK;AAClC;AAAA,EACF;AAGA,MAAI,CAAC,eAAe;AAClB,oBAAgB,SAAS;AAAA,EAC3B;AAEA,QAAM,oBAAmC,MAAM;AAAA,IAC7C,QAAQ,iBAAiB,mBAAmB,KAAK,IAAI,CAAC;AAAA,EACxD;AACA,QAAM,mBACJ,SAAS,yBAAyB,cAC9B,kBAAkB,QAAQ,SAAS,aAAa,IAChD;AAEN,MAAI,CAAC,kBAAkB,QAAQ;AAC7B;AAAA,EACF;AAEA,MAAI,mBAAmB,GAAG;AACxB,sBAAkB,CAAC,EAAE,MAAM;AAC3B,UAAM,eAAe;AAAA,EACvB;AAKA,MAAI,MAAM,YAAY,qBAAqB,GAAG;AAC5C,sBAAkB,GAAG,EAAE,EAAE,MAAM;AAC/B,UAAM,eAAe;AAAA,EACvB,WAKS,CAAC,MAAM,YAAY,qBAAqB,kBAAkB,SAAS,GAAG;AAC7E,sBAAkB,CAAC,EAAE,MAAM;AAC3B,UAAM,eAAe;AAAA,EACvB;AACF;AAKO,SAAS,cAAc;AAC5B,MAAI,iBAAiB,WAAW,cAAc,KAAK,GAAG;AACpD,kBAAc,MAAM;AACpB,oBAAgB;AAAA,EAClB;AACF;",
4
+ "sourcesContent": ["import { keyCodes } from './keyCodes.js';\nimport { isFunction } from './is.js';\n\nconst FOCUSABLE_ELEMENTS = [\n 'a[href]:not([tabindex^=\"-\"]):not([inert])',\n 'area[href]:not([tabindex^=\"-\"]):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([tabindex^=\"-\"]):not([inert])',\n 'audio:not([tabindex^=\"-\"]):not([inert])',\n 'video:not([tabindex^=\"-\"]):not([inert])',\n '[contenteditable]:not([tabindex^=\"-\"]):not([inert])',\n '[tabindex]:not([tabindex^=\"-\"]):not([inert])',\n];\n\nlet focusedBefore;\n\n/**\n * Save the current active element.\n */\nexport function saveActiveElement() {\n focusedBefore = document.activeElement;\n}\n\n/**\n * Trap tab navigation inside the given element.\n *\n * @param {HTMLElement} element The element in which to trap the tabulations.\n * @param {KeyboardEvent} event The keydown or keyup event.\n */\nexport function trapFocus(element: HTMLElement, event: KeyboardEvent) {\n if (event.keyCode !== keyCodes.TAB) {\n return;\n }\n\n // Save the previous focused element\n if (!focusedBefore) {\n focusedBefore = document.activeElement;\n }\n\n const focusableChildren: HTMLElement[] = Array.from(\n element.querySelectorAll(FOCUSABLE_ELEMENTS.join(', ')),\n ) as HTMLElement[];\n const focusedItemIndex =\n document.activeElement instanceof HTMLElement\n ? focusableChildren.indexOf(document.activeElement)\n : -1;\n\n if (!focusableChildren.length) {\n return;\n }\n\n if (focusedItemIndex < 0) {\n focusableChildren[0].focus();\n event.preventDefault();\n }\n\n // If the SHIFT key is being pressed while tabbing (moving backwards) and\n // the currently focused item is the first one, move the focus to the last\n // focusable item from the dialog element\n if (event.shiftKey && focusedItemIndex === 0) {\n focusableChildren.at(-1).focus();\n event.preventDefault();\n }\n\n // If the SHIFT key is not being pressed (moving forwards) and the currently\n // focused item is the last one, move the focus to the first focusable item\n // from the dialog element\n else if (!event.shiftKey && focusedItemIndex === focusableChildren.length - 1) {\n focusableChildren[0].focus();\n event.preventDefault();\n }\n}\n\n/**\n * Untrap the tab navigation.\n */\nexport function untrapFocus() {\n if (focusedBefore && isFunction(focusedBefore.focus)) {\n focusedBefore.focus();\n focusedBefore = null;\n }\n}\n"],
5
+ "mappings": "AAAA,SAAS,gBAAgB;AACzB,SAAS,kBAAkB;AAE3B,MAAM,qBAAqB;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAEA,IAAI;AAKG,SAAS,oBAAoB;AAClC,kBAAgB,SAAS;AAC3B;AAQO,SAAS,UAAU,SAAsB,OAAsB;AACpE,MAAI,MAAM,YAAY,SAAS,KAAK;AAClC;AAAA,EACF;AAGA,MAAI,CAAC,eAAe;AAClB,oBAAgB,SAAS;AAAA,EAC3B;AAEA,QAAM,oBAAmC,MAAM;AAAA,IAC7C,QAAQ,iBAAiB,mBAAmB,KAAK,IAAI,CAAC;AAAA,EACxD;AACA,QAAM,mBACJ,SAAS,yBAAyB,cAC9B,kBAAkB,QAAQ,SAAS,aAAa,IAChD;AAEN,MAAI,CAAC,kBAAkB,QAAQ;AAC7B;AAAA,EACF;AAEA,MAAI,mBAAmB,GAAG;AACxB,sBAAkB,CAAC,EAAE,MAAM;AAC3B,UAAM,eAAe;AAAA,EACvB;AAKA,MAAI,MAAM,YAAY,qBAAqB,GAAG;AAC5C,sBAAkB,GAAG,EAAE,EAAE,MAAM;AAC/B,UAAM,eAAe;AAAA,EACvB,WAKS,CAAC,MAAM,YAAY,qBAAqB,kBAAkB,SAAS,GAAG;AAC7E,sBAAkB,CAAC,EAAE,MAAM;AAC3B,UAAM,eAAe;AAAA,EACvB;AACF;AAKO,SAAS,cAAc;AAC5B,MAAI,iBAAiB,WAAW,cAAc,KAAK,GAAG;AACpD,kBAAc,MAAM;AACpB,oBAAgB;AAAA,EAClB;AACF;",
6
6
  "names": []
7
7
  }
package/utils/tween.js CHANGED
@@ -2,7 +2,7 @@ import { cubicBezier } from "@motionone/easing";
2
2
  import { lerp, map, clamp01, damp, inertiaFinalValue } from "./math/index.js";
3
3
  import { isDefined, isArray, isNumber } from "./is.js";
4
4
  import { noop, noopValue as linear } from "./noop.js";
5
- import { useRaf } from "../services/index.js";
5
+ import { useRaf } from "../services/RafService.js";
6
6
  let id = 0;
7
7
  const DEFAULT_PROGRESS_PRECISION = 1e-4;
8
8
  function normalizeEase(ease) {
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../packages/js-toolkit/utils/tween.ts"],
4
- "sourcesContent": ["import { cubicBezier } from '@motionone/easing';\nimport { lerp, map, clamp01, damp, inertiaFinalValue } from './math/index.js';\nimport { isDefined, isArray, isNumber } from './is.js';\nimport { noop, noopValue as linear } from './noop.js';\nimport { useRaf } from '../services/index.js';\nimport type { EasingFunction } from './math/createEases.js';\n\nlet id = 0;\nconst DEFAULT_PROGRESS_PRECISION = 0.0001;\n\nexport type BezierCurve = [number, number, number, number];\n\n/**\n * Controls for a tween.\n */\nexport interface Tween {\n /**\n * Start the tween from the beginning.\n */\n start: () => void;\n /**\n * Finish the tween and set its state to the end.\n */\n finish: () => void;\n /**\n * Pause the tween.\n */\n pause: () => void;\n /**\n * Start the tween from the current paused progress.\n */\n play: () => void;\n /**\n * Set and get the tween's progress.\n */\n progress: (progress?: number) => number;\n}\n\nexport interface TweenOptions {\n /**\n * The duration, in seconds.\n * Defaults to `1`.\n */\n duration?: number;\n /**\n * The delay, in seconds.\n * Defaults to `0`.\n */\n delay?: number;\n /**\n * The easing function or bezier curve to use.\n * Defaults to a linear easing function.\n */\n easing?: EasingFunction | BezierCurve;\n /**\n * The smooth factor. Setting this option to `true` or a `number` will disable the `duration` option.\n */\n smooth?: true | number;\n /**\n * The precision for when to consider the tween finished.\n * Defaults to `0.0001`.\n */\n precision?: number;\n /**\n * A callback executed on start.\n */\n onStart?: (progress: number) => void;\n /**\n * A callback executed each time the progress is updated.\n */\n onProgress?: (progress: number) => void;\n /**\n * A callback executed when the tween is finished.\n */\n onFinish?: (progress: number) => void;\n}\n\n/**\n * Normalize a easing function with default fallbacks.\n */\nexport function normalizeEase(ease: EasingFunction | BezierCurve): EasingFunction {\n if (!isDefined(ease)) {\n return linear;\n }\n\n if (isArray(ease)) {\n return cubicBezier(...ease);\n }\n\n return ease;\n}\n\n/**\n * Tween from 0 to 1.\n */\nexport function tween(callback: (progress: number) => unknown, options: TweenOptions = {}): Tween {\n const raf = useRaf();\n\n let progressValue = 0;\n let easedProgress = 0;\n\n const isSmooth = isDefined(options.smooth) && (isNumber(options.smooth) || options.smooth);\n const smoothFactor = isNumber(options.smooth) ? options.smooth : 0.1;\n const precision = options.precision ?? DEFAULT_PROGRESS_PRECISION;\n const ease = normalizeEase(options.easing);\n\n let delay = options.delay ?? 0;\n delay *= 1000;\n let duration = options.duration ?? 1;\n duration *= 1000;\n\n /* eslint-disable @typescript-eslint/no-use-before-define */\n let startTime = getStartTime();\n let endTime = getEndTime(startTime);\n /* eslint-enable @typescript-eslint/no-use-before-define */\n\n const key = `tw-${id}`;\n id += 1;\n\n const { onStart = noop, onProgress = noop, onFinish = noop } = options;\n let isRunning = false;\n\n /**\n * Pause the animation.\n */\n function pause() {\n isRunning = false;\n raf.remove(key);\n }\n\n /**\n * Set the progress value.\n */\n function progress(newProgress: number) {\n if (!isDefined(newProgress)) {\n return easedProgress;\n }\n\n progressValue = newProgress;\n easedProgress = isSmooth\n ? damp(progressValue, easedProgress, smoothFactor, precision)\n : ease(progressValue);\n\n // Stop when reaching precision\n if (Math.abs(1 - easedProgress) < precision) {\n progressValue = 1;\n easedProgress = 1;\n }\n\n callback(easedProgress);\n onProgress(easedProgress);\n\n if (easedProgress === 1) {\n pause();\n requestAnimationFrame(() => onFinish(easedProgress));\n }\n\n return easedProgress;\n }\n\n /**\n * Loop for rendering the animation.\n */\n function tick(props: { time: number }) {\n progress(clamp01(map(props.time, startTime, endTime, 0, 1)));\n }\n\n function getStartTime() {\n return performance.now() + delay;\n }\n\n function getEndTime(time: number) {\n return isSmooth ? inertiaFinalValue(time, 1) : time + duration;\n }\n\n /**\n * Play the animation.\n */\n function start() {\n onStart(0);\n startTime = getStartTime();\n endTime = getEndTime(startTime);\n progressValue = 0;\n easedProgress = 0;\n isRunning = true;\n\n raf.add(key, tick);\n }\n\n /**\n * Play a paused animation.\n */\n function play() {\n if (isRunning) {\n return;\n }\n\n startTime = getStartTime() - lerp(0, duration, progressValue);\n endTime = getEndTime(startTime);\n isRunning = true;\n\n raf.add(key, tick);\n }\n\n return {\n start,\n finish: () => progress(1),\n pause,\n play,\n progress,\n };\n}\n"],
4
+ "sourcesContent": ["import { cubicBezier } from '@motionone/easing';\nimport { lerp, map, clamp01, damp, inertiaFinalValue } from './math/index.js';\nimport { isDefined, isArray, isNumber } from './is.js';\nimport { noop, noopValue as linear } from './noop.js';\nimport { useRaf } from '../services/RafService.js';\nimport type { EasingFunction } from './math/createEases.js';\n\nlet id = 0;\nconst DEFAULT_PROGRESS_PRECISION = 0.0001;\n\nexport type BezierCurve = [number, number, number, number];\n\n/**\n * Controls for a tween.\n */\nexport interface Tween {\n /**\n * Start the tween from the beginning.\n */\n start: () => void;\n /**\n * Finish the tween and set its state to the end.\n */\n finish: () => void;\n /**\n * Pause the tween.\n */\n pause: () => void;\n /**\n * Start the tween from the current paused progress.\n */\n play: () => void;\n /**\n * Set and get the tween's progress.\n */\n progress: (progress?: number) => number;\n}\n\nexport interface TweenOptions {\n /**\n * The duration, in seconds.\n * Defaults to `1`.\n */\n duration?: number;\n /**\n * The delay, in seconds.\n * Defaults to `0`.\n */\n delay?: number;\n /**\n * The easing function or bezier curve to use.\n * Defaults to a linear easing function.\n */\n easing?: EasingFunction | BezierCurve;\n /**\n * The smooth factor. Setting this option to `true` or a `number` will disable the `duration` option.\n */\n smooth?: true | number;\n /**\n * The precision for when to consider the tween finished.\n * Defaults to `0.0001`.\n */\n precision?: number;\n /**\n * A callback executed on start.\n */\n onStart?: (progress: number) => void;\n /**\n * A callback executed each time the progress is updated.\n */\n onProgress?: (progress: number) => void;\n /**\n * A callback executed when the tween is finished.\n */\n onFinish?: (progress: number) => void;\n}\n\n/**\n * Normalize a easing function with default fallbacks.\n */\nexport function normalizeEase(ease: EasingFunction | BezierCurve): EasingFunction {\n if (!isDefined(ease)) {\n return linear;\n }\n\n if (isArray(ease)) {\n return cubicBezier(...ease);\n }\n\n return ease;\n}\n\n/**\n * Tween from 0 to 1.\n */\nexport function tween(callback: (progress: number) => unknown, options: TweenOptions = {}): Tween {\n const raf = useRaf();\n\n let progressValue = 0;\n let easedProgress = 0;\n\n const isSmooth = isDefined(options.smooth) && (isNumber(options.smooth) || options.smooth);\n const smoothFactor = isNumber(options.smooth) ? options.smooth : 0.1;\n const precision = options.precision ?? DEFAULT_PROGRESS_PRECISION;\n const ease = normalizeEase(options.easing);\n\n let delay = options.delay ?? 0;\n delay *= 1000;\n let duration = options.duration ?? 1;\n duration *= 1000;\n\n /* eslint-disable @typescript-eslint/no-use-before-define */\n let startTime = getStartTime();\n let endTime = getEndTime(startTime);\n /* eslint-enable @typescript-eslint/no-use-before-define */\n\n const key = `tw-${id}`;\n id += 1;\n\n const { onStart = noop, onProgress = noop, onFinish = noop } = options;\n let isRunning = false;\n\n /**\n * Pause the animation.\n */\n function pause() {\n isRunning = false;\n raf.remove(key);\n }\n\n /**\n * Set the progress value.\n */\n function progress(newProgress: number) {\n if (!isDefined(newProgress)) {\n return easedProgress;\n }\n\n progressValue = newProgress;\n easedProgress = isSmooth\n ? damp(progressValue, easedProgress, smoothFactor, precision)\n : ease(progressValue);\n\n // Stop when reaching precision\n if (Math.abs(1 - easedProgress) < precision) {\n progressValue = 1;\n easedProgress = 1;\n }\n\n callback(easedProgress);\n onProgress(easedProgress);\n\n if (easedProgress === 1) {\n pause();\n requestAnimationFrame(() => onFinish(easedProgress));\n }\n\n return easedProgress;\n }\n\n /**\n * Loop for rendering the animation.\n */\n function tick(props: { time: number }) {\n progress(clamp01(map(props.time, startTime, endTime, 0, 1)));\n }\n\n function getStartTime() {\n return performance.now() + delay;\n }\n\n function getEndTime(time: number) {\n return isSmooth ? inertiaFinalValue(time, 1) : time + duration;\n }\n\n /**\n * Play the animation.\n */\n function start() {\n onStart(0);\n startTime = getStartTime();\n endTime = getEndTime(startTime);\n progressValue = 0;\n easedProgress = 0;\n isRunning = true;\n\n raf.add(key, tick);\n }\n\n /**\n * Play a paused animation.\n */\n function play() {\n if (isRunning) {\n return;\n }\n\n startTime = getStartTime() - lerp(0, duration, progressValue);\n endTime = getEndTime(startTime);\n isRunning = true;\n\n raf.add(key, tick);\n }\n\n return {\n start,\n finish: () => progress(1),\n pause,\n play,\n progress,\n };\n}\n"],
5
5
  "mappings": "AAAA,SAAS,mBAAmB;AAC5B,SAAS,MAAM,KAAK,SAAS,MAAM,yBAAyB;AAC5D,SAAS,WAAW,SAAS,gBAAgB;AAC7C,SAAS,MAAM,aAAa,cAAc;AAC1C,SAAS,cAAc;AAGvB,IAAI,KAAK;AACT,MAAM,6BAA6B;AAwE5B,SAAS,cAAc,MAAoD;AAChF,MAAI,CAAC,UAAU,IAAI,GAAG;AACpB,WAAO;AAAA,EACT;AAEA,MAAI,QAAQ,IAAI,GAAG;AACjB,WAAO,YAAY,GAAG,IAAI;AAAA,EAC5B;AAEA,SAAO;AACT;AAKO,SAAS,MAAM,UAAyC,UAAwB,CAAC,GAAU;AAChG,QAAM,MAAM,OAAO;AAEnB,MAAI,gBAAgB;AACpB,MAAI,gBAAgB;AAEpB,QAAM,WAAW,UAAU,QAAQ,MAAM,MAAM,SAAS,QAAQ,MAAM,KAAK,QAAQ;AACnF,QAAM,eAAe,SAAS,QAAQ,MAAM,IAAI,QAAQ,SAAS;AACjE,QAAM,YAAY,QAAQ,aAAa;AACvC,QAAM,OAAO,cAAc,QAAQ,MAAM;AAEzC,MAAI,QAAQ,QAAQ,SAAS;AAC7B,WAAS;AACT,MAAI,WAAW,QAAQ,YAAY;AACnC,cAAY;AAGZ,MAAI,YAAY,aAAa;AAC7B,MAAI,UAAU,WAAW,SAAS;AAGlC,QAAM,MAAM,MAAM,EAAE;AACpB,QAAM;AAEN,QAAM,EAAE,UAAU,MAAM,aAAa,MAAM,WAAW,KAAK,IAAI;AAC/D,MAAI,YAAY;AAKhB,WAAS,QAAQ;AACf,gBAAY;AACZ,QAAI,OAAO,GAAG;AAAA,EAChB;AAKA,WAAS,SAAS,aAAqB;AACrC,QAAI,CAAC,UAAU,WAAW,GAAG;AAC3B,aAAO;AAAA,IACT;AAEA,oBAAgB;AAChB,oBAAgB,WACZ,KAAK,eAAe,eAAe,cAAc,SAAS,IAC1D,KAAK,aAAa;AAGtB,QAAI,KAAK,IAAI,IAAI,aAAa,IAAI,WAAW;AAC3C,sBAAgB;AAChB,sBAAgB;AAAA,IAClB;AAEA,aAAS,aAAa;AACtB,eAAW,aAAa;AAExB,QAAI,kBAAkB,GAAG;AACvB,YAAM;AACN,4BAAsB,MAAM,SAAS,aAAa,CAAC;AAAA,IACrD;AAEA,WAAO;AAAA,EACT;AAKA,WAAS,KAAK,OAAyB;AACrC,aAAS,QAAQ,IAAI,MAAM,MAAM,WAAW,SAAS,GAAG,CAAC,CAAC,CAAC;AAAA,EAC7D;AAEA,WAAS,eAAe;AACtB,WAAO,YAAY,IAAI,IAAI;AAAA,EAC7B;AAEA,WAAS,WAAW,MAAc;AAChC,WAAO,WAAW,kBAAkB,MAAM,CAAC,IAAI,OAAO;AAAA,EACxD;AAKA,WAAS,QAAQ;AACf,YAAQ,CAAC;AACT,gBAAY,aAAa;AACzB,cAAU,WAAW,SAAS;AAC9B,oBAAgB;AAChB,oBAAgB;AAChB,gBAAY;AAEZ,QAAI,IAAI,KAAK,IAAI;AAAA,EACnB;AAKA,WAAS,OAAO;AACd,QAAI,WAAW;AACb;AAAA,IACF;AAEA,gBAAY,aAAa,IAAI,KAAK,GAAG,UAAU,aAAa;AAC5D,cAAU,WAAW,SAAS;AAC9B,gBAAY;AAEZ,QAAI,IAAI,KAAK,IAAI;AAAA,EACnB;AAEA,SAAO;AAAA,IACL;AAAA,IACA,QAAQ,MAAM,SAAS,CAAC;AAAA,IACxB;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
6
6
  "names": []
7
7
  }