@studiometa/js-toolkit 2.11.2 → 2.12.0
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/Base.cjs +155 -60
- package/Base/Base.cjs.map +2 -2
- package/Base/Base.js +138 -38
- package/Base/Base.js.map +2 -2
- package/Base/managers/AbstractManager.cjs +21 -0
- package/Base/managers/AbstractManager.cjs.map +1 -1
- package/Base/managers/AbstractManager.js +21 -0
- package/Base/managers/AbstractManager.js.map +1 -1
- package/Base/managers/ChildrenManager.cjs +41 -8
- package/Base/managers/ChildrenManager.cjs.map +3 -3
- package/Base/managers/ChildrenManager.js +41 -8
- package/Base/managers/ChildrenManager.js.map +2 -2
- package/Base/managers/EventsManager.cjs +92 -7
- package/Base/managers/EventsManager.cjs.map +2 -2
- package/Base/managers/EventsManager.js +88 -7
- package/Base/managers/EventsManager.js.map +2 -2
- package/Base/managers/OptionsManager.cjs +29 -2
- package/Base/managers/OptionsManager.cjs.map +2 -2
- package/Base/managers/OptionsManager.js +25 -2
- package/Base/managers/OptionsManager.js.map +2 -2
- package/Base/managers/RefsManager.cjs +19 -5
- package/Base/managers/RefsManager.cjs.map +2 -2
- package/Base/managers/RefsManager.js +27 -6
- package/Base/managers/RefsManager.js.map +2 -2
- package/Base/managers/ResponsiveOptionsManager.cjs +22 -6
- package/Base/managers/ResponsiveOptionsManager.cjs.map +2 -2
- package/Base/managers/ResponsiveOptionsManager.js +22 -6
- package/Base/managers/ResponsiveOptionsManager.js.map +2 -2
- package/Base/managers/ServicesManager.cjs +54 -4
- package/Base/managers/ServicesManager.cjs.map +2 -2
- package/Base/managers/ServicesManager.js +54 -4
- package/Base/managers/ServicesManager.js.map +2 -2
- package/Base/utils.cjs +4 -0
- package/Base/utils.cjs.map +1 -1
- package/Base/utils.js +4 -0
- package/Base/utils.js.map +1 -1
- package/decorators/withBreakpointManager.cjs +14 -4
- package/decorators/withBreakpointManager.cjs.map +2 -2
- package/decorators/withBreakpointManager.js +14 -4
- package/decorators/withBreakpointManager.js.map +2 -2
- package/decorators/withBreakpointObserver.cjs +11 -1
- package/decorators/withBreakpointObserver.cjs.map +2 -2
- package/decorators/withBreakpointObserver.js +12 -2
- package/decorators/withBreakpointObserver.js.map +2 -2
- package/decorators/withDrag.cjs +6 -0
- package/decorators/withDrag.cjs.map +1 -1
- package/decorators/withDrag.js +6 -0
- package/decorators/withDrag.js.map +1 -1
- package/decorators/withExtraConfig.cjs +7 -0
- package/decorators/withExtraConfig.cjs.map +1 -1
- package/decorators/withExtraConfig.js +3 -0
- package/decorators/withExtraConfig.js.map +1 -1
- package/decorators/withFreezedOptions.cjs +8 -0
- package/decorators/withFreezedOptions.cjs.map +1 -1
- package/decorators/withFreezedOptions.js +8 -0
- package/decorators/withFreezedOptions.js.map +1 -1
- package/decorators/withIntersectionObserver.cjs +9 -0
- package/decorators/withIntersectionObserver.cjs.map +1 -1
- package/decorators/withIntersectionObserver.js +9 -0
- package/decorators/withIntersectionObserver.js.map +1 -1
- package/decorators/withMountOnMediaQuery.cjs +16 -0
- package/decorators/withMountOnMediaQuery.cjs.map +1 -1
- package/decorators/withMountOnMediaQuery.js +16 -0
- package/decorators/withMountOnMediaQuery.js.map +1 -1
- package/decorators/withMountWhenInView.cjs +21 -0
- package/decorators/withMountWhenInView.cjs.map +1 -1
- package/decorators/withMountWhenInView.js +21 -0
- package/decorators/withMountWhenInView.js.map +1 -1
- package/decorators/withRelativePointer.cjs +6 -0
- package/decorators/withRelativePointer.cjs.map +1 -1
- package/decorators/withRelativePointer.js +6 -0
- package/decorators/withRelativePointer.js.map +1 -1
- package/decorators/withResponsiveOptions.cjs +3 -0
- package/decorators/withResponsiveOptions.cjs.map +1 -1
- package/decorators/withResponsiveOptions.js +3 -0
- package/decorators/withResponsiveOptions.js.map +1 -1
- package/decorators/withScrolledInView/utils.cjs +6 -6
- package/decorators/withScrolledInView/utils.cjs.map +2 -2
- package/decorators/withScrolledInView/utils.js +7 -7
- package/decorators/withScrolledInView/utils.js.map +2 -2
- package/decorators/withScrolledInView/withScrolledInView.cjs +33 -0
- package/decorators/withScrolledInView/withScrolledInView.cjs.map +1 -1
- package/decorators/withScrolledInView/withScrolledInView.js +33 -0
- package/decorators/withScrolledInView/withScrolledInView.js.map +1 -1
- package/decorators/withVue2.cjs +3 -0
- package/decorators/withVue2.cjs.map +1 -1
- package/decorators/withVue2.js +3 -0
- package/decorators/withVue2.js.map +1 -1
- package/helpers/createApp.cjs +2 -2
- package/helpers/createApp.cjs.map +2 -2
- package/helpers/createApp.js +2 -2
- package/helpers/createApp.js.map +2 -2
- package/helpers/getClosestParent.cjs +4 -0
- package/helpers/getClosestParent.cjs.map +1 -1
- package/helpers/getDirectChildren.cjs.map +1 -1
- package/helpers/getDirectChildren.js.map +1 -1
- package/helpers/importOnInteraction.cjs +4 -4
- package/helpers/importOnInteraction.cjs.map +2 -2
- package/helpers/importOnInteraction.js +4 -4
- package/helpers/importOnInteraction.js.map +2 -2
- package/helpers/importWhenPrefersMotion.cjs +4 -0
- package/helpers/importWhenPrefersMotion.cjs.map +1 -1
- package/helpers/importWhenVisible.cjs +2 -1
- package/helpers/importWhenVisible.cjs.map +2 -2
- package/helpers/importWhenVisible.js +2 -1
- package/helpers/importWhenVisible.js.map +2 -2
- package/helpers/index.cjs +4 -0
- package/helpers/index.cjs.map +1 -1
- package/package.json +3 -3
- package/services/drag.cjs +12 -8
- package/services/drag.cjs.map +2 -2
- package/services/drag.js +8 -8
- package/services/drag.js.map +2 -2
- package/services/index.cjs +4 -0
- package/services/index.cjs.map +1 -1
- package/services/key.cjs +6 -2
- package/services/key.cjs.map +2 -2
- package/services/key.js +2 -2
- package/services/key.js.map +2 -2
- package/services/load.cjs +3 -0
- package/services/load.cjs.map +1 -1
- package/services/load.js +3 -0
- package/services/load.js.map +1 -1
- package/services/pointer.cjs +4 -4
- package/services/pointer.cjs.map +2 -2
- package/services/pointer.js +4 -4
- package/services/pointer.js.map +2 -2
- package/services/raf.cjs +2 -2
- package/services/raf.cjs.map +2 -2
- package/services/raf.js +2 -2
- package/services/raf.js.map +2 -2
- package/services/resize.cjs +4 -0
- package/services/resize.cjs.map +1 -1
- package/services/scroll.cjs +4 -0
- package/services/scroll.cjs.map +1 -1
- package/services/service.cjs +2 -2
- package/services/service.cjs.map +2 -2
- package/services/service.js +2 -2
- package/services/service.js.map +2 -2
- package/utils/Queue.cjs +30 -0
- package/utils/Queue.cjs.map +1 -1
- package/utils/Queue.js +30 -0
- package/utils/Queue.js.map +1 -1
- package/utils/SmartQueue.cjs +16 -0
- package/utils/SmartQueue.cjs.map +1 -1
- package/utils/SmartQueue.js +12 -0
- package/utils/SmartQueue.js.map +1 -1
- package/utils/collide/collidePointRect.cjs +4 -1
- package/utils/collide/collidePointRect.cjs.map +1 -1
- package/utils/collide/collidePointRect.js +4 -1
- package/utils/collide/collidePointRect.js.map +1 -1
- package/utils/collide/collideRectRect.cjs +4 -1
- package/utils/collide/collideRectRect.cjs.map +1 -1
- package/utils/collide/collideRectRect.js +4 -1
- package/utils/collide/collideRectRect.js.map +1 -1
- package/utils/collide/index.cjs +4 -0
- package/utils/collide/index.cjs.map +1 -1
- package/utils/css/animate.cjs +21 -12
- package/utils/css/animate.cjs.map +2 -2
- package/utils/css/animate.js +17 -12
- package/utils/css/animate.js.map +2 -2
- package/utils/css/classes.cjs +2 -3
- package/utils/css/classes.cjs.map +2 -2
- package/utils/css/classes.js +2 -3
- package/utils/css/classes.js.map +2 -2
- package/utils/css/index.cjs +4 -0
- package/utils/css/index.cjs.map +1 -1
- package/utils/css/matrix.cjs.map +1 -1
- package/utils/css/matrix.js.map +1 -1
- package/utils/css/styles.cjs +2 -2
- package/utils/css/styles.cjs.map +2 -2
- package/utils/css/styles.js +2 -2
- package/utils/css/styles.js.map +2 -2
- package/utils/css/transform.cjs.map +1 -1
- package/utils/css/transform.js.map +1 -1
- package/utils/css/transition.cjs +19 -0
- package/utils/css/transition.cjs.map +1 -1
- package/utils/css/transition.js +15 -0
- package/utils/css/transition.js.map +1 -1
- package/utils/focusTrap.cjs +4 -0
- package/utils/focusTrap.cjs.map +1 -1
- package/utils/focusTrap.js.map +1 -1
- package/utils/history.cjs +6 -5
- package/utils/history.cjs.map +2 -2
- package/utils/history.js +6 -5
- package/utils/history.js.map +2 -2
- package/utils/index.cjs +4 -0
- package/utils/index.cjs.map +1 -1
- package/utils/math/clamp01.cjs +4 -0
- package/utils/math/clamp01.cjs.map +1 -1
- package/utils/math/index.cjs +4 -0
- package/utils/math/index.cjs.map +1 -1
- package/utils/math/inertiaFinalValue.cjs +4 -0
- package/utils/math/inertiaFinalValue.cjs.map +1 -1
- package/utils/object/autoBind.cjs +11 -5
- package/utils/object/autoBind.cjs.map +2 -2
- package/utils/object/autoBind.js +7 -5
- package/utils/object/autoBind.js.map +2 -2
- package/utils/object/index.cjs +4 -0
- package/utils/object/index.cjs.map +1 -1
- package/utils/scheduler.cjs +4 -4
- package/utils/scheduler.cjs.map +2 -2
- package/utils/scheduler.js +4 -4
- package/utils/scheduler.js.map +2 -2
- package/utils/scrollTo.cjs +4 -0
- package/utils/scrollTo.cjs.map +1 -1
- package/utils/string/endsWith.cjs +35 -0
- package/utils/string/endsWith.cjs.map +7 -0
- package/utils/string/endsWith.d.ts +8 -0
- package/utils/string/endsWith.js +13 -0
- package/utils/string/endsWith.js.map +7 -0
- package/utils/string/index.cjs +7 -0
- package/utils/string/index.cjs.map +2 -2
- package/utils/string/index.d.ts +2 -0
- package/utils/string/index.js +2 -0
- package/utils/string/index.js.map +2 -2
- package/utils/string/startsWith.cjs +35 -0
- package/utils/string/startsWith.cjs.map +7 -0
- package/utils/string/startsWith.d.ts +8 -0
- package/utils/string/startsWith.js +13 -0
- package/utils/string/startsWith.js.map +7 -0
- package/utils/string/withLeadingCharacters.cjs +4 -0
- package/utils/string/withLeadingCharacters.cjs.map +1 -1
- package/utils/string/withLeadingCharacters.js.map +1 -1
- package/utils/string/withLeadingSlash.cjs +4 -0
- package/utils/string/withLeadingSlash.cjs.map +1 -1
- package/utils/string/withTrailingCharacters.cjs +4 -0
- package/utils/string/withTrailingCharacters.cjs.map +1 -1
- package/utils/string/withTrailingCharacters.js.map +1 -1
- package/utils/string/withTrailingSlash.cjs +4 -0
- package/utils/string/withTrailingSlash.cjs.map +1 -1
- package/utils/string/withoutLeadingCharacters.cjs.map +1 -1
- package/utils/string/withoutLeadingCharacters.js.map +1 -1
- package/utils/string/withoutLeadingCharactersRecursive.cjs +4 -0
- package/utils/string/withoutLeadingCharactersRecursive.cjs.map +1 -1
- package/utils/string/withoutLeadingCharactersRecursive.js.map +1 -1
- package/utils/string/withoutLeadingSlash.cjs +4 -0
- package/utils/string/withoutLeadingSlash.cjs.map +1 -1
- package/utils/string/withoutTrailingCharacters.cjs.map +1 -1
- package/utils/string/withoutTrailingCharacters.js.map +1 -1
- package/utils/string/withoutTrailingCharactersRecursive.cjs +4 -0
- package/utils/string/withoutTrailingCharactersRecursive.cjs.map +1 -1
- package/utils/string/withoutTrailingCharactersRecursive.js.map +1 -1
- package/utils/string/withoutTrailingSlash.cjs +4 -0
- package/utils/string/withoutTrailingSlash.cjs.map +1 -1
- package/utils/tween.cjs +4 -0
- package/utils/tween.cjs.map +1 -1
- package/utils/tween.js.map +1 -1
|
@@ -34,6 +34,9 @@ function withScrolledInView(BaseClass, options = {}) {
|
|
|
34
34
|
BaseClass,
|
|
35
35
|
options
|
|
36
36
|
) {
|
|
37
|
+
/**
|
|
38
|
+
* Config.
|
|
39
|
+
*/
|
|
37
40
|
static config = {
|
|
38
41
|
name: `${BaseClass.config.name}WithMountWhenInView`,
|
|
39
42
|
emits: ["scrolledInView"],
|
|
@@ -113,8 +116,23 @@ function withScrolledInView(BaseClass, options = {}) {
|
|
|
113
116
|
}
|
|
114
117
|
return this.__props;
|
|
115
118
|
}
|
|
119
|
+
/**
|
|
120
|
+
* Factor used for the `dampedProgress` props.
|
|
121
|
+
*
|
|
122
|
+
* @deprecated
|
|
123
|
+
* @todo v3 delete in favor of option API
|
|
124
|
+
*/
|
|
116
125
|
dampFactor = null;
|
|
126
|
+
/**
|
|
127
|
+
* Precision for the `dampedProgress` props.
|
|
128
|
+
*
|
|
129
|
+
* @deprecated
|
|
130
|
+
* @todo v3 delete in favor of option API
|
|
131
|
+
*/
|
|
117
132
|
dampPrecision = null;
|
|
133
|
+
/**
|
|
134
|
+
* Bind listeners.
|
|
135
|
+
*/
|
|
118
136
|
constructor(element) {
|
|
119
137
|
super(element);
|
|
120
138
|
const render = () => {
|
|
@@ -167,26 +185,41 @@ function withScrolledInView(BaseClass, options = {}) {
|
|
|
167
185
|
render();
|
|
168
186
|
});
|
|
169
187
|
}
|
|
188
|
+
/**
|
|
189
|
+
* Mounted hook.
|
|
190
|
+
*/
|
|
170
191
|
mounted() {
|
|
171
192
|
if (isFunction(super.mounted)) {
|
|
172
193
|
super.mounted();
|
|
173
194
|
}
|
|
174
195
|
}
|
|
196
|
+
/**
|
|
197
|
+
* Resized hook.
|
|
198
|
+
*/
|
|
175
199
|
resized(props) {
|
|
176
200
|
if (isFunction(super.resized)) {
|
|
177
201
|
super.resized(props);
|
|
178
202
|
}
|
|
179
203
|
}
|
|
204
|
+
/**
|
|
205
|
+
* Scrolled hook.
|
|
206
|
+
*/
|
|
180
207
|
scrolled(props) {
|
|
181
208
|
if (isFunction(super.scrolled)) {
|
|
182
209
|
super.scrolled(props);
|
|
183
210
|
}
|
|
184
211
|
}
|
|
212
|
+
/**
|
|
213
|
+
* Ticked hook.
|
|
214
|
+
*/
|
|
185
215
|
ticked(props) {
|
|
186
216
|
if (isFunction(super.ticked)) {
|
|
187
217
|
super.ticked(props);
|
|
188
218
|
}
|
|
189
219
|
}
|
|
220
|
+
/**
|
|
221
|
+
* Destroyed hook.
|
|
222
|
+
*/
|
|
190
223
|
destroyed() {
|
|
191
224
|
if (isFunction(super.destroyed)) {
|
|
192
225
|
super.destroyed();
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../packages/js-toolkit/decorators/withScrolledInView/withScrolledInView.ts"],
|
|
4
4
|
"sourcesContent": ["import type { BaseInterface, BaseDecorator } from '../../Base/types.js';\nimport type { Base, BaseProps, BaseConfig } from '../../Base/index.js';\nimport type {\n RafServiceProps,\n ScrollServiceProps,\n ResizeServiceProps,\n} from '../../services/index.js';\nimport { withMountWhenInView } from '../withMountWhenInView.js';\nimport {\n damp,\n clamp,\n clamp01,\n getOffsetSizes,\n isFunction,\n useScheduler,\n} from '../../utils/index.js';\nimport { normalizeOffset, getEdges } from './utils.js';\n\nconst scheduler = useScheduler(['update', 'render']);\n\nexport interface WithScrolledInViewProps extends BaseProps {\n $options: {\n dampFactor: number;\n dampPrecision: number;\n offset: string;\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\nfunction updateProgress(\n props: ScrollInViewProps,\n axis: 'x' | 'y',\n progressKey: 'progress' | 'dampedProgress',\n currentKey: 'current' | 'dampedCurrent',\n) {\n props[progressKey][axis] =\n props.start[axis] === props.end[axis]\n ? 0\n : clamp01(\n (props[currentKey][axis] - props.start[axis]) / (props.end[axis] - props.start[axis]),\n );\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 updateProgress(props, axis, 'progress', 'current');\n updateProgress(props, axis, 'dampedProgress', 'dampedCurrent');\n}\n\nexport interface WithScrolledInViewInterface extends BaseInterface {\n /**\n * @type {ScrollInViewProps}\n */\n readonly 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\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<T extends BaseProps = BaseProps> extends withMountWhenInView(\n BaseClass,\n options,\n )<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 offset: {\n type: String,\n default: 'start end / end start',\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 shouldEvaluateProps = true;\n\n get props() {\n if (this.shouldEvaluateProps) {\n this.shouldEvaluateProps = false;\n const targetSizes = options.useOffsetSizes\n ? getOffsetSizes(this.$el)\n : this.$el.getBoundingClientRect();\n\n targetSizes.y += window.pageYOffset;\n targetSizes.x += window.pageXOffset;\n\n const containerSizes = {\n x: 0,\n y: 0,\n height: window.innerHeight,\n width: window.innerWidth,\n };\n\n const offset = normalizeOffset(this.$options.offset);\n\n // Y axis\n const [yStart, yEnd] = getEdges('y', targetSizes, containerSizes, offset);\n const yCurrent = clamp(window.pageYOffset, yStart, yEnd);\n const yProgress = yStart === yEnd ? 0 : clamp01((yCurrent - yStart) / (yEnd - yStart));\n // X axis\n const [xStart, xEnd] = getEdges('x', targetSizes, containerSizes, offset);\n const xCurrent = clamp(window.pageXOffset, xStart, xEnd);\n const xProgress = xStart === xEnd ? 0 : 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 = xCurrent;\n this.__props.dampedCurrent.y = yCurrent;\n this.__props.progress.x = xProgress;\n this.__props.progress.y = yProgress;\n this.__props.dampedProgress.x = xProgress;\n this.__props.dampedProgress.y = yProgress;\n }\n\n return this.__props;\n }\n\n /**\n * Factor used for the `dampedProgress` props.\n *\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 *\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.shouldEvaluateProps = true;\n render();\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.dampPrecision ?? this.$options.dampPrecision;\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('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 // @ts-ignore\n return WithScrolledInView;\n}\n"],
|
|
5
|
-
"mappings": "AAOA,SAAS,2BAA2B;AACpC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,iBAAiB,gBAAgB;AAE1C,MAAM,YAAY,aAAa,CAAC,UAAU,QAAQ,CAAC;AAyCnD,SAAS,eACP,OACA,MACA,aACA,YACA;AACA,QAAM,
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/decorators/withVue2.cjs
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../packages/js-toolkit/decorators/withVue2.ts"],
|
|
4
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;
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA,mBAAkC;AAe3B,SAAS,SACd,WACA,SACoD;AAAA,EAQpD,MAAM,iBAAiB,UAAU;AAAA,IAC/B,OAAO,SAAqB;AAAA,MAC1B,GAAG,UAAU;AAAA,MACb,MAAM,GAAG,UAAU,OAAO,IAAI;AAAA,MAC9B,MAAM,CAAC,GAAI,UAAU,QAAQ,QAAQ,CAAC,GAAI,KAAK;AAAA,IACjD;AAAA,IAEA;AAAA;AAAA;AAAA;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
6
|
"names": []
|
|
7
7
|
}
|
package/decorators/withVue2.js
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../packages/js-toolkit/decorators/withVue2.ts"],
|
|
4
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;
|
|
5
|
+
"mappings": "AAIA,SAAS,OAAO,kBAAkB;AAe3B,SAAS,SACd,WACA,SACoD;AAAA,EAQpD,MAAM,iBAAiB,UAAU;AAAA,IAC/B,OAAO,SAAqB;AAAA,MAC1B,GAAG,UAAU;AAAA,MACb,MAAM,GAAG,UAAU,OAAO,IAAI;AAAA,MAC9B,MAAM,CAAC,GAAI,UAAU,QAAQ,QAAQ,CAAC,GAAI,KAAK;AAAA,IACjD;AAAA,IAEA;AAAA;AAAA;AAAA;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
6
|
"names": []
|
|
7
7
|
}
|
package/helpers/createApp.cjs
CHANGED
|
@@ -28,9 +28,9 @@ function createApp(App, rootElement = document.body) {
|
|
|
28
28
|
let app;
|
|
29
29
|
const options = rootElement instanceof HTMLElement ? { root: rootElement, features: void 0 } : { root: document.body, ...rootElement };
|
|
30
30
|
if ((0, import_utils.isDefined)(options.features)) {
|
|
31
|
-
Object.entries(options.features)
|
|
31
|
+
for (const [feature, value] of Object.entries(options.features)) {
|
|
32
32
|
import_features.features.set(feature, value);
|
|
33
|
-
}
|
|
33
|
+
}
|
|
34
34
|
}
|
|
35
35
|
function init() {
|
|
36
36
|
app = new App(options.root).$mount();
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../packages/js-toolkit/helpers/createApp.ts"],
|
|
4
|
-
"sourcesContent": ["import type { Base, BaseConstructor, BaseProps } from '../Base/index.js';\nimport type { Features } from '../Base/features.js';\nimport { features } from '../Base/features.js';\nimport { isDefined } from '../utils/index.js';\n\nexport type CreateAppOptions = {\n root: HTMLElement;\n features: Features;\n};\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<S extends BaseConstructor<Base>, T extends BaseProps = BaseProps>(\n App: S,\n rootElement: HTMLElement | Partial<CreateAppOptions> = document.body,\n): () => Promise<S & Base<T>> {\n let app: S & Base<T>;\n const options =\n rootElement instanceof HTMLElement\n ? { root: rootElement, features: undefined }\n : { root: document.body, ...rootElement };\n\n if (isDefined(options.features)) {\n Object.entries(options.features as Features)
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,sBAAyB;AACzB,mBAA0B;AAWX,SAAR,UACL,KACA,cAAuD,SAAS,MACpC;AAC5B,MAAI;AACJ,QAAM,UACJ,uBAAuB,cACnB,EAAE,MAAM,aAAa,UAAU,OAAU,IACzC,EAAE,MAAM,SAAS,MAAM,GAAG,YAAY;AAE5C,UAAI,wBAAU,QAAQ,QAAQ,GAAG;AAC/B,
|
|
4
|
+
"sourcesContent": ["import type { Base, BaseConstructor, BaseProps } from '../Base/index.js';\nimport type { Features } from '../Base/features.js';\nimport { features } from '../Base/features.js';\nimport { isDefined } from '../utils/index.js';\n\nexport type CreateAppOptions = {\n root: HTMLElement;\n features: Features;\n};\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<S extends BaseConstructor<Base>, T extends BaseProps = BaseProps>(\n App: S,\n rootElement: HTMLElement | Partial<CreateAppOptions> = document.body,\n): () => Promise<S & Base<T>> {\n let app: S & Base<T>;\n const options =\n rootElement instanceof HTMLElement\n ? { root: rootElement, features: undefined }\n : { root: document.body, ...rootElement };\n\n if (isDefined(options.features)) {\n for (const [feature, value] of Object.entries(options.features as Features)) {\n features.set(feature as keyof Features, value);\n }\n }\n\n function init() {\n app = (new App(options.root) as S & Base<T>).$mount();\n return app;\n }\n\n let p: Promise<S & Base<T>>;\n\n if (features.get('asyncChildren')) {\n p = Promise.resolve(init());\n } else {\n p = new Promise<S & Base<T>>((resolve) => {\n if (document.readyState === 'complete') {\n resolve(init());\n } else {\n document.addEventListener('readystatechange', () => {\n if (document.readyState === 'complete') {\n resolve(init());\n }\n });\n }\n });\n }\n\n return () => p;\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,sBAAyB;AACzB,mBAA0B;AAWX,SAAR,UACL,KACA,cAAuD,SAAS,MACpC;AAC5B,MAAI;AACJ,QAAM,UACJ,uBAAuB,cACnB,EAAE,MAAM,aAAa,UAAU,OAAU,IACzC,EAAE,MAAM,SAAS,MAAM,GAAG,YAAY;AAE5C,UAAI,wBAAU,QAAQ,QAAQ,GAAG;AAC/B,eAAW,CAAC,SAAS,KAAK,KAAK,OAAO,QAAQ,QAAQ,QAAoB,GAAG;AAC3E,+BAAS,IAAI,SAA2B,KAAK;AAAA,IAC/C;AAAA,EACF;AAEA,WAAS,OAAO;AACd,UAAO,IAAI,IAAI,QAAQ,IAAI,EAAkB,OAAO;AACpD,WAAO;AAAA,EACT;AAEA,MAAI;AAEJ,MAAI,yBAAS,IAAI,eAAe,GAAG;AACjC,QAAI,QAAQ,QAAQ,KAAK,CAAC;AAAA,EAC5B,OAAO;AACL,QAAI,IAAI,QAAqB,CAAC,YAAY;AACxC,UAAI,SAAS,eAAe,YAAY;AACtC,gBAAQ,KAAK,CAAC;AAAA,MAChB,OAAO;AACL,iBAAS,iBAAiB,oBAAoB,MAAM;AAClD,cAAI,SAAS,eAAe,YAAY;AACtC,oBAAQ,KAAK,CAAC;AAAA,UAChB;AAAA,QACF,CAAC;AAAA,MACH;AAAA,IACF,CAAC;AAAA,EACH;AAEA,SAAO,MAAM;AACf;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/helpers/createApp.js
CHANGED
|
@@ -4,9 +4,9 @@ function createApp(App, rootElement = document.body) {
|
|
|
4
4
|
let app;
|
|
5
5
|
const options = rootElement instanceof HTMLElement ? { root: rootElement, features: void 0 } : { root: document.body, ...rootElement };
|
|
6
6
|
if (isDefined(options.features)) {
|
|
7
|
-
Object.entries(options.features)
|
|
7
|
+
for (const [feature, value] of Object.entries(options.features)) {
|
|
8
8
|
features.set(feature, value);
|
|
9
|
-
}
|
|
9
|
+
}
|
|
10
10
|
}
|
|
11
11
|
function init() {
|
|
12
12
|
app = new App(options.root).$mount();
|
package/helpers/createApp.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../packages/js-toolkit/helpers/createApp.ts"],
|
|
4
|
-
"sourcesContent": ["import type { Base, BaseConstructor, BaseProps } from '../Base/index.js';\nimport type { Features } from '../Base/features.js';\nimport { features } from '../Base/features.js';\nimport { isDefined } from '../utils/index.js';\n\nexport type CreateAppOptions = {\n root: HTMLElement;\n features: Features;\n};\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<S extends BaseConstructor<Base>, T extends BaseProps = BaseProps>(\n App: S,\n rootElement: HTMLElement | Partial<CreateAppOptions> = document.body,\n): () => Promise<S & Base<T>> {\n let app: S & Base<T>;\n const options =\n rootElement instanceof HTMLElement\n ? { root: rootElement, features: undefined }\n : { root: document.body, ...rootElement };\n\n if (isDefined(options.features)) {\n Object.entries(options.features as Features)
|
|
5
|
-
"mappings": "AAEA,SAAS,gBAAgB;AACzB,SAAS,iBAAiB;AAWX,SAAR,UACL,KACA,cAAuD,SAAS,MACpC;AAC5B,MAAI;AACJ,QAAM,UACJ,uBAAuB,cACnB,EAAE,MAAM,aAAa,UAAU,OAAU,IACzC,EAAE,MAAM,SAAS,MAAM,GAAG,YAAY;AAE5C,MAAI,UAAU,QAAQ,QAAQ,GAAG;AAC/B,
|
|
4
|
+
"sourcesContent": ["import type { Base, BaseConstructor, BaseProps } from '../Base/index.js';\nimport type { Features } from '../Base/features.js';\nimport { features } from '../Base/features.js';\nimport { isDefined } from '../utils/index.js';\n\nexport type CreateAppOptions = {\n root: HTMLElement;\n features: Features;\n};\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<S extends BaseConstructor<Base>, T extends BaseProps = BaseProps>(\n App: S,\n rootElement: HTMLElement | Partial<CreateAppOptions> = document.body,\n): () => Promise<S & Base<T>> {\n let app: S & Base<T>;\n const options =\n rootElement instanceof HTMLElement\n ? { root: rootElement, features: undefined }\n : { root: document.body, ...rootElement };\n\n if (isDefined(options.features)) {\n for (const [feature, value] of Object.entries(options.features as Features)) {\n features.set(feature as keyof Features, value);\n }\n }\n\n function init() {\n app = (new App(options.root) as S & Base<T>).$mount();\n return app;\n }\n\n let p: Promise<S & Base<T>>;\n\n if (features.get('asyncChildren')) {\n p = Promise.resolve(init());\n } else {\n p = new Promise<S & Base<T>>((resolve) => {\n if (document.readyState === 'complete') {\n resolve(init());\n } else {\n document.addEventListener('readystatechange', () => {\n if (document.readyState === 'complete') {\n resolve(init());\n }\n });\n }\n });\n }\n\n return () => p;\n}\n"],
|
|
5
|
+
"mappings": "AAEA,SAAS,gBAAgB;AACzB,SAAS,iBAAiB;AAWX,SAAR,UACL,KACA,cAAuD,SAAS,MACpC;AAC5B,MAAI;AACJ,QAAM,UACJ,uBAAuB,cACnB,EAAE,MAAM,aAAa,UAAU,OAAU,IACzC,EAAE,MAAM,SAAS,MAAM,GAAG,YAAY;AAE5C,MAAI,UAAU,QAAQ,QAAQ,GAAG;AAC/B,eAAW,CAAC,SAAS,KAAK,KAAK,OAAO,QAAQ,QAAQ,QAAoB,GAAG;AAC3E,eAAS,IAAI,SAA2B,KAAK;AAAA,IAC/C;AAAA,EACF;AAEA,WAAS,OAAO;AACd,UAAO,IAAI,IAAI,QAAQ,IAAI,EAAkB,OAAO;AACpD,WAAO;AAAA,EACT;AAEA,MAAI;AAEJ,MAAI,SAAS,IAAI,eAAe,GAAG;AACjC,QAAI,QAAQ,QAAQ,KAAK,CAAC;AAAA,EAC5B,OAAO;AACL,QAAI,IAAI,QAAqB,CAAC,YAAY;AACxC,UAAI,SAAS,eAAe,YAAY;AACtC,gBAAQ,KAAK,CAAC;AAAA,MAChB,OAAO;AACL,iBAAS,iBAAiB,oBAAoB,MAAM;AAClD,cAAI,SAAS,eAAe,YAAY;AACtC,oBAAQ,KAAK,CAAC;AAAA,UAChB;AAAA,QACF,CAAC;AAAA,MACH;AAAA,IACF,CAAC;AAAA,EACH;AAEA,SAAO,MAAM;AACf;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -17,6 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
return to;
|
|
18
18
|
};
|
|
19
19
|
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
21
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
22
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
23
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
20
24
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
21
25
|
mod
|
|
22
26
|
));
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../packages/js-toolkit/helpers/getClosestParent.ts"],
|
|
4
4
|
"sourcesContent": ["import type { Base, BaseConstructor } from '../Base/index.js';\nimport getInstanceFromElement from './getInstanceFromElement.js';\nimport { getAncestorWhere } from '../utils/index.js';\n\n/**\n * Get the closest parent of a component.\n */\nexport default function getClosestParent<T extends BaseConstructor>(\n childInstance: Base,\n ParentConstructor: T,\n) {\n const parentEl = getAncestorWhere(\n childInstance.$el,\n (element) => element && getInstanceFromElement(element, ParentConstructor) !== null,\n );\n\n return parentEl ? getInstanceFromElement(parentEl, ParentConstructor) : null;\n}\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,oCAAmC;AACnC,mBAAiC;AAKlB,SAAR,iBACL,eACA,mBACA;AACA,QAAM,eAAW;AAAA,IACf,cAAc;AAAA,IACd,CAAC,YAAY,eAAW,8BAAAA,SAAuB,SAAS,iBAAiB,MAAM;AAAA,EACjF;AAEA,SAAO,eAAW,8BAAAA,SAAuB,UAAU,iBAAiB,IAAI;AAC1E;",
|
|
6
6
|
"names": ["getInstanceFromElement"]
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../packages/js-toolkit/helpers/getDirectChildren.ts"],
|
|
4
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;
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAwB;AAWjB,SAAS,kBACd,gBACA,YACA,cACK;AACL,QAAM,WAAW,eAAe,UAAU,YAAY;AACtD,QAAM,gBAAgB,eAAe,UAAU,UAAU;AAEzD,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,YAAY;AAE1D,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
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../packages/js-toolkit/helpers/getDirectChildren.ts"],
|
|
4
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;
|
|
5
|
+
"mappings": "AACA,SAAS,eAAe;AAWjB,SAAS,kBACd,gBACA,YACA,cACK;AACL,QAAM,WAAW,eAAe,UAAU,YAAY;AACtD,QAAM,gBAAgB,eAAe,UAAU,UAAU;AAEzD,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,YAAY;AAE1D,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
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -37,11 +37,11 @@ function importOnInteraction(fn, nameOrSelectorOrElement, events, parent) {
|
|
|
37
37
|
const handler = () => {
|
|
38
38
|
resolver(resolve);
|
|
39
39
|
};
|
|
40
|
-
|
|
41
|
-
|
|
40
|
+
for (const element of elements) {
|
|
41
|
+
for (const event of normalizedEvents) {
|
|
42
42
|
element.addEventListener(event, handler, eventListenerOptions);
|
|
43
|
-
}
|
|
44
|
-
}
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
45
|
});
|
|
46
46
|
}
|
|
47
47
|
if (module.exports.default) module.exports = module.exports.default;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../packages/js-toolkit/helpers/importOnInteraction.ts"],
|
|
4
|
-
"sourcesContent": ["import type { Base, BaseConstructor } from '../Base/index.js';\nimport { getTargetElements } from './utils.js';\nimport { isString, getComponentResolver } from '../utils/index.js';\n\n/**\n * Import a component on an interaction.\n *\n * @template {BaseConstructor} [T=BaseConstructor]\n * @param {() => Promise<T|{default:T}>} fn\n * The import function.\n * @param {string|HTMLElement|HTMLElement[]} nameOrSelectorOrElement\n * The name or selector for the component.\n * @param {string|string[]} events\n * The events to listen to to trigger the import.\n * @param {Base} [parent]\n * The parent component.\n * @returns {Promise<InstanceType<T>>}\n */\nexport default function importOnInteraction<T extends BaseConstructor = BaseConstructor>(\n fn: () => Promise<T | { default: T }>,\n nameOrSelectorOrElement: string | HTMLElement | HTMLElement[],\n events: string | string[],\n parent?: Base,\n): Promise<T> {\n const normalizedEvents = isString(events) ? [events] : events;\n\n const resolver = getComponentResolver(fn);\n\n return new Promise((resolve) => {\n const elements = getTargetElements(nameOrSelectorOrElement, parent?.$el);\n const eventListenerOptions = {\n capture: true,\n passive: true,\n once: true,\n };\n const handler = () => {\n resolver(resolve);\n };\n\n
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAkC;AAClC,IAAAA,gBAA+C;AAgBhC,SAAR,oBACL,IACA,yBACA,QACA,QACY;AACZ,QAAM,uBAAmB,wBAAS,MAAM,IAAI,CAAC,MAAM,IAAI;AAEvD,QAAM,eAAW,oCAAqB,EAAE;AAExC,SAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,UAAM,eAAW,gCAAkB,yBAAyB,QAAQ,GAAG;AACvE,UAAM,uBAAuB;AAAA,MAC3B,SAAS;AAAA,MACT,SAAS;AAAA,MACT,MAAM;AAAA,IACR;AACA,UAAM,UAAU,MAAM;AACpB,eAAS,OAAO;AAAA,IAClB;AAEA,
|
|
4
|
+
"sourcesContent": ["import type { Base, BaseConstructor } from '../Base/index.js';\nimport { getTargetElements } from './utils.js';\nimport { isString, getComponentResolver } from '../utils/index.js';\n\n/**\n * Import a component on an interaction.\n *\n * @template {BaseConstructor} [T=BaseConstructor]\n * @param {() => Promise<T|{default:T}>} fn\n * The import function.\n * @param {string|HTMLElement|HTMLElement[]} nameOrSelectorOrElement\n * The name or selector for the component.\n * @param {string|string[]} events\n * The events to listen to to trigger the import.\n * @param {Base} [parent]\n * The parent component.\n * @returns {Promise<InstanceType<T>>}\n */\nexport default function importOnInteraction<T extends BaseConstructor = BaseConstructor>(\n fn: () => Promise<T | { default: T }>,\n nameOrSelectorOrElement: string | HTMLElement | HTMLElement[],\n events: string | string[],\n parent?: Base,\n): Promise<T> {\n const normalizedEvents = isString(events) ? [events] : events;\n\n const resolver = getComponentResolver(fn);\n\n return new Promise((resolve) => {\n const elements = getTargetElements(nameOrSelectorOrElement, parent?.$el);\n const eventListenerOptions = {\n capture: true,\n passive: true,\n once: true,\n };\n const handler = () => {\n resolver(resolve);\n };\n\n for (const element of elements) {\n for (const event of normalizedEvents) {\n element.addEventListener(event, handler, eventListenerOptions);\n }\n }\n });\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAkC;AAClC,IAAAA,gBAA+C;AAgBhC,SAAR,oBACL,IACA,yBACA,QACA,QACY;AACZ,QAAM,uBAAmB,wBAAS,MAAM,IAAI,CAAC,MAAM,IAAI;AAEvD,QAAM,eAAW,oCAAqB,EAAE;AAExC,SAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,UAAM,eAAW,gCAAkB,yBAAyB,QAAQ,GAAG;AACvE,UAAM,uBAAuB;AAAA,MAC3B,SAAS;AAAA,MACT,SAAS;AAAA,MACT,MAAM;AAAA,IACR;AACA,UAAM,UAAU,MAAM;AACpB,eAAS,OAAO;AAAA,IAClB;AAEA,eAAW,WAAW,UAAU;AAC9B,iBAAW,SAAS,kBAAkB;AACpC,gBAAQ,iBAAiB,OAAO,SAAS,oBAAoB;AAAA,MAC/D;AAAA,IACF;AAAA,EACF,CAAC;AACH;",
|
|
6
6
|
"names": ["import_utils"]
|
|
7
7
|
}
|
|
@@ -13,11 +13,11 @@ function importOnInteraction(fn, nameOrSelectorOrElement, events, parent) {
|
|
|
13
13
|
const handler = () => {
|
|
14
14
|
resolver(resolve);
|
|
15
15
|
};
|
|
16
|
-
|
|
17
|
-
|
|
16
|
+
for (const element of elements) {
|
|
17
|
+
for (const event of normalizedEvents) {
|
|
18
18
|
element.addEventListener(event, handler, eventListenerOptions);
|
|
19
|
-
}
|
|
20
|
-
}
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
21
|
});
|
|
22
22
|
}
|
|
23
23
|
export {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../packages/js-toolkit/helpers/importOnInteraction.ts"],
|
|
4
|
-
"sourcesContent": ["import type { Base, BaseConstructor } from '../Base/index.js';\nimport { getTargetElements } from './utils.js';\nimport { isString, getComponentResolver } from '../utils/index.js';\n\n/**\n * Import a component on an interaction.\n *\n * @template {BaseConstructor} [T=BaseConstructor]\n * @param {() => Promise<T|{default:T}>} fn\n * The import function.\n * @param {string|HTMLElement|HTMLElement[]} nameOrSelectorOrElement\n * The name or selector for the component.\n * @param {string|string[]} events\n * The events to listen to to trigger the import.\n * @param {Base} [parent]\n * The parent component.\n * @returns {Promise<InstanceType<T>>}\n */\nexport default function importOnInteraction<T extends BaseConstructor = BaseConstructor>(\n fn: () => Promise<T | { default: T }>,\n nameOrSelectorOrElement: string | HTMLElement | HTMLElement[],\n events: string | string[],\n parent?: Base,\n): Promise<T> {\n const normalizedEvents = isString(events) ? [events] : events;\n\n const resolver = getComponentResolver(fn);\n\n return new Promise((resolve) => {\n const elements = getTargetElements(nameOrSelectorOrElement, parent?.$el);\n const eventListenerOptions = {\n capture: true,\n passive: true,\n once: true,\n };\n const handler = () => {\n resolver(resolve);\n };\n\n
|
|
5
|
-
"mappings": "AACA,SAAS,yBAAyB;AAClC,SAAS,UAAU,4BAA4B;AAgBhC,SAAR,oBACL,IACA,yBACA,QACA,QACY;AACZ,QAAM,mBAAmB,SAAS,MAAM,IAAI,CAAC,MAAM,IAAI;AAEvD,QAAM,WAAW,qBAAqB,EAAE;AAExC,SAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,UAAM,WAAW,kBAAkB,yBAAyB,QAAQ,GAAG;AACvE,UAAM,uBAAuB;AAAA,MAC3B,SAAS;AAAA,MACT,SAAS;AAAA,MACT,MAAM;AAAA,IACR;AACA,UAAM,UAAU,MAAM;AACpB,eAAS,OAAO;AAAA,IAClB;AAEA,
|
|
4
|
+
"sourcesContent": ["import type { Base, BaseConstructor } from '../Base/index.js';\nimport { getTargetElements } from './utils.js';\nimport { isString, getComponentResolver } from '../utils/index.js';\n\n/**\n * Import a component on an interaction.\n *\n * @template {BaseConstructor} [T=BaseConstructor]\n * @param {() => Promise<T|{default:T}>} fn\n * The import function.\n * @param {string|HTMLElement|HTMLElement[]} nameOrSelectorOrElement\n * The name or selector for the component.\n * @param {string|string[]} events\n * The events to listen to to trigger the import.\n * @param {Base} [parent]\n * The parent component.\n * @returns {Promise<InstanceType<T>>}\n */\nexport default function importOnInteraction<T extends BaseConstructor = BaseConstructor>(\n fn: () => Promise<T | { default: T }>,\n nameOrSelectorOrElement: string | HTMLElement | HTMLElement[],\n events: string | string[],\n parent?: Base,\n): Promise<T> {\n const normalizedEvents = isString(events) ? [events] : events;\n\n const resolver = getComponentResolver(fn);\n\n return new Promise((resolve) => {\n const elements = getTargetElements(nameOrSelectorOrElement, parent?.$el);\n const eventListenerOptions = {\n capture: true,\n passive: true,\n once: true,\n };\n const handler = () => {\n resolver(resolve);\n };\n\n for (const element of elements) {\n for (const event of normalizedEvents) {\n element.addEventListener(event, handler, eventListenerOptions);\n }\n }\n });\n}\n"],
|
|
5
|
+
"mappings": "AACA,SAAS,yBAAyB;AAClC,SAAS,UAAU,4BAA4B;AAgBhC,SAAR,oBACL,IACA,yBACA,QACA,QACY;AACZ,QAAM,mBAAmB,SAAS,MAAM,IAAI,CAAC,MAAM,IAAI;AAEvD,QAAM,WAAW,qBAAqB,EAAE;AAExC,SAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,UAAM,WAAW,kBAAkB,yBAAyB,QAAQ,GAAG;AACvE,UAAM,uBAAuB;AAAA,MAC3B,SAAS;AAAA,MACT,SAAS;AAAA,MACT,MAAM;AAAA,IACR;AACA,UAAM,UAAU,MAAM;AACpB,eAAS,OAAO;AAAA,IAClB;AAEA,eAAW,WAAW,UAAU;AAC9B,iBAAW,SAAS,kBAAkB;AACpC,gBAAQ,iBAAiB,OAAO,SAAS,oBAAoB;AAAA,MAC/D;AAAA,IACF;AAAA,EACF,CAAC;AACH;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -17,6 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
return to;
|
|
18
18
|
};
|
|
19
19
|
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
21
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
22
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
23
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
20
24
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
21
25
|
mod
|
|
22
26
|
));
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../packages/js-toolkit/helpers/importWhenPrefersMotion.ts"],
|
|
4
4
|
"sourcesContent": ["import type { BaseConstructor } from '../Base/index.js';\nimport importOnMediaQuery from './importOnMediaQuery.js';\n\n/**\n * Import a component if user does not reduce motion.\n *\n * @template {BaseConstructor} T\n * @param {() => Promise<T|{default:T}>} fn\n * @returns {Promise<T>}\n */\nexport default function importWhenPrefersMotion<T extends BaseConstructor = BaseConstructor>(\n fn: () => Promise<T | { default: T }>,\n): Promise<T> {\n return importOnMediaQuery(fn, 'not (prefers-reduced-motion)');\n}\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,gCAA+B;AAShB,SAAR,wBACL,IACY;AACZ,aAAO,0BAAAA,SAAmB,IAAI,8BAA8B;AAC9D;",
|
|
6
6
|
"names": ["importOnMediaQuery"]
|
|
7
7
|
}
|
|
@@ -36,7 +36,8 @@ function importWhenVisible(fn, nameOrSelectorOrElement, parent, observerOptions
|
|
|
36
36
|
}
|
|
37
37
|
}, observerOptions);
|
|
38
38
|
const elements = (0, import_utils.getTargetElements)(nameOrSelectorOrElement, parent?.$el);
|
|
39
|
-
|
|
39
|
+
for (const element of elements)
|
|
40
|
+
observer.observe(element);
|
|
40
41
|
});
|
|
41
42
|
}
|
|
42
43
|
if (module.exports.default) module.exports = module.exports.default;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../packages/js-toolkit/helpers/importWhenVisible.ts"],
|
|
4
|
-
"sourcesContent": ["import type { Base, BaseConstructor } from '../Base/index.js';\nimport { getTargetElements } from './utils.js';\nimport { getComponentResolver } from '../utils/index.js';\n\n/**\n * Import a component when it is visible.\n *\n * @template {BaseConstructor} T\n * @param {() => Promise<T|{default:T}>} fn\n * The import function.\n * @param {string|HTMLElement|HTMLElement[]} nameOrSelectorOrElement\n * The name or selector for the component.\n * @param {Base} [parent]\n * The parent component.\n * @param {IntersectionObserverInit} [observerOptions]\n * Options for the `IntersectionObserver` instance.\n * @returns {Promise<T>}\n */\nexport default function importWhenVisible<T extends BaseConstructor = BaseConstructor>(\n fn: () => Promise<T | { default: T }>,\n nameOrSelectorOrElement: string | HTMLElement | HTMLElement[],\n parent?: Base,\n observerOptions: IntersectionObserverInit = {},\n): Promise<T> {\n const resolver = getComponentResolver(fn);\n\n return new Promise((resolve) => {\n const observer = new IntersectionObserver((entries) => {\n const someEntriesAreVisible = entries.some((entry) => entry.isIntersecting);\n if (someEntriesAreVisible) {\n setTimeout(() => {\n resolver(resolve, () => observer.disconnect());\n }, 0);\n }\n }, observerOptions);\n\n const elements = getTargetElements(nameOrSelectorOrElement, parent?.$el);\n
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAkC;AAClC,IAAAA,gBAAqC;AAgBtB,SAAR,kBACL,IACA,yBACA,QACA,kBAA4C,CAAC,GACjC;AACZ,QAAM,eAAW,oCAAqB,EAAE;AAExC,SAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,UAAM,WAAW,IAAI,qBAAqB,CAAC,YAAY;AACrD,YAAM,wBAAwB,QAAQ,KAAK,CAAC,UAAU,MAAM,cAAc;AAC1E,UAAI,uBAAuB;AACzB,mBAAW,MAAM;AACf,mBAAS,SAAS,MAAM,SAAS,WAAW,CAAC;AAAA,QAC/C,GAAG,CAAC;AAAA,MACN;AAAA,IACF,GAAG,eAAe;AAElB,UAAM,eAAW,gCAAkB,yBAAyB,QAAQ,GAAG;AACvE,
|
|
4
|
+
"sourcesContent": ["import type { Base, BaseConstructor } from '../Base/index.js';\nimport { getTargetElements } from './utils.js';\nimport { getComponentResolver } from '../utils/index.js';\n\n/**\n * Import a component when it is visible.\n *\n * @template {BaseConstructor} T\n * @param {() => Promise<T|{default:T}>} fn\n * The import function.\n * @param {string|HTMLElement|HTMLElement[]} nameOrSelectorOrElement\n * The name or selector for the component.\n * @param {Base} [parent]\n * The parent component.\n * @param {IntersectionObserverInit} [observerOptions]\n * Options for the `IntersectionObserver` instance.\n * @returns {Promise<T>}\n */\nexport default function importWhenVisible<T extends BaseConstructor = BaseConstructor>(\n fn: () => Promise<T | { default: T }>,\n nameOrSelectorOrElement: string | HTMLElement | HTMLElement[],\n parent?: Base,\n observerOptions: IntersectionObserverInit = {},\n): Promise<T> {\n const resolver = getComponentResolver(fn);\n\n return new Promise((resolve) => {\n const observer = new IntersectionObserver((entries) => {\n const someEntriesAreVisible = entries.some((entry) => entry.isIntersecting);\n if (someEntriesAreVisible) {\n setTimeout(() => {\n resolver(resolve, () => observer.disconnect());\n }, 0);\n }\n }, observerOptions);\n\n const elements = getTargetElements(nameOrSelectorOrElement, parent?.$el);\n for (const element of elements) observer.observe(element);\n });\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAkC;AAClC,IAAAA,gBAAqC;AAgBtB,SAAR,kBACL,IACA,yBACA,QACA,kBAA4C,CAAC,GACjC;AACZ,QAAM,eAAW,oCAAqB,EAAE;AAExC,SAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,UAAM,WAAW,IAAI,qBAAqB,CAAC,YAAY;AACrD,YAAM,wBAAwB,QAAQ,KAAK,CAAC,UAAU,MAAM,cAAc;AAC1E,UAAI,uBAAuB;AACzB,mBAAW,MAAM;AACf,mBAAS,SAAS,MAAM,SAAS,WAAW,CAAC;AAAA,QAC/C,GAAG,CAAC;AAAA,MACN;AAAA,IACF,GAAG,eAAe;AAElB,UAAM,eAAW,gCAAkB,yBAAyB,QAAQ,GAAG;AACvE,eAAW,WAAW;AAAU,eAAS,QAAQ,OAAO;AAAA,EAC1D,CAAC;AACH;",
|
|
6
6
|
"names": ["import_utils"]
|
|
7
7
|
}
|
|
@@ -12,7 +12,8 @@ function importWhenVisible(fn, nameOrSelectorOrElement, parent, observerOptions
|
|
|
12
12
|
}
|
|
13
13
|
}, observerOptions);
|
|
14
14
|
const elements = getTargetElements(nameOrSelectorOrElement, parent?.$el);
|
|
15
|
-
|
|
15
|
+
for (const element of elements)
|
|
16
|
+
observer.observe(element);
|
|
16
17
|
});
|
|
17
18
|
}
|
|
18
19
|
export {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../packages/js-toolkit/helpers/importWhenVisible.ts"],
|
|
4
|
-
"sourcesContent": ["import type { Base, BaseConstructor } from '../Base/index.js';\nimport { getTargetElements } from './utils.js';\nimport { getComponentResolver } from '../utils/index.js';\n\n/**\n * Import a component when it is visible.\n *\n * @template {BaseConstructor} T\n * @param {() => Promise<T|{default:T}>} fn\n * The import function.\n * @param {string|HTMLElement|HTMLElement[]} nameOrSelectorOrElement\n * The name or selector for the component.\n * @param {Base} [parent]\n * The parent component.\n * @param {IntersectionObserverInit} [observerOptions]\n * Options for the `IntersectionObserver` instance.\n * @returns {Promise<T>}\n */\nexport default function importWhenVisible<T extends BaseConstructor = BaseConstructor>(\n fn: () => Promise<T | { default: T }>,\n nameOrSelectorOrElement: string | HTMLElement | HTMLElement[],\n parent?: Base,\n observerOptions: IntersectionObserverInit = {},\n): Promise<T> {\n const resolver = getComponentResolver(fn);\n\n return new Promise((resolve) => {\n const observer = new IntersectionObserver((entries) => {\n const someEntriesAreVisible = entries.some((entry) => entry.isIntersecting);\n if (someEntriesAreVisible) {\n setTimeout(() => {\n resolver(resolve, () => observer.disconnect());\n }, 0);\n }\n }, observerOptions);\n\n const elements = getTargetElements(nameOrSelectorOrElement, parent?.$el);\n
|
|
5
|
-
"mappings": "AACA,SAAS,yBAAyB;AAClC,SAAS,4BAA4B;AAgBtB,SAAR,kBACL,IACA,yBACA,QACA,kBAA4C,CAAC,GACjC;AACZ,QAAM,WAAW,qBAAqB,EAAE;AAExC,SAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,UAAM,WAAW,IAAI,qBAAqB,CAAC,YAAY;AACrD,YAAM,wBAAwB,QAAQ,KAAK,CAAC,UAAU,MAAM,cAAc;AAC1E,UAAI,uBAAuB;AACzB,mBAAW,MAAM;AACf,mBAAS,SAAS,MAAM,SAAS,WAAW,CAAC;AAAA,QAC/C,GAAG,CAAC;AAAA,MACN;AAAA,IACF,GAAG,eAAe;AAElB,UAAM,WAAW,kBAAkB,yBAAyB,QAAQ,GAAG;AACvE,
|
|
4
|
+
"sourcesContent": ["import type { Base, BaseConstructor } from '../Base/index.js';\nimport { getTargetElements } from './utils.js';\nimport { getComponentResolver } from '../utils/index.js';\n\n/**\n * Import a component when it is visible.\n *\n * @template {BaseConstructor} T\n * @param {() => Promise<T|{default:T}>} fn\n * The import function.\n * @param {string|HTMLElement|HTMLElement[]} nameOrSelectorOrElement\n * The name or selector for the component.\n * @param {Base} [parent]\n * The parent component.\n * @param {IntersectionObserverInit} [observerOptions]\n * Options for the `IntersectionObserver` instance.\n * @returns {Promise<T>}\n */\nexport default function importWhenVisible<T extends BaseConstructor = BaseConstructor>(\n fn: () => Promise<T | { default: T }>,\n nameOrSelectorOrElement: string | HTMLElement | HTMLElement[],\n parent?: Base,\n observerOptions: IntersectionObserverInit = {},\n): Promise<T> {\n const resolver = getComponentResolver(fn);\n\n return new Promise((resolve) => {\n const observer = new IntersectionObserver((entries) => {\n const someEntriesAreVisible = entries.some((entry) => entry.isIntersecting);\n if (someEntriesAreVisible) {\n setTimeout(() => {\n resolver(resolve, () => observer.disconnect());\n }, 0);\n }\n }, observerOptions);\n\n const elements = getTargetElements(nameOrSelectorOrElement, parent?.$el);\n for (const element of elements) observer.observe(element);\n });\n}\n"],
|
|
5
|
+
"mappings": "AACA,SAAS,yBAAyB;AAClC,SAAS,4BAA4B;AAgBtB,SAAR,kBACL,IACA,yBACA,QACA,kBAA4C,CAAC,GACjC;AACZ,QAAM,WAAW,qBAAqB,EAAE;AAExC,SAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,UAAM,WAAW,IAAI,qBAAqB,CAAC,YAAY;AACrD,YAAM,wBAAwB,QAAQ,KAAK,CAAC,UAAU,MAAM,cAAc;AAC1E,UAAI,uBAAuB;AACzB,mBAAW,MAAM;AACf,mBAAS,SAAS,MAAM,SAAS,WAAW,CAAC;AAAA,QAC/C,GAAG,CAAC;AAAA,MACN;AAAA,IACF,GAAG,eAAe;AAElB,UAAM,WAAW,kBAAkB,yBAAyB,QAAQ,GAAG;AACvE,eAAW,WAAW;AAAU,eAAS,QAAQ,OAAO;AAAA,EAC1D,CAAC;AACH;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/helpers/index.cjs
CHANGED
|
@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
};
|
|
19
19
|
var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
|
|
20
20
|
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
21
25
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
26
|
mod
|
|
23
27
|
));
|
package/helpers/index.cjs.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../packages/js-toolkit/helpers/index.ts"],
|
|
4
4
|
"sourcesContent": ["export * from './getDirectChildren.js';\nexport { default as createApp } from './createApp.js';\nexport { default as getClosestParent } from './getClosestParent.js';\nexport { default as getInstanceFromElement } from './getInstanceFromElement.js';\nexport { default as importOnInteraction } from './importOnInteraction.js';\nexport { default as importWhenIdle } from './importWhenIdle.js';\nexport { default as importWhenVisible } from './importWhenVisible.js';\nexport { default as importOnMediaQuery } from './importOnMediaQuery.js';\nexport { default as importWhenPrefersMotion } from './importWhenPrefersMotion.js';\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,4BAAc,oCAAd;AACA,uBAAqC;AACrC,8BAA4C;AAC5C,oCAAkD;AAClD,iCAA+C;AAC/C,4BAA0C;AAC1C,+BAA6C;AAC7C,gCAA8C;AAC9C,qCAAmD;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@studiometa/js-toolkit",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.12.0",
|
|
4
4
|
"description": "A set of useful little bits of JavaScript to boost your project! 🚀",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
@@ -45,9 +45,9 @@
|
|
|
45
45
|
"deepmerge": "^4.3.1"
|
|
46
46
|
},
|
|
47
47
|
"devDependencies": {
|
|
48
|
-
"vue": "^2.6"
|
|
48
|
+
"vue": "^2.6.0"
|
|
49
49
|
},
|
|
50
50
|
"peerDependencies": {
|
|
51
|
-
"vue": "^2.6 || ^3.0"
|
|
51
|
+
"vue": "^2.6.0 || ^3.0"
|
|
52
52
|
}
|
|
53
53
|
}
|
package/services/drag.cjs
CHANGED
|
@@ -17,6 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
return to;
|
|
18
18
|
};
|
|
19
19
|
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
21
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
22
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
23
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
20
24
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
21
25
|
mod
|
|
22
26
|
));
|
|
@@ -189,22 +193,22 @@ function createDragService(target, { dampFactor = 0.85, dragTreshold = 10 } = {}
|
|
|
189
193
|
}
|
|
190
194
|
},
|
|
191
195
|
init() {
|
|
192
|
-
|
|
196
|
+
for (const event of targetEvents) {
|
|
193
197
|
target.addEventListener(event, handleEvent, passiveEventOptions);
|
|
194
|
-
}
|
|
195
|
-
|
|
198
|
+
}
|
|
199
|
+
for (const event of windowEvents) {
|
|
196
200
|
window.addEventListener(event, handleEvent, passiveEventOptions);
|
|
197
|
-
}
|
|
201
|
+
}
|
|
198
202
|
target.addEventListener("dragstart", handleEvent, { capture: true });
|
|
199
203
|
target.addEventListener("click", handleEvent, { capture: true });
|
|
200
204
|
},
|
|
201
205
|
kill() {
|
|
202
|
-
|
|
206
|
+
for (const event of targetEvents) {
|
|
203
207
|
target.removeEventListener(event, handleEvent);
|
|
204
|
-
}
|
|
205
|
-
|
|
208
|
+
}
|
|
209
|
+
for (const event of windowEvents) {
|
|
206
210
|
window.removeEventListener(event, handleEvent);
|
|
207
|
-
}
|
|
211
|
+
}
|
|
208
212
|
target.removeEventListener("dragstart", handleEvent);
|
|
209
213
|
target.removeEventListener("click", handleEvent);
|
|
210
214
|
}
|