@studiometa/js-toolkit 3.6.0-beta.0 → 3.6.0-beta.1

package/services/RafService.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../packages/js-toolkit/services/RafService.ts"],
-  "sourcesContent": ["import type { ServiceInterface } from './AbstractService.js';\nimport { AbstractService } from './AbstractService.js';\nimport { domScheduler } from '../utils/scheduler.js';\nimport { isFunction } from '../utils/is.js';\n\nexport interface RafServiceProps {\n  time: DOMHighResTimeStamp;\n  delta: number;\n}\n\nexport type RafServiceInterface = ServiceInterface<RafServiceProps>;\n\nexport class RafService extends AbstractService<RafServiceProps> {\n  /**\n   * @private\n   */\n  isTicking = false;\n\n  /**\n   * @private\n   */\n  scheduler = domScheduler;\n\n  props: RafServiceProps = {\n    time: performance.now(),\n    delta: 0,\n  };\n\n  trigger(props: RafServiceProps) {\n    this.scheduler.read(() => {\n      const writeQueue: Array<(props: RafServiceProps) => unknown> = [];\n\n      for (const callback of this.callbacks.values()) {\n        const render = callback(props) as ((props: RafServiceProps) => unknown) | void;\n        if (isFunction(render)) {\n          writeQueue.push(render);\n        }\n      }\n\n      if (writeQueue.length > 0) {\n        this.scheduler.write(() => {\n          for (let i = 0; i < writeQueue.length; i++) {\n            writeQueue[i](props);\n          }\n        });\n      }\n    });\n  }\n\n  loop() {\n    const time = performance.now();\n    this.props.delta = time - this.props.time;\n    this.props.time = time;\n    this.trigger(this.props);\n\n    if (!this.isTicking) {\n      return;\n    }\n\n    requestAnimationFrame(() => this.loop());\n  }\n\n  init() {\n    this.isTicking = true;\n    requestAnimationFrame(() => this.loop());\n  }\n\n  kill() {\n    this.isTicking = false;\n  }\n}\n\n/**\n * Use the RequestAnimationFrame (raf) service.\n * @link https://js-toolkit.studiometa.dev/api/services/useRaf.html\n*/\nexport function useRaf(): RafServiceInterface {\n  return RafService.getInstance();\n}\n"],
+  "sourcesContent": ["import type { ServiceInterface } from './AbstractService.js';\nimport { AbstractService } from './AbstractService.js';\nimport { domScheduler } from '../utils/scheduler.js';\nimport { isFunction } from '../utils/is.js';\n\nexport interface RafServiceProps {\n  time: DOMHighResTimeStamp;\n  delta: number;\n}\n\nexport type RafServiceInterface = ServiceInterface<RafServiceProps>;\n\nexport class RafService extends AbstractService<RafServiceProps> {\n  /**\n   * @private\n   */\n  isTicking = false;\n\n  /**\n   * @private\n   */\n  scheduler = domScheduler;\n\n  props: RafServiceProps = {\n    time: performance.now(),\n    delta: 0,\n  };\n\n  trigger(props: RafServiceProps) {\n    this.scheduler.read(() => {\n      const writeQueue: Array<(props: RafServiceProps) => unknown> = [];\n\n      for (const callback of this.callbacks.values()) {\n        const render = callback(props) as ((props: RafServiceProps) => unknown) | void;\n        if (isFunction(render)) {\n          writeQueue.push(render);\n        }\n      }\n\n      if (writeQueue.length > 0) {\n        this.scheduler.write(() => {\n          for (let i = 0; i < writeQueue.length; i++) {\n            writeQueue[i](props);\n          }\n        });\n      }\n    });\n  }\n\n  loop() {\n    const time = performance.now();\n    this.props.delta = time - this.props.time;\n    this.props.time = time;\n    this.trigger(this.props);\n\n    if (!this.isTicking) {\n      return;\n    }\n\n    requestAnimationFrame(() => this.loop());\n  }\n\n  init() {\n    this.isTicking = true;\n    requestAnimationFrame(() => this.loop());\n  }\n\n  kill() {\n    this.isTicking = false;\n  }\n}\n\n/**\n * Use the RequestAnimationFrame (raf) service.\n * @link https://js-toolkit.studiometa.dev/api/services/useRaf.html\n */\nexport function useRaf(): RafServiceInterface {\n  return RafService.getInstance();\n}\n"],
   "mappings": "AACA,SAAS,uBAAuB;AAChC,SAAS,oBAAoB;AAC7B,SAAS,kBAAkB;AASpB,MAAM,mBAAmB,gBAAiC;AAAA;AAAA;AAAA;AAAA,EAI/D,YAAY;AAAA;AAAA;AAAA;AAAA,EAKZ,YAAY;AAAA,EAEZ,QAAyB;AAAA,IACvB,MAAM,YAAY,IAAI;AAAA,IACtB,OAAO;AAAA,EACT;AAAA,EAEA,QAAQ,OAAwB;AAC9B,SAAK,UAAU,KAAK,MAAM;AACxB,YAAM,aAAyD,CAAC;AAEhE,iBAAW,YAAY,KAAK,UAAU,OAAO,GAAG;AAC9C,cAAM,SAAS,SAAS,KAAK;AAC7B,YAAI,WAAW,MAAM,GAAG;AACtB,qBAAW,KAAK,MAAM;AAAA,QACxB;AAAA,MACF;AAEA,UAAI,WAAW,SAAS,GAAG;AACzB,aAAK,UAAU,MAAM,MAAM;AACzB,mBAAS,IAAI,GAAG,IAAI,WAAW,QAAQ,KAAK;AAC1C,uBAAW,CAAC,EAAE,KAAK;AAAA,UACrB;AAAA,QACF,CAAC;AAAA,MACH;AAAA,IACF,CAAC;AAAA,EACH;AAAA,EAEA,OAAO;AACL,UAAM,OAAO,YAAY,IAAI;AAC7B,SAAK,MAAM,QAAQ,OAAO,KAAK,MAAM;AACrC,SAAK,MAAM,OAAO;AAClB,SAAK,QAAQ,KAAK,KAAK;AAEvB,QAAI,CAAC,KAAK,WAAW;AACnB;AAAA,IACF;AAEA,0BAAsB,MAAM,KAAK,KAAK,CAAC;AAAA,EACzC;AAAA,EAEA,OAAO;AACL,SAAK,YAAY;AACjB,0BAAsB,MAAM,KAAK,KAAK,CAAC;AAAA,EACzC;AAAA,EAEA,OAAO;AACL,SAAK,YAAY;AAAA,EACnB;AACF;AAMO,SAAS,SAA8B;AAC5C,SAAO,WAAW,YAAY;AAChC;",
   "names": []
 }

package/services/ResizeService.d.ts

@@ -26,5 +26,5 @@ export declare class ResizeService<T extends Features['breakpoints'] = Features[
 /**
  * Use the resize service.
  * @link https://js-toolkit.studiometa.dev/api/services/useResize.html
-*/
+ */
 export declare function useResize<T extends Features['breakpoints'] = Features['breakpoints']>(breakpoints?: T): ResizeServiceInterface<T>;

package/services/ResizeService.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../packages/js-toolkit/services/ResizeService.ts"],
-  "sourcesContent": ["import type { ServiceConfig, ServiceInterface } from './AbstractService.js';\nimport { AbstractService } from './AbstractService.js';\nimport type { Features } from '../Base/features.js';\nimport { features } from '../Base/features.js';\nimport { debounce } from '../utils/debounce.js';\nimport { cache } from '../utils/cache.js';\n\nexport interface ResizeServiceProps<U extends Features['breakpoints'] = Features['breakpoints']> {\n  width: number;\n  height: number;\n  ratio: number;\n  orientation: 'square' | 'landscape' | 'portrait';\n  breakpoint: keyof U;\n  breakpoints: Array<keyof U>;\n  activeBreakpoints: Record<keyof U, boolean>;\n}\n\nexport type ResizeServiceInterface<U extends Features['breakpoints'] = Features['breakpoints']> =\n  ServiceInterface<ResizeServiceProps<U>>;\n\nexport class ResizeService<\n  T extends Features['breakpoints'] = Features['breakpoints'],\n> extends AbstractService<ResizeServiceProps<T>> {\n  static config: ServiceConfig = [[() => window, [['resize']]]];\n\n  breakpoints: T;\n\n  props: ResizeServiceProps<T> = {\n    width: window.innerWidth,\n    height: window.innerHeight,\n    ratio: window.innerWidth / window.innerHeight,\n    orientation: 'square',\n    get breakpoint() {\n      return Object.keys(this.activeBreakpoints)\n        .toReversed()\n        .find((name) => this.activeBreakpoints[name]);\n    },\n    get breakpoints() {\n      return Object.keys(this.activeBreakpoints);\n    },\n    activeBreakpoints: {} as Record<keyof T, boolean>,\n  };\n\n  constructor(breakpoints: T) {\n    super();\n    this.breakpoints = breakpoints;\n\n    Object.defineProperty(this.props, 'activeBreakpoints', {\n      get: () => {\n        const activeBreakpoints = {};\n\n        for (const [name, breakpoint] of Object.entries(\n          this.breakpoints ?? features.get('breakpoints'),\n        )) {\n          activeBreakpoints[name] = cache(\n            [this, window.innerWidth, window.innerHeight, breakpoint],\n            () => window.matchMedia(`(min-width: ${breakpoint})`).matches,\n          );\n        }\n\n        return activeBreakpoints as Record<keyof T, boolean>;\n      },\n    });\n  }\n\n  /**\n   * Update props.\n   */\n  updateProps(): ResizeServiceProps<T> {\n    const { props } = this;\n\n    props.width = window.innerWidth;\n    props.height = window.innerHeight;\n    props.ratio = window.innerWidth / window.innerHeight;\n    props.orientation = 'square';\n\n    if (props.ratio > 1) {\n      props.orientation = 'landscape';\n    }\n\n    if (props.ratio < 1) {\n      props.orientation = 'portrait';\n    }\n\n    return props;\n  }\n\n  onResizeDebounce = debounce(() => {\n    this.trigger(this.updateProps());\n  }, 100);\n\n  handleEvent() {\n    this.onResizeDebounce();\n  }\n}\n\n/**\n * Use the resize service.\n * @link https://js-toolkit.studiometa.dev/api/services/useResize.html\n*/\nexport function useResize<T extends Features['breakpoints'] = Features['breakpoints']>(\n  breakpoints?: T,\n): ResizeServiceInterface<T> {\n  return ResizeService.getInstance([breakpoints], breakpoints);\n}\n"],
+  "sourcesContent": ["import type { ServiceConfig, ServiceInterface } from './AbstractService.js';\nimport { AbstractService } from './AbstractService.js';\nimport type { Features } from '../Base/features.js';\nimport { features } from '../Base/features.js';\nimport { debounce } from '../utils/debounce.js';\nimport { cache } from '../utils/cache.js';\n\nexport interface ResizeServiceProps<U extends Features['breakpoints'] = Features['breakpoints']> {\n  width: number;\n  height: number;\n  ratio: number;\n  orientation: 'square' | 'landscape' | 'portrait';\n  breakpoint: keyof U;\n  breakpoints: Array<keyof U>;\n  activeBreakpoints: Record<keyof U, boolean>;\n}\n\nexport type ResizeServiceInterface<U extends Features['breakpoints'] = Features['breakpoints']> =\n  ServiceInterface<ResizeServiceProps<U>>;\n\nexport class ResizeService<\n  T extends Features['breakpoints'] = Features['breakpoints'],\n> extends AbstractService<ResizeServiceProps<T>> {\n  static config: ServiceConfig = [[() => window, [['resize']]]];\n\n  breakpoints: T;\n\n  props: ResizeServiceProps<T> = {\n    width: window.innerWidth,\n    height: window.innerHeight,\n    ratio: window.innerWidth / window.innerHeight,\n    orientation: 'square',\n    get breakpoint() {\n      return Object.keys(this.activeBreakpoints)\n        .toReversed()\n        .find((name) => this.activeBreakpoints[name]);\n    },\n    get breakpoints() {\n      return Object.keys(this.activeBreakpoints);\n    },\n    activeBreakpoints: {} as Record<keyof T, boolean>,\n  };\n\n  constructor(breakpoints: T) {\n    super();\n    this.breakpoints = breakpoints;\n\n    Object.defineProperty(this.props, 'activeBreakpoints', {\n      get: () => {\n        const activeBreakpoints = {};\n\n        for (const [name, breakpoint] of Object.entries(\n          this.breakpoints ?? features.get('breakpoints'),\n        )) {\n          activeBreakpoints[name] = cache(\n            [this, window.innerWidth, window.innerHeight, breakpoint],\n            () => window.matchMedia(`(min-width: ${breakpoint})`).matches,\n          );\n        }\n\n        return activeBreakpoints as Record<keyof T, boolean>;\n      },\n    });\n  }\n\n  /**\n   * Update props.\n   */\n  updateProps(): ResizeServiceProps<T> {\n    const { props } = this;\n\n    props.width = window.innerWidth;\n    props.height = window.innerHeight;\n    props.ratio = window.innerWidth / window.innerHeight;\n    props.orientation = 'square';\n\n    if (props.ratio > 1) {\n      props.orientation = 'landscape';\n    }\n\n    if (props.ratio < 1) {\n      props.orientation = 'portrait';\n    }\n\n    return props;\n  }\n\n  onResizeDebounce = debounce(() => {\n    this.trigger(this.updateProps());\n  }, 100);\n\n  handleEvent() {\n    this.onResizeDebounce();\n  }\n}\n\n/**\n * Use the resize service.\n * @link https://js-toolkit.studiometa.dev/api/services/useResize.html\n */\nexport function useResize<T extends Features['breakpoints'] = Features['breakpoints']>(\n  breakpoints?: T,\n): ResizeServiceInterface<T> {\n  return ResizeService.getInstance([breakpoints], breakpoints);\n}\n"],
   "mappings": "AACA,SAAS,uBAAuB;AAEhC,SAAS,gBAAgB;AACzB,SAAS,gBAAgB;AACzB,SAAS,aAAa;AAef,MAAM,sBAEH,gBAAuC;AAAA,EAC/C,OAAO,SAAwB,CAAC,CAAC,MAAM,QAAQ,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC;AAAA,EAE5D;AAAA,EAEA,QAA+B;AAAA,IAC7B,OAAO,OAAO;AAAA,IACd,QAAQ,OAAO;AAAA,IACf,OAAO,OAAO,aAAa,OAAO;AAAA,IAClC,aAAa;AAAA,IACb,IAAI,aAAa;AACf,aAAO,OAAO,KAAK,KAAK,iBAAiB,EACtC,WAAW,EACX,KAAK,CAAC,SAAS,KAAK,kBAAkB,IAAI,CAAC;AAAA,IAChD;AAAA,IACA,IAAI,cAAc;AAChB,aAAO,OAAO,KAAK,KAAK,iBAAiB;AAAA,IAC3C;AAAA,IACA,mBAAmB,CAAC;AAAA,EACtB;AAAA,EAEA,YAAY,aAAgB;AAC1B,UAAM;AACN,SAAK,cAAc;AAEnB,WAAO,eAAe,KAAK,OAAO,qBAAqB;AAAA,MACrD,KAAK,MAAM;AACT,cAAM,oBAAoB,CAAC;AAE3B,mBAAW,CAAC,MAAM,UAAU,KAAK,OAAO;AAAA,UACtC,KAAK,eAAe,SAAS,IAAI,aAAa;AAAA,QAChD,GAAG;AACD,4BAAkB,IAAI,IAAI;AAAA,YACxB,CAAC,MAAM,OAAO,YAAY,OAAO,aAAa,UAAU;AAAA,YACxD,MAAM,OAAO,WAAW,eAAe,UAAU,GAAG,EAAE;AAAA,UACxD;AAAA,QACF;AAEA,eAAO;AAAA,MACT;AAAA,IACF,CAAC;AAAA,EACH;AAAA;AAAA;AAAA;AAAA,EAKA,cAAqC;AACnC,UAAM,EAAE,MAAM,IAAI;AAElB,UAAM,QAAQ,OAAO;AACrB,UAAM,SAAS,OAAO;AACtB,UAAM,QAAQ,OAAO,aAAa,OAAO;AACzC,UAAM,cAAc;AAEpB,QAAI,MAAM,QAAQ,GAAG;AACnB,YAAM,cAAc;AAAA,IACtB;AAEA,QAAI,MAAM,QAAQ,GAAG;AACnB,YAAM,cAAc;AAAA,IACtB;AAEA,WAAO;AAAA,EACT;AAAA,EAEA,mBAAmB,SAAS,MAAM;AAChC,SAAK,QAAQ,KAAK,YAAY,CAAC;AAAA,EACjC,GAAG,GAAG;AAAA,EAEN,cAAc;AACZ,SAAK,iBAAiB;AAAA,EACxB;AACF;AAMO,SAAS,UACd,aAC2B;AAC3B,SAAO,cAAc,YAAY,CAAC,WAAW,GAAG,WAAW;AAC7D;",
   "names": []
 }

