@mintjamsinc/ichigojs 0.1.7 → 0.1.8
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/README.md +53 -4
- package/dist/ichigo.esm.js +291 -4
- package/dist/ichigo.esm.js.map +1 -1
- package/dist/ichigo.esm.min.js +1 -1
- package/dist/ichigo.esm.min.js.map +1 -1
- package/dist/ichigo.umd.js +291 -4
- package/dist/ichigo.umd.js.map +1 -1
- package/dist/ichigo.umd.min.js +1 -1
- package/dist/ichigo.umd.min.js.map +1 -1
- package/dist/types/ichigo/directives/StandardDirectiveName.d.ts +2 -1
- package/dist/types/ichigo/directives/VBindDirective.d.ts +9 -0
- package/dist/types/ichigo/directives/VDirectiveManager.d.ts +18 -0
- package/dist/types/ichigo/directives/VIntersectionDirective.d.ts +91 -0
- package/dist/types/ichigo/directives/VOnDirective.d.ts +1 -1
- package/package.json +1 -1
@@ -58,6 +58,15 @@ export declare class VBindDirective implements VDirective {
|
|
58
58
|
* If this directive is binding the "key" attribute, it will be handled by the VForDirective.
|
59
59
|
*/
|
60
60
|
get isKey(): boolean;
|
61
|
+
/**
|
62
|
+
* Indicates if this directive is binding the "options" attribute or any of its sub-properties (e.g., "options.intersection").
|
63
|
+
* The "options" attribute is special and is used for passing options to certain directives like VIntersectionDirective.
|
64
|
+
*/
|
65
|
+
get isOptions(): boolean;
|
66
|
+
/**
|
67
|
+
* Gets the name of the attribute being bound (e.g., "src", "class", "options", "options.intersection").
|
68
|
+
*/
|
69
|
+
get attributeName(): string | undefined;
|
61
70
|
/**
|
62
71
|
* Gets the original expression string from the directive.
|
63
72
|
*/
|
@@ -3,6 +3,11 @@ import { VNode } from "../VNode";
|
|
3
3
|
import { VBindingsPreparer } from "../VBindingsPreparer";
|
4
4
|
import { VDOMUpdater } from "../VDOMUpdater";
|
5
5
|
import { VBindDirective } from "./VBindDirective";
|
6
|
+
/**
|
7
|
+
* Manages directives associated with a virtual node (VNode).
|
8
|
+
* This class is responsible for parsing, storing, and managing the lifecycle of directives.
|
9
|
+
* It also provides access to bindings preparers and DOM updaters from the associated directives.
|
10
|
+
*/
|
6
11
|
export declare class VDirectiveManager {
|
7
12
|
#private;
|
8
13
|
constructor(vNode: VNode);
|
@@ -32,6 +37,19 @@ export declare class VDirectiveManager {
|
|
32
37
|
* If no such directive exists, this returns undefined.
|
33
38
|
*/
|
34
39
|
get keyDirective(): VBindDirective | undefined;
|
40
|
+
/**
|
41
|
+
* Gets a record of VBindDirectives for options specific to certain directives.
|
42
|
+
* The keys are directive names (e.g., 'options', 'options.intersection').
|
43
|
+
*/
|
44
|
+
get optionsDirectives(): Record<string, VBindDirective | undefined>;
|
45
|
+
/**
|
46
|
+
* Gets the VBindDirective for options specific to the given directive name.
|
47
|
+
* Searches in order: `:options.{directive}` -> `:options`
|
48
|
+
*
|
49
|
+
* @param directive The directive name (e.g., 'intersection', 'resize')
|
50
|
+
* @returns The VBindDirective instance or undefined
|
51
|
+
*/
|
52
|
+
optionsDirective(directive: string): VBindDirective | undefined;
|
35
53
|
/**
|
36
54
|
* Cleans up any resources used by the directive handler.
|
37
55
|
*/
|
@@ -0,0 +1,91 @@
|
|
1
|
+
import { VNode } from "../VNode";
|
2
|
+
import { VBindingsPreparer } from "../VBindingsPreparer";
|
3
|
+
import { VDirective } from "./VDirective";
|
4
|
+
import { VDirectiveParseContext } from "./VDirectiveParseContext";
|
5
|
+
import { VDOMUpdater } from "../VDOMUpdater";
|
6
|
+
/**
|
7
|
+
* Directive for observing element intersection with viewport or ancestor elements using IntersectionObserver.
|
8
|
+
* The `v-intersection` directive allows you to respond to changes in an element's visibility.
|
9
|
+
*
|
10
|
+
* Example usage:
|
11
|
+
* <div v-intersection="handleIntersection">Observable content</div>
|
12
|
+
* <div v-intersection="handleIntersection" :options.intersection="{threshold: 0.5}">Observable content</div>
|
13
|
+
*
|
14
|
+
* The handler receives IntersectionObserverEntry array as the first argument and $ctx as the second:
|
15
|
+
* handleIntersection(entries, $ctx) {
|
16
|
+
* const entry = entries[0];
|
17
|
+
* if (entry.isIntersecting) {
|
18
|
+
* console.log('Element is visible!');
|
19
|
+
* }
|
20
|
+
* }
|
21
|
+
*
|
22
|
+
* Options can be provided via :options or :options.intersection attribute:
|
23
|
+
* :options="{root: null, threshold: 0.5, rootMargin: '0px'}"
|
24
|
+
* :options.intersection="{root: null, threshold: 0.5, rootMargin: '0px'}"
|
25
|
+
*
|
26
|
+
* This directive is useful for lazy-loading, infinite scrolling, animation triggers,
|
27
|
+
* and other features that depend on element visibility.
|
28
|
+
*/
|
29
|
+
export declare class VIntersectionDirective implements VDirective {
|
30
|
+
#private;
|
31
|
+
/**
|
32
|
+
* @param context The context for parsing the directive.
|
33
|
+
*/
|
34
|
+
constructor(context: VDirectiveParseContext);
|
35
|
+
/**
|
36
|
+
* @inheritdoc
|
37
|
+
*/
|
38
|
+
get name(): string;
|
39
|
+
/**
|
40
|
+
* @inheritdoc
|
41
|
+
*/
|
42
|
+
get vNode(): VNode;
|
43
|
+
/**
|
44
|
+
* @inheritdoc
|
45
|
+
*/
|
46
|
+
get needsAnchor(): boolean;
|
47
|
+
/**
|
48
|
+
* @inheritdoc
|
49
|
+
*/
|
50
|
+
get bindingsPreparer(): VBindingsPreparer | undefined;
|
51
|
+
/**
|
52
|
+
* @inheritdoc
|
53
|
+
*/
|
54
|
+
get domUpdater(): VDOMUpdater | undefined;
|
55
|
+
/**
|
56
|
+
* @inheritdoc
|
57
|
+
*/
|
58
|
+
get templatize(): boolean;
|
59
|
+
/**
|
60
|
+
* @inheritdoc
|
61
|
+
*/
|
62
|
+
get dependentIdentifiers(): string[];
|
63
|
+
/**
|
64
|
+
* @inheritdoc
|
65
|
+
*/
|
66
|
+
get onMount(): (() => void) | undefined;
|
67
|
+
/**
|
68
|
+
* @inheritdoc
|
69
|
+
*/
|
70
|
+
get onMounted(): (() => void) | undefined;
|
71
|
+
/**
|
72
|
+
* @inheritdoc
|
73
|
+
*/
|
74
|
+
get onUpdate(): (() => void) | undefined;
|
75
|
+
/**
|
76
|
+
* @inheritdoc
|
77
|
+
*/
|
78
|
+
get onUpdated(): (() => void) | undefined;
|
79
|
+
/**
|
80
|
+
* @inheritdoc
|
81
|
+
*/
|
82
|
+
get onUnmount(): (() => void) | undefined;
|
83
|
+
/**
|
84
|
+
* @inheritdoc
|
85
|
+
*/
|
86
|
+
get onUnmounted(): (() => void) | undefined;
|
87
|
+
/**
|
88
|
+
* @inheritdoc
|
89
|
+
*/
|
90
|
+
destroy(): void;
|
91
|
+
}
|
@@ -19,7 +19,7 @@ import { VDOMUpdater } from "../VDOMUpdater";
|
|
19
19
|
* @mounted="onMounted" - Called after the element is inserted into the DOM
|
20
20
|
* @update="onUpdate" - Called before the element is updated
|
21
21
|
* @updated="onUpdated" - Called after the element is updated
|
22
|
-
* @unmount="onUnmount" - Called before
|
22
|
+
* @unmount="onUnmount" - Called before VNode cleanup begins
|
23
23
|
* @unmounted="onUnmounted" - Called after VNode cleanup is complete (element reference still available)
|
24
24
|
*
|
25
25
|
* This directive is essential for handling user interactions and lifecycle events in your application.
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@mintjamsinc/ichigojs",
|
3
|
-
"version": "0.1.
|
3
|
+
"version": "0.1.8",
|
4
4
|
"description": "ichigo.js - Simple and intuitive reactive framework. Lightweight, fast, and user-friendly virtual DOM library",
|
5
5
|
"main": "./dist/ichigo.umd.js",
|
6
6
|
"module": "./dist/ichigo.esm.js",
|