@mintjamsinc/ichigojs 0.1.9 → 0.1.11

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.
@@ -42,7 +42,13 @@ export declare class VApplication {
42
42
  get functionDependencies(): Record<string, string[]>;
43
43
  /**
44
44
  * Mounts the application.
45
- * @param selectors The CSS selectors to identify the root element.
45
+ * @param target The CSS selector string or HTMLElement to mount the application to.
46
46
  */
47
- mount(selectors: string): void;
47
+ mount(target: string | HTMLElement): void;
48
+ /**
49
+ * Creates a child application instance with the same registries.
50
+ * @param options The application options for the child.
51
+ * @returns The created child application instance.
52
+ */
53
+ createChildApp(options: VApplicationOptions): VApplication;
48
54
  }
@@ -1,2 +1,25 @@
1
+ /**
2
+ * Represents a reusable component definition.
3
+ */
1
4
  export declare class VComponent {
5
+ /**
6
+ * The unique identifier for the component.
7
+ */
8
+ readonly id: string;
9
+ /**
10
+ * The function that creates a new instance of the component.
11
+ */
12
+ readonly createInstance: (props?: any) => any;
13
+ /**
14
+ * The optional template ID for the component.
15
+ * If not specified, defaults to the component ID.
16
+ */
17
+ readonly templateID?: string;
18
+ /**
19
+ * Creates a new component definition.
20
+ * @param id The unique identifier for the component.
21
+ * @param createInstance The function that creates a new instance of the component.
22
+ * @param templateID The optional template ID for the component.
23
+ */
24
+ constructor(id: string, createInstance: (props?: any) => any, templateID?: string);
2
25
  }
@@ -1,2 +1,37 @@
1
+ import { VComponent } from './VComponent';
2
+ /**
3
+ * A registry for managing component definitions.
4
+ */
1
5
  export declare class VComponentRegistry {
6
+ #private;
7
+ /**
8
+ * Registers a new component.
9
+ * @param id The unique identifier for the component.
10
+ * @param createInstance The function that creates a new instance of the component.
11
+ * @param templateID The optional template ID for the component.
12
+ * @returns True if the component was registered, false if a component with the same ID already exists.
13
+ */
14
+ register(id: string, createInstance: (props?: any) => any, templateID?: string): boolean;
15
+ /**
16
+ * Checks if a component with the given ID exists.
17
+ * @param id The component ID to check.
18
+ * @returns True if the component exists, false otherwise.
19
+ */
20
+ has(id: string): boolean;
21
+ /**
22
+ * Gets a component by its ID.
23
+ * @param id The component ID to retrieve.
24
+ * @returns The component definition, or undefined if not found.
25
+ */
26
+ get(id: string): VComponent | undefined;
27
+ /**
28
+ * Removes a component from the registry.
29
+ * @param id The component ID to remove.
30
+ * @returns True if the component was removed, false if it didn't exist.
31
+ */
32
+ unregister(id: string): boolean;
33
+ /**
34
+ * Clears all registered components.
35
+ */
36
+ clear(): void;
2
37
  }
@@ -18,8 +18,12 @@ export declare enum StandardDirectiveName {
18
18
  V_BIND = "v-bind",
19
19
  /** Two-way data binding directives. */
20
20
  V_MODEL = "v-model",
21
- /** Slot content insertion directives. */
21
+ /** Resize observer directives. */
22
22
  V_RESIZE = "v-resize",
23
23
  /** Intersection observer directives. */
24
- V_INTERSECTION = "v-intersection"
24
+ V_INTERSECTION = "v-intersection",
25
+ /** Performance observer directives. */
26
+ V_PERFORMANCE = "v-performance",
27
+ /** Component directive. */
28
+ V_COMPONENT = "v-component"
25
29
  }