package/services/ScrollService.d.ts

@@ -83,5 +83,5 @@ export declare class ScrollService extends AbstractService<ScrollServiceProps> {
  * props();
  * ```
  * @link https://js-toolkit.studiometa.dev/api/services/useScroll.html
-*/
+ */
 export declare function useScroll(): ScrollServiceInterface;

package/services/ScrollService.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../packages/js-toolkit/services/ScrollService.ts"],
-  "sourcesContent": ["import type { ServiceConfig, ServiceInterface } from './AbstractService.js';\nimport { AbstractService } from './AbstractService.js';\nimport { debounce } from '../utils/debounce.js';\nimport { PASSIVE_CAPTURE_EVENT_OPTIONS } from './utils.js';\nimport { nextTick } from '../utils/nextTick.js';\n\nexport interface ScrollServiceProps {\n  x: number;\n  y: number;\n  changed: { x: boolean; y: boolean };\n  changedX: boolean;\n  changedY: boolean;\n  last: { x: number; y: number };\n  lastX: number;\n  lastY: number;\n  delta: { x: number; y: number };\n  deltaX: number;\n  deltaY: number;\n  progress: { x: number; y: number };\n  progressX: number;\n  progressY: number;\n  max: { x: number; y: number };\n  maxX: number;\n  maxY: number;\n  direction: { x: 'LEFT' | 'RIGHT' | 'NONE'; y: 'UP' | 'DOWN' | 'NONE' };\n  isUp: boolean;\n  isRight: boolean;\n  isDown: boolean;\n  isLeft: boolean;\n}\n\nexport type ScrollServiceInterface = ServiceInterface<ScrollServiceProps>;\n\nexport class ScrollService extends AbstractService<ScrollServiceProps> {\n  static config: ServiceConfig = [\n    [() => document, [['scroll', PASSIVE_CAPTURE_EVENT_OPTIONS]]],\n    [() => window, [['resize', PASSIVE_CAPTURE_EVENT_OPTIONS]]],\n  ];\n\n  /**\n   * Cached scroll max values, updated on resize and first scroll.\n   * @private\n   */\n  __maxX: number | null = null;\n  __maxY: number | null = null;\n\n  /**\n   * Observe scroll container size changes that do not trigger window resize.\n   * @private\n   */\n  __resizeObserver: ResizeObserver | null = null;\n\n  props: ScrollServiceProps = {\n    x: window.scrollX,\n    y: window.scrollY,\n    changed: {\n      x: false,\n      y: false,\n    },\n    changedX: false,\n    changedY: false,\n    last: {\n      x: window.scrollX,\n      y: window.scrollY,\n    },\n    lastX: window.scrollX,\n    lastY: window.scrollY,\n    delta: {\n      x: 0,\n      y: 0,\n    },\n    deltaX: 0,\n    deltaY: 0,\n    max: {\n      x: document.scrollingElement.scrollWidth - window.innerWidth,\n      y: document.scrollingElement.scrollHeight - window.innerHeight,\n    },\n    maxX: document.scrollingElement.scrollWidth - window.innerWidth,\n    maxY: document.scrollingElement.scrollHeight - window.innerHeight,\n    progress: {\n      x: 0,\n      y: 0,\n    },\n    progressX: 0,\n    progressY: 0,\n    direction: {\n      x: 'NONE',\n      y: 'NONE',\n    },\n    isUp: false,\n    isRight: false,\n    isDown: false,\n    isLeft: false,\n  };\n\n  updateProps(): ScrollServiceProps {\n    const { props } = this;\n    const yLast = props.y;\n    const xLast = props.x;\n\n    props.y = window.scrollY;\n    props.x = window.scrollX;\n    props.changed.x = props.changedX = props.x !== xLast;\n    props.changed.y = props.changedY = props.y !== yLast;\n    props.last.x = props.lastX = xLast;\n    props.last.y = props.lastY = yLast;\n    props.delta.x = props.deltaX = props.x - xLast;\n    props.delta.y = props.deltaY = props.y - yLast;\n    if (this.__maxX === null || this.__maxY === null) {\n      this.__updateMaxValues();\n    }\n    props.max.x = props.maxX = this.__maxX;\n    props.max.y = props.maxY = this.__maxY;\n    props.progress.x = props.progressX = props.max.x === 0 ? 1 : props.x / props.max.x;\n    props.progress.y = props.progressY = props.max.y === 0 ? 1 : props.y / props.max.y;\n    props.isUp = props.y < yLast;\n    props.isRight = props.x > xLast;\n    props.isDown = props.y > yLast;\n    props.isLeft = props.x < xLast;\n    /* eslint-disable no-nested-ternary */\n    props.direction.x = props.isRight ? 'RIGHT' : props.isLeft ? 'LEFT' : 'NONE';\n    props.direction.y = props.isDown ? 'DOWN' : props.isUp ? 'UP' : 'NONE';\n    /* eslint-enable no-nested-ternary */\n\n    return props;\n  }\n\n  update(trigger = true) {\n    nextTick(() => this.updateProps()).then(() => {\n      if (trigger) {\n        this.trigger(this.props);\n      }\n    });\n  }\n\n  onScrollDebounced = debounce(() => {\n    this.update();\n  }, 100);\n\n  /**\n   * Update cached max scroll values on resize.\n   * @private\n   */\n  __updateMaxValues() {\n    this.__maxX = document.scrollingElement.scrollWidth - window.innerWidth;\n    this.__maxY = document.scrollingElement.scrollHeight - window.innerHeight;\n  }\n\n  /**\n   * Scroll and resize handler.\n   */\n  handleEvent(event: Event) {\n    if (event.type === 'resize') {\n      this.__updateMaxValues();\n      this.update(false);\n      return;\n    }\n\n    this.update();\n    this.onScrollDebounced();\n  }\n\n  init() {\n    super.init();\n\n    if (typeof ResizeObserver === 'function' && document.scrollingElement) {\n      this.__resizeObserver = new ResizeObserver(() => {\n        this.__updateMaxValues();\n      });\n      this.__resizeObserver.observe(document.scrollingElement);\n    }\n  }\n\n  kill() {\n    this.__resizeObserver?.disconnect();\n    this.__resizeObserver = null;\n    super.kill();\n  }\n}\n\n/**\n * Use the scroll service.\n *\n * ```js\n * import { useScroll } from '@studiometa/js-toolkit/services';\n * const { add, remove, props } = useScroll();\n * add(key, (props) => {});\n * remove(key);\n * props();\n * ```\n * @link https://js-toolkit.studiometa.dev/api/services/useScroll.html\n*/\nexport function useScroll(): ScrollServiceInterface {\n  return ScrollService.getInstance();\n}\n"],
+  "sourcesContent": ["import type { ServiceConfig, ServiceInterface } from './AbstractService.js';\nimport { AbstractService } from './AbstractService.js';\nimport { debounce } from '../utils/debounce.js';\nimport { PASSIVE_CAPTURE_EVENT_OPTIONS } from './utils.js';\nimport { nextTick } from '../utils/nextTick.js';\n\nexport interface ScrollServiceProps {\n  x: number;\n  y: number;\n  changed: { x: boolean; y: boolean };\n  changedX: boolean;\n  changedY: boolean;\n  last: { x: number; y: number };\n  lastX: number;\n  lastY: number;\n  delta: { x: number; y: number };\n  deltaX: number;\n  deltaY: number;\n  progress: { x: number; y: number };\n  progressX: number;\n  progressY: number;\n  max: { x: number; y: number };\n  maxX: number;\n  maxY: number;\n  direction: { x: 'LEFT' | 'RIGHT' | 'NONE'; y: 'UP' | 'DOWN' | 'NONE' };\n  isUp: boolean;\n  isRight: boolean;\n  isDown: boolean;\n  isLeft: boolean;\n}\n\nexport type ScrollServiceInterface = ServiceInterface<ScrollServiceProps>;\n\nexport class ScrollService extends AbstractService<ScrollServiceProps> {\n  static config: ServiceConfig = [\n    [() => document, [['scroll', PASSIVE_CAPTURE_EVENT_OPTIONS]]],\n    [() => window, [['resize', PASSIVE_CAPTURE_EVENT_OPTIONS]]],\n  ];\n\n  /**\n   * Cached scroll max values, updated on resize and first scroll.\n   * @private\n   */\n  __maxX: number | null = null;\n  __maxY: number | null = null;\n\n  /**\n   * Observe scroll container size changes that do not trigger window resize.\n   * @private\n   */\n  __resizeObserver: ResizeObserver | null = null;\n\n  props: ScrollServiceProps = {\n    x: window.scrollX,\n    y: window.scrollY,\n    changed: {\n      x: false,\n      y: false,\n    },\n    changedX: false,\n    changedY: false,\n    last: {\n      x: window.scrollX,\n      y: window.scrollY,\n    },\n    lastX: window.scrollX,\n    lastY: window.scrollY,\n    delta: {\n      x: 0,\n      y: 0,\n    },\n    deltaX: 0,\n    deltaY: 0,\n    max: {\n      x: document.scrollingElement.scrollWidth - window.innerWidth,\n      y: document.scrollingElement.scrollHeight - window.innerHeight,\n    },\n    maxX: document.scrollingElement.scrollWidth - window.innerWidth,\n    maxY: document.scrollingElement.scrollHeight - window.innerHeight,\n    progress: {\n      x: 0,\n      y: 0,\n    },\n    progressX: 0,\n    progressY: 0,\n    direction: {\n      x: 'NONE',\n      y: 'NONE',\n    },\n    isUp: false,\n    isRight: false,\n    isDown: false,\n    isLeft: false,\n  };\n\n  updateProps(): ScrollServiceProps {\n    const { props } = this;\n    const yLast = props.y;\n    const xLast = props.x;\n\n    props.y = window.scrollY;\n    props.x = window.scrollX;\n    props.changed.x = props.changedX = props.x !== xLast;\n    props.changed.y = props.changedY = props.y !== yLast;\n    props.last.x = props.lastX = xLast;\n    props.last.y = props.lastY = yLast;\n    props.delta.x = props.deltaX = props.x - xLast;\n    props.delta.y = props.deltaY = props.y - yLast;\n    if (this.__maxX === null || this.__maxY === null) {\n      this.__updateMaxValues();\n    }\n    props.max.x = props.maxX = this.__maxX;\n    props.max.y = props.maxY = this.__maxY;\n    props.progress.x = props.progressX = props.max.x === 0 ? 1 : props.x / props.max.x;\n    props.progress.y = props.progressY = props.max.y === 0 ? 1 : props.y / props.max.y;\n    props.isUp = props.y < yLast;\n    props.isRight = props.x > xLast;\n    props.isDown = props.y > yLast;\n    props.isLeft = props.x < xLast;\n    /* eslint-disable no-nested-ternary */\n    props.direction.x = props.isRight ? 'RIGHT' : props.isLeft ? 'LEFT' : 'NONE';\n    props.direction.y = props.isDown ? 'DOWN' : props.isUp ? 'UP' : 'NONE';\n    /* eslint-enable no-nested-ternary */\n\n    return props;\n  }\n\n  update(trigger = true) {\n    nextTick(() => this.updateProps()).then(() => {\n      if (trigger) {\n        this.trigger(this.props);\n      }\n    });\n  }\n\n  onScrollDebounced = debounce(() => {\n    this.update();\n  }, 100);\n\n  /**\n   * Update cached max scroll values on resize.\n   * @private\n   */\n  __updateMaxValues() {\n    this.__maxX = document.scrollingElement.scrollWidth - window.innerWidth;\n    this.__maxY = document.scrollingElement.scrollHeight - window.innerHeight;\n  }\n\n  /**\n   * Scroll and resize handler.\n   */\n  handleEvent(event: Event) {\n    if (event.type === 'resize') {\n      this.__updateMaxValues();\n      this.update(false);\n      return;\n    }\n\n    this.update();\n    this.onScrollDebounced();\n  }\n\n  init() {\n    super.init();\n\n    if (typeof ResizeObserver === 'function' && document.scrollingElement) {\n      this.__resizeObserver = new ResizeObserver(() => {\n        this.__updateMaxValues();\n      });\n      this.__resizeObserver.observe(document.scrollingElement);\n    }\n  }\n\n  kill() {\n    this.__resizeObserver?.disconnect();\n    this.__resizeObserver = null;\n    super.kill();\n  }\n}\n\n/**\n * Use the scroll service.\n *\n * ```js\n * import { useScroll } from '@studiometa/js-toolkit/services';\n * const { add, remove, props } = useScroll();\n * add(key, (props) => {});\n * remove(key);\n * props();\n * ```\n * @link https://js-toolkit.studiometa.dev/api/services/useScroll.html\n */\nexport function useScroll(): ScrollServiceInterface {\n  return ScrollService.getInstance();\n}\n"],
   "mappings": "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",
   "names": []
 }

package/utils/cache.d.ts

@@ -1,5 +1,5 @@
 /**
  * Cache the result of a callback in map instances.
  * @link https://js-toolkit.studiometa.dev/utils/cache.html
-*/
+ */
 export declare function cache<T extends any>(keys: any | any[], callback: () => T): T;

package/utils/cache.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../packages/js-toolkit/utils/cache.ts"],
-  "sourcesContent": ["import { isArray } from './is.js';\n\n/**\n * Cache the result of a callback in map instances.\n * @link https://js-toolkit.studiometa.dev/utils/cache.html\n*/\nexport function cache<T extends any>(keys: any | any[], callback: () => T): T {\n  const normalizedKeys = isArray(keys) ? keys : [keys];\n  let value = (globalThis.__JS_TOOLKIT_CACHE__ ??= new Map());\n  let index = 1;\n\n  for (const key of normalizedKeys) {\n    if (!value.has(key)) {\n      const newValue = index === normalizedKeys.length ? callback() : new Map();\n      value.set(key, newValue);\n    }\n\n    value = value.get(key);\n    index += 1;\n  }\n\n  return value as T;\n}\n"],
+  "sourcesContent": ["import { isArray } from './is.js';\n\n/**\n * Cache the result of a callback in map instances.\n * @link https://js-toolkit.studiometa.dev/utils/cache.html\n */\nexport function cache<T extends any>(keys: any | any[], callback: () => T): T {\n  const normalizedKeys = isArray(keys) ? keys : [keys];\n  let value = (globalThis.__JS_TOOLKIT_CACHE__ ??= new Map());\n  let index = 1;\n\n  for (const key of normalizedKeys) {\n    if (!value.has(key)) {\n      const newValue = index === normalizedKeys.length ? callback() : new Map();\n      value.set(key, newValue);\n    }\n\n    value = value.get(key);\n    index += 1;\n  }\n\n  return value as T;\n}\n"],
   "mappings": "AAAA,SAAS,eAAe;AAMjB,SAAS,MAAqB,MAAmB,UAAsB;AAC5E,QAAM,iBAAiB,QAAQ,IAAI,IAAI,OAAO,CAAC,IAAI;AACnD,MAAI,QAAS,WAAW,yBAAyB,oBAAI,IAAI;AACzD,MAAI,QAAQ;AAEZ,aAAW,OAAO,gBAAgB;AAChC,QAAI,CAAC,MAAM,IAAI,GAAG,GAAG;AACnB,YAAM,WAAW,UAAU,eAAe,SAAS,SAAS,IAAI,oBAAI,IAAI;AACxE,YAAM,IAAI,KAAK,QAAQ;AAAA,IACzB;AAEA,YAAQ,MAAM,IAAI,GAAG;AACrB,aAAS;AAAA,EACX;AAEA,SAAO;AACT;",
   "names": []
 }

package/utils/collide/boundingRectToCircle.d.ts

@@ -11,7 +11,7 @@
  * @param {boolean} force Force usage of non-square DOMElements
  * @return {Circle} Circle object that can be used in collides functions
  * @link https://js-toolkit.studiometa.dev/utils/collision/boundingRectToCircle.html
-*/
+ */
 export declare function boundingRectToCircle({ x, y, width, height }: {
     height: any;
     width: any;

package/utils/collide/boundingRectToCircle.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../packages/js-toolkit/utils/collide/boundingRectToCircle.ts"],
-  "sourcesContent": ["/**\n * @typedef {Object} Circle\n * @property {number} x Circle's x position\n * @property {number} y Circle's y position\n * @property {number} radius Circle's radius\n */\n\n/**\n * Convert clientRect to a formatted circle object\n *\n * @param {Partial<DOMRect>} domRect DOMRect of a square DOMElement\n * @param {boolean} force Force usage of non-square DOMElements\n * @return {Circle} Circle object that can be used in collides functions\n * @link https://js-toolkit.studiometa.dev/utils/collision/boundingRectToCircle.html\n*/\nexport function boundingRectToCircle({ x, y, width, height }, force = false) {\n  if (width !== height && !force) {\n    throw new Error('Initial DOMElement is not a square. Please use the force mode.');\n  }\n  return {\n    x: x + width / 2,\n    y: y + height / 2,\n    radius: (width + height) / 4,\n  };\n}\n"],
+  "sourcesContent": ["/**\n * @typedef {Object} Circle\n * @property {number} x Circle's x position\n * @property {number} y Circle's y position\n * @property {number} radius Circle's radius\n */\n\n/**\n * Convert clientRect to a formatted circle object\n *\n * @param {Partial<DOMRect>} domRect DOMRect of a square DOMElement\n * @param {boolean} force Force usage of non-square DOMElements\n * @return {Circle} Circle object that can be used in collides functions\n * @link https://js-toolkit.studiometa.dev/utils/collision/boundingRectToCircle.html\n */\nexport function boundingRectToCircle({ x, y, width, height }, force = false) {\n  if (width !== height && !force) {\n    throw new Error('Initial DOMElement is not a square. Please use the force mode.');\n  }\n  return {\n    x: x + width / 2,\n    y: y + height / 2,\n    radius: (width + height) / 4,\n  };\n}\n"],
   "mappings": "AAeO,SAAS,qBAAqB,EAAE,GAAG,GAAG,OAAO,OAAO,GAAG,QAAQ,OAAO;AAC3E,MAAI,UAAU,UAAU,CAAC,OAAO;AAC9B,UAAM,IAAI,MAAM,gEAAgE;AAAA,EAClF;AACA,SAAO;AAAA,IACL,GAAG,IAAI,QAAQ;AAAA,IACf,GAAG,IAAI,SAAS;AAAA,IAChB,SAAS,QAAQ,UAAU;AAAA,EAC7B;AACF;",
   "names": []
 }

package/utils/collide/collideCircleCircle.d.ts

@@ -12,5 +12,5 @@
  * @param {Circle} circle2 Circle 2
  * @return {boolean} Are the sides of one circle touching the other ?
  * @link https://js-toolkit.studiometa.dev/utils/collision/collideCircleCircle.html
-*/
+ */
 export declare function collideCircleCircle(circle1: any, circle2: any): boolean;

package/utils/collide/collideCircleCircle.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../packages/js-toolkit/utils/collide/collideCircleCircle.ts"],
-  "sourcesContent": ["/**\n * @typedef {Object} Circle\n * @property {number} x Circle's x position\n * @property {number} y Circle's y position\n * @property {number} radius Circle's radius\n */\n\n/**\n * Test if a circle collides with another.\n * Inspired by http://www.jeffreythompson.org/collision-detection/circle-circle.php\n *\n * @param {Circle} circle1 Circle 1\n * @param {Circle} circle2 Circle 2\n * @return {boolean} Are the sides of one circle touching the other ?\n * @link https://js-toolkit.studiometa.dev/utils/collision/collideCircleCircle.html\n*/\nexport function collideCircleCircle(circle1, circle2) {\n  // get distance between the circle's centers\n  // use the Pythagorean Theorem to compute the distance\n  const distX = circle1.x - circle2.x;\n  const distY = circle1.y - circle2.y;\n  const distance = Math.sqrt(distX * distX + distY * distY);\n\n  // if the distance is less than the sum of the circle's\n  // radii, the circles are touching!\n  if (distance <= circle1.radius + circle2.radius) {\n    return true;\n  }\n  return false;\n}\n"],
+  "sourcesContent": ["/**\n * @typedef {Object} Circle\n * @property {number} x Circle's x position\n * @property {number} y Circle's y position\n * @property {number} radius Circle's radius\n */\n\n/**\n * Test if a circle collides with another.\n * Inspired by http://www.jeffreythompson.org/collision-detection/circle-circle.php\n *\n * @param {Circle} circle1 Circle 1\n * @param {Circle} circle2 Circle 2\n * @return {boolean} Are the sides of one circle touching the other ?\n * @link https://js-toolkit.studiometa.dev/utils/collision/collideCircleCircle.html\n */\nexport function collideCircleCircle(circle1, circle2) {\n  // get distance between the circle's centers\n  // use the Pythagorean Theorem to compute the distance\n  const distX = circle1.x - circle2.x;\n  const distY = circle1.y - circle2.y;\n  const distance = Math.sqrt(distX * distX + distY * distY);\n\n  // if the distance is less than the sum of the circle's\n  // radii, the circles are touching!\n  if (distance <= circle1.radius + circle2.radius) {\n    return true;\n  }\n  return false;\n}\n"],
   "mappings": "AAgBO,SAAS,oBAAoB,SAAS,SAAS;AAGpD,QAAM,QAAQ,QAAQ,IAAI,QAAQ;AAClC,QAAM,QAAQ,QAAQ,IAAI,QAAQ;AAClC,QAAM,WAAW,KAAK,KAAK,QAAQ,QAAQ,QAAQ,KAAK;AAIxD,MAAI,YAAY,QAAQ,SAAS,QAAQ,QAAQ;AAC/C,WAAO;AAAA,EACT;AACA,SAAO;AACT;",
   "names": []
 }

package/utils/collide/collideCircleRect.d.ts

@@ -19,5 +19,5 @@
  * @param {Rect} rect Rectangle
  * @return {boolean} Are the sides of the circle touching the rectangle ?
  * @link https://js-toolkit.studiometa.dev/utils/collision/collideCircleRect.html
-*/
+ */
 export declare function collideCircleRect(circle: any, rect: any): boolean;

package/utils/collide/collideCircleRect.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../packages/js-toolkit/utils/collide/collideCircleRect.ts"],
-  "sourcesContent": ["/**\n * @typedef {Object} Rect\n * @property {number} x Rectangle's x position\n * @property {number} y Rectangle's y position\n * @property {number} width Rectangle's width\n * @property {number} height Rectangle's height\n */\n\n/**\n * @typedef {Object} Circle\n * @property {number} x Circle's x position\n * @property {number} y Circle's y position\n * @property {number} radius Circle's radius\n */\n\n/**\n * Test if a circle collides with a rectangle.\n * Inspired by http://www.jeffreythompson.org/collision-detection/circle-rect.php\n *\n * @param {Circle} circle Circle\n * @param {Rect} rect Rectangle\n * @return {boolean} Are the sides of the circle touching the rectangle ?\n * @link https://js-toolkit.studiometa.dev/utils/collision/collideCircleRect.html\n*/\nexport function collideCircleRect(circle, rect) {\n  // temporary variables to set edges for testing\n  let testX = circle.x;\n  let testY = circle.y;\n\n  // which edge is closest?\n  if (circle.x < rect.x) {\n    testX = rect.x; // test left edge\n  } else if (circle.x > rect.x + rect.width) {\n    testX = rect.x + rect.width; // right edge\n  }\n\n  if (circle.y < rect.y) {\n    testY = rect.y; // top edge\n  } else if (circle.y > rect.y + rect.height) {\n    testY = rect.y + rect.height; // bottom edge\n  }\n\n  // get distance from closest edges\n  const distX = circle.x - testX;\n  const distY = circle.y - testY;\n  const distance = Math.sqrt(distX * distX + distY * distY);\n\n  // if the distance is less than the radius, collision!\n  if (distance <= circle.radius) {\n    return true;\n  }\n  return false;\n}\n"],
+  "sourcesContent": ["/**\n * @typedef {Object} Rect\n * @property {number} x Rectangle's x position\n * @property {number} y Rectangle's y position\n * @property {number} width Rectangle's width\n * @property {number} height Rectangle's height\n */\n\n/**\n * @typedef {Object} Circle\n * @property {number} x Circle's x position\n * @property {number} y Circle's y position\n * @property {number} radius Circle's radius\n */\n\n/**\n * Test if a circle collides with a rectangle.\n * Inspired by http://www.jeffreythompson.org/collision-detection/circle-rect.php\n *\n * @param {Circle} circle Circle\n * @param {Rect} rect Rectangle\n * @return {boolean} Are the sides of the circle touching the rectangle ?\n * @link https://js-toolkit.studiometa.dev/utils/collision/collideCircleRect.html\n */\nexport function collideCircleRect(circle, rect) {\n  // temporary variables to set edges for testing\n  let testX = circle.x;\n  let testY = circle.y;\n\n  // which edge is closest?\n  if (circle.x < rect.x) {\n    testX = rect.x; // test left edge\n  } else if (circle.x > rect.x + rect.width) {\n    testX = rect.x + rect.width; // right edge\n  }\n\n  if (circle.y < rect.y) {\n    testY = rect.y; // top edge\n  } else if (circle.y > rect.y + rect.height) {\n    testY = rect.y + rect.height; // bottom edge\n  }\n\n  // get distance from closest edges\n  const distX = circle.x - testX;\n  const distY = circle.y - testY;\n  const distance = Math.sqrt(distX * distX + distY * distY);\n\n  // if the distance is less than the radius, collision!\n  if (distance <= circle.radius) {\n    return true;\n  }\n  return false;\n}\n"],
   "mappings": "AAwBO,SAAS,kBAAkB,QAAQ,MAAM;AAE9C,MAAI,QAAQ,OAAO;AACnB,MAAI,QAAQ,OAAO;AAGnB,MAAI,OAAO,IAAI,KAAK,GAAG;AACrB,YAAQ,KAAK;AAAA,EACf,WAAW,OAAO,IAAI,KAAK,IAAI,KAAK,OAAO;AACzC,YAAQ,KAAK,IAAI,KAAK;AAAA,EACxB;AAEA,MAAI,OAAO,IAAI,KAAK,GAAG;AACrB,YAAQ,KAAK;AAAA,EACf,WAAW,OAAO,IAAI,KAAK,IAAI,KAAK,QAAQ;AAC1C,YAAQ,KAAK,IAAI,KAAK;AAAA,EACxB;AAGA,QAAM,QAAQ,OAAO,IAAI;AACzB,QAAM,QAAQ,OAAO,IAAI;AACzB,QAAM,WAAW,KAAK,KAAK,QAAQ,QAAQ,QAAQ,KAAK;AAGxD,MAAI,YAAY,OAAO,QAAQ;AAC7B,WAAO;AAAA,EACT;AACA,SAAO;AACT;",
   "names": []
 }

package/utils/collide/collidePointCircle.d.ts

@@ -17,5 +17,5 @@
  * @param {Circle} circle Circle
  * @return {boolean} Is the point inside the circle's bounds ?
  * @link https://js-toolkit.studiometa.dev/utils/collision/collidePointCircle.html
-*/
+ */
 export declare function collidePointCircle(point: any, circle: any): boolean;

package/utils/collide/collidePointCircle.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../packages/js-toolkit/utils/collide/collidePointCircle.ts"],
-  "sourcesContent": ["/**\n * @typedef {Object} Point\n * @property {number} x Point's x position\n * @property {number} y Point's y position\n */\n\n/**\n * @typedef {Object} Circle\n * @property {number} x Circle's x position\n * @property {number} y Circle's y position\n * @property {number} radius Circle's radius\n */\n\n/**\n * Test if a point is inside a circle.\n * Inspired by http://www.jeffreythompson.org/collision-detection/point-circle.php\n *\n * @param {Point} point Point\n * @param {Circle} circle Circle\n * @return {boolean} Is the point inside the circle's bounds ?\n * @link https://js-toolkit.studiometa.dev/utils/collision/collidePointCircle.html\n*/\nexport function collidePointCircle(point, circle) {\n  // get distance between the point and circle's center\n  // using the Pythagorean Theorem\n  const distX = point.x - circle.x;\n  const distY = point.y - circle.y;\n  const distance = Math.sqrt(distX * distX + distY * distY);\n\n  // if the distance is less than the circle's\n  // radius the point is inside!\n  return distance <= circle.radius;\n}\n"],
+  "sourcesContent": ["/**\n * @typedef {Object} Point\n * @property {number} x Point's x position\n * @property {number} y Point's y position\n */\n\n/**\n * @typedef {Object} Circle\n * @property {number} x Circle's x position\n * @property {number} y Circle's y position\n * @property {number} radius Circle's radius\n */\n\n/**\n * Test if a point is inside a circle.\n * Inspired by http://www.jeffreythompson.org/collision-detection/point-circle.php\n *\n * @param {Point} point Point\n * @param {Circle} circle Circle\n * @return {boolean} Is the point inside the circle's bounds ?\n * @link https://js-toolkit.studiometa.dev/utils/collision/collidePointCircle.html\n */\nexport function collidePointCircle(point, circle) {\n  // get distance between the point and circle's center\n  // using the Pythagorean Theorem\n  const distX = point.x - circle.x;\n  const distY = point.y - circle.y;\n  const distance = Math.sqrt(distX * distX + distY * distY);\n\n  // if the distance is less than the circle's\n  // radius the point is inside!\n  return distance <= circle.radius;\n}\n"],
   "mappings": "AAsBO,SAAS,mBAAmB,OAAO,QAAQ;AAGhD,QAAM,QAAQ,MAAM,IAAI,OAAO;AAC/B,QAAM,QAAQ,MAAM,IAAI,OAAO;AAC/B,QAAM,WAAW,KAAK,KAAK,QAAQ,QAAQ,QAAQ,KAAK;AAIxD,SAAO,YAAY,OAAO;AAC5B;",
   "names": []
 }

package/utils/collide/collidePointRect.d.ts

@@ -18,5 +18,5 @@
  * @param {Rect} rect Rectangle
  * @return {boolean} Is the point inside the rectangle's bounds ?
  * @link https://js-toolkit.studiometa.dev/utils/collision/collidePointRect.html
-*/
+ */
 export declare function collidePointRect(point: any, rect: any): boolean;

package/utils/collide/collidePointRect.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../packages/js-toolkit/utils/collide/collidePointRect.ts"],
-  "sourcesContent": ["/**\n * @typedef {Object} Point\n * @property {number} x Point's x position\n * @property {number} y Point's y position\n */\n\n/**\n * @typedef {Object} Rect\n * @property {number} x Rectangle's x position\n * @property {number} y Rectangle's y position\n * @property {number} width Rectangle's width\n * @property {number} height Rectangle's height\n */\n\n/**\n * Test if a point collides with a rectangle.\n * Inspired by http://www.jeffreythompson.org/collision-detection/point-rect.php\n *\n * @param {Point} point Point\n * @param {Rect} rect Rectangle\n * @return {boolean} Is the point inside the rectangle's bounds ?\n * @link https://js-toolkit.studiometa.dev/utils/collision/collidePointRect.html\n*/\nexport function collidePointRect(point, rect) {\n  return (\n    point.x >= rect.x && // right of the left edge AND\n    point.x <= rect.x + rect.width && // left of the right edge AND\n    point.y >= rect.y && // below the top AND\n    point.y <= rect.y + rect.height // above the bottom\n  );\n}\n"],
+  "sourcesContent": ["/**\n * @typedef {Object} Point\n * @property {number} x Point's x position\n * @property {number} y Point's y position\n */\n\n/**\n * @typedef {Object} Rect\n * @property {number} x Rectangle's x position\n * @property {number} y Rectangle's y position\n * @property {number} width Rectangle's width\n * @property {number} height Rectangle's height\n */\n\n/**\n * Test if a point collides with a rectangle.\n * Inspired by http://www.jeffreythompson.org/collision-detection/point-rect.php\n *\n * @param {Point} point Point\n * @param {Rect} rect Rectangle\n * @return {boolean} Is the point inside the rectangle's bounds ?\n * @link https://js-toolkit.studiometa.dev/utils/collision/collidePointRect.html\n */\nexport function collidePointRect(point, rect) {\n  return (\n    point.x >= rect.x && // right of the left edge AND\n    point.x <= rect.x + rect.width && // left of the right edge AND\n    point.y >= rect.y && // below the top AND\n    point.y <= rect.y + rect.height // above the bottom\n  );\n}\n"],
   "mappings": "AAuBO,SAAS,iBAAiB,OAAO,MAAM;AAC5C,SACE,MAAM,KAAK,KAAK;AAAA,EAChB,MAAM,KAAK,KAAK,IAAI,KAAK;AAAA,EACzB,MAAM,KAAK,KAAK;AAAA,EAChB,MAAM,KAAK,KAAK,IAAI,KAAK;AAE7B;",
   "names": []
 }

package/utils/collide/collideRectRect.d.ts

@@ -13,5 +13,5 @@
  * @param {Rect} rect2 Rectangle 2
  * @return {boolean} Are the sides of one rectangle touching the other ?
  * @link https://js-toolkit.studiometa.dev/utils/collision/collideRectRect.html
-*/
+ */
 export declare function collideRectRect(rect1: any, rect2: any): boolean;

package/utils/collide/collideRectRect.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../packages/js-toolkit/utils/collide/collideRectRect.ts"],
-  "sourcesContent": ["/**\n * @typedef {Object} Rect\n * @property {number} x Rectangle's x position\n * @property {number} y Rectangle's y position\n * @property {number} width Rectangle's width\n * @property {number} height Rectangle's height\n */\n\n/**\n * Test if a rectangle collides with another rectangle.\n * Inspired by http://www.jeffreythompson.org/collision-detection/rect-rect.php\n *\n * @param {Rect} rect1 Rectangle 1\n * @param {Rect} rect2 Rectangle 2\n * @return {boolean} Are the sides of one rectangle touching the other ?\n * @link https://js-toolkit.studiometa.dev/utils/collision/collideRectRect.html\n*/\nexport function collideRectRect(rect1, rect2) {\n  return (\n    rect1.x + rect1.width >= rect2.x && // rect1 right edge past rect2 left AND\n    rect1.x <= rect2.x + rect2.width && // rect1 left edge past rect2 right AND\n    rect1.y + rect1.height >= rect2.y && // rect1 top edge past rect2 bottom AND\n    rect1.y <= rect2.y + rect2.height // rect1 bottom edge past rect2 top\n  );\n}\n"],
+  "sourcesContent": ["/**\n * @typedef {Object} Rect\n * @property {number} x Rectangle's x position\n * @property {number} y Rectangle's y position\n * @property {number} width Rectangle's width\n * @property {number} height Rectangle's height\n */\n\n/**\n * Test if a rectangle collides with another rectangle.\n * Inspired by http://www.jeffreythompson.org/collision-detection/rect-rect.php\n *\n * @param {Rect} rect1 Rectangle 1\n * @param {Rect} rect2 Rectangle 2\n * @return {boolean} Are the sides of one rectangle touching the other ?\n * @link https://js-toolkit.studiometa.dev/utils/collision/collideRectRect.html\n */\nexport function collideRectRect(rect1, rect2) {\n  return (\n    rect1.x + rect1.width >= rect2.x && // rect1 right edge past rect2 left AND\n    rect1.x <= rect2.x + rect2.width && // rect1 left edge past rect2 right AND\n    rect1.y + rect1.height >= rect2.y && // rect1 top edge past rect2 bottom AND\n    rect1.y <= rect2.y + rect2.height // rect1 bottom edge past rect2 top\n  );\n}\n"],
   "mappings": "AAiBO,SAAS,gBAAgB,OAAO,OAAO;AAC5C,SACE,MAAM,IAAI,MAAM,SAAS,MAAM;AAAA,EAC/B,MAAM,KAAK,MAAM,IAAI,MAAM;AAAA,EAC3B,MAAM,IAAI,MAAM,UAAU,MAAM;AAAA,EAChC,MAAM,KAAK,MAAM,IAAI,MAAM;AAE/B;",
   "names": []
 }

package/utils/css/animate.d.ts

@@ -41,6 +41,6 @@ export type Animate = Tween;
 /**
  * Animate one or more elements.
  * @link https://js-toolkit.studiometa.dev/utils/css/animate.html
-*/
+ */
 export declare function animate(elementOrElements: HTMLElement | HTMLElement[] | NodeListOf<HTMLElement>, keyframes: Keyframe[], options?: AnimateOptions): Animate;
 export {};

package/utils/css/animate.js

@@ -111,9 +111,7 @@ function compileSegment(from, to) {
   };
 }
 function renderSegment(element, segment, progress) {
-  const easedProgress = segment.easing(
-    map(progress, segment.fromOffset, segment.toOffset, 0, 1)
-  );
+  const easedProgress = segment.easing(map(progress, segment.fromOffset, segment.toOffset, 0, 1));
   scheduler.read(() => {
     for (let i = 0; i < segment.dynamicTranslates.length; i++) {
       const dynamic = segment.dynamicTranslates[i];
@@ -259,9 +257,7 @@ function animate(elementOrElements, keyframes, options = {}) {
     if (newProgress !== void 0) {
       const newTime = lerp(0, duration, newProgress);
       for (let i = 0; i < controls.length; i++) {
-        const controlProgress = clamp01(
-          map(newTime, timings[i][1], timings[i][2], 0, 1)
-        );
+        const controlProgress = clamp01(map(newTime, timings[i][1], timings[i][2], 0, 1));
         controls[i].progress(controlProgress);
       }
     }

package/utils/css/animate.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../packages/js-toolkit/utils/css/animate.ts"],
-  "sourcesContent": ["import { clamp01, lerp, map } from '../math/index.js';\nimport { isFunction } from '../is.js';\nimport { domScheduler as scheduler } from '../scheduler.js';\nimport { tween, normalizeEase } from '../tween.js';\nimport { eachElements } from './utils.js';\nimport { startsWith } from '../string/index.js';\nimport type { TransformProps } from './transform.js';\nimport type { EasingFunction } from '../math/index.js';\nimport type { BezierCurve, Tween, TweenOptions } from '../tween.js';\n\nexport type CSSCustomPropertyName = `--${string}`;\n\ntype KeyframeTransforms<Type> = {\n  [Property in keyof Type]: number | [number, string];\n};\n\nexport type Keyframe = Partial<\n  KeyframeTransforms<TransformProps> & {\n    opacity: number;\n    transformOrigin: string;\n    easing: EasingFunction | BezierCurve;\n    offset: number;\n    [key: CSSCustomPropertyName]: number;\n  }\n>;\n\nexport type NormalizedKeyframe = Keyframe & {\n  easing: EasingFunction;\n  offset: number;\n  vars: string[];\n};\n\n\n/**\n * A pre-compiled segment between two keyframes.\n * All constant parts (deltas, offsets, writers) are resolved once at creation.\n * The render loop only does multiply-add and string concatenation.\n */\ninterface CompiledSegment {\n  fromOffset: number;\n  toOffset: number;\n  easing: EasingFunction;\n  /** Parallel arrays for transform properties (structure-of-arrays layout) */\n  transformStarts: number[];\n  transformDeltas: number[];\n  transformCssFunctions: string[];\n  transformUnits: string[];\n  /** Whether translate3d is needed */\n  hasTranslate: boolean;\n  /** Indices into transformStarts/transformDeltas for x, y, z axes */\n  translateAxisIndices: number[];\n  /** The index where non-translate transforms start in the parallel arrays */\n  simpleTransformStart: number;\n  /** Translate properties that need element size for CSS unit conversion at render time */\n  dynamicTranslates: Array<{\n    index: number;\n    from: number | [number, string];\n    to: number | [number, string];\n    sizeRef: string;\n  }>;\n  /** Opacity: pre-computed start and delta, or null if not animated */\n  opacityStart: number;\n  opacityDelta: number;\n  hasOpacity: boolean;\n  /** CSS custom properties: parallel arrays */\n  customPropertyNames: string[];\n  customPropertyStarts: number[];\n  customPropertyDeltas: number[];\n  /** Transform origin for this segment, or false */\n  transformOrigin: string | false;\n}\n\nexport interface AnimateOptions extends Omit<TweenOptions, 'duration'> {\n  /**\n   * The duration of the tween, in seconds.\n   * When using multiple targets, it can be a function which will be\n   * called with the current target and its index and should return\n   * the duration in seconds for this element.\n   *\n   * Defaults to `1`.\n   */\n  duration?: number | ((target: HTMLElement, index: number) => number);\n  /**\n   * Delay between the start of each target animation, in seconds.\n   * When using multiple targets, it can be a function which will be called\n   * with the current target and its index and should return the delay\n   * in seconds for this element's tween.\n   *\n   * Defaults to `0`.\n   */\n  stagger?: number | ((target: HTMLElement, index: number) => number);\n}\n\nexport type Animate = Tween;\n\nlet id = 0;\nconst running = new WeakMap();\n\nconst CSSUnitConverter = {\n  '%': (value: number, size: number) => (value * size) / 100,\n  vh: (value: number) => (value * window.innerHeight) / 100,\n  vw: (value: number) => (value * window.innerWidth) / 100,\n  vmin: (value: number) => (value * Math.min(window.innerWidth, window.innerHeight)) / 100,\n  vmax: (value: number) => (value * Math.max(window.innerWidth, window.innerHeight)) / 100,\n};\n\n/**\n * Resolve a keyframe value that may have a CSS unit (e.g. [50, '%']).\n */\nfunction resolveUnitValue(val: number | [number, string], elementSize: number): number {\n  if (typeof val === 'number') {\n    return val;\n  }\n\n  if (!val[1] || !CSSUnitConverter[val[1]]) {\n    return val[0];\n  }\n\n  return CSSUnitConverter[val[1]](val[0], elementSize);\n}\n\n/**\n * Non-translate transform property definitions: [keyframeProp, cssFn, unit, defaultValue].\n */\nconst SIMPLE_TRANSFORM_DEFS: ReadonlyArray<\n  readonly [string, string, string, number]\n> = [\n  ['rotate', 'rotate', 'deg', 0],\n  ['rotateX', 'rotateX', 'deg', 0],\n  ['rotateY', 'rotateY', 'deg', 0],\n  ['rotateZ', 'rotateZ', 'deg', 0],\n  ['scale', 'scale', '', 1],\n  ['scaleX', 'scaleX', '', 1],\n  ['scaleY', 'scaleY', '', 1],\n  ['scaleZ', 'scaleZ', '', 1],\n  ['skew', 'skew', 'deg', 0],\n  ['skewX', 'skewX', 'deg', 0],\n  ['skewY', 'skewY', 'deg', 0],\n];\n\n/**\n * Translate axis definitions: [keyframeProp, defaultValue, sizeRef].\n * These are grouped into a single translate3d() call during rendering.\n */\nconst TRANSLATE_DEFS: ReadonlyArray<\n  readonly [string, number, string]\n> = [\n  ['x', 0, 'offsetWidth'],\n  ['y', 0, 'offsetHeight'],\n  ['z', 0, 'offsetWidth'],\n];\n\n/**\n * Compile a pair of keyframes into a pre-computed segment.\n * All constant work (deltas, property filtering) is done here once.\n */\nfunction compileSegment(\n  from: NormalizedKeyframe,\n  to: NormalizedKeyframe,\n): CompiledSegment {\n  const transformStarts: number[] = [];\n  const transformDeltas: number[] = [];\n  const transformCssFunctions: string[] = [];\n  const transformUnits: string[] = [];\n  const dynamicTranslates: CompiledSegment['dynamicTranslates'] = [];\n\n  // Translate axes: grouped into translate3d(x, y, z) during rendering.\n  // We track indices into the parallel arrays for x, y, z.\n  let hasTranslate = false;\n  const translateAxisIndices: number[] = [];\n\n  for (const [prop, defaultValue, sizeRef] of TRANSLATE_DEFS) {\n    const propertyExists = from[prop] !== undefined || to[prop] !== undefined;\n    if (propertyExists) hasTranslate = true;\n\n    const fromValue = from[prop] ?? defaultValue;\n    const toValue = to[prop] ?? defaultValue;\n    const arrayIndex = transformStarts.length;\n    translateAxisIndices.push(arrayIndex);\n\n    // Placeholder CSS function/unit \u2014 not used for translate (special rendering)\n    transformCssFunctions.push('');\n    transformUnits.push('px');\n\n    if (typeof fromValue !== 'number' || typeof toValue !== 'number') {\n      transformStarts.push(0);\n      transformDeltas.push(0);\n      dynamicTranslates.push({ index: arrayIndex, from: fromValue, to: toValue, sizeRef });\n    } else {\n      transformStarts.push(fromValue);\n      transformDeltas.push(toValue - fromValue);\n    }\n  }\n\n  // Non-translate transforms: each gets its own CSS function\n  for (const [prop, cssFunction, unit, defaultValue] of SIMPLE_TRANSFORM_DEFS) {\n    if (from[prop] === undefined && to[prop] === undefined) continue;\n\n    const startValue = (from[prop] as number) ?? defaultValue;\n    transformCssFunctions.push(cssFunction);\n    transformUnits.push(unit);\n    transformStarts.push(startValue);\n    transformDeltas.push(((to[prop] as number) ?? defaultValue) - startValue);\n  }\n\n  // Opacity\n  const hasOpacity = from.opacity !== undefined || to.opacity !== undefined;\n  const opacityStart = hasOpacity ? (from.opacity ?? 1) : 0;\n  const opacityDelta = hasOpacity ? (to.opacity ?? 1) - opacityStart : 0;\n\n  // CSS custom properties\n  const customPropertyNames: string[] = [];\n  const customPropertyStarts: number[] = [];\n  const customPropertyDeltas: number[] = [];\n  if (from.vars && to.vars) {\n    for (const name of from.vars) {\n      const startValue = from[name] as number;\n      const endValue = (to[name] as number | undefined) ?? startValue;\n      customPropertyNames.push(name);\n      customPropertyStarts.push(startValue);\n      customPropertyDeltas.push(endValue - startValue);\n    }\n  }\n\n  return {\n    fromOffset: from.offset,\n    toOffset: to.offset,\n    easing: to.easing,\n    transformStarts,\n    transformDeltas,\n    transformCssFunctions,\n    transformUnits,\n    hasTranslate,\n    translateAxisIndices,\n    simpleTransformStart: TRANSLATE_DEFS.length,\n    dynamicTranslates,\n    hasOpacity,\n    opacityStart,\n    opacityDelta,\n    customPropertyNames,\n    customPropertyStarts,\n    customPropertyDeltas,\n    transformOrigin: to.transformOrigin !== undefined ? to.transformOrigin : false,\n  };\n}\n\n/**\n * Render an element using a pre-compiled segment and a progress value.\n * The hot path: only multiply-add, string concatenation, and DOM writes.\n */\nfunction renderSegment(\n  element: HTMLElement,\n  segment: CompiledSegment,\n  progress: number,\n) {\n  const easedProgress = segment.easing(\n    map(progress, segment.fromOffset, segment.toOffset, 0, 1),\n  );\n\n  scheduler.read(() => {\n    // Resolve dynamic (CSS-unit) transforms that need element size\n    for (let i = 0; i < segment.dynamicTranslates.length; i++) {\n      const dynamic = segment.dynamicTranslates[i];\n      const elementSize = element[dynamic.sizeRef];\n      const startValue = resolveUnitValue(dynamic.from, elementSize);\n      segment.transformStarts[dynamic.index] = startValue;\n      segment.transformDeltas[dynamic.index] = resolveUnitValue(dynamic.to, elementSize) - startValue;\n    }\n\n    // Build transform string: translate3d grouped, then individual transforms\n    let transformValue = '';\n\n    if (segment.hasTranslate) {\n      const xIndex = segment.translateAxisIndices[0];\n      const yIndex = segment.translateAxisIndices[1];\n      const zIndex = segment.translateAxisIndices[2];\n      const x = segment.transformStarts[xIndex] + segment.transformDeltas[xIndex] * easedProgress;\n      const y = segment.transformStarts[yIndex] + segment.transformDeltas[yIndex] * easedProgress;\n      const z = segment.transformStarts[zIndex] + segment.transformDeltas[zIndex] * easedProgress;\n      transformValue += `translate3d(${x}px, ${y}px, ${z}px) `;\n    }\n\n    for (let i = segment.simpleTransformStart; i < segment.transformStarts.length; i++) {\n      const value = segment.transformStarts[i] + segment.transformDeltas[i] * easedProgress;\n      transformValue += `${segment.transformCssFunctions[i]}(${value}${segment.transformUnits[i]}) `;\n    }\n\n    // Compute opacity\n    let opacity: false | number | string = false;\n    if (segment.hasOpacity) {\n      opacity = segment.opacityStart + segment.opacityDelta * easedProgress;\n    } else if (element.style.opacity) {\n      opacity = '';\n    }\n\n    // Compute transform origin\n    let transformOrigin: false | string = false;\n    if (segment.transformOrigin !== false) {\n      transformOrigin = segment.transformOrigin;\n    } else if (element.style.transformOrigin) {\n      transformOrigin = '';\n    }\n\n    // Compute CSS custom properties\n    const hasCustomProperties = segment.customPropertyNames.length > 0;\n\n    scheduler.write(() => {\n      if (opacity !== false) {\n        // @ts-ignore\n        element.style.opacity = opacity;\n      }\n      if (transformOrigin !== false) {\n        element.style.transformOrigin = transformOrigin;\n      }\n      if (hasCustomProperties) {\n        for (let i = 0; i < segment.customPropertyNames.length; i++) {\n          element.style.setProperty(\n            segment.customPropertyNames[i],\n            (segment.customPropertyStarts[i] + segment.customPropertyDeltas[i] * easedProgress).toString(),\n          );\n        }\n      }\n      element.style.transform = transformValue;\n    });\n  });\n}\n\n/**\n * Animate an element.\n */\nfunction singleAnimate(\n  element: HTMLElement,\n  keyframes: Keyframe[],\n  options: TweenOptions = {},\n): Animate {\n  const keyframesCount = keyframes.length - 1;\n  const normalizedKeyframes = keyframes.map(\n    (keyframe, index): NormalizedKeyframe => ({\n      ...keyframe,\n      offset: keyframe.offset ?? index / keyframesCount,\n      easing: normalizeEase(keyframe.easing),\n      vars: Object.keys(keyframe).filter((key) => startsWith(key, '--')),\n    }),\n  );\n\n  // Compile keyframe pairs into pre-computed segments (stage 1: partial evaluation)\n  const segments: CompiledSegment[] = [];\n  for (let i = 1; i < normalizedKeyframes.length; i++) {\n    segments.push(compileSegment(normalizedKeyframes[i - 1], normalizedKeyframes[i]));\n  }\n\n  if (!running.has(element)) {\n    running.set(element, new Map());\n  }\n\n  const key = `animate-${id}`;\n  id += 1;\n\n  /**\n   * Set the progress value.\n   */\n  function callback(progress: number) {\n    let segmentIndex = 0;\n    while (\n      segmentIndex < segments.length - 1 &&\n      segments[segmentIndex].toOffset <= progress &&\n      segments[segmentIndex].toOffset !== 1\n    ) {\n      segmentIndex += 1;\n    }\n\n    renderSegment(element, segments[segmentIndex], progress);\n  }\n\n  const controls = tween(callback, {\n    ...options,\n    onStart(progress) {\n      if (isFunction(options.onStart)) {\n        options.onStart(progress);\n      }\n      // Stop running instances\n      const runningKeys = running.get(element);\n      for (const [runningKey, runningPause] of runningKeys.entries()) {\n        runningPause();\n        runningKeys.delete(runningKey);\n      }\n      runningKeys.set(key, controls.pause);\n      running.set(element, runningKeys);\n    },\n  });\n\n  return controls;\n}\n\ntype Duration = number;\ntype Delay = number;\ntype DurationWithDelay = number;\n\n/**\n * Animate one or more elements.\n * @link https://js-toolkit.studiometa.dev/utils/css/animate.html\n*/\nexport function animate(\n  elementOrElements: HTMLElement | HTMLElement[] | NodeListOf<HTMLElement>,\n  keyframes: Keyframe[],\n  options: AnimateOptions = {},\n): Animate {\n  if (elementOrElements instanceof HTMLElement) {\n    return singleAnimate(elementOrElements, keyframes, {\n      ...options,\n      duration: isFunction(options.duration)\n        ? options.duration(elementOrElements, 0)\n        : options.duration,\n    });\n  }\n\n  const stagger = options.stagger ?? 0;\n  const staggerIsFunction = isFunction(stagger);\n  const durationFn = isFunction(options.duration) ? options.duration : null;\n  const progressFn = isFunction(options.onProgress) ? options.onProgress : null;\n  const progresses: number[] = [];\n  const timings: [Duration, Delay, DurationWithDelay][] = [];\n  let duration = 0;\n  let progressSum = 0;\n  let elementCount = 0;\n\n  const controls = eachElements(elementOrElements, (element, index) => {\n    const delay = staggerIsFunction ? stagger(element, index) : stagger * index;\n    const itemOptions = { ...options, delay } as TweenOptions;\n\n    if (durationFn) {\n      itemOptions.duration = durationFn(element, index);\n    } else if (itemOptions.duration === undefined) {\n      itemOptions.duration = 1;\n    }\n\n    timings[index] = [itemOptions.duration, delay, itemOptions.duration + delay];\n\n    if (timings[index][2] > duration) {\n      // eslint-disable-next-line prefer-destructuring\n      duration = timings[index][2];\n    }\n\n    progresses[index] = 0;\n    elementCount = index + 1;\n    itemOptions.onProgress = (itemProgress) => {\n      progressSum += itemProgress - progresses[index];\n      progresses[index] = itemProgress;\n      if (progressFn) {\n        progressFn(progressSum / elementCount);\n      }\n    };\n\n    return singleAnimate(element, keyframes, itemOptions);\n  });\n\n  function forAll(key: string) {\n    for (const control of controls) {\n      control[key]();\n    }\n  }\n\n  function progress(newProgress?: number) {\n    if (newProgress !== undefined) {\n      const newTime = lerp(0, duration, newProgress);\n      for (let i = 0; i < controls.length; i++) {\n        const controlProgress = clamp01(\n          map(newTime, timings[i][1], timings[i][2], 0, 1),\n        );\n        controls[i].progress(controlProgress);\n      }\n    }\n\n    return progressSum / elementCount;\n  }\n\n  return {\n    start: () => forAll('start'),\n    pause: () => forAll('pause'),\n    finish: () => forAll('finish'),\n    play: () => forAll('play'),\n    progress,\n  };\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { clamp01, lerp, map } from '../math/index.js';\nimport { isFunction } from '../is.js';\nimport { domScheduler as scheduler } from '../scheduler.js';\nimport { tween, normalizeEase } from '../tween.js';\nimport { eachElements } from './utils.js';\nimport { startsWith } from '../string/index.js';\nimport type { TransformProps } from './transform.js';\nimport type { EasingFunction } from '../math/index.js';\nimport type { BezierCurve, Tween, TweenOptions } from '../tween.js';\n\nexport type CSSCustomPropertyName = `--${string}`;\n\ntype KeyframeTransforms<Type> = {\n  [Property in keyof Type]: number | [number, string];\n};\n\nexport type Keyframe = Partial<\n  KeyframeTransforms<TransformProps> & {\n    opacity: number;\n    transformOrigin: string;\n    easing: EasingFunction | BezierCurve;\n    offset: number;\n    [key: CSSCustomPropertyName]: number;\n  }\n>;\n\nexport type NormalizedKeyframe = Keyframe & {\n  easing: EasingFunction;\n  offset: number;\n  vars: string[];\n};\n\n/**\n * A pre-compiled segment between two keyframes.\n * All constant parts (deltas, offsets, writers) are resolved once at creation.\n * The render loop only does multiply-add and string concatenation.\n */\ninterface CompiledSegment {\n  fromOffset: number;\n  toOffset: number;\n  easing: EasingFunction;\n  /** Parallel arrays for transform properties (structure-of-arrays layout) */\n  transformStarts: number[];\n  transformDeltas: number[];\n  transformCssFunctions: string[];\n  transformUnits: string[];\n  /** Whether translate3d is needed */\n  hasTranslate: boolean;\n  /** Indices into transformStarts/transformDeltas for x, y, z axes */\n  translateAxisIndices: number[];\n  /** The index where non-translate transforms start in the parallel arrays */\n  simpleTransformStart: number;\n  /** Translate properties that need element size for CSS unit conversion at render time */\n  dynamicTranslates: Array<{\n    index: number;\n    from: number | [number, string];\n    to: number | [number, string];\n    sizeRef: string;\n  }>;\n  /** Opacity: pre-computed start and delta, or null if not animated */\n  opacityStart: number;\n  opacityDelta: number;\n  hasOpacity: boolean;\n  /** CSS custom properties: parallel arrays */\n  customPropertyNames: string[];\n  customPropertyStarts: number[];\n  customPropertyDeltas: number[];\n  /** Transform origin for this segment, or false */\n  transformOrigin: string | false;\n}\n\nexport interface AnimateOptions extends Omit<TweenOptions, 'duration'> {\n  /**\n   * The duration of the tween, in seconds.\n   * When using multiple targets, it can be a function which will be\n   * called with the current target and its index and should return\n   * the duration in seconds for this element.\n   *\n   * Defaults to `1`.\n   */\n  duration?: number | ((target: HTMLElement, index: number) => number);\n  /**\n   * Delay between the start of each target animation, in seconds.\n   * When using multiple targets, it can be a function which will be called\n   * with the current target and its index and should return the delay\n   * in seconds for this element's tween.\n   *\n   * Defaults to `0`.\n   */\n  stagger?: number | ((target: HTMLElement, index: number) => number);\n}\n\nexport type Animate = Tween;\n\nlet id = 0;\nconst running = new WeakMap();\n\nconst CSSUnitConverter = {\n  '%': (value: number, size: number) => (value * size) / 100,\n  vh: (value: number) => (value * window.innerHeight) / 100,\n  vw: (value: number) => (value * window.innerWidth) / 100,\n  vmin: (value: number) => (value * Math.min(window.innerWidth, window.innerHeight)) / 100,\n  vmax: (value: number) => (value * Math.max(window.innerWidth, window.innerHeight)) / 100,\n};\n\n/**\n * Resolve a keyframe value that may have a CSS unit (e.g. [50, '%']).\n */\nfunction resolveUnitValue(val: number | [number, string], elementSize: number): number {\n  if (typeof val === 'number') {\n    return val;\n  }\n\n  if (!val[1] || !CSSUnitConverter[val[1]]) {\n    return val[0];\n  }\n\n  return CSSUnitConverter[val[1]](val[0], elementSize);\n}\n\n/**\n * Non-translate transform property definitions: [keyframeProp, cssFn, unit, defaultValue].\n */\nconst SIMPLE_TRANSFORM_DEFS: ReadonlyArray<readonly [string, string, string, number]> = [\n  ['rotate', 'rotate', 'deg', 0],\n  ['rotateX', 'rotateX', 'deg', 0],\n  ['rotateY', 'rotateY', 'deg', 0],\n  ['rotateZ', 'rotateZ', 'deg', 0],\n  ['scale', 'scale', '', 1],\n  ['scaleX', 'scaleX', '', 1],\n  ['scaleY', 'scaleY', '', 1],\n  ['scaleZ', 'scaleZ', '', 1],\n  ['skew', 'skew', 'deg', 0],\n  ['skewX', 'skewX', 'deg', 0],\n  ['skewY', 'skewY', 'deg', 0],\n];\n\n/**\n * Translate axis definitions: [keyframeProp, defaultValue, sizeRef].\n * These are grouped into a single translate3d() call during rendering.\n */\nconst TRANSLATE_DEFS: ReadonlyArray<readonly [string, number, string]> = [\n  ['x', 0, 'offsetWidth'],\n  ['y', 0, 'offsetHeight'],\n  ['z', 0, 'offsetWidth'],\n];\n\n/**\n * Compile a pair of keyframes into a pre-computed segment.\n * All constant work (deltas, property filtering) is done here once.\n */\nfunction compileSegment(from: NormalizedKeyframe, to: NormalizedKeyframe): CompiledSegment {\n  const transformStarts: number[] = [];\n  const transformDeltas: number[] = [];\n  const transformCssFunctions: string[] = [];\n  const transformUnits: string[] = [];\n  const dynamicTranslates: CompiledSegment['dynamicTranslates'] = [];\n\n  // Translate axes: grouped into translate3d(x, y, z) during rendering.\n  // We track indices into the parallel arrays for x, y, z.\n  let hasTranslate = false;\n  const translateAxisIndices: number[] = [];\n\n  for (const [prop, defaultValue, sizeRef] of TRANSLATE_DEFS) {\n    const propertyExists = from[prop] !== undefined || to[prop] !== undefined;\n    if (propertyExists) hasTranslate = true;\n\n    const fromValue = from[prop] ?? defaultValue;\n    const toValue = to[prop] ?? defaultValue;\n    const arrayIndex = transformStarts.length;\n    translateAxisIndices.push(arrayIndex);\n\n    // Placeholder CSS function/unit \u2014 not used for translate (special rendering)\n    transformCssFunctions.push('');\n    transformUnits.push('px');\n\n    if (typeof fromValue !== 'number' || typeof toValue !== 'number') {\n      transformStarts.push(0);\n      transformDeltas.push(0);\n      dynamicTranslates.push({ index: arrayIndex, from: fromValue, to: toValue, sizeRef });\n    } else {\n      transformStarts.push(fromValue);\n      transformDeltas.push(toValue - fromValue);\n    }\n  }\n\n  // Non-translate transforms: each gets its own CSS function\n  for (const [prop, cssFunction, unit, defaultValue] of SIMPLE_TRANSFORM_DEFS) {\n    if (from[prop] === undefined && to[prop] === undefined) continue;\n\n    const startValue = (from[prop] as number) ?? defaultValue;\n    transformCssFunctions.push(cssFunction);\n    transformUnits.push(unit);\n    transformStarts.push(startValue);\n    transformDeltas.push(((to[prop] as number) ?? defaultValue) - startValue);\n  }\n\n  // Opacity\n  const hasOpacity = from.opacity !== undefined || to.opacity !== undefined;\n  const opacityStart = hasOpacity ? (from.opacity ?? 1) : 0;\n  const opacityDelta = hasOpacity ? (to.opacity ?? 1) - opacityStart : 0;\n\n  // CSS custom properties\n  const customPropertyNames: string[] = [];\n  const customPropertyStarts: number[] = [];\n  const customPropertyDeltas: number[] = [];\n  if (from.vars && to.vars) {\n    for (const name of from.vars) {\n      const startValue = from[name] as number;\n      const endValue = (to[name] as number | undefined) ?? startValue;\n      customPropertyNames.push(name);\n      customPropertyStarts.push(startValue);\n      customPropertyDeltas.push(endValue - startValue);\n    }\n  }\n\n  return {\n    fromOffset: from.offset,\n    toOffset: to.offset,\n    easing: to.easing,\n    transformStarts,\n    transformDeltas,\n    transformCssFunctions,\n    transformUnits,\n    hasTranslate,\n    translateAxisIndices,\n    simpleTransformStart: TRANSLATE_DEFS.length,\n    dynamicTranslates,\n    hasOpacity,\n    opacityStart,\n    opacityDelta,\n    customPropertyNames,\n    customPropertyStarts,\n    customPropertyDeltas,\n    transformOrigin: to.transformOrigin !== undefined ? to.transformOrigin : false,\n  };\n}\n\n/**\n * Render an element using a pre-compiled segment and a progress value.\n * The hot path: only multiply-add, string concatenation, and DOM writes.\n */\nfunction renderSegment(element: HTMLElement, segment: CompiledSegment, progress: number) {\n  const easedProgress = segment.easing(map(progress, segment.fromOffset, segment.toOffset, 0, 1));\n\n  scheduler.read(() => {\n    // Resolve dynamic (CSS-unit) transforms that need element size\n    for (let i = 0; i < segment.dynamicTranslates.length; i++) {\n      const dynamic = segment.dynamicTranslates[i];\n      const elementSize = element[dynamic.sizeRef];\n      const startValue = resolveUnitValue(dynamic.from, elementSize);\n      segment.transformStarts[dynamic.index] = startValue;\n      segment.transformDeltas[dynamic.index] =\n        resolveUnitValue(dynamic.to, elementSize) - startValue;\n    }\n\n    // Build transform string: translate3d grouped, then individual transforms\n    let transformValue = '';\n\n    if (segment.hasTranslate) {\n      const xIndex = segment.translateAxisIndices[0];\n      const yIndex = segment.translateAxisIndices[1];\n      const zIndex = segment.translateAxisIndices[2];\n      const x = segment.transformStarts[xIndex] + segment.transformDeltas[xIndex] * easedProgress;\n      const y = segment.transformStarts[yIndex] + segment.transformDeltas[yIndex] * easedProgress;\n      const z = segment.transformStarts[zIndex] + segment.transformDeltas[zIndex] * easedProgress;\n      transformValue += `translate3d(${x}px, ${y}px, ${z}px) `;\n    }\n\n    for (let i = segment.simpleTransformStart; i < segment.transformStarts.length; i++) {\n      const value = segment.transformStarts[i] + segment.transformDeltas[i] * easedProgress;\n      transformValue += `${segment.transformCssFunctions[i]}(${value}${segment.transformUnits[i]}) `;\n    }\n\n    // Compute opacity\n    let opacity: false | number | string = false;\n    if (segment.hasOpacity) {\n      opacity = segment.opacityStart + segment.opacityDelta * easedProgress;\n    } else if (element.style.opacity) {\n      opacity = '';\n    }\n\n    // Compute transform origin\n    let transformOrigin: false | string = false;\n    if (segment.transformOrigin !== false) {\n      transformOrigin = segment.transformOrigin;\n    } else if (element.style.transformOrigin) {\n      transformOrigin = '';\n    }\n\n    // Compute CSS custom properties\n    const hasCustomProperties = segment.customPropertyNames.length > 0;\n\n    scheduler.write(() => {\n      if (opacity !== false) {\n        // @ts-ignore\n        element.style.opacity = opacity;\n      }\n      if (transformOrigin !== false) {\n        element.style.transformOrigin = transformOrigin;\n      }\n      if (hasCustomProperties) {\n        for (let i = 0; i < segment.customPropertyNames.length; i++) {\n          element.style.setProperty(\n            segment.customPropertyNames[i],\n            (\n              segment.customPropertyStarts[i] +\n              segment.customPropertyDeltas[i] * easedProgress\n            ).toString(),\n          );\n        }\n      }\n      element.style.transform = transformValue;\n    });\n  });\n}\n\n/**\n * Animate an element.\n */\nfunction singleAnimate(\n  element: HTMLElement,\n  keyframes: Keyframe[],\n  options: TweenOptions = {},\n): Animate {\n  const keyframesCount = keyframes.length - 1;\n  const normalizedKeyframes = keyframes.map(\n    (keyframe, index): NormalizedKeyframe => ({\n      ...keyframe,\n      offset: keyframe.offset ?? index / keyframesCount,\n      easing: normalizeEase(keyframe.easing),\n      vars: Object.keys(keyframe).filter((key) => startsWith(key, '--')),\n    }),\n  );\n\n  // Compile keyframe pairs into pre-computed segments (stage 1: partial evaluation)\n  const segments: CompiledSegment[] = [];\n  for (let i = 1; i < normalizedKeyframes.length; i++) {\n    segments.push(compileSegment(normalizedKeyframes[i - 1], normalizedKeyframes[i]));\n  }\n\n  if (!running.has(element)) {\n    running.set(element, new Map());\n  }\n\n  const key = `animate-${id}`;\n  id += 1;\n\n  /**\n   * Set the progress value.\n   */\n  function callback(progress: number) {\n    let segmentIndex = 0;\n    while (\n      segmentIndex < segments.length - 1 &&\n      segments[segmentIndex].toOffset <= progress &&\n      segments[segmentIndex].toOffset !== 1\n    ) {\n      segmentIndex += 1;\n    }\n\n    renderSegment(element, segments[segmentIndex], progress);\n  }\n\n  const controls = tween(callback, {\n    ...options,\n    onStart(progress) {\n      if (isFunction(options.onStart)) {\n        options.onStart(progress);\n      }\n      // Stop running instances\n      const runningKeys = running.get(element);\n      for (const [runningKey, runningPause] of runningKeys.entries()) {\n        runningPause();\n        runningKeys.delete(runningKey);\n      }\n      runningKeys.set(key, controls.pause);\n      running.set(element, runningKeys);\n    },\n  });\n\n  return controls;\n}\n\ntype Duration = number;\ntype Delay = number;\ntype DurationWithDelay = number;\n\n/**\n * Animate one or more elements.\n * @link https://js-toolkit.studiometa.dev/utils/css/animate.html\n */\nexport function animate(\n  elementOrElements: HTMLElement | HTMLElement[] | NodeListOf<HTMLElement>,\n  keyframes: Keyframe[],\n  options: AnimateOptions = {},\n): Animate {\n  if (elementOrElements instanceof HTMLElement) {\n    return singleAnimate(elementOrElements, keyframes, {\n      ...options,\n      duration: isFunction(options.duration)\n        ? options.duration(elementOrElements, 0)\n        : options.duration,\n    });\n  }\n\n  const stagger = options.stagger ?? 0;\n  const staggerIsFunction = isFunction(stagger);\n  const durationFn = isFunction(options.duration) ? options.duration : null;\n  const progressFn = isFunction(options.onProgress) ? options.onProgress : null;\n  const progresses: number[] = [];\n  const timings: [Duration, Delay, DurationWithDelay][] = [];\n  let duration = 0;\n  let progressSum = 0;\n  let elementCount = 0;\n\n  const controls = eachElements(elementOrElements, (element, index) => {\n    const delay = staggerIsFunction ? stagger(element, index) : stagger * index;\n    const itemOptions = { ...options, delay } as TweenOptions;\n\n    if (durationFn) {\n      itemOptions.duration = durationFn(element, index);\n    } else if (itemOptions.duration === undefined) {\n      itemOptions.duration = 1;\n    }\n\n    timings[index] = [itemOptions.duration, delay, itemOptions.duration + delay];\n\n    if (timings[index][2] > duration) {\n      // eslint-disable-next-line prefer-destructuring\n      duration = timings[index][2];\n    }\n\n    progresses[index] = 0;\n    elementCount = index + 1;\n    itemOptions.onProgress = (itemProgress) => {\n      progressSum += itemProgress - progresses[index];\n      progresses[index] = itemProgress;\n      if (progressFn) {\n        progressFn(progressSum / elementCount);\n      }\n    };\n\n    return singleAnimate(element, keyframes, itemOptions);\n  });\n\n  function forAll(key: string) {\n    for (const control of controls) {\n      control[key]();\n    }\n  }\n\n  function progress(newProgress?: number) {\n    if (newProgress !== undefined) {\n      const newTime = lerp(0, duration, newProgress);\n      for (let i = 0; i < controls.length; i++) {\n        const controlProgress = clamp01(map(newTime, timings[i][1], timings[i][2], 0, 1));\n        controls[i].progress(controlProgress);\n      }\n    }\n\n    return progressSum / elementCount;\n  }\n\n  return {\n    start: () => forAll('start'),\n    pause: () => forAll('pause'),\n    finish: () => forAll('finish'),\n    play: () => forAll('play'),\n    progress,\n  };\n}\n"],
+  "mappings": "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",
   "names": ["key"]
 }

package/utils/css/classes.d.ts

@@ -1,15 +1,15 @@
 /**
  * Add class names to an element.
  * @link https://js-toolkit.studiometa.dev/utils/css/addClass.html
-*/
+ */
 export declare function add(element: Element | Element[] | NodeListOf<Element>, classNames: string | string[]): void;
 /**
  * Remove class names from an element.
  * @link https://js-toolkit.studiometa.dev/utils/css/removeClass.html
-*/
+ */
 export declare function remove(element: Element | Element[] | NodeListOf<Element>, classNames: string | string[]): void;
 /**
  * Toggle class names from an element.
  * @link https://js-toolkit.studiometa.dev/utils/css/toggleClass.html
-*/
+ */
 export declare function toggle(element: Element | Element[] | NodeListOf<Element>, classNames: string | string[], force?: boolean): void;

package/utils/css/classes.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../packages/js-toolkit/utils/css/classes.ts"],
-  "sourcesContent": ["import { isArray } from '../is.js';\n// eslint-disable-next-line import/extensions\nimport { eachElements } from './utils.js';\n\n/**\n * Manage a list of classes as string on an element.\n */\nfunction setClasses(\n  element: Element | Element[] | NodeListOf<Element>,\n  classNames: string | string[],\n  method: 'add' | 'remove' | 'toggle',\n  forceToggle?: boolean,\n) {\n  if (!element || !classNames) {\n    return;\n  }\n\n  const normalizedClassNames = isArray(classNames)\n    ? classNames\n    : classNames.split(' ').filter((className) => className);\n\n  if (method !== 'toggle') {\n    eachElements(element, (el) => el.classList[method](...normalizedClassNames));\n  } else {\n    for (const className of normalizedClassNames)\n      eachElements(element, (el) => el.classList[method](className, forceToggle));\n  }\n}\n\n/**\n * Add class names to an element.\n * @link https://js-toolkit.studiometa.dev/utils/css/addClass.html\n*/\nexport function add(\n  element: Element | Element[] | NodeListOf<Element>,\n  classNames: string | string[],\n) {\n  setClasses(element, classNames, 'add');\n}\n\n/**\n * Remove class names from an element.\n * @link https://js-toolkit.studiometa.dev/utils/css/removeClass.html\n*/\nexport function remove(\n  element: Element | Element[] | NodeListOf<Element>,\n  classNames: string | string[],\n) {\n  setClasses(element, classNames, 'remove');\n}\n\n/**\n * Toggle class names from an element.\n * @link https://js-toolkit.studiometa.dev/utils/css/toggleClass.html\n*/\nexport function toggle(\n  element: Element | Element[] | NodeListOf<Element>,\n  classNames: string | string[],\n  force?: boolean,\n) {\n  setClasses(element, classNames, 'toggle', force);\n}\n"],
+  "sourcesContent": ["import { isArray } from '../is.js';\n// eslint-disable-next-line import/extensions\nimport { eachElements } from './utils.js';\n\n/**\n * Manage a list of classes as string on an element.\n */\nfunction setClasses(\n  element: Element | Element[] | NodeListOf<Element>,\n  classNames: string | string[],\n  method: 'add' | 'remove' | 'toggle',\n  forceToggle?: boolean,\n) {\n  if (!element || !classNames) {\n    return;\n  }\n\n  const normalizedClassNames = isArray(classNames)\n    ? classNames\n    : classNames.split(' ').filter((className) => className);\n\n  if (method !== 'toggle') {\n    eachElements(element, (el) => el.classList[method](...normalizedClassNames));\n  } else {\n    for (const className of normalizedClassNames)\n      eachElements(element, (el) => el.classList[method](className, forceToggle));\n  }\n}\n\n/**\n * Add class names to an element.\n * @link https://js-toolkit.studiometa.dev/utils/css/addClass.html\n */\nexport function add(\n  element: Element | Element[] | NodeListOf<Element>,\n  classNames: string | string[],\n) {\n  setClasses(element, classNames, 'add');\n}\n\n/**\n * Remove class names from an element.\n * @link https://js-toolkit.studiometa.dev/utils/css/removeClass.html\n */\nexport function remove(\n  element: Element | Element[] | NodeListOf<Element>,\n  classNames: string | string[],\n) {\n  setClasses(element, classNames, 'remove');\n}\n\n/**\n * Toggle class names from an element.\n * @link https://js-toolkit.studiometa.dev/utils/css/toggleClass.html\n */\nexport function toggle(\n  element: Element | Element[] | NodeListOf<Element>,\n  classNames: string | string[],\n  force?: boolean,\n) {\n  setClasses(element, classNames, 'toggle', force);\n}\n"],
   "mappings": "AAAA,SAAS,eAAe;AAExB,SAAS,oBAAoB;AAK7B,SAAS,WACP,SACA,YACA,QACA,aACA;AACA,MAAI,CAAC,WAAW,CAAC,YAAY;AAC3B;AAAA,EACF;AAEA,QAAM,uBAAuB,QAAQ,UAAU,IAC3C,aACA,WAAW,MAAM,GAAG,EAAE,OAAO,CAAC,cAAc,SAAS;AAEzD,MAAI,WAAW,UAAU;AACvB,iBAAa,SAAS,CAAC,OAAO,GAAG,UAAU,MAAM,EAAE,GAAG,oBAAoB,CAAC;AAAA,EAC7E,OAAO;AACL,eAAW,aAAa;AACtB,mBAAa,SAAS,CAAC,OAAO,GAAG,UAAU,MAAM,EAAE,WAAW,WAAW,CAAC;AAAA,EAC9E;AACF;AAMO,SAAS,IACd,SACA,YACA;AACA,aAAW,SAAS,YAAY,KAAK;AACvC;AAMO,SAAS,OACd,SACA,YACA;AACA,aAAW,SAAS,YAAY,QAAQ;AAC1C;AAMO,SAAS,OACd,SACA,YACA,OACA;AACA,aAAW,SAAS,YAAY,UAAU,KAAK;AACjD;",
   "names": []
 }

package/utils/css/getOffsetSizes.d.ts

@@ -1,7 +1,7 @@
 /**
  * Get a `DOMRect` like `Object` for an element, without its transforms.
  * @link https://js-toolkit.studiometa.dev/utils/css/getOffsetSizes.html
-*/
+ */
 export declare function getOffsetSizes(element: HTMLElement): {
     x: number;
     y: number;

package/utils/css/getOffsetSizes.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../packages/js-toolkit/utils/css/getOffsetSizes.ts"],
-  "sourcesContent": ["/**\n * Get a `DOMRect` like `Object` for an element, without its transforms.\n * @link https://js-toolkit.studiometa.dev/utils/css/getOffsetSizes.html\n*/\nexport function getOffsetSizes(element: HTMLElement) {\n  let parent = element;\n  let x = -window.scrollX;\n  let y = -window.scrollY;\n\n  while (parent) {\n    x += parent.offsetLeft;\n    y += parent.offsetTop;\n    // @ts-ignore\n    parent = parent.offsetParent;\n  }\n\n  const width = element.offsetWidth;\n  const height = element.offsetHeight;\n\n  return {\n    x,\n    y,\n    width,\n    height,\n    top: y,\n    right: width + x,\n    bottom: height + y,\n    left: x,\n  };\n}\n"],
+  "sourcesContent": ["/**\n * Get a `DOMRect` like `Object` for an element, without its transforms.\n * @link https://js-toolkit.studiometa.dev/utils/css/getOffsetSizes.html\n */\nexport function getOffsetSizes(element: HTMLElement) {\n  let parent = element;\n  let x = -window.scrollX;\n  let y = -window.scrollY;\n\n  while (parent) {\n    x += parent.offsetLeft;\n    y += parent.offsetTop;\n    // @ts-ignore\n    parent = parent.offsetParent;\n  }\n\n  const width = element.offsetWidth;\n  const height = element.offsetHeight;\n\n  return {\n    x,\n    y,\n    width,\n    height,\n    top: y,\n    right: width + x,\n    bottom: height + y,\n    left: x,\n  };\n}\n"],
   "mappings": "AAIO,SAAS,eAAe,SAAsB;AACnD,MAAI,SAAS;AACb,MAAI,IAAI,CAAC,OAAO;AAChB,MAAI,IAAI,CAAC,OAAO;AAEhB,SAAO,QAAQ;AACb,SAAK,OAAO;AACZ,SAAK,OAAO;AAEZ,aAAS,OAAO;AAAA,EAClB;AAEA,QAAM,QAAQ,QAAQ;AACtB,QAAM,SAAS,QAAQ;AAEvB,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,KAAK;AAAA,IACL,OAAO,QAAQ;AAAA,IACf,QAAQ,SAAS;AAAA,IACjB,MAAM;AAAA,EACR;AACF;",
   "names": []
 }

package/utils/css/matrix.d.ts

@@ -23,6 +23,6 @@ type MatrixTransform = {
  * // matrix(0.5, 0, 0, 0.5, 0, 0)
  * ```
  * @link https://js-toolkit.studiometa.dev/utils/css/matrix.html
-*/
+ */
 export declare function matrix(transform?: MatrixTransform): string;
 export {};

package/utils/css/matrix.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../packages/js-toolkit/utils/css/matrix.ts"],
-  "sourcesContent": ["type MatrixTransform = {\n  scaleX?: number;\n  scaleY?: number;\n  skewX?: number;\n  skewY?: number;\n  translateX?: number;\n  translateY?: number;\n};\n\n/**\n * Format a CSS transform matrix with the given values.\n *\n * @param  {Object} transform\n * @param  {number} [transform.scaleX=1]     The scale on the x axis.\n * @param  {number} [transform.scaleY=1]     The scale on the y axis.\n * @param  {number} [transform.skewX=0]      The skew on the x axis.\n * @param  {number} [transform.skewY=0]      The skew on the y axis.\n * @param  {number} [transform.translateX=0] The translate on the x axis.\n * @param  {number} [transform.translateY=0] The translate on the y axis.\n * @return {string}                           A formatted CSS matrix transform.\n * @example\n * ```js\n * matrix({ scaleX: 0.5, scaleY: 0.5 });\n * // matrix(0.5, 0, 0, 0.5, 0, 0)\n * ```\n * @link https://js-toolkit.studiometa.dev/utils/css/matrix.html\n*/\nexport function matrix(transform?: MatrixTransform): string {\n  // eslint-disable-next-line no-param-reassign\n  transform = transform || {};\n  return `matrix(${transform.scaleX ?? 1}, ${transform.skewY ?? 0}, ${transform.skewX ?? 0}, ${\n    transform.scaleY ?? 1\n  }, ${transform.translateX ?? 0}, ${transform.translateY ?? 0})`;\n}\n"],
+  "sourcesContent": ["type MatrixTransform = {\n  scaleX?: number;\n  scaleY?: number;\n  skewX?: number;\n  skewY?: number;\n  translateX?: number;\n  translateY?: number;\n};\n\n/**\n * Format a CSS transform matrix with the given values.\n *\n * @param  {Object} transform\n * @param  {number} [transform.scaleX=1]     The scale on the x axis.\n * @param  {number} [transform.scaleY=1]     The scale on the y axis.\n * @param  {number} [transform.skewX=0]      The skew on the x axis.\n * @param  {number} [transform.skewY=0]      The skew on the y axis.\n * @param  {number} [transform.translateX=0] The translate on the x axis.\n * @param  {number} [transform.translateY=0] The translate on the y axis.\n * @return {string}                           A formatted CSS matrix transform.\n * @example\n * ```js\n * matrix({ scaleX: 0.5, scaleY: 0.5 });\n * // matrix(0.5, 0, 0, 0.5, 0, 0)\n * ```\n * @link https://js-toolkit.studiometa.dev/utils/css/matrix.html\n */\nexport function matrix(transform?: MatrixTransform): string {\n  // eslint-disable-next-line no-param-reassign\n  transform = transform || {};\n  return `matrix(${transform.scaleX ?? 1}, ${transform.skewY ?? 0}, ${transform.skewX ?? 0}, ${\n    transform.scaleY ?? 1\n  }, ${transform.translateX ?? 0}, ${transform.translateY ?? 0})`;\n}\n"],
   "mappings": "AA2BO,SAAS,OAAO,WAAqC;AAE1D,cAAY,aAAa,CAAC;AAC1B,SAAO,UAAU,UAAU,UAAU,CAAC,KAAK,UAAU,SAAS,CAAC,KAAK,UAAU,SAAS,CAAC,KACtF,UAAU,UAAU,CACtB,KAAK,UAAU,cAAc,CAAC,KAAK,UAAU,cAAc,CAAC;AAC9D;",
   "names": []
 }

