@studiometa/js-toolkit 2.5.0 → 2.6.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/Base/index.cjs +56 -62
- package/Base/index.cjs.map +7 -0
- package/Base/index.d.ts +5 -5
- package/Base/index.js +63 -69
- package/Base/index.js.map +7 -0
- package/Base/managers/AbstractManager.cjs +8 -12
- package/Base/managers/AbstractManager.cjs.map +7 -0
- package/Base/managers/AbstractManager.d.ts +11 -21
- package/Base/managers/AbstractManager.js +7 -12
- package/Base/managers/AbstractManager.js.map +7 -0
- package/Base/managers/ChildrenManager.cjs +6 -20
- package/Base/managers/ChildrenManager.cjs.map +7 -0
- package/Base/managers/ChildrenManager.d.ts +2 -2
- package/Base/managers/ChildrenManager.js +5 -14
- package/Base/managers/ChildrenManager.js.map +7 -0
- package/Base/managers/EventsManager.cjs +60 -64
- package/Base/managers/EventsManager.cjs.map +7 -0
- package/Base/managers/EventsManager.d.ts +2 -2
- package/Base/managers/EventsManager.js +59 -64
- package/Base/managers/EventsManager.js.map +7 -0
- package/Base/managers/OptionsManager.cjs +14 -22
- package/Base/managers/OptionsManager.cjs.map +7 -0
- package/Base/managers/OptionsManager.d.ts +42 -55
- package/Base/managers/OptionsManager.js +12 -21
- package/Base/managers/OptionsManager.js.map +7 -0
- package/Base/managers/RefsManager.cjs +11 -16
- package/Base/managers/RefsManager.cjs.map +7 -0
- package/Base/managers/RefsManager.d.ts +3 -11
- package/Base/managers/RefsManager.js +9 -8
- package/Base/managers/RefsManager.js.map +7 -0
- package/Base/managers/ResponsiveOptionsManager.cjs +4 -9
- package/Base/managers/ResponsiveOptionsManager.cjs.map +7 -0
- package/Base/managers/ResponsiveOptionsManager.d.ts +8 -4
- package/Base/managers/ResponsiveOptionsManager.js +3 -2
- package/Base/managers/ResponsiveOptionsManager.js.map +7 -0
- package/Base/managers/ServicesManager.cjs +21 -45
- package/Base/managers/ServicesManager.cjs.map +7 -0
- package/Base/managers/ServicesManager.d.ts +33 -58
- package/Base/managers/ServicesManager.js +13 -32
- package/Base/managers/ServicesManager.js.map +7 -0
- package/Base/types.cjs +1 -0
- package/Base/types.cjs.map +7 -0
- package/Base/types.js +1 -0
- package/Base/types.js.map +7 -0
- package/Base/utils.cjs +1 -0
- package/Base/utils.cjs.map +7 -0
- package/Base/utils.js +1 -0
- package/Base/utils.js.map +7 -0
- package/decorators/index.cjs +1 -0
- package/decorators/index.cjs.map +7 -0
- package/decorators/index.js +1 -0
- package/decorators/index.js.map +7 -0
- package/decorators/withBreakpointManager.cjs +1 -0
- package/decorators/withBreakpointManager.cjs.map +7 -0
- package/decorators/withBreakpointManager.js +1 -0
- package/decorators/withBreakpointManager.js.map +7 -0
- package/decorators/withBreakpointObserver.cjs +10 -15
- package/decorators/withBreakpointObserver.cjs.map +7 -0
- package/decorators/withBreakpointObserver.js +10 -16
- package/decorators/withBreakpointObserver.js.map +7 -0
- package/decorators/withDrag.cjs +5 -9
- package/decorators/withDrag.cjs.map +7 -0
- package/decorators/withDrag.js +5 -10
- package/decorators/withDrag.js.map +7 -0
- package/decorators/withExtraConfig.cjs +2 -6
- package/decorators/withExtraConfig.cjs.map +7 -0
- package/decorators/withExtraConfig.js +2 -7
- package/decorators/withExtraConfig.js.map +7 -0
- package/decorators/withFreezedOptions.cjs +2 -9
- package/decorators/withFreezedOptions.cjs.map +7 -0
- package/decorators/withFreezedOptions.js +2 -10
- package/decorators/withFreezedOptions.js.map +7 -0
- package/decorators/withIntersectionObserver.cjs +11 -16
- package/decorators/withIntersectionObserver.cjs.map +7 -0
- package/decorators/withIntersectionObserver.js +11 -17
- package/decorators/withIntersectionObserver.js.map +7 -0
- package/decorators/withMountWhenInView.cjs +11 -16
- package/decorators/withMountWhenInView.cjs.map +7 -0
- package/decorators/withMountWhenInView.js +11 -17
- package/decorators/withMountWhenInView.js.map +7 -0
- package/decorators/withResponsiveOptions.cjs +3 -8
- package/decorators/withResponsiveOptions.cjs.map +7 -0
- package/decorators/withResponsiveOptions.js +2 -1
- package/decorators/withResponsiveOptions.js.map +7 -0
- package/decorators/withScrolledInView.cjs +45 -50
- package/decorators/withScrolledInView.cjs.map +7 -0
- package/decorators/withScrolledInView.js +45 -51
- package/decorators/withScrolledInView.js.map +7 -0
- package/decorators/withVue2.cjs +9 -15
- package/decorators/withVue2.cjs.map +7 -0
- package/decorators/withVue2.js +9 -16
- package/decorators/withVue2.js.map +7 -0
- package/helpers/createApp.cjs +1 -0
- package/helpers/createApp.cjs.map +7 -0
- package/helpers/createApp.js +1 -0
- package/helpers/createApp.js.map +7 -0
- package/helpers/getClosestParent.cjs +1 -0
- package/helpers/getClosestParent.cjs.map +7 -0
- package/helpers/getClosestParent.js +1 -0
- package/helpers/getClosestParent.js.map +7 -0
- package/helpers/getDirectChildren.cjs +1 -0
- package/helpers/getDirectChildren.cjs.map +7 -0
- package/helpers/getDirectChildren.js +1 -0
- package/helpers/getDirectChildren.js.map +7 -0
- package/helpers/getInstanceFromElement.cjs +1 -0
- package/helpers/getInstanceFromElement.cjs.map +7 -0
- package/helpers/getInstanceFromElement.js +1 -0
- package/helpers/getInstanceFromElement.js.map +7 -0
- package/helpers/importOnInteraction.cjs +2 -1
- package/helpers/importOnInteraction.cjs.map +7 -0
- package/helpers/importOnInteraction.js +2 -1
- package/helpers/importOnInteraction.js.map +7 -0
- package/helpers/importWhenIdle.cjs +1 -0
- package/helpers/importWhenIdle.cjs.map +7 -0
- package/helpers/importWhenIdle.js +1 -0
- package/helpers/importWhenIdle.js.map +7 -0
- package/helpers/importWhenVisible.cjs +2 -1
- package/helpers/importWhenVisible.cjs.map +7 -0
- package/helpers/importWhenVisible.js +2 -1
- package/helpers/importWhenVisible.js.map +7 -0
- package/helpers/index.cjs +1 -0
- package/helpers/index.cjs.map +7 -0
- package/helpers/index.js +1 -0
- package/helpers/index.js.map +7 -0
- package/helpers/utils.cjs +1 -0
- package/helpers/utils.cjs.map +7 -0
- package/helpers/utils.js +1 -0
- package/helpers/utils.js.map +7 -0
- package/index.cjs +1 -0
- package/index.cjs.map +7 -0
- package/index.js +1 -0
- package/index.js.map +7 -0
- package/package.json +1 -1
- package/services/drag.cjs +1 -0
- package/services/drag.cjs.map +7 -0
- package/services/drag.js +1 -0
- package/services/drag.js.map +7 -0
- package/services/index.cjs +1 -0
- package/services/index.cjs.map +7 -0
- package/services/index.js +1 -0
- package/services/index.js.map +7 -0
- package/services/key.cjs +2 -1
- package/services/key.cjs.map +7 -0
- package/services/key.js +2 -1
- package/services/key.js.map +7 -0
- package/services/load.cjs +1 -0
- package/services/load.cjs.map +7 -0
- package/services/load.js +1 -0
- package/services/load.js.map +7 -0
- package/services/pointer.cjs +3 -3
- package/services/pointer.cjs.map +7 -0
- package/services/pointer.js +3 -3
- package/services/pointer.js.map +7 -0
- package/services/raf.cjs +1 -0
- package/services/raf.cjs.map +7 -0
- package/services/raf.js +1 -0
- package/services/raf.js.map +7 -0
- package/services/resize.cjs +1 -0
- package/services/resize.cjs.map +7 -0
- package/services/resize.js +1 -0
- package/services/resize.js.map +7 -0
- package/services/scroll.cjs +1 -0
- package/services/scroll.cjs.map +7 -0
- package/services/scroll.js +1 -0
- package/services/scroll.js.map +7 -0
- package/services/service.cjs +1 -0
- package/services/service.cjs.map +7 -0
- package/services/service.js +1 -0
- package/services/service.js.map +7 -0
- package/utils/collide/boundingRectToCircle.cjs +1 -0
- package/utils/collide/boundingRectToCircle.cjs.map +7 -0
- package/utils/collide/boundingRectToCircle.js +1 -0
- package/utils/collide/boundingRectToCircle.js.map +7 -0
- package/utils/collide/collideCircleCircle.cjs +1 -0
- package/utils/collide/collideCircleCircle.cjs.map +7 -0
- package/utils/collide/collideCircleCircle.js +1 -0
- package/utils/collide/collideCircleCircle.js.map +7 -0
- package/utils/collide/collideCircleRect.cjs +1 -0
- package/utils/collide/collideCircleRect.cjs.map +7 -0
- package/utils/collide/collideCircleRect.js +1 -0
- package/utils/collide/collideCircleRect.js.map +7 -0
- package/utils/collide/collidePointCircle.cjs +1 -0
- package/utils/collide/collidePointCircle.cjs.map +7 -0
- package/utils/collide/collidePointCircle.js +1 -0
- package/utils/collide/collidePointCircle.js.map +7 -0
- package/utils/collide/collidePointRect.cjs +1 -0
- package/utils/collide/collidePointRect.cjs.map +7 -0
- package/utils/collide/collidePointRect.js +1 -0
- package/utils/collide/collidePointRect.js.map +7 -0
- package/utils/collide/collideRectRect.cjs +1 -0
- package/utils/collide/collideRectRect.cjs.map +7 -0
- package/utils/collide/collideRectRect.js +1 -0
- package/utils/collide/collideRectRect.js.map +7 -0
- package/utils/collide/index.cjs +1 -0
- package/utils/collide/index.cjs.map +7 -0
- package/utils/collide/index.js +1 -0
- package/utils/collide/index.js.map +7 -0
- package/utils/css/animate.cjs +38 -14
- package/utils/css/animate.cjs.map +7 -0
- package/utils/css/animate.d.ts +4 -24
- package/utils/css/animate.js +38 -14
- package/utils/css/animate.js.map +7 -0
- package/utils/css/classes.cjs +7 -3
- package/utils/css/classes.cjs.map +7 -0
- package/utils/css/classes.d.ts +6 -6
- package/utils/css/classes.js +7 -3
- package/utils/css/classes.js.map +7 -0
- package/utils/css/getOffsetSizes.cjs +1 -0
- package/utils/css/getOffsetSizes.cjs.map +7 -0
- package/utils/css/getOffsetSizes.js +1 -0
- package/utils/css/getOffsetSizes.js.map +7 -0
- package/utils/css/index.cjs +2 -1
- package/utils/css/index.cjs.map +7 -0
- package/utils/css/index.d.ts +7 -7
- package/utils/css/index.js +1 -0
- package/utils/css/index.js.map +7 -0
- package/utils/css/matrix.cjs +2 -2
- package/utils/css/matrix.cjs.map +7 -0
- package/utils/css/matrix.js +2 -2
- package/utils/css/matrix.js.map +7 -0
- package/utils/css/styles.cjs +12 -8
- package/utils/css/styles.cjs.map +7 -0
- package/utils/css/styles.d.ts +4 -4
- package/utils/css/styles.js +12 -8
- package/utils/css/styles.js.map +7 -0
- package/utils/css/transform.cjs +7 -4
- package/utils/css/transform.cjs.map +7 -0
- package/utils/css/transform.d.ts +2 -2
- package/utils/css/transform.js +7 -4
- package/utils/css/transform.js.map +7 -0
- package/utils/css/transition.cjs +10 -8
- package/utils/css/transition.cjs.map +7 -0
- package/utils/css/transition.d.ts +5 -8
- package/utils/css/transition.js +10 -9
- package/utils/css/transition.js.map +7 -0
- package/utils/css/utils.cjs +32 -0
- package/utils/css/utils.cjs.map +7 -0
- package/utils/css/utils.d.ts +1 -0
- package/utils/css/utils.js +10 -0
- package/utils/css/utils.js.map +7 -0
- package/utils/debounce.cjs +1 -0
- package/utils/debounce.cjs.map +7 -0
- package/utils/debounce.js +1 -0
- package/utils/debounce.js.map +7 -0
- package/utils/focusTrap.cjs +1 -0
- package/utils/focusTrap.cjs.map +7 -0
- package/utils/focusTrap.js +1 -0
- package/utils/focusTrap.js.map +7 -0
- package/utils/has.cjs +1 -0
- package/utils/has.cjs.map +7 -0
- package/utils/has.js +1 -0
- package/utils/has.js.map +7 -0
- package/utils/history.cjs +1 -0
- package/utils/history.cjs.map +7 -0
- package/utils/history.js +1 -0
- package/utils/history.js.map +7 -0
- package/utils/index.cjs +2 -1
- package/utils/index.cjs.map +7 -0
- package/utils/index.d.ts +19 -19
- package/utils/index.js +1 -0
- package/utils/index.js.map +7 -0
- package/utils/is.cjs +1 -0
- package/utils/is.cjs.map +7 -0
- package/utils/is.js +1 -0
- package/utils/is.js.map +7 -0
- package/utils/keyCodes.cjs +1 -0
- package/utils/keyCodes.cjs.map +7 -0
- package/utils/keyCodes.js +1 -0
- package/utils/keyCodes.js.map +7 -0
- package/utils/math/clamp.cjs +1 -0
- package/utils/math/clamp.cjs.map +7 -0
- package/utils/math/clamp.js +1 -0
- package/utils/math/clamp.js.map +7 -0
- package/utils/math/clamp01.cjs +1 -0
- package/utils/math/clamp01.cjs.map +7 -0
- package/utils/math/clamp01.js +1 -0
- package/utils/math/clamp01.js.map +7 -0
- package/utils/math/createEases.cjs +1 -0
- package/utils/math/createEases.cjs.map +7 -0
- package/utils/math/createEases.js +1 -0
- package/utils/math/createEases.js.map +7 -0
- package/utils/math/damp.cjs +1 -0
- package/utils/math/damp.cjs.map +7 -0
- package/utils/math/damp.js +1 -0
- package/utils/math/damp.js.map +7 -0
- package/utils/math/ease.cjs +1 -0
- package/utils/math/ease.cjs.map +7 -0
- package/utils/math/ease.js +1 -0
- package/utils/math/ease.js.map +7 -0
- package/utils/math/index.cjs +1 -0
- package/utils/math/index.cjs.map +7 -0
- package/utils/math/index.js +1 -0
- package/utils/math/index.js.map +7 -0
- package/utils/math/inertiaFinalValue.cjs +1 -0
- package/utils/math/inertiaFinalValue.cjs.map +7 -0
- package/utils/math/inertiaFinalValue.js +1 -0
- package/utils/math/inertiaFinalValue.js.map +7 -0
- package/utils/math/lerp.cjs +1 -0
- package/utils/math/lerp.cjs.map +7 -0
- package/utils/math/lerp.js +1 -0
- package/utils/math/lerp.js.map +7 -0
- package/utils/math/map.cjs +1 -0
- package/utils/math/map.cjs.map +7 -0
- package/utils/math/map.js +1 -0
- package/utils/math/map.js.map +7 -0
- package/utils/math/round.cjs +1 -0
- package/utils/math/round.cjs.map +7 -0
- package/utils/math/round.js +1 -0
- package/utils/math/round.js.map +7 -0
- package/utils/memoize.cjs +1 -0
- package/utils/memoize.cjs.map +7 -0
- package/utils/memoize.js +1 -0
- package/utils/memoize.js.map +7 -0
- package/utils/nextFrame.cjs +1 -0
- package/utils/nextFrame.cjs.map +7 -0
- package/utils/nextFrame.js +1 -0
- package/utils/nextFrame.js.map +7 -0
- package/utils/nextMicrotask.cjs +1 -0
- package/utils/nextMicrotask.cjs.map +7 -0
- package/utils/nextMicrotask.js +1 -0
- package/utils/nextMicrotask.js.map +7 -0
- package/utils/nextTick.cjs +1 -0
- package/utils/nextTick.cjs.map +7 -0
- package/utils/nextTick.js +1 -0
- package/utils/nextTick.js.map +7 -0
- package/utils/noop.cjs +1 -0
- package/utils/noop.cjs.map +7 -0
- package/utils/noop.js +1 -0
- package/utils/noop.js.map +7 -0
- package/utils/object/autoBind.cjs +1 -0
- package/utils/object/autoBind.cjs.map +7 -0
- package/utils/object/autoBind.js +1 -0
- package/utils/object/autoBind.js.map +7 -0
- package/utils/object/getAllProperties.cjs +1 -0
- package/utils/object/getAllProperties.cjs.map +7 -0
- package/utils/object/getAllProperties.js +1 -0
- package/utils/object/getAllProperties.js.map +7 -0
- package/utils/object/index.cjs +1 -0
- package/utils/object/index.cjs.map +7 -0
- package/utils/object/index.js +1 -0
- package/utils/object/index.js.map +7 -0
- package/utils/scheduler.cjs +1 -0
- package/utils/scheduler.cjs.map +7 -0
- package/utils/scheduler.js +1 -0
- package/utils/scheduler.js.map +7 -0
- package/utils/scrollTo.cjs +1 -0
- package/utils/scrollTo.cjs.map +7 -0
- package/utils/scrollTo.js +1 -0
- package/utils/scrollTo.js.map +7 -0
- package/utils/string/index.cjs +1 -0
- package/utils/string/index.cjs.map +7 -0
- package/utils/string/index.js +1 -0
- package/utils/string/index.js.map +7 -0
- package/utils/string/withLeadingCharacters.cjs +1 -0
- package/utils/string/withLeadingCharacters.cjs.map +7 -0
- package/utils/string/withLeadingCharacters.js +1 -0
- package/utils/string/withLeadingCharacters.js.map +7 -0
- package/utils/string/withLeadingSlash.cjs +1 -0
- package/utils/string/withLeadingSlash.cjs.map +7 -0
- package/utils/string/withLeadingSlash.js +1 -0
- package/utils/string/withLeadingSlash.js.map +7 -0
- package/utils/string/withTrailingCharacters.cjs +1 -0
- package/utils/string/withTrailingCharacters.cjs.map +7 -0
- package/utils/string/withTrailingCharacters.js +1 -0
- package/utils/string/withTrailingCharacters.js.map +7 -0
- package/utils/string/withTrailingSlash.cjs +1 -0
- package/utils/string/withTrailingSlash.cjs.map +7 -0
- package/utils/string/withTrailingSlash.js +1 -0
- package/utils/string/withTrailingSlash.js.map +7 -0
- package/utils/string/withoutLeadingCharacters.cjs +1 -0
- package/utils/string/withoutLeadingCharacters.cjs.map +7 -0
- package/utils/string/withoutLeadingCharacters.js +1 -0
- package/utils/string/withoutLeadingCharacters.js.map +7 -0
- package/utils/string/withoutLeadingCharactersRecursive.cjs +1 -0
- package/utils/string/withoutLeadingCharactersRecursive.cjs.map +7 -0
- package/utils/string/withoutLeadingCharactersRecursive.js +1 -0
- package/utils/string/withoutLeadingCharactersRecursive.js.map +7 -0
- package/utils/string/withoutLeadingSlash.cjs +1 -0
- package/utils/string/withoutLeadingSlash.cjs.map +7 -0
- package/utils/string/withoutLeadingSlash.js +1 -0
- package/utils/string/withoutLeadingSlash.js.map +7 -0
- package/utils/string/withoutTrailingCharacters.cjs +1 -0
- package/utils/string/withoutTrailingCharacters.cjs.map +7 -0
- package/utils/string/withoutTrailingCharacters.js +1 -0
- package/utils/string/withoutTrailingCharacters.js.map +7 -0
- package/utils/string/withoutTrailingCharactersRecursive.cjs +1 -0
- package/utils/string/withoutTrailingCharactersRecursive.cjs.map +7 -0
- package/utils/string/withoutTrailingCharactersRecursive.js +1 -0
- package/utils/string/withoutTrailingCharactersRecursive.js.map +7 -0
- package/utils/string/withoutTrailingSlash.cjs +1 -0
- package/utils/string/withoutTrailingSlash.cjs.map +7 -0
- package/utils/string/withoutTrailingSlash.js +1 -0
- package/utils/string/withoutTrailingSlash.js.map +7 -0
- package/utils/throttle.cjs +1 -0
- package/utils/throttle.cjs.map +7 -0
- package/utils/throttle.js +1 -0
- package/utils/throttle.js.map +7 -0
- package/utils/tween.cjs +2 -2
- package/utils/tween.cjs.map +7 -0
- package/utils/tween.js +2 -2
- package/utils/tween.js.map +7 -0
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../packages/js-toolkit/decorators/withResponsiveOptions.ts"],
|
|
4
|
+
"sourcesContent": ["import type { BaseInterface, BaseDecorator } from '../Base/types.js';\nimport type { Base, BaseProps, Managers } from '../Base/index.js';\nimport { ResponsiveOptionsManager } from '../Base/managers/ResponsiveOptionsManager.js';\n\n/**\n * Extends the configuration of an existing class.\n */\nexport function withResponsiveOptions<S extends Base>(\n BaseClass: typeof Base,\n): BaseDecorator<BaseInterface, S> {\n /**\n * Class.\n */\n class WithResponsiveOptions<\n T extends BaseProps = BaseProps,\n > extends BaseClass<T> {\n /**\n * Get managers.\n */\n get __managers(): Managers & { OptionsManager: typeof ResponsiveOptionsManager } {\n return {\n ...super.__managers,\n OptionsManager: ResponsiveOptionsManager,\n };\n }\n }\n\n // @ts-ignore\n return WithResponsiveOptions;\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,sCAAyC;AAKlC,SAAS,sBACd,WACiC;AAIjC,QAAM,8BAEI,UAAa;AAAA,IAIrB,IAAI,aAA6E;AAC/E,aAAO;AAAA,QACL,GAAG,MAAM;AAAA,QACT,gBAAgB;AAAA,MAClB;AAAA,IACF;AAAA,EACF;AAGA,SAAO;AACT;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import ResponsiveOptionsManager from "../Base/managers/ResponsiveOptionsManager.js";
|
|
1
|
+
import { ResponsiveOptionsManager } from "../Base/managers/ResponsiveOptionsManager.js";
|
|
2
2
|
function withResponsiveOptions(BaseClass) {
|
|
3
3
|
class WithResponsiveOptions extends BaseClass {
|
|
4
4
|
get __managers() {
|
|
@@ -13,3 +13,4 @@ function withResponsiveOptions(BaseClass) {
|
|
|
13
13
|
export {
|
|
14
14
|
withResponsiveOptions
|
|
15
15
|
};
|
|
16
|
+
//# sourceMappingURL=withResponsiveOptions.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../packages/js-toolkit/decorators/withResponsiveOptions.ts"],
|
|
4
|
+
"sourcesContent": ["import type { BaseInterface, BaseDecorator } from '../Base/types.js';\nimport type { Base, BaseProps, Managers } from '../Base/index.js';\nimport { ResponsiveOptionsManager } from '../Base/managers/ResponsiveOptionsManager.js';\n\n/**\n * Extends the configuration of an existing class.\n */\nexport function withResponsiveOptions<S extends Base>(\n BaseClass: typeof Base,\n): BaseDecorator<BaseInterface, S> {\n /**\n * Class.\n */\n class WithResponsiveOptions<\n T extends BaseProps = BaseProps,\n > extends BaseClass<T> {\n /**\n * Get managers.\n */\n get __managers(): Managers & { OptionsManager: typeof ResponsiveOptionsManager } {\n return {\n ...super.__managers,\n OptionsManager: ResponsiveOptionsManager,\n };\n }\n }\n\n // @ts-ignore\n return WithResponsiveOptions;\n}\n"],
|
|
5
|
+
"mappings": "AAEA,SAAS,gCAAgC;AAKlC,SAAS,sBACd,WACiC;AAIjC,QAAM,8BAEI,UAAa;AAAA,IAIrB,IAAI,aAA6E;AAC/E,aAAO;AAAA,QACL,GAAG,MAAM;AAAA,QACT,gBAAgB;AAAA,MAClB;AAAA,IACF;AAAA,EACF;AAGA,SAAO;AACT;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -2,7 +2,6 @@ var __defProp = Object.defineProperty;
|
|
|
2
2
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
3
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
4
4
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
5
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
6
5
|
var __export = (target, all) => {
|
|
7
6
|
for (var name in all)
|
|
8
7
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -16,10 +15,6 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
16
15
|
return to;
|
|
17
16
|
};
|
|
18
17
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
-
var __publicField = (obj, key, value) => {
|
|
20
|
-
__defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
21
|
-
return value;
|
|
22
|
-
};
|
|
23
18
|
|
|
24
19
|
// packages/js-toolkit/decorators/withScrolledInView.ts
|
|
25
20
|
var withScrolledInView_exports = {};
|
|
@@ -51,36 +46,50 @@ function updateProps(props, dampFactor, dampPrecision, axis = "x") {
|
|
|
51
46
|
}
|
|
52
47
|
function withScrolledInView(BaseClass, options = {}) {
|
|
53
48
|
class WithScrolledInView extends (0, import_withMountWhenInView.withMountWhenInView)(BaseClass, options) {
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
end: {
|
|
62
|
-
x: 0,
|
|
63
|
-
y: 0
|
|
64
|
-
},
|
|
65
|
-
current: {
|
|
66
|
-
x: 0,
|
|
67
|
-
y: 0
|
|
49
|
+
static config = {
|
|
50
|
+
name: `${BaseClass.config.name}WithMountWhenInView`,
|
|
51
|
+
emits: ["scrolledInView"],
|
|
52
|
+
options: {
|
|
53
|
+
dampFactor: {
|
|
54
|
+
type: Number,
|
|
55
|
+
default: 0.1
|
|
68
56
|
},
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
},
|
|
73
|
-
progress: {
|
|
74
|
-
x: 0,
|
|
75
|
-
y: 0
|
|
76
|
-
},
|
|
77
|
-
dampedProgress: {
|
|
78
|
-
x: 0,
|
|
79
|
-
y: 0
|
|
57
|
+
dampPrecision: {
|
|
58
|
+
type: Number,
|
|
59
|
+
default: 1e-3
|
|
80
60
|
}
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
|
|
61
|
+
}
|
|
62
|
+
};
|
|
63
|
+
__props = {
|
|
64
|
+
start: {
|
|
65
|
+
x: 0,
|
|
66
|
+
y: 0
|
|
67
|
+
},
|
|
68
|
+
end: {
|
|
69
|
+
x: 0,
|
|
70
|
+
y: 0
|
|
71
|
+
},
|
|
72
|
+
current: {
|
|
73
|
+
x: 0,
|
|
74
|
+
y: 0
|
|
75
|
+
},
|
|
76
|
+
dampedCurrent: {
|
|
77
|
+
x: 0,
|
|
78
|
+
y: 0
|
|
79
|
+
},
|
|
80
|
+
progress: {
|
|
81
|
+
x: 0,
|
|
82
|
+
y: 0
|
|
83
|
+
},
|
|
84
|
+
dampedProgress: {
|
|
85
|
+
x: 0,
|
|
86
|
+
y: 0
|
|
87
|
+
}
|
|
88
|
+
};
|
|
89
|
+
dampFactor = null;
|
|
90
|
+
dampPrecision = null;
|
|
91
|
+
constructor(element) {
|
|
92
|
+
super(element);
|
|
84
93
|
const render = () => {
|
|
85
94
|
scheduler.update(() => {
|
|
86
95
|
const renderFn = this.__callMethod("scrolledInView", this.__props);
|
|
@@ -104,9 +113,8 @@ function withScrolledInView(BaseClass, options = {}) {
|
|
|
104
113
|
}
|
|
105
114
|
},
|
|
106
115
|
ticked: () => {
|
|
107
|
-
|
|
108
|
-
const
|
|
109
|
-
const dampPrecision = (_b = this.dampFactor) != null ? _b : this.$options.dampFactor;
|
|
116
|
+
const dampFactor = this.dampFactor ?? this.$options.dampFactor;
|
|
117
|
+
const dampPrecision = this.dampFactor ?? this.$options.dampFactor;
|
|
110
118
|
updateProps(this.__props, dampFactor, dampPrecision, "x");
|
|
111
119
|
updateProps(this.__props, dampFactor, dampPrecision, "y");
|
|
112
120
|
if (this.__props.dampedCurrent.x === this.__props.current.x && this.__props.dampedCurrent.y === this.__props.current.y) {
|
|
@@ -197,20 +205,7 @@ function withScrolledInView(BaseClass, options = {}) {
|
|
|
197
205
|
);
|
|
198
206
|
}
|
|
199
207
|
}
|
|
200
|
-
__publicField(WithScrolledInView, "config", {
|
|
201
|
-
name: `${BaseClass.config.name}WithMountWhenInView`,
|
|
202
|
-
emits: ["scrolledInView"],
|
|
203
|
-
options: {
|
|
204
|
-
dampFactor: {
|
|
205
|
-
type: Number,
|
|
206
|
-
default: 0.1
|
|
207
|
-
},
|
|
208
|
-
dampPrecision: {
|
|
209
|
-
type: Number,
|
|
210
|
-
default: 1e-3
|
|
211
|
-
}
|
|
212
|
-
}
|
|
213
|
-
});
|
|
214
208
|
return WithScrolledInView;
|
|
215
209
|
}
|
|
216
210
|
if (module.exports.default) module.exports = module.exports.default;
|
|
211
|
+
//# sourceMappingURL=withScrolledInView.cjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../packages/js-toolkit/decorators/withScrolledInView.ts"],
|
|
4
|
+
"sourcesContent": ["import type { BaseInterface, BaseDecorator } from '../Base/types.js';\nimport type { Base, BaseProps, BaseConfig } from '../Base/index.js';\nimport type { RafServiceProps, ScrollServiceProps, ResizeServiceProps } from '../services/index.js';\nimport { withMountWhenInView } from './withMountWhenInView.js';\nimport { damp, clamp, clamp01, getOffsetSizes, isFunction, useScheduler } from '../utils/index.js';\n\nconst scheduler = useScheduler(['update', 'render']);\n\nexport interface WithScrolledInViewProps extends BaseProps {\n $options: {\n dampFactor: number;\n dampPrecision: number;\n };\n}\n\nexport type ScrollInViewProps = {\n start: {\n x: number;\n y: number;\n };\n end: {\n x: number;\n y: number;\n };\n current: {\n x: number;\n y: number;\n };\n dampedCurrent: {\n x: number;\n y: number;\n };\n progress: {\n x: number;\n y: number;\n };\n dampedProgress: {\n x: number;\n y: number;\n };\n};\n\nexport type WithScrolledInViewOptions = IntersectionObserverInit & {\n useOffsetSizes?: boolean;\n};\n\n/**\n * Update props on tick.\n */\nfunction updateProps(\n props: ScrollInViewProps,\n dampFactor: number,\n dampPrecision: number,\n axis: 'x' | 'y' = 'x',\n): void {\n props.current[axis] = clamp(\n axis === 'x' ? window.pageXOffset : window.pageYOffset,\n props.start[axis],\n props.end[axis],\n );\n props.dampedCurrent[axis] = damp(\n props.current[axis],\n props.dampedCurrent[axis],\n dampFactor,\n dampPrecision,\n );\n props.progress[axis] = clamp01(\n (props.current[axis] - props.start[axis]) / (props.end[axis] - props.start[axis]),\n );\n props.dampedProgress[axis] = clamp01(\n (props.dampedCurrent[axis] - props.start[axis]) / (props.end[axis] - props.start[axis]),\n );\n}\n\nexport interface WithScrolledInViewInterface extends BaseInterface {\n /**\n * @private\n * @type {ScrollInViewProps}\n */\n __props: ScrollInViewProps;\n dampFactor?: number;\n dampPrecision?: number;\n mounted(): void;\n resized(props: ResizeServiceProps): void;\n scrolled(props: ScrollServiceProps): void;\n ticked(props: RafServiceProps): void;\n destroyed(): void;\n /**\n * @private\n */\n __setProps(): void;\n}\n\n/**\n * Add scrolled in view capabilities to a component.\n */\nexport function withScrolledInView<S extends Base = Base>(\n BaseClass: typeof Base,\n options: WithScrolledInViewOptions = {},\n): BaseDecorator<WithScrolledInViewInterface, S, WithScrolledInViewProps> {\n /**\n * Class.\n */\n class WithScrolledInView<\n T extends BaseProps = BaseProps,\n > extends withMountWhenInView(BaseClass, options)<T & WithScrolledInViewProps> {\n /**\n * Config.\n */\n static config: BaseConfig = {\n name: `${BaseClass.config.name}WithMountWhenInView`,\n emits: ['scrolledInView'],\n options: {\n dampFactor: {\n type: Number,\n default: 0.1,\n },\n dampPrecision: {\n type: Number,\n default: 0.001,\n },\n },\n };\n\n __props: ScrollInViewProps = {\n start: {\n x: 0,\n y: 0,\n },\n end: {\n x: 0,\n y: 0,\n },\n current: {\n x: 0,\n y: 0,\n },\n dampedCurrent: {\n x: 0,\n y: 0,\n },\n progress: {\n x: 0,\n y: 0,\n },\n dampedProgress: {\n x: 0,\n y: 0,\n },\n };\n\n /**\n * Factor used for the `dampedProgress` props.\n * @deprecated\n * @todo v3 delete in favor of option API\n */\n dampFactor?: number = null;\n\n /**\n * Precision for the `dampedProgress` props.\n * @deprecated\n * @todo v3 delete in favor of option API\n */\n dampPrecision?: number = null;\n\n /**\n * Bind listeners.\n */\n constructor(element: HTMLElement) {\n super(element);\n\n const render = () => {\n scheduler.update(() => {\n // @ts-ignore\n const renderFn = this.__callMethod('scrolledInView', this.__props);\n if (isFunction(renderFn)) {\n scheduler.render(() => {\n renderFn(this.__props);\n });\n }\n });\n };\n\n const delegate = {\n handleEvent(event) {\n delegate[event.type](event.detail[0]);\n },\n resized: () => {\n this.__setProps();\n },\n scrolled: (props) => {\n if ((!this.$services.has('ticked') && props.changed.y) || props.changed.x) {\n this.$services.enable('ticked');\n }\n },\n ticked: () => {\n const dampFactor = this.dampFactor ?? this.$options.dampFactor;\n const dampPrecision = this.dampFactor ?? this.$options.dampFactor;\n\n updateProps(this.__props, dampFactor, dampPrecision, 'x');\n updateProps(this.__props, dampFactor, dampPrecision, 'y');\n\n if (\n this.__props.dampedCurrent.x === this.__props.current.x &&\n this.__props.dampedCurrent.y === this.__props.current.y\n ) {\n this.$services.disable('ticked');\n }\n\n render();\n },\n };\n\n this.$on('before-mounted', () => {\n this.$on('resized', delegate);\n this.$on('scrolled', delegate);\n this.$on('ticked', delegate);\n });\n\n this.$on('mounted', () => {\n this.__setProps();\n });\n\n this.$on('destroyed', () => {\n this.$off('resized', delegate);\n this.$off('scrolled', delegate);\n this.$off('ticked', delegate);\n\n // Clamp damped values to their final value and trigger one last render on destroy\n this.__props.dampedCurrent.x = this.__props.current.x;\n this.__props.dampedCurrent.y = this.__props.current.y;\n this.__props.dampedProgress.x = this.__props.progress.x;\n this.__props.dampedProgress.y = this.__props.progress.y;\n render();\n });\n }\n\n /**\n * Mounted hook.\n */\n mounted() {\n // @ts-ignore\n if (isFunction(super.mounted)) {\n // @ts-ignore\n super.mounted();\n }\n }\n\n /**\n * Resized hook.\n */\n resized(props: ResizeServiceProps) {\n // @ts-ignore\n if (isFunction(super.resized)) {\n // @ts-ignore\n super.resized(props);\n }\n }\n\n /**\n * Scrolled hook.\n */\n scrolled(props: ScrollServiceProps) {\n // @ts-ignore\n if (isFunction(super.scrolled)) {\n // @ts-ignore\n super.scrolled(props);\n }\n }\n\n /**\n * Ticked hook.\n */\n ticked(props: RafServiceProps) {\n // @ts-ignore\n if (isFunction(super.ticked)) {\n // @ts-ignore\n super.ticked(props);\n }\n }\n\n /**\n * Destroyed hook.\n */\n destroyed() {\n // @ts-ignore\n if (isFunction(super.destroyed)) {\n // @ts-ignore\n super.destroyed();\n }\n }\n\n /**\n * Set the decorator props.\n */\n __setProps() {\n const sizes = options.useOffsetSizes\n ? getOffsetSizes(this.$el)\n : this.$el.getBoundingClientRect();\n\n // Y axis\n const yEnd = sizes.y + window.pageYOffset + sizes.height;\n const yStart = yEnd - window.innerHeight - sizes.height;\n const yCurrent = clamp(window.pageYOffset, yStart, yEnd);\n const yProgress = clamp01((yCurrent - yStart) / (yEnd - yStart));\n\n // X axis\n const xEnd = sizes.x + window.pageXOffset + sizes.width;\n const xStart = xEnd - window.innerWidth - sizes.width;\n const xCurrent = clamp(window.pageXOffset, xStart, xEnd);\n const xProgress = clamp01((xCurrent - xStart) / (xEnd - xStart));\n\n this.__props.start.x = xStart;\n this.__props.start.y = yStart;\n this.__props.end.x = xEnd;\n this.__props.end.y = yEnd;\n this.__props.current.x = xCurrent;\n this.__props.current.y = yCurrent;\n this.__props.dampedCurrent.x = damp(\n xCurrent,\n this.__props.dampedCurrent.x,\n this.dampFactor,\n this.dampPrecision,\n );\n this.__props.dampedCurrent.y = damp(\n yCurrent,\n this.__props.dampedCurrent.y,\n this.dampFactor,\n this.dampPrecision,\n );\n this.__props.progress.x = xProgress;\n this.__props.progress.y = yProgress;\n this.__props.dampedProgress.x = clamp01(\n (this.__props.dampedCurrent.x - xStart) / (xEnd - xStart),\n );\n this.__props.dampedProgress.y = clamp01(\n (this.__props.dampedCurrent.y - yStart) / (yEnd - yStart),\n );\n }\n }\n\n // @ts-ignore\n return WithScrolledInView;\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -1,9 +1,3 @@
|
|
|
1
|
-
var __defProp = Object.defineProperty;
|
|
2
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
3
|
-
var __publicField = (obj, key, value) => {
|
|
4
|
-
__defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
5
|
-
return value;
|
|
6
|
-
};
|
|
7
1
|
import { withMountWhenInView } from "./withMountWhenInView.js";
|
|
8
2
|
import { damp, clamp, clamp01, getOffsetSizes, isFunction, useScheduler } from "../utils/index.js";
|
|
9
3
|
const scheduler = useScheduler(["update", "render"]);
|
|
@@ -28,36 +22,50 @@ function updateProps(props, dampFactor, dampPrecision, axis = "x") {
|
|
|
28
22
|
}
|
|
29
23
|
function withScrolledInView(BaseClass, options = {}) {
|
|
30
24
|
class WithScrolledInView extends withMountWhenInView(BaseClass, options) {
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
end: {
|
|
39
|
-
x: 0,
|
|
40
|
-
y: 0
|
|
41
|
-
},
|
|
42
|
-
current: {
|
|
43
|
-
x: 0,
|
|
44
|
-
y: 0
|
|
25
|
+
static config = {
|
|
26
|
+
name: `${BaseClass.config.name}WithMountWhenInView`,
|
|
27
|
+
emits: ["scrolledInView"],
|
|
28
|
+
options: {
|
|
29
|
+
dampFactor: {
|
|
30
|
+
type: Number,
|
|
31
|
+
default: 0.1
|
|
45
32
|
},
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
},
|
|
50
|
-
progress: {
|
|
51
|
-
x: 0,
|
|
52
|
-
y: 0
|
|
53
|
-
},
|
|
54
|
-
dampedProgress: {
|
|
55
|
-
x: 0,
|
|
56
|
-
y: 0
|
|
33
|
+
dampPrecision: {
|
|
34
|
+
type: Number,
|
|
35
|
+
default: 1e-3
|
|
57
36
|
}
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
|
|
37
|
+
}
|
|
38
|
+
};
|
|
39
|
+
__props = {
|
|
40
|
+
start: {
|
|
41
|
+
x: 0,
|
|
42
|
+
y: 0
|
|
43
|
+
},
|
|
44
|
+
end: {
|
|
45
|
+
x: 0,
|
|
46
|
+
y: 0
|
|
47
|
+
},
|
|
48
|
+
current: {
|
|
49
|
+
x: 0,
|
|
50
|
+
y: 0
|
|
51
|
+
},
|
|
52
|
+
dampedCurrent: {
|
|
53
|
+
x: 0,
|
|
54
|
+
y: 0
|
|
55
|
+
},
|
|
56
|
+
progress: {
|
|
57
|
+
x: 0,
|
|
58
|
+
y: 0
|
|
59
|
+
},
|
|
60
|
+
dampedProgress: {
|
|
61
|
+
x: 0,
|
|
62
|
+
y: 0
|
|
63
|
+
}
|
|
64
|
+
};
|
|
65
|
+
dampFactor = null;
|
|
66
|
+
dampPrecision = null;
|
|
67
|
+
constructor(element) {
|
|
68
|
+
super(element);
|
|
61
69
|
const render = () => {
|
|
62
70
|
scheduler.update(() => {
|
|
63
71
|
const renderFn = this.__callMethod("scrolledInView", this.__props);
|
|
@@ -81,9 +89,8 @@ function withScrolledInView(BaseClass, options = {}) {
|
|
|
81
89
|
}
|
|
82
90
|
},
|
|
83
91
|
ticked: () => {
|
|
84
|
-
|
|
85
|
-
const
|
|
86
|
-
const dampPrecision = (_b = this.dampFactor) != null ? _b : this.$options.dampFactor;
|
|
92
|
+
const dampFactor = this.dampFactor ?? this.$options.dampFactor;
|
|
93
|
+
const dampPrecision = this.dampFactor ?? this.$options.dampFactor;
|
|
87
94
|
updateProps(this.__props, dampFactor, dampPrecision, "x");
|
|
88
95
|
updateProps(this.__props, dampFactor, dampPrecision, "y");
|
|
89
96
|
if (this.__props.dampedCurrent.x === this.__props.current.x && this.__props.dampedCurrent.y === this.__props.current.y) {
|
|
@@ -174,22 +181,9 @@ function withScrolledInView(BaseClass, options = {}) {
|
|
|
174
181
|
);
|
|
175
182
|
}
|
|
176
183
|
}
|
|
177
|
-
__publicField(WithScrolledInView, "config", {
|
|
178
|
-
name: `${BaseClass.config.name}WithMountWhenInView`,
|
|
179
|
-
emits: ["scrolledInView"],
|
|
180
|
-
options: {
|
|
181
|
-
dampFactor: {
|
|
182
|
-
type: Number,
|
|
183
|
-
default: 0.1
|
|
184
|
-
},
|
|
185
|
-
dampPrecision: {
|
|
186
|
-
type: Number,
|
|
187
|
-
default: 1e-3
|
|
188
|
-
}
|
|
189
|
-
}
|
|
190
|
-
});
|
|
191
184
|
return WithScrolledInView;
|
|
192
185
|
}
|
|
193
186
|
export {
|
|
194
187
|
withScrolledInView
|
|
195
188
|
};
|
|
189
|
+
//# sourceMappingURL=withScrolledInView.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../packages/js-toolkit/decorators/withScrolledInView.ts"],
|
|
4
|
+
"sourcesContent": ["import type { BaseInterface, BaseDecorator } from '../Base/types.js';\nimport type { Base, BaseProps, BaseConfig } from '../Base/index.js';\nimport type { RafServiceProps, ScrollServiceProps, ResizeServiceProps } from '../services/index.js';\nimport { withMountWhenInView } from './withMountWhenInView.js';\nimport { damp, clamp, clamp01, getOffsetSizes, isFunction, useScheduler } from '../utils/index.js';\n\nconst scheduler = useScheduler(['update', 'render']);\n\nexport interface WithScrolledInViewProps extends BaseProps {\n $options: {\n dampFactor: number;\n dampPrecision: number;\n };\n}\n\nexport type ScrollInViewProps = {\n start: {\n x: number;\n y: number;\n };\n end: {\n x: number;\n y: number;\n };\n current: {\n x: number;\n y: number;\n };\n dampedCurrent: {\n x: number;\n y: number;\n };\n progress: {\n x: number;\n y: number;\n };\n dampedProgress: {\n x: number;\n y: number;\n };\n};\n\nexport type WithScrolledInViewOptions = IntersectionObserverInit & {\n useOffsetSizes?: boolean;\n};\n\n/**\n * Update props on tick.\n */\nfunction updateProps(\n props: ScrollInViewProps,\n dampFactor: number,\n dampPrecision: number,\n axis: 'x' | 'y' = 'x',\n): void {\n props.current[axis] = clamp(\n axis === 'x' ? window.pageXOffset : window.pageYOffset,\n props.start[axis],\n props.end[axis],\n );\n props.dampedCurrent[axis] = damp(\n props.current[axis],\n props.dampedCurrent[axis],\n dampFactor,\n dampPrecision,\n );\n props.progress[axis] = clamp01(\n (props.current[axis] - props.start[axis]) / (props.end[axis] - props.start[axis]),\n );\n props.dampedProgress[axis] = clamp01(\n (props.dampedCurrent[axis] - props.start[axis]) / (props.end[axis] - props.start[axis]),\n );\n}\n\nexport interface WithScrolledInViewInterface extends BaseInterface {\n /**\n * @private\n * @type {ScrollInViewProps}\n */\n __props: ScrollInViewProps;\n dampFactor?: number;\n dampPrecision?: number;\n mounted(): void;\n resized(props: ResizeServiceProps): void;\n scrolled(props: ScrollServiceProps): void;\n ticked(props: RafServiceProps): void;\n destroyed(): void;\n /**\n * @private\n */\n __setProps(): void;\n}\n\n/**\n * Add scrolled in view capabilities to a component.\n */\nexport function withScrolledInView<S extends Base = Base>(\n BaseClass: typeof Base,\n options: WithScrolledInViewOptions = {},\n): BaseDecorator<WithScrolledInViewInterface, S, WithScrolledInViewProps> {\n /**\n * Class.\n */\n class WithScrolledInView<\n T extends BaseProps = BaseProps,\n > extends withMountWhenInView(BaseClass, options)<T & WithScrolledInViewProps> {\n /**\n * Config.\n */\n static config: BaseConfig = {\n name: `${BaseClass.config.name}WithMountWhenInView`,\n emits: ['scrolledInView'],\n options: {\n dampFactor: {\n type: Number,\n default: 0.1,\n },\n dampPrecision: {\n type: Number,\n default: 0.001,\n },\n },\n };\n\n __props: ScrollInViewProps = {\n start: {\n x: 0,\n y: 0,\n },\n end: {\n x: 0,\n y: 0,\n },\n current: {\n x: 0,\n y: 0,\n },\n dampedCurrent: {\n x: 0,\n y: 0,\n },\n progress: {\n x: 0,\n y: 0,\n },\n dampedProgress: {\n x: 0,\n y: 0,\n },\n };\n\n /**\n * Factor used for the `dampedProgress` props.\n * @deprecated\n * @todo v3 delete in favor of option API\n */\n dampFactor?: number = null;\n\n /**\n * Precision for the `dampedProgress` props.\n * @deprecated\n * @todo v3 delete in favor of option API\n */\n dampPrecision?: number = null;\n\n /**\n * Bind listeners.\n */\n constructor(element: HTMLElement) {\n super(element);\n\n const render = () => {\n scheduler.update(() => {\n // @ts-ignore\n const renderFn = this.__callMethod('scrolledInView', this.__props);\n if (isFunction(renderFn)) {\n scheduler.render(() => {\n renderFn(this.__props);\n });\n }\n });\n };\n\n const delegate = {\n handleEvent(event) {\n delegate[event.type](event.detail[0]);\n },\n resized: () => {\n this.__setProps();\n },\n scrolled: (props) => {\n if ((!this.$services.has('ticked') && props.changed.y) || props.changed.x) {\n this.$services.enable('ticked');\n }\n },\n ticked: () => {\n const dampFactor = this.dampFactor ?? this.$options.dampFactor;\n const dampPrecision = this.dampFactor ?? this.$options.dampFactor;\n\n updateProps(this.__props, dampFactor, dampPrecision, 'x');\n updateProps(this.__props, dampFactor, dampPrecision, 'y');\n\n if (\n this.__props.dampedCurrent.x === this.__props.current.x &&\n this.__props.dampedCurrent.y === this.__props.current.y\n ) {\n this.$services.disable('ticked');\n }\n\n render();\n },\n };\n\n this.$on('before-mounted', () => {\n this.$on('resized', delegate);\n this.$on('scrolled', delegate);\n this.$on('ticked', delegate);\n });\n\n this.$on('mounted', () => {\n this.__setProps();\n });\n\n this.$on('destroyed', () => {\n this.$off('resized', delegate);\n this.$off('scrolled', delegate);\n this.$off('ticked', delegate);\n\n // Clamp damped values to their final value and trigger one last render on destroy\n this.__props.dampedCurrent.x = this.__props.current.x;\n this.__props.dampedCurrent.y = this.__props.current.y;\n this.__props.dampedProgress.x = this.__props.progress.x;\n this.__props.dampedProgress.y = this.__props.progress.y;\n render();\n });\n }\n\n /**\n * Mounted hook.\n */\n mounted() {\n // @ts-ignore\n if (isFunction(super.mounted)) {\n // @ts-ignore\n super.mounted();\n }\n }\n\n /**\n * Resized hook.\n */\n resized(props: ResizeServiceProps) {\n // @ts-ignore\n if (isFunction(super.resized)) {\n // @ts-ignore\n super.resized(props);\n }\n }\n\n /**\n * Scrolled hook.\n */\n scrolled(props: ScrollServiceProps) {\n // @ts-ignore\n if (isFunction(super.scrolled)) {\n // @ts-ignore\n super.scrolled(props);\n }\n }\n\n /**\n * Ticked hook.\n */\n ticked(props: RafServiceProps) {\n // @ts-ignore\n if (isFunction(super.ticked)) {\n // @ts-ignore\n super.ticked(props);\n }\n }\n\n /**\n * Destroyed hook.\n */\n destroyed() {\n // @ts-ignore\n if (isFunction(super.destroyed)) {\n // @ts-ignore\n super.destroyed();\n }\n }\n\n /**\n * Set the decorator props.\n */\n __setProps() {\n const sizes = options.useOffsetSizes\n ? getOffsetSizes(this.$el)\n : this.$el.getBoundingClientRect();\n\n // Y axis\n const yEnd = sizes.y + window.pageYOffset + sizes.height;\n const yStart = yEnd - window.innerHeight - sizes.height;\n const yCurrent = clamp(window.pageYOffset, yStart, yEnd);\n const yProgress = clamp01((yCurrent - yStart) / (yEnd - yStart));\n\n // X axis\n const xEnd = sizes.x + window.pageXOffset + sizes.width;\n const xStart = xEnd - window.innerWidth - sizes.width;\n const xCurrent = clamp(window.pageXOffset, xStart, xEnd);\n const xProgress = clamp01((xCurrent - xStart) / (xEnd - xStart));\n\n this.__props.start.x = xStart;\n this.__props.start.y = yStart;\n this.__props.end.x = xEnd;\n this.__props.end.y = yEnd;\n this.__props.current.x = xCurrent;\n this.__props.current.y = yCurrent;\n this.__props.dampedCurrent.x = damp(\n xCurrent,\n this.__props.dampedCurrent.x,\n this.dampFactor,\n this.dampPrecision,\n );\n this.__props.dampedCurrent.y = damp(\n yCurrent,\n this.__props.dampedCurrent.y,\n this.dampFactor,\n this.dampPrecision,\n );\n this.__props.progress.x = xProgress;\n this.__props.progress.y = yProgress;\n this.__props.dampedProgress.x = clamp01(\n (this.__props.dampedCurrent.x - xStart) / (xEnd - xStart),\n );\n this.__props.dampedProgress.y = clamp01(\n (this.__props.dampedCurrent.y - yStart) / (yEnd - yStart),\n );\n }\n }\n\n // @ts-ignore\n return WithScrolledInView;\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/decorators/withVue2.cjs
CHANGED
|
@@ -2,7 +2,6 @@ var __defProp = Object.defineProperty;
|
|
|
2
2
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
3
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
4
4
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
5
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
6
5
|
var __export = (target, all) => {
|
|
7
6
|
for (var name in all)
|
|
8
7
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -16,10 +15,6 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
16
15
|
return to;
|
|
17
16
|
};
|
|
18
17
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
-
var __publicField = (obj, key, value) => {
|
|
20
|
-
__defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
21
|
-
return value;
|
|
22
|
-
};
|
|
23
18
|
|
|
24
19
|
// packages/js-toolkit/decorators/withVue2.ts
|
|
25
20
|
var withVue2_exports = {};
|
|
@@ -29,13 +24,17 @@ __export(withVue2_exports, {
|
|
|
29
24
|
module.exports = __toCommonJS(withVue2_exports);
|
|
30
25
|
var import_utils = require("../utils/index.cjs");
|
|
31
26
|
function withVue2(BaseClass, VueCtor) {
|
|
32
|
-
var _a, _b;
|
|
33
27
|
class WithVue2 extends BaseClass {
|
|
28
|
+
static config = {
|
|
29
|
+
...BaseClass.config,
|
|
30
|
+
name: `${BaseClass.config.name}WithVue`,
|
|
31
|
+
refs: [...BaseClass.config?.refs ?? [], "vue"]
|
|
32
|
+
};
|
|
33
|
+
$vue;
|
|
34
|
+
static vueConfig;
|
|
34
35
|
constructor(element) {
|
|
35
|
-
var _a2;
|
|
36
36
|
super(element);
|
|
37
|
-
|
|
38
|
-
const vueConfig = (_a2 = this.vueConfig) != null ? _a2 : this.constructor.vueConfig;
|
|
37
|
+
const vueConfig = this.vueConfig ?? this.constructor.vueConfig;
|
|
39
38
|
if (!vueConfig) {
|
|
40
39
|
if (import_utils.isDev) {
|
|
41
40
|
throw new Error("[withVue] You must define a `vueConfig` object.");
|
|
@@ -60,12 +59,7 @@ function withVue2(BaseClass, VueCtor) {
|
|
|
60
59
|
});
|
|
61
60
|
}
|
|
62
61
|
}
|
|
63
|
-
__publicField(WithVue2, "config", {
|
|
64
|
-
...BaseClass.config,
|
|
65
|
-
name: `${BaseClass.config.name}WithVue`,
|
|
66
|
-
refs: [...(_b = (_a = BaseClass.config) == null ? void 0 : _a.refs) != null ? _b : [], "vue"]
|
|
67
|
-
});
|
|
68
|
-
__publicField(WithVue2, "vueConfig");
|
|
69
62
|
return WithVue2;
|
|
70
63
|
}
|
|
71
64
|
if (module.exports.default) module.exports = module.exports.default;
|
|
65
|
+
//# sourceMappingURL=withVue2.cjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../packages/js-toolkit/decorators/withVue2.ts"],
|
|
4
|
+
"sourcesContent": ["import type Vue from 'vue';\nimport type { ComponentOptions, VueConstructor } from 'vue';\nimport type { BaseDecorator, BaseInterface } from '../Base/types.js';\nimport type { Base, BaseConfig, BaseProps } from '../Base/index.js';\nimport { isDev, isFunction } from '../utils/index.js';\n\nexport interface WithVue2Props extends BaseProps {\n $refs: {\n vue: HTMLElement;\n };\n}\n\nexport interface WithVue2Interface extends BaseInterface {\n $vue: Vue;\n}\n\n/**\n * withVue decorator.\n */\nexport function withVue2<S extends Base, T extends Vue = Vue>(\n BaseClass: typeof Base,\n VueCtor: VueConstructor,\n): BaseDecorator<WithVue2Interface, S, WithVue2Props> {\n type VueConfig = ComponentOptions<T> & {\n render: ComponentOptions<T>['render'];\n };\n\n /**\n * Class.\n */\n class WithVue2 extends BaseClass {\n static config:BaseConfig = {\n ...BaseClass.config,\n name: `${BaseClass.config.name}WithVue`,\n refs: [...(BaseClass.config?.refs ?? []), 'vue'],\n };\n\n $vue: Vue;\n\n /**\n * Vue app configuration.\n */\n static vueConfig: VueConfig;\n\n constructor(element: HTMLElement) {\n super(element);\n\n // @ts-ignore\n const vueConfig: VueConfig = this.vueConfig ?? this.constructor.vueConfig;\n\n if (!vueConfig) {\n if (isDev) {\n throw new Error('[withVue] You must define a `vueConfig` object.');\n }\n return;\n }\n\n if (!isFunction(vueConfig.render)) {\n if (isDev) {\n throw new Error('[withVue] You must define a `render` function in vueConfig.');\n }\n return;\n }\n\n this.$vue = new VueCtor(vueConfig);\n\n this.$on('mounted', () => {\n if (!(this.$refs.vue instanceof HTMLElement)) {\n throw new Error('[withVue] The `vue` refs must be a single HTMLElement.');\n }\n\n this.$vue.$mount(this.$refs.vue);\n });\n\n this.$on('destroyed', () => {\n this.$vue.$destroy();\n });\n }\n }\n\n // @ts-ignore\n return WithVue2;\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA,mBAAkC;AAe3B,SAAS,SACd,WACA,SACoD;AAQpD,QAAM,iBAAiB,UAAU;AAAA,IAC/B,OAAO,SAAoB;AAAA,MACzB,GAAG,UAAU;AAAA,MACb,MAAM,GAAG,UAAU,OAAO;AAAA,MAC1B,MAAM,CAAC,GAAI,UAAU,QAAQ,QAAQ,CAAC,GAAI,KAAK;AAAA,IACjD;AAAA,IAEA;AAAA,IAKA,OAAO;AAAA,IAEP,YAAY,SAAsB;AAChC,YAAM,OAAO;AAGb,YAAM,YAAuB,KAAK,aAAa,KAAK,YAAY;AAEhE,UAAI,CAAC,WAAW;AACd,YAAI,oBAAO;AACT,gBAAM,IAAI,MAAM,iDAAiD;AAAA,QACnE;AACA;AAAA,MACF;AAEA,UAAI,KAAC,yBAAW,UAAU,MAAM,GAAG;AACjC,YAAI,oBAAO;AACT,gBAAM,IAAI,MAAM,6DAA6D;AAAA,QAC/E;AACA;AAAA,MACF;AAEA,WAAK,OAAO,IAAI,QAAQ,SAAS;AAEjC,WAAK,IAAI,WAAW,MAAM;AACxB,YAAI,EAAE,KAAK,MAAM,eAAe,cAAc;AAC5C,gBAAM,IAAI,MAAM,wDAAwD;AAAA,QAC1E;AAEA,aAAK,KAAK,OAAO,KAAK,MAAM,GAAG;AAAA,MACjC,CAAC;AAED,WAAK,IAAI,aAAa,MAAM;AAC1B,aAAK,KAAK,SAAS;AAAA,MACrB,CAAC;AAAA,IACH;AAAA,EACF;AAGA,SAAO;AACT;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/decorators/withVue2.js
CHANGED
|
@@ -1,18 +1,16 @@
|
|
|
1
|
-
var __defProp = Object.defineProperty;
|
|
2
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
3
|
-
var __publicField = (obj, key, value) => {
|
|
4
|
-
__defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
5
|
-
return value;
|
|
6
|
-
};
|
|
7
1
|
import { isDev, isFunction } from "../utils/index.js";
|
|
8
2
|
function withVue2(BaseClass, VueCtor) {
|
|
9
|
-
var _a, _b;
|
|
10
3
|
class WithVue2 extends BaseClass {
|
|
4
|
+
static config = {
|
|
5
|
+
...BaseClass.config,
|
|
6
|
+
name: `${BaseClass.config.name}WithVue`,
|
|
7
|
+
refs: [...BaseClass.config?.refs ?? [], "vue"]
|
|
8
|
+
};
|
|
9
|
+
$vue;
|
|
10
|
+
static vueConfig;
|
|
11
11
|
constructor(element) {
|
|
12
|
-
var _a2;
|
|
13
12
|
super(element);
|
|
14
|
-
|
|
15
|
-
const vueConfig = (_a2 = this.vueConfig) != null ? _a2 : this.constructor.vueConfig;
|
|
13
|
+
const vueConfig = this.vueConfig ?? this.constructor.vueConfig;
|
|
16
14
|
if (!vueConfig) {
|
|
17
15
|
if (isDev) {
|
|
18
16
|
throw new Error("[withVue] You must define a `vueConfig` object.");
|
|
@@ -37,14 +35,9 @@ function withVue2(BaseClass, VueCtor) {
|
|
|
37
35
|
});
|
|
38
36
|
}
|
|
39
37
|
}
|
|
40
|
-
__publicField(WithVue2, "config", {
|
|
41
|
-
...BaseClass.config,
|
|
42
|
-
name: `${BaseClass.config.name}WithVue`,
|
|
43
|
-
refs: [...(_b = (_a = BaseClass.config) == null ? void 0 : _a.refs) != null ? _b : [], "vue"]
|
|
44
|
-
});
|
|
45
|
-
__publicField(WithVue2, "vueConfig");
|
|
46
38
|
return WithVue2;
|
|
47
39
|
}
|
|
48
40
|
export {
|
|
49
41
|
withVue2
|
|
50
42
|
};
|
|
43
|
+
//# sourceMappingURL=withVue2.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../packages/js-toolkit/decorators/withVue2.ts"],
|
|
4
|
+
"sourcesContent": ["import type Vue from 'vue';\nimport type { ComponentOptions, VueConstructor } from 'vue';\nimport type { BaseDecorator, BaseInterface } from '../Base/types.js';\nimport type { Base, BaseConfig, BaseProps } from '../Base/index.js';\nimport { isDev, isFunction } from '../utils/index.js';\n\nexport interface WithVue2Props extends BaseProps {\n $refs: {\n vue: HTMLElement;\n };\n}\n\nexport interface WithVue2Interface extends BaseInterface {\n $vue: Vue;\n}\n\n/**\n * withVue decorator.\n */\nexport function withVue2<S extends Base, T extends Vue = Vue>(\n BaseClass: typeof Base,\n VueCtor: VueConstructor,\n): BaseDecorator<WithVue2Interface, S, WithVue2Props> {\n type VueConfig = ComponentOptions<T> & {\n render: ComponentOptions<T>['render'];\n };\n\n /**\n * Class.\n */\n class WithVue2 extends BaseClass {\n static config:BaseConfig = {\n ...BaseClass.config,\n name: `${BaseClass.config.name}WithVue`,\n refs: [...(BaseClass.config?.refs ?? []), 'vue'],\n };\n\n $vue: Vue;\n\n /**\n * Vue app configuration.\n */\n static vueConfig: VueConfig;\n\n constructor(element: HTMLElement) {\n super(element);\n\n // @ts-ignore\n const vueConfig: VueConfig = this.vueConfig ?? this.constructor.vueConfig;\n\n if (!vueConfig) {\n if (isDev) {\n throw new Error('[withVue] You must define a `vueConfig` object.');\n }\n return;\n }\n\n if (!isFunction(vueConfig.render)) {\n if (isDev) {\n throw new Error('[withVue] You must define a `render` function in vueConfig.');\n }\n return;\n }\n\n this.$vue = new VueCtor(vueConfig);\n\n this.$on('mounted', () => {\n if (!(this.$refs.vue instanceof HTMLElement)) {\n throw new Error('[withVue] The `vue` refs must be a single HTMLElement.');\n }\n\n this.$vue.$mount(this.$refs.vue);\n });\n\n this.$on('destroyed', () => {\n this.$vue.$destroy();\n });\n }\n }\n\n // @ts-ignore\n return WithVue2;\n}\n"],
|
|
5
|
+
"mappings": "AAIA,SAAS,OAAO,kBAAkB;AAe3B,SAAS,SACd,WACA,SACoD;AAQpD,QAAM,iBAAiB,UAAU;AAAA,IAC/B,OAAO,SAAoB;AAAA,MACzB,GAAG,UAAU;AAAA,MACb,MAAM,GAAG,UAAU,OAAO;AAAA,MAC1B,MAAM,CAAC,GAAI,UAAU,QAAQ,QAAQ,CAAC,GAAI,KAAK;AAAA,IACjD;AAAA,IAEA;AAAA,IAKA,OAAO;AAAA,IAEP,YAAY,SAAsB;AAChC,YAAM,OAAO;AAGb,YAAM,YAAuB,KAAK,aAAa,KAAK,YAAY;AAEhE,UAAI,CAAC,WAAW;AACd,YAAI,OAAO;AACT,gBAAM,IAAI,MAAM,iDAAiD;AAAA,QACnE;AACA;AAAA,MACF;AAEA,UAAI,CAAC,WAAW,UAAU,MAAM,GAAG;AACjC,YAAI,OAAO;AACT,gBAAM,IAAI,MAAM,6DAA6D;AAAA,QAC/E;AACA;AAAA,MACF;AAEA,WAAK,OAAO,IAAI,QAAQ,SAAS;AAEjC,WAAK,IAAI,WAAW,MAAM;AACxB,YAAI,EAAE,KAAK,MAAM,eAAe,cAAc;AAC5C,gBAAM,IAAI,MAAM,wDAAwD;AAAA,QAC1E;AAEA,aAAK,KAAK,OAAO,KAAK,MAAM,GAAG;AAAA,MACjC,CAAC;AAED,WAAK,IAAI,aAAa,MAAM;AAC1B,aAAK,KAAK,SAAS;AAAA,MACrB,CAAC;AAAA,IACH;AAAA,EACF;AAGA,SAAO;AACT;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/helpers/createApp.cjs
CHANGED
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../packages/js-toolkit/helpers/createApp.ts"],
|
|
4
|
+
"sourcesContent": ["import type { Base, BaseConstructor, BaseProps } from '../Base/index.js';\n\n/**\n * Instantiate and mount the given component on the given root element when the page has been loaded\n * and return a function to use the app instance when it is ready.\n */\nexport default function createApp<\n S extends BaseConstructor<Base>,\n T extends BaseProps = BaseProps,\n>(App: S, rootElement: HTMLElement = document.body): () => Promise<S & Base<T>> {\n let isLoaded = document.readyState === 'complete';\n let app: S & Base<T>;\n\n if (!isLoaded) {\n document.addEventListener('readystatechange', () => {\n if (document.readyState === 'complete') {\n app = (new App(rootElement) as S & Base<T>).$mount();\n isLoaded = true;\n }\n });\n } else {\n app = (new App(rootElement) as S & Base<T>).$mount();\n }\n\n const promise:Promise<S & Base<T>> = new Promise((resolve) => {\n document.addEventListener('readystatechange', () => {\n if (document.readyState === 'complete') {\n setTimeout(() => resolve(app), 0);\n }\n });\n });\n\n return function useApp() {\n if (isLoaded) {\n return Promise.resolve(app);\n }\n\n return promise;\n };\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAMe,SAAR,UAGL,KAAQ,cAA2B,SAAS,MAAkC;AAC9E,MAAI,WAAW,SAAS,eAAe;AACvC,MAAI;AAEJ,MAAI,CAAC,UAAU;AACb,aAAS,iBAAiB,oBAAoB,MAAM;AAClD,UAAI,SAAS,eAAe,YAAY;AACtC,cAAO,IAAI,IAAI,WAAW,EAAkB,OAAO;AACnD,mBAAW;AAAA,MACb;AAAA,IACF,CAAC;AAAA,EACH,OAAO;AACL,UAAO,IAAI,IAAI,WAAW,EAAkB,OAAO;AAAA,EACrD;AAEA,QAAM,UAA+B,IAAI,QAAQ,CAAC,YAAY;AAC5D,aAAS,iBAAiB,oBAAoB,MAAM;AAClD,UAAI,SAAS,eAAe,YAAY;AACtC,mBAAW,MAAM,QAAQ,GAAG,GAAG,CAAC;AAAA,MAClC;AAAA,IACF,CAAC;AAAA,EACH,CAAC;AAED,SAAO,SAAS,SAAS;AACvB,QAAI,UAAU;AACZ,aAAO,QAAQ,QAAQ,GAAG;AAAA,IAC5B;AAEA,WAAO;AAAA,EACT;AACF;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/helpers/createApp.js
CHANGED
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../packages/js-toolkit/helpers/createApp.ts"],
|
|
4
|
+
"sourcesContent": ["import type { Base, BaseConstructor, BaseProps } from '../Base/index.js';\n\n/**\n * Instantiate and mount the given component on the given root element when the page has been loaded\n * and return a function to use the app instance when it is ready.\n */\nexport default function createApp<\n S extends BaseConstructor<Base>,\n T extends BaseProps = BaseProps,\n>(App: S, rootElement: HTMLElement = document.body): () => Promise<S & Base<T>> {\n let isLoaded = document.readyState === 'complete';\n let app: S & Base<T>;\n\n if (!isLoaded) {\n document.addEventListener('readystatechange', () => {\n if (document.readyState === 'complete') {\n app = (new App(rootElement) as S & Base<T>).$mount();\n isLoaded = true;\n }\n });\n } else {\n app = (new App(rootElement) as S & Base<T>).$mount();\n }\n\n const promise:Promise<S & Base<T>> = new Promise((resolve) => {\n document.addEventListener('readystatechange', () => {\n if (document.readyState === 'complete') {\n setTimeout(() => resolve(app), 0);\n }\n });\n });\n\n return function useApp() {\n if (isLoaded) {\n return Promise.resolve(app);\n }\n\n return promise;\n };\n}\n"],
|
|
5
|
+
"mappings": "AAMe,SAAR,UAGL,KAAQ,cAA2B,SAAS,MAAkC;AAC9E,MAAI,WAAW,SAAS,eAAe;AACvC,MAAI;AAEJ,MAAI,CAAC,UAAU;AACb,aAAS,iBAAiB,oBAAoB,MAAM;AAClD,UAAI,SAAS,eAAe,YAAY;AACtC,cAAO,IAAI,IAAI,WAAW,EAAkB,OAAO;AACnD,mBAAW;AAAA,MACb;AAAA,IACF,CAAC;AAAA,EACH,OAAO;AACL,UAAO,IAAI,IAAI,WAAW,EAAkB,OAAO;AAAA,EACrD;AAEA,QAAM,UAA+B,IAAI,QAAQ,CAAC,YAAY;AAC5D,aAAS,iBAAiB,oBAAoB,MAAM;AAClD,UAAI,SAAS,eAAe,YAAY;AACtC,mBAAW,MAAM,QAAQ,GAAG,GAAG,CAAC;AAAA,MAClC;AAAA,IACF,CAAC;AAAA,EACH,CAAC;AAED,SAAO,SAAS,SAAS;AACvB,QAAI,UAAU;AACZ,aAAO,QAAQ,QAAQ,GAAG;AAAA,IAC5B;AAEA,WAAO;AAAA,EACT;AACF;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -46,3 +46,4 @@ function getClosestParent(childInstance, ParentConstructor) {
|
|
|
46
46
|
return parentEl ? (0, import_getInstanceFromElement.default)(parentEl, ParentConstructor) : null;
|
|
47
47
|
}
|
|
48
48
|
if (module.exports.default) module.exports = module.exports.default;
|
|
49
|
+
//# sourceMappingURL=getClosestParent.cjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../packages/js-toolkit/helpers/getClosestParent.ts"],
|
|
4
|
+
"sourcesContent": ["import type { Base, BaseConstructor } from '../Base/index.js';\nimport getInstanceFromElement from './getInstanceFromElement.js';\n\n/**\n * Walk through an element ancestors while the given condition is true with a\n * limit of 1000 iteration to avoid infinite loops.\n */\nfunction walkAncestorsWhile(\n element: HTMLElement,\n condition: (element: HTMLElement) => boolean,\n limit = 1000,\n): HTMLElement | null {\n let parent = element.parentElement;\n let count = 0;\n\n while (parent && condition(parent) && count < limit) {\n parent = parent.parentElement;\n count += 1;\n }\n\n return parent;\n}\n\n/**\n * Get the closest parent of a component.\n */\nexport default function getClosestParent<T extends BaseConstructor>(childInstance:Base, ParentConstructor:T) {\n const parentEl = walkAncestorsWhile(\n childInstance.$el,\n (element) => !getInstanceFromElement(element, ParentConstructor),\n );\n\n return parentEl ? getInstanceFromElement(parentEl, ParentConstructor) : null;\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,oCAAmC;AAMnC,SAAS,mBACP,SACA,WACA,QAAQ,KACY;AACpB,MAAI,SAAS,QAAQ;AACrB,MAAI,QAAQ;AAEZ,SAAO,UAAU,UAAU,MAAM,KAAK,QAAQ,OAAO;AACnD,aAAS,OAAO;AAChB,aAAS;AAAA,EACX;AAEA,SAAO;AACT;AAKe,SAAR,iBAA6D,eAAoB,mBAAqB;AAC3G,QAAM,WAAW;AAAA,IACf,cAAc;AAAA,IACd,CAAC,YAAY,KAAC,8BAAAA,SAAuB,SAAS,iBAAiB;AAAA,EACjE;AAEA,SAAO,eAAW,8BAAAA,SAAuB,UAAU,iBAAiB,IAAI;AAC1E;",
|
|
6
|
+
"names": ["getInstanceFromElement"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../packages/js-toolkit/helpers/getClosestParent.ts"],
|
|
4
|
+
"sourcesContent": ["import type { Base, BaseConstructor } from '../Base/index.js';\nimport getInstanceFromElement from './getInstanceFromElement.js';\n\n/**\n * Walk through an element ancestors while the given condition is true with a\n * limit of 1000 iteration to avoid infinite loops.\n */\nfunction walkAncestorsWhile(\n element: HTMLElement,\n condition: (element: HTMLElement) => boolean,\n limit = 1000,\n): HTMLElement | null {\n let parent = element.parentElement;\n let count = 0;\n\n while (parent && condition(parent) && count < limit) {\n parent = parent.parentElement;\n count += 1;\n }\n\n return parent;\n}\n\n/**\n * Get the closest parent of a component.\n */\nexport default function getClosestParent<T extends BaseConstructor>(childInstance:Base, ParentConstructor:T) {\n const parentEl = walkAncestorsWhile(\n childInstance.$el,\n (element) => !getInstanceFromElement(element, ParentConstructor),\n );\n\n return parentEl ? getInstanceFromElement(parentEl, ParentConstructor) : null;\n}\n"],
|
|
5
|
+
"mappings": "AACA,OAAO,4BAA4B;AAMnC,SAAS,mBACP,SACA,WACA,QAAQ,KACY;AACpB,MAAI,SAAS,QAAQ;AACrB,MAAI,QAAQ;AAEZ,SAAO,UAAU,UAAU,MAAM,KAAK,QAAQ,OAAO;AACnD,aAAS,OAAO;AAChB,aAAS;AAAA,EACX;AAEA,SAAO;AACT;AAKe,SAAR,iBAA6D,eAAoB,mBAAqB;AAC3G,QAAM,WAAW;AAAA,IACf,cAAc;AAAA,IACd,CAAC,YAAY,CAAC,uBAAuB,SAAS,iBAAiB;AAAA,EACjE;AAEA,SAAO,WAAW,uBAAuB,UAAU,iBAAiB,IAAI;AAC1E;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -44,3 +44,4 @@ function isDirectChild(parentInstance, parentName, childrenName, childInstance)
|
|
|
44
44
|
return getDirectChildren(parentInstance, parentName, childrenName).includes(childInstance);
|
|
45
45
|
}
|
|
46
46
|
if (module.exports.default) module.exports = module.exports.default;
|
|
47
|
+
//# sourceMappingURL=getDirectChildren.cjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../packages/js-toolkit/helpers/getDirectChildren.ts"],
|
|
4
|
+
"sourcesContent": ["import { Base, BaseProps } from '../Base/index.js';\nimport { isArray } from '../utils/index.js';\n\n/**\n * Get direct children from a parent when working with nested components.\n *\n * @template {Base} T\n * @param {Base} parentInstance\n * @param {string} parentName\n * @param {string} childrenName\n * @returns {T[]}\n */\nexport function getDirectChildren<T extends Base = Base>(\n parentInstance: Base,\n parentName: string,\n childrenName: string,\n): T[] {\n const children = parentInstance.$children[childrenName] as Base<BaseProps>[];\n const nestedParents = parentInstance.$children[parentName] as Base<BaseProps>[];\n\n if (!isArray(children)) {\n return [];\n }\n\n if (!isArray(nestedParents) || nestedParents.length <= 0) {\n return children as T[];\n }\n\n return [...children].filter((child) =>\n [...nestedParents].every((nestedParent) => {\n const nestedChildren = nestedParent.$children[childrenName] as Base<BaseProps>[];\n /* istanbul ignore next */\n return isArray(nestedChildren) ? !nestedChildren.includes(child) : true;\n }),\n ) as T[];\n}\n\n/**\n * Test if a component instance is a direct child from the given component.\n *\n * @param {Base} parentInstance\n * @param {string} parentName\n * @param {string} childrenName\n * @param {Base} childInstance\n * @returns {boolean}\n */\nexport function isDirectChild(parentInstance, parentName, childrenName, childInstance) {\n return getDirectChildren(parentInstance, parentName, childrenName).includes(childInstance);\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAwB;AAWjB,SAAS,kBACd,gBACA,YACA,cACK;AACL,QAAM,WAAW,eAAe,UAAU;AAC1C,QAAM,gBAAgB,eAAe,UAAU;AAE/C,MAAI,KAAC,sBAAQ,QAAQ,GAAG;AACtB,WAAO,CAAC;AAAA,EACV;AAEA,MAAI,KAAC,sBAAQ,aAAa,KAAK,cAAc,UAAU,GAAG;AACxD,WAAO;AAAA,EACT;AAEA,SAAO,CAAC,GAAG,QAAQ,EAAE;AAAA,IAAO,CAAC,UAC3B,CAAC,GAAG,aAAa,EAAE,MAAM,CAAC,iBAAiB;AACzC,YAAM,iBAAiB,aAAa,UAAU;AAE9C,iBAAO,sBAAQ,cAAc,IAAI,CAAC,eAAe,SAAS,KAAK,IAAI;AAAA,IACrE,CAAC;AAAA,EACH;AACF;AAWO,SAAS,cAAc,gBAAgB,YAAY,cAAc,eAAe;AACrF,SAAO,kBAAkB,gBAAgB,YAAY,YAAY,EAAE,SAAS,aAAa;AAC3F;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../packages/js-toolkit/helpers/getDirectChildren.ts"],
|
|
4
|
+
"sourcesContent": ["import { Base, BaseProps } from '../Base/index.js';\nimport { isArray } from '../utils/index.js';\n\n/**\n * Get direct children from a parent when working with nested components.\n *\n * @template {Base} T\n * @param {Base} parentInstance\n * @param {string} parentName\n * @param {string} childrenName\n * @returns {T[]}\n */\nexport function getDirectChildren<T extends Base = Base>(\n parentInstance: Base,\n parentName: string,\n childrenName: string,\n): T[] {\n const children = parentInstance.$children[childrenName] as Base<BaseProps>[];\n const nestedParents = parentInstance.$children[parentName] as Base<BaseProps>[];\n\n if (!isArray(children)) {\n return [];\n }\n\n if (!isArray(nestedParents) || nestedParents.length <= 0) {\n return children as T[];\n }\n\n return [...children].filter((child) =>\n [...nestedParents].every((nestedParent) => {\n const nestedChildren = nestedParent.$children[childrenName] as Base<BaseProps>[];\n /* istanbul ignore next */\n return isArray(nestedChildren) ? !nestedChildren.includes(child) : true;\n }),\n ) as T[];\n}\n\n/**\n * Test if a component instance is a direct child from the given component.\n *\n * @param {Base} parentInstance\n * @param {string} parentName\n * @param {string} childrenName\n * @param {Base} childInstance\n * @returns {boolean}\n */\nexport function isDirectChild(parentInstance, parentName, childrenName, childInstance) {\n return getDirectChildren(parentInstance, parentName, childrenName).includes(childInstance);\n}\n"],
|
|
5
|
+
"mappings": "AACA,SAAS,eAAe;AAWjB,SAAS,kBACd,gBACA,YACA,cACK;AACL,QAAM,WAAW,eAAe,UAAU;AAC1C,QAAM,gBAAgB,eAAe,UAAU;AAE/C,MAAI,CAAC,QAAQ,QAAQ,GAAG;AACtB,WAAO,CAAC;AAAA,EACV;AAEA,MAAI,CAAC,QAAQ,aAAa,KAAK,cAAc,UAAU,GAAG;AACxD,WAAO;AAAA,EACT;AAEA,SAAO,CAAC,GAAG,QAAQ,EAAE;AAAA,IAAO,CAAC,UAC3B,CAAC,GAAG,aAAa,EAAE,MAAM,CAAC,iBAAiB;AACzC,YAAM,iBAAiB,aAAa,UAAU;AAE9C,aAAO,QAAQ,cAAc,IAAI,CAAC,eAAe,SAAS,KAAK,IAAI;AAAA,IACrE,CAAC;AAAA,EACH;AACF;AAWO,SAAS,cAAc,gBAAgB,YAAY,cAAc,eAAe;AACrF,SAAO,kBAAkB,gBAAgB,YAAY,YAAY,EAAE,SAAS,aAAa;AAC3F;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../packages/js-toolkit/helpers/getInstanceFromElement.ts"],
|
|
4
|
+
"sourcesContent": ["import type { BaseConstructor, BaseEl } from '../Base/index.js';\n\n/**\n * Get a component instance from a DOM element.\n */\nexport default function getInstanceFromElement<T extends BaseConstructor>(\n element: BaseEl,\n Constructor: T,\n):InstanceType<T> | null {\n if (!element.__base__ || !element.__base__.has(Constructor)) {\n return null;\n }\n\n return element.__base__.get(Constructor) as InstanceType<T>;\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAKe,SAAR,uBACL,SACA,aACuB;AACvB,MAAI,CAAC,QAAQ,YAAY,CAAC,QAAQ,SAAS,IAAI,WAAW,GAAG;AAC3D,WAAO;AAAA,EACT;AAEA,SAAO,QAAQ,SAAS,IAAI,WAAW;AACzC;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../packages/js-toolkit/helpers/getInstanceFromElement.ts"],
|
|
4
|
+
"sourcesContent": ["import type { BaseConstructor, BaseEl } from '../Base/index.js';\n\n/**\n * Get a component instance from a DOM element.\n */\nexport default function getInstanceFromElement<T extends BaseConstructor>(\n element: BaseEl,\n Constructor: T,\n):InstanceType<T> | null {\n if (!element.__base__ || !element.__base__.has(Constructor)) {\n return null;\n }\n\n return element.__base__.get(Constructor) as InstanceType<T>;\n}\n"],
|
|
5
|
+
"mappings": "AAKe,SAAR,uBACL,SACA,aACuB;AACvB,MAAI,CAAC,QAAQ,YAAY,CAAC,QAAQ,SAAS,IAAI,WAAW,GAAG;AAC3D,WAAO;AAAA,EACT;AAEA,SAAO,QAAQ,SAAS,IAAI,WAAW;AACzC;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|