@@ -0,0 +1,81 @@
1
+ import { VDirective } from './VDirective';
2
+ import { VNode } from '../VNode';
3
+ import { VDirectiveParseContext } from './VDirectiveParseContext';
4
+ import { VBindingsPreparer } from '../VBindingsPreparer';
5
+ import { VDOMUpdater } from '../VDOMUpdater';
6
+ /**
7
+ * Directive for rendering components.
8
+ * Usage: <div v-component="componentId" :options="props"></div>
9
+ *
10
+ * The :options binding is used to pass properties to the component.
11
+ * Example:
12
+ * <div v-component="my-component" :options="{message: 'Hello'}"></div>
13
+ */
14
+ export declare class VComponentDirective implements VDirective {
15
+ #private;
16
+ constructor(context: VDirectiveParseContext);
17
+ /**
18
+ * @inheritdoc
19
+ */
20
+ get name(): string;
21
+ /**
22
+ * @inheritdoc
23
+ */
24
+ get vNode(): VNode;
25
+ /**
26
+ * @inheritdoc
27
+ */
28
+ get needsAnchor(): boolean;
29
+ /**
30
+ * @inheritdoc
31
+ */
32
+ get bindingsPreparer(): VBindingsPreparer | undefined;
33
+ /**
34
+ * @inheritdoc
35
+ */
36
+ get domUpdater(): VDOMUpdater | undefined;
37
+ /**
38
+ * @inheritdoc
39
+ */
40
+ get templatize(): boolean;
41
+ /**
42
+ * @inheritdoc
43
+ */
44
+ get dependentIdentifiers(): string[];
45
+ /**
46
+ * @inheritdoc
47
+ */
48
+ get onMount(): (() => void) | undefined;
49
+ /**
50
+ * @inheritdoc
51
+ */
52
+ get onMounted(): (() => void) | undefined;
53
+ /**
54
+ * @inheritdoc
55
+ */
56
+ get onUpdate(): (() => void) | undefined;
57
+ /**
58
+ * @inheritdoc
59
+ */
60
+ get onUpdated(): (() => void) | undefined;
61
+ /**
62
+ * @inheritdoc
63
+ */
64
+ get onUnmount(): (() => void) | undefined;
65
+ /**
66
+ * @inheritdoc
67
+ */
68
+ get onUnmounted(): (() => void) | undefined;
69
+ /**
70
+ * @inheritdoc
71
+ */
72
+ destroy(): void;
73
+ /**
74
+ * Renders the component.
75
+ */
76
+ private renderComponent;
77
+ /**
78
+ * Cleans up the component.
79
+ */
80
+ private cleanupComponent;
81
+ }
@@ -4,41 +4,31 @@ import { VDirective } from "./VDirective";
4
4
  import { VDirectiveParseContext } from "./VDirectiveParseContext";
5
5
  import { VDOMUpdater } from "../VDOMUpdater";
6
6
  /**
7
- * Configuration options for the v-performance directive.
8
- */
9
- export interface VPerformanceOptions {
10
- /**
11
- * The type(s) of performance entries to observe.
12
- * Can be a single type or an array of types.
13
- * Common types: 'mark', 'measure', 'navigation', 'resource', 'paint', 'element', 'largest-contentful-paint', 'layout-shift'
14
- */
15
- entryTypes?: string | string[];
16
- /**
17
- * Whether to include buffered entries (entries that occurred before the observer was created).
18
- * Default: false
19
- */
20
- buffered?: boolean;
21
- }
22
- /**
23
- * Directive for observing performance entries using PerformanceObserver.
24
- * The `v-performance` directive allows you to monitor various performance metrics.
7
+ * Directive for observing performance metrics using PerformanceObserver.
8
+ * The `v-performance` directive allows you to monitor various performance entries.
25
9
  *
26
10
  * Example usage:
27
11
  * <div v-performance="handlePerformance">Performance monitoring</div>
28
- * <div v-performance="{ handler: handlePerformance, options: { entryTypes: ['measure', 'mark'], buffered: true } }">
29
- * Advanced monitoring
30
- * </div>
12
+ * <div v-performance="handlePerformance" :options.performance="{entryTypes: ['measure']}">Performance monitoring</div>
31
13
  *
32
- * The handler receives PerformanceObserverEntryList and PerformanceObserver as the first two arguments,
33
- * and $ctx as the third:
34
- * handlePerformance(list, observer, $ctx) {
35
- * list.getEntries().forEach(entry => {
36
- * console.log(`${entry.entryType}: ${entry.name} - ${entry.duration}ms`);
14
+ * By default (without options), it observes 'mark' and 'measure' entry types.
15
+ *
16
+ * The handler receives PerformanceObserverEntryList, PerformanceObserver, options (with droppedEntriesCount), and $ctx as arguments:
17
+ * handlePerformance(entries, observer, options, $ctx) {
18
+ * entries.getEntries().forEach(entry => {
19
+ * console.log(`${entry.name}: ${entry.duration}ms`);
37
20
  * });
21
+ * if (options?.droppedEntriesCount) {
22
+ * console.log(`Dropped entries: ${options.droppedEntriesCount}`);
23
+ * }
38
24
  * }
39
25
  *
40
- * This directive is useful for monitoring application performance, custom metrics,
41
- * and identifying performance bottlenecks.
26
+ * Options can be provided via :options or :options.performance attribute:
27
+ * :options="{entryTypes: ['measure', 'mark']}"
28
+ * :options.performance="{type: 'navigation', buffered: true}"
29
+ *
30
+ * This directive is useful for performance monitoring, profiling, and identifying
31
+ * performance bottlenecks in your application.
42
32
  */
43
33
  export declare class VPerformanceDirective implements VDirective {
44
34
  #private;
@@ -1 +1,3 @@
1
1
  export { VDOM } from './ichigo/VDOM';
2
+ export { VComponent } from './ichigo/components/VComponent';
3
+ export { VComponentRegistry } from './ichigo/components/VComponentRegistry';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mintjamsinc/ichigojs",
3
- "version": "0.1.9",
3
+ "version": "0.1.11",
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",