package/utils/css/styles.d.ts

@@ -1,10 +1,10 @@
 /**
  * Add styles to an element.
  * @link https://js-toolkit.studiometa.dev/utils/css/addStyle.html
-*/
+ */
 export declare function add(elementOrElements: HTMLElement | HTMLElement[] | NodeListOf<HTMLElement>, styles: Partial<CSSStyleDeclaration>): void;
 /**
  * Remove class names from an element.
  * @link https://js-toolkit.studiometa.dev/utils/css/removeStyle.html
-*/
+ */
 export declare function remove(elementOrElements: HTMLElement | HTMLElement[] | NodeListOf<HTMLElement>, styles: Partial<CSSStyleDeclaration>): void;

package/utils/css/styles.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../packages/js-toolkit/utils/css/styles.ts"],
-  "sourcesContent": ["import { isObject } from '../is.js';\n// eslint-disable-next-line import/extensions\nimport { eachElements } from './utils.js';\n\n/**\n * Manage a list of style properties on an element.\n */\nfunction setStyles(\n  elementOrElements: HTMLElement | HTMLElement[] | NodeListOf<HTMLElement>,\n  styles: Partial<CSSStyleDeclaration>,\n  method: 'add' | 'remove' = 'add',\n) {\n  if (!elementOrElements || !styles || !isObject(styles)) {\n    return;\n  }\n\n  eachElements(elementOrElements, (el) => {\n    for (const [prop, value] of Object.entries(styles)) {\n      el.style[prop] = method === 'add' ? value : '';\n    }\n  });\n}\n\n/**\n * Add styles to an element.\n * @link https://js-toolkit.studiometa.dev/utils/css/addStyle.html\n*/\nexport function add(\n  elementOrElements: HTMLElement | HTMLElement[] | NodeListOf<HTMLElement>,\n  styles: Partial<CSSStyleDeclaration>,\n) {\n  setStyles(elementOrElements, styles);\n}\n\n/**\n * Remove class names from an element.\n * @link https://js-toolkit.studiometa.dev/utils/css/removeStyle.html\n*/\nexport function remove(\n  elementOrElements: HTMLElement | HTMLElement[] | NodeListOf<HTMLElement>,\n  styles: Partial<CSSStyleDeclaration>,\n) {\n  setStyles(elementOrElements, styles, 'remove');\n}\n"],
+  "sourcesContent": ["import { isObject } from '../is.js';\n// eslint-disable-next-line import/extensions\nimport { eachElements } from './utils.js';\n\n/**\n * Manage a list of style properties on an element.\n */\nfunction setStyles(\n  elementOrElements: HTMLElement | HTMLElement[] | NodeListOf<HTMLElement>,\n  styles: Partial<CSSStyleDeclaration>,\n  method: 'add' | 'remove' = 'add',\n) {\n  if (!elementOrElements || !styles || !isObject(styles)) {\n    return;\n  }\n\n  eachElements(elementOrElements, (el) => {\n    for (const [prop, value] of Object.entries(styles)) {\n      el.style[prop] = method === 'add' ? value : '';\n    }\n  });\n}\n\n/**\n * Add styles to an element.\n * @link https://js-toolkit.studiometa.dev/utils/css/addStyle.html\n */\nexport function add(\n  elementOrElements: HTMLElement | HTMLElement[] | NodeListOf<HTMLElement>,\n  styles: Partial<CSSStyleDeclaration>,\n) {\n  setStyles(elementOrElements, styles);\n}\n\n/**\n * Remove class names from an element.\n * @link https://js-toolkit.studiometa.dev/utils/css/removeStyle.html\n */\nexport function remove(\n  elementOrElements: HTMLElement | HTMLElement[] | NodeListOf<HTMLElement>,\n  styles: Partial<CSSStyleDeclaration>,\n) {\n  setStyles(elementOrElements, styles, 'remove');\n}\n"],
   "mappings": "AAAA,SAAS,gBAAgB;AAEzB,SAAS,oBAAoB;AAK7B,SAAS,UACP,mBACA,QACA,SAA2B,OAC3B;AACA,MAAI,CAAC,qBAAqB,CAAC,UAAU,CAAC,SAAS,MAAM,GAAG;AACtD;AAAA,EACF;AAEA,eAAa,mBAAmB,CAAC,OAAO;AACtC,eAAW,CAAC,MAAM,KAAK,KAAK,OAAO,QAAQ,MAAM,GAAG;AAClD,SAAG,MAAM,IAAI,IAAI,WAAW,QAAQ,QAAQ;AAAA,IAC9C;AAAA,EACF,CAAC;AACH;AAMO,SAAS,IACd,mBACA,QACA;AACA,YAAU,mBAAmB,MAAM;AACrC;AAMO,SAAS,OACd,mBACA,QACA;AACA,YAAU,mBAAmB,QAAQ,QAAQ;AAC/C;",
   "names": []
 }

package/utils/css/transform.d.ts

@@ -18,5 +18,5 @@ export declare const TRANSFORM_PROPS: string[];
 /**
  * Generate a CSS transform.
  * @link https://js-toolkit.studiometa.dev/utils/css/transform.html
-*/
+ */
 export declare function transform(elementOrElements: HTMLElement | HTMLElement[] | NodeListOf<HTMLElement>, props: TransformProps): string;

package/utils/css/transform.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../packages/js-toolkit/utils/css/transform.ts"],
-  "sourcesContent": ["// eslint-disable-next-line import/extensions\nimport { eachElements } from './utils.js';\n\nexport type TransformProps = Partial<{\n  x: number;\n  y: number;\n  z: number;\n  rotate: number;\n  rotateX: number;\n  rotateY: number;\n  rotateZ: number;\n  scale: number;\n  scaleX: number;\n  scaleY: number;\n  scaleZ: number;\n  skew: number;\n  skewX: number;\n  skewY: number;\n}>;\n\nexport const TRANSFORM_PROPS = [\n  'x',\n  'y',\n  'z',\n  'rotate',\n  'rotateX',\n  'rotateY',\n  'rotateZ',\n  'scale',\n  'scaleX',\n  'scaleY',\n  'scaleZ',\n  'skew',\n  'skewX',\n  'skewY',\n];\n\n/**\n * Generate a CSS transform.\n * @link https://js-toolkit.studiometa.dev/utils/css/transform.html\n*/\nexport function transform(\n  elementOrElements: HTMLElement | HTMLElement[] | NodeListOf<HTMLElement>,\n  props: TransformProps,\n): string {\n  if (!elementOrElements) return\n\n  let value = '';\n\n  if (props.x !== undefined || props.y !== undefined || props.z !== undefined) {\n    value += `translate3d(${props.x ?? 0}px, ${props.y ?? 0}px, ${props.z ?? 0}px) `;\n  }\n\n  if (props.rotate !== undefined) {\n    value += `rotate(${props.rotate}deg) `;\n  } else {\n    if (props.rotateX !== undefined) {\n      value += `rotateX(${props.rotateX}deg) `;\n    }\n\n    if (props.rotateY !== undefined) {\n      value += `rotateY(${props.rotateY}deg) `;\n    }\n\n    if (props.rotateZ !== undefined) {\n      value += `rotateZ(${props.rotateZ}deg) `;\n    }\n  }\n\n  if (props.scale !== undefined) {\n    value += `scale(${props.scale}) `;\n  } else {\n    if (props.scaleX !== undefined) {\n      value += `scaleX(${props.scaleX}) `;\n    }\n\n    if (props.scaleY !== undefined) {\n      value += `scaleY(${props.scaleY}) `;\n    }\n\n    if (props.scaleZ !== undefined) {\n      value += `scaleZ(${props.scaleZ}) `;\n    }\n  }\n\n  if (props.skew !== undefined) {\n    value += `skew(${props.skew}deg) `;\n  } else {\n    if (props.skewX !== undefined) {\n      value += `skewX(${props.skewX}deg) `;\n    }\n\n    if (props.skewY !== undefined) {\n      value += `skewY(${props.skewY}deg) `;\n    }\n  }\n\n  eachElements(elementOrElements, (element) => {\n    element.style.transform = value;\n  });\n  return value;\n}\n"],
+  "sourcesContent": ["// eslint-disable-next-line import/extensions\nimport { eachElements } from './utils.js';\n\nexport type TransformProps = Partial<{\n  x: number;\n  y: number;\n  z: number;\n  rotate: number;\n  rotateX: number;\n  rotateY: number;\n  rotateZ: number;\n  scale: number;\n  scaleX: number;\n  scaleY: number;\n  scaleZ: number;\n  skew: number;\n  skewX: number;\n  skewY: number;\n}>;\n\nexport const TRANSFORM_PROPS = [\n  'x',\n  'y',\n  'z',\n  'rotate',\n  'rotateX',\n  'rotateY',\n  'rotateZ',\n  'scale',\n  'scaleX',\n  'scaleY',\n  'scaleZ',\n  'skew',\n  'skewX',\n  'skewY',\n];\n\n/**\n * Generate a CSS transform.\n * @link https://js-toolkit.studiometa.dev/utils/css/transform.html\n */\nexport function transform(\n  elementOrElements: HTMLElement | HTMLElement[] | NodeListOf<HTMLElement>,\n  props: TransformProps,\n): string {\n  if (!elementOrElements) return;\n\n  let value = '';\n\n  if (props.x !== undefined || props.y !== undefined || props.z !== undefined) {\n    value += `translate3d(${props.x ?? 0}px, ${props.y ?? 0}px, ${props.z ?? 0}px) `;\n  }\n\n  if (props.rotate !== undefined) {\n    value += `rotate(${props.rotate}deg) `;\n  } else {\n    if (props.rotateX !== undefined) {\n      value += `rotateX(${props.rotateX}deg) `;\n    }\n\n    if (props.rotateY !== undefined) {\n      value += `rotateY(${props.rotateY}deg) `;\n    }\n\n    if (props.rotateZ !== undefined) {\n      value += `rotateZ(${props.rotateZ}deg) `;\n    }\n  }\n\n  if (props.scale !== undefined) {\n    value += `scale(${props.scale}) `;\n  } else {\n    if (props.scaleX !== undefined) {\n      value += `scaleX(${props.scaleX}) `;\n    }\n\n    if (props.scaleY !== undefined) {\n      value += `scaleY(${props.scaleY}) `;\n    }\n\n    if (props.scaleZ !== undefined) {\n      value += `scaleZ(${props.scaleZ}) `;\n    }\n  }\n\n  if (props.skew !== undefined) {\n    value += `skew(${props.skew}deg) `;\n  } else {\n    if (props.skewX !== undefined) {\n      value += `skewX(${props.skewX}deg) `;\n    }\n\n    if (props.skewY !== undefined) {\n      value += `skewY(${props.skewY}deg) `;\n    }\n  }\n\n  eachElements(elementOrElements, (element) => {\n    element.style.transform = value;\n  });\n  return value;\n}\n"],
   "mappings": "AACA,SAAS,oBAAoB;AAmBtB,MAAM,kBAAkB;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAMO,SAAS,UACd,mBACA,OACQ;AACR,MAAI,CAAC,kBAAmB;AAExB,MAAI,QAAQ;AAEZ,MAAI,MAAM,MAAM,UAAa,MAAM,MAAM,UAAa,MAAM,MAAM,QAAW;AAC3E,aAAS,eAAe,MAAM,KAAK,CAAC,OAAO,MAAM,KAAK,CAAC,OAAO,MAAM,KAAK,CAAC;AAAA,EAC5E;AAEA,MAAI,MAAM,WAAW,QAAW;AAC9B,aAAS,UAAU,MAAM,MAAM;AAAA,EACjC,OAAO;AACL,QAAI,MAAM,YAAY,QAAW;AAC/B,eAAS,WAAW,MAAM,OAAO;AAAA,IACnC;AAEA,QAAI,MAAM,YAAY,QAAW;AAC/B,eAAS,WAAW,MAAM,OAAO;AAAA,IACnC;AAEA,QAAI,MAAM,YAAY,QAAW;AAC/B,eAAS,WAAW,MAAM,OAAO;AAAA,IACnC;AAAA,EACF;AAEA,MAAI,MAAM,UAAU,QAAW;AAC7B,aAAS,SAAS,MAAM,KAAK;AAAA,EAC/B,OAAO;AACL,QAAI,MAAM,WAAW,QAAW;AAC9B,eAAS,UAAU,MAAM,MAAM;AAAA,IACjC;AAEA,QAAI,MAAM,WAAW,QAAW;AAC9B,eAAS,UAAU,MAAM,MAAM;AAAA,IACjC;AAEA,QAAI,MAAM,WAAW,QAAW;AAC9B,eAAS,UAAU,MAAM,MAAM;AAAA,IACjC;AAAA,EACF;AAEA,MAAI,MAAM,SAAS,QAAW;AAC5B,aAAS,QAAQ,MAAM,IAAI;AAAA,EAC7B,OAAO;AACL,QAAI,MAAM,UAAU,QAAW;AAC7B,eAAS,SAAS,MAAM,KAAK;AAAA,IAC/B;AAEA,QAAI,MAAM,UAAU,QAAW;AAC7B,eAAS,SAAS,MAAM,KAAK;AAAA,IAC/B;AAAA,EACF;AAEA,eAAa,mBAAmB,CAAC,YAAY;AAC3C,YAAQ,MAAM,YAAY;AAAA,EAC5B,CAAC;AACD,SAAO;AACT;",
   "names": []
 }

package/utils/css/transition.d.ts

@@ -16,5 +16,5 @@ export declare function setClassesOrStyles(element: HTMLElement, classesOrStyles
  * @param  {string}                                            endMode           Whether to remove or keep the `to` classes/styles
  * @return {Promise<void>}                                                      A promise resolving at the end of the transition.
  * @link https://js-toolkit.studiometa.dev/utils/css/transition.html
-*/
+ */
 export declare function transition(elementOrElements: HTMLElement | HTMLElement[] | NodeListOf<HTMLElement>, name: string | TransitionStyles, endMode?: 'keep' | 'remove'): Promise<void>;