@twobirds/microcomponents 0.3.0 → 0.4.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.
Files changed (55) hide show
  1. package/README.md +91 -34
  2. package/dist/MC.min.js +1 -1
  3. package/dist/autoload.min.js +1 -1
  4. package/dist/cli/create.d.ts +53 -0
  5. package/dist/cli/create.d.ts.map +1 -0
  6. package/dist/cli/create.js +419 -0
  7. package/dist/cli/dispatch.d.ts +43 -0
  8. package/dist/cli/dispatch.d.ts.map +1 -0
  9. package/dist/cli/dispatch.js +287 -0
  10. package/dist/cli/index.d.ts +12 -0
  11. package/dist/cli/index.d.ts.map +1 -0
  12. package/dist/cli/index.js +12 -0
  13. package/dist/cli/scaffold.d.ts +68 -0
  14. package/dist/cli/scaffold.d.ts.map +1 -0
  15. package/dist/cli/scaffold.js +109 -0
  16. package/dist/cli/writeScaffold.d.ts +66 -0
  17. package/dist/cli/writeScaffold.d.ts.map +1 -0
  18. package/dist/cli/writeScaffold.js +114 -0
  19. package/dist/core/MC.d.ts +50 -9
  20. package/dist/core/MC.d.ts.map +1 -1
  21. package/dist/core/MC.js +78 -33
  22. package/dist/core/elements.d.ts +11 -8
  23. package/dist/core/elements.d.ts.map +1 -1
  24. package/dist/core/elements.js +12 -7
  25. package/dist/core/mcGuards.d.ts +2 -2
  26. package/dist/elements.min.js +1 -1
  27. package/dist/formValues.min.js +1 -1
  28. package/dist/microcomponents.min.js +1 -1
  29. package/dist/observables.min.js +1 -1
  30. package/dist/state/formValues.d.ts +11 -5
  31. package/dist/state/formValues.d.ts.map +1 -1
  32. package/dist/state/formValues.js +18 -11
  33. package/dist/state/observables.d.ts +30 -13
  34. package/dist/state/observables.d.ts.map +1 -1
  35. package/dist/state/observables.js +64 -35
  36. package/dist/state/placeholders.d.ts.map +1 -1
  37. package/dist/state/placeholders.js +16 -11
  38. package/dist/types/mcTypes.d.ts +16 -7
  39. package/dist/types/mcTypes.d.ts.map +1 -1
  40. package/dist/utils/autoload.d.ts +6 -3
  41. package/dist/utils/autoload.d.ts.map +1 -1
  42. package/dist/utils/autoload.js +2 -2
  43. package/dist/utils/events.d.ts +21 -28
  44. package/dist/utils/events.d.ts.map +1 -1
  45. package/dist/utils/events.js +23 -29
  46. package/dist/utils/helpers.d.ts +19 -19
  47. package/dist/utils/helpers.d.ts.map +1 -1
  48. package/dist/utils/helpers.js +19 -19
  49. package/dist/utils/index.d.ts +2 -2
  50. package/dist/utils/index.d.ts.map +1 -1
  51. package/dist/utils/index.js +2 -2
  52. package/dist/utils/resolveComponentPath.d.ts +36 -0
  53. package/dist/utils/resolveComponentPath.d.ts.map +1 -0
  54. package/dist/utils/resolveComponentPath.js +39 -0
  55. package/package.json +19 -13
@@ -36,10 +36,10 @@ export function isBrowser() {
36
36
  *
37
37
  * @example
38
38
  * ```ts
39
- * isNativeObject({}); // true
40
- * isNativeObject(new Object()); // true
41
- * isNativeObject([]); // false
42
- * isNativeObject(null); // false
39
+ * console.log(isNativeObject({}));
40
+ * console.log(isNativeObject(new Object()));
41
+ * console.log(isNativeObject([]));
42
+ * console.log(isNativeObject(null));
43
43
  * ```
44
44
  */
45
45
  export function isNativeObject(value) {
@@ -53,7 +53,7 @@ export function isNativeObject(value) {
53
53
  * @example
54
54
  * ```ts
55
55
  * const obj = { z: 1, a: { y: 2, b: 3 } };
56
- * sortObject(obj); // { a: { b: 3, y: 2 }, z: 1 }
56
+ * console.log(JSON.stringify(sortObject(obj)));
57
57
  * ```
58
58
  */
59
59
  export function sortObject(source) {
@@ -81,7 +81,7 @@ export function sortObject(source) {
81
81
  * @example
82
82
  * ```ts
83
83
  * const obj = { user: { name: 'Alice', age: 30 } };
84
- * flattenObject(obj); // { 'user.age': 30, 'user.name': 'Alice' }
84
+ * console.log(JSON.stringify(flattenObject(obj)));
85
85
  * ```
86
86
  */
87
87
  export function flattenObject(source, doSort = true) {
@@ -117,10 +117,10 @@ export function flattenObject(source, doSort = true) {
117
117
  *
118
118
  * @example
119
119
  * ```ts
120
- * deepEqual({ a: 1 }, { a: 1 }); // true
121
- * deepEqual({ a: { b: 2 } }, { a: {} }); // false
122
- * deepEqual({ a: NaN }, { a: NaN }); // true (SameValueZero)
123
- * deepEqual({ a: NaN }, { a: null }); // false
120
+ * console.log(deepEqual({ a: 1 }, { a: 1 }));
121
+ * console.log(deepEqual({ a: { b: 2 } }, { a: {} }));
122
+ * console.log(deepEqual({ a: NaN }, { a: NaN }));
123
+ * console.log(deepEqual({ a: NaN }, { a: null }));
124
124
  * ```
125
125
  */
126
126
  export function deepEqual(a, b) {
@@ -168,8 +168,8 @@ export function deepEqual(a, b) {
168
168
  * @example
169
169
  * ```ts
170
170
  * const data = { user: { profile: { name: 'Alice' } } };
171
- * nameSpace('user.profile.name', data); // 'Alice'
172
- * nameSpace(['user', 'profile'], data); // { name: 'Alice' }
171
+ * console.log(nameSpace('user.profile.name', data));
172
+ * console.log(nameSpace(['user', 'profile'], data));
173
173
  * ```
174
174
  */
175
175
  export function nameSpace(ns, obj = {}) {
@@ -198,9 +198,8 @@ export function nameSpace(ns, obj = {}) {
198
198
  * @example
199
199
  * ```ts
200
200
  * const data = { user: { name: 'Alice' } };
201
- * parse('Hello {user.name}!', data); // 'Hello Alice!'
202
- *
203
- * parse(['Hi {user.name}', 'Bye {user.name}'], data); // ['Hi Alice', 'Bye Alice']
201
+ * console.log(parse('Hello {user.name}!', data));
202
+ * console.log(parse(['Hi {user.name}', 'Bye {user.name}'], data));
204
203
  * ```
205
204
  */
206
205
  export function parse(template, parseThis, ...rest) {
@@ -241,7 +240,7 @@ export function parse(template, parseThis, ...rest) {
241
240
  *
242
241
  * @example
243
242
  * ```ts
244
- * kebabToPascal('my-element'); // 'MyElement'
243
+ * console.log(kebabToPascal('my-element'));
245
244
  * ```
246
245
  */
247
246
  export function kebabToPascal(str) {
@@ -261,7 +260,8 @@ export function kebabToPascal(str) {
261
260
  * @example
262
261
  * ```ts
263
262
  * const log = debounce(() => console.log('called'), 300);
264
- * log(); // will only execute once after 300ms of inactivity
263
+ * log();
264
+ * log();
265
265
  * ```
266
266
  */
267
267
  export function debounce(func, milliseconds) {
@@ -283,7 +283,7 @@ export function debounce(func, milliseconds) {
283
283
  * @example
284
284
  * ```ts
285
285
  * const elems = htmlToElements('<div>Hello</div><span>World</span>');
286
- * // [HTMLElement<div>, HTMLElement<span>]
286
+ * console.log(elems.map((el) => el.tagName));
287
287
  * ```
288
288
  */
289
289
  export function htmlToElements(html) {
@@ -305,7 +305,7 @@ export function htmlToElements(html) {
305
305
  * const src = { get name() { return 'Alice'; } };
306
306
  * const tgt = {};
307
307
  * copyGettersSetters(src, tgt);
308
- * console.log(tgt.name); // 'Alice'
308
+ * console.log(tgt.name);
309
309
  * ```
310
310
  */
311
311
  export function copyGettersSetters(source, target) {
@@ -5,7 +5,7 @@ Utils module — events, autoload, and helper utilities.
5
5
  @showGroups
6
6
  */
7
7
  /** @group Events */
8
- export { getMcEventName, trueEventName, off, on, one, trigger, BubbleController } from './events.js';
8
+ export { getMcEventName, trueEventName, off, on, one, trigger, BubbleController, } from './events.js';
9
9
  /** @hidden */
10
10
  export type { QuerySelectorString, TargetSelect } from './events.js';
11
11
  /** @group Autoload */
@@ -13,5 +13,5 @@ export { autoload } from './autoload.js';
13
13
  /** @hidden */
14
14
  export type { Autoload } from './autoload.js';
15
15
  /** @group Helpers */
16
- export { isBrowser, isNativeObject, sortObject, flattenObject, deepEqual, nameSpace, parse, kebabToPascal, debounce, htmlToElements, copyGettersSetters, injectCSS, processAssets, loadAssets, bindTemplateEvents } from './helpers.js';
16
+ export { isBrowser, isNativeObject, sortObject, flattenObject, deepEqual, nameSpace, parse, kebabToPascal, debounce, htmlToElements, copyGettersSetters, injectCSS, processAssets, loadAssets, bindTemplateEvents, } from './helpers.js';
17
17
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA;;;;;EAKE;AAEF,oBAAoB;AACpB,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,GAAG,EAAE,EAAE,EAAE,GAAG,EAAE,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AACrG,cAAc;AACd,YAAY,EAAE,mBAAmB,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AACrE,sBAAsB;AACtB,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,cAAc;AACd,YAAY,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,qBAAqB;AACrB,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,UAAU,EAAE,aAAa,EAAE,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,aAAa,EAAE,QAAQ,EAAE,cAAc,EAAE,kBAAkB,EAAE,SAAS,EAAE,aAAa,EAAE,UAAU,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA;;;;;EAKE;AAEF,oBAAoB;AACpB,OAAO,EACN,cAAc,EACd,aAAa,EACb,GAAG,EACH,EAAE,EACF,GAAG,EACH,OAAO,EACP,gBAAgB,GAChB,MAAM,aAAa,CAAC;AACrB,cAAc;AACd,YAAY,EAAE,mBAAmB,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AACrE,sBAAsB;AACtB,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,cAAc;AACd,YAAY,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,qBAAqB;AACrB,OAAO,EACN,SAAS,EACT,cAAc,EACd,UAAU,EACV,aAAa,EACb,SAAS,EACT,SAAS,EACT,KAAK,EACL,aAAa,EACb,QAAQ,EACR,cAAc,EACd,kBAAkB,EAClB,SAAS,EACT,aAAa,EACb,UAAU,EACV,kBAAkB,GAClB,MAAM,cAAc,CAAC"}
@@ -5,8 +5,8 @@ Utils module — events, autoload, and helper utilities.
5
5
  @showGroups
6
6
  */
7
7
  /** @group Events */
8
- export { getMcEventName, trueEventName, off, on, one, trigger, BubbleController } from './events.js';
8
+ export { getMcEventName, trueEventName, off, on, one, trigger, BubbleController, } from './events.js';
9
9
  /** @group Autoload */
10
10
  export { autoload } from './autoload.js';
11
11
  /** @group Helpers */
12
- export { isBrowser, isNativeObject, sortObject, flattenObject, deepEqual, nameSpace, parse, kebabToPascal, debounce, htmlToElements, copyGettersSetters, injectCSS, processAssets, loadAssets, bindTemplateEvents } from './helpers.js';
12
+ export { isBrowser, isNativeObject, sortObject, flattenObject, deepEqual, nameSpace, parse, kebabToPascal, debounce, htmlToElements, copyGettersSetters, injectCSS, processAssets, loadAssets, bindTemplateEvents, } from './helpers.js';
@@ -0,0 +1,36 @@
1
+ /**
2
+ @module Autoload
3
+
4
+ Single source of truth for the tag-to-file convention: hyphens become path
5
+ separators, so `my-card` resolves to `./my/card.js`. Imported by the runtime
6
+ autoload loader and by build-time tooling so both agree on the path without
7
+ either duplicating the rule.
8
+ */
9
+ /**
10
+ The tag-to-path primitive: hyphens become path separators, with no prefix or
11
+ extension. `my-card` → `my/card`. The single source of truth for the
12
+ convention; {@link resolveComponentPath} and build-time tooling both derive
13
+ their paths from it so neither duplicates the rule.
14
+
15
+ @example Returns `'my/card'` for `my-card`, and `'app/header'` for `app-header`.
16
+ ```ts
17
+ tagPath('my-card');
18
+ tagPath('app-header');
19
+ ```
20
+ @hidden
21
+ @group Autoload
22
+ */
23
+ export declare function tagPath(tag: string): string;
24
+ /**
25
+ Resolves a microcomponent tag name to its autoload module path by prefixing and
26
+ suffixing {@link tagPath}: `my-card` → `./my/card.js`.
27
+
28
+ @example Returns `'./my/card.js'` for `my-card`, and `'./app/header.js'` for `app-header`.
29
+ ```ts
30
+ resolveComponentPath('my-card');
31
+ resolveComponentPath('app-header');
32
+ ```
33
+ @group Autoload
34
+ */
35
+ export declare function resolveComponentPath(tag: string): string;
36
+ //# sourceMappingURL=resolveComponentPath.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"resolveComponentPath.d.ts","sourceRoot":"","sources":["../../src/utils/resolveComponentPath.ts"],"names":[],"mappings":"AAAA;;;;;;;EAOE;AAEF;;;;;;;;;;;;;EAaE;AACF,wBAAgB,OAAO,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAE3C;AAED;;;;;;;;;;EAUE;AACF,wBAAgB,oBAAoB,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAExD"}
@@ -0,0 +1,39 @@
1
+ /**
2
+ @module Autoload
3
+
4
+ Single source of truth for the tag-to-file convention: hyphens become path
5
+ separators, so `my-card` resolves to `./my/card.js`. Imported by the runtime
6
+ autoload loader and by build-time tooling so both agree on the path without
7
+ either duplicating the rule.
8
+ */
9
+ /**
10
+ The tag-to-path primitive: hyphens become path separators, with no prefix or
11
+ extension. `my-card` → `my/card`. The single source of truth for the
12
+ convention; {@link resolveComponentPath} and build-time tooling both derive
13
+ their paths from it so neither duplicates the rule.
14
+
15
+ @example Returns `'my/card'` for `my-card`, and `'app/header'` for `app-header`.
16
+ ```ts
17
+ tagPath('my-card');
18
+ tagPath('app-header');
19
+ ```
20
+ @hidden
21
+ @group Autoload
22
+ */
23
+ export function tagPath(tag) {
24
+ return tag.split('-').join('/');
25
+ }
26
+ /**
27
+ Resolves a microcomponent tag name to its autoload module path by prefixing and
28
+ suffixing {@link tagPath}: `my-card` → `./my/card.js`.
29
+
30
+ @example Returns `'./my/card.js'` for `my-card`, and `'./app/header.js'` for `app-header`.
31
+ ```ts
32
+ resolveComponentPath('my-card');
33
+ resolveComponentPath('app-header');
34
+ ```
35
+ @group Autoload
36
+ */
37
+ export function resolveComponentPath(tag) {
38
+ return './' + tagPath(tag) + '.js';
39
+ }
package/package.json CHANGED
@@ -1,20 +1,20 @@
1
1
  {
2
2
  "name": "@twobirds/microcomponents",
3
- "version": "0.3.0",
3
+ "version": "0.4.1",
4
4
  "description": "Micro Components",
5
5
  "keywords": [
6
- "custom elements",
7
- "web components",
8
- "javascript",
9
- "typescript",
10
6
  "PWA",
11
7
  "SPA",
12
8
  "client",
13
- "library",
9
+ "custom elements",
14
10
  "framework",
11
+ "javascript",
12
+ "library",
15
13
  "lightweight",
16
14
  "native",
17
- "standalone"
15
+ "standalone",
16
+ "typescript",
17
+ "web components"
18
18
  ],
19
19
  "license": "MIT",
20
20
  "author": "Frank Thürigen",
@@ -32,6 +32,9 @@
32
32
  "type": "git",
33
33
  "url": "git+https://gitlab.com/twoBirds/microcomponents.git"
34
34
  },
35
+ "bin": {
36
+ "mc": "./dist/cli/index.js"
37
+ },
35
38
  "files": [
36
39
  "dist"
37
40
  ],
@@ -70,23 +73,27 @@
70
73
  "format": "oxfmt .",
71
74
  "lint": "oxlint \"src\"",
72
75
  "fix": "oxfmt . && oxlint \"src\" --fix",
73
- "check": "tsc --noEmit -p tsconfig.lib.json && tsc -p tsconfig.test.json && tsc -p demo/web-test/tsconfig.demo.json && tsc -p tsconfig.node.json",
76
+ "check": "tsc --noEmit -p tsconfig.lib.json && tsc --noEmit -p tsconfig.cli.json && tsc -p tsconfig.test.json && tsc -p demo/web-test/tsconfig.demo.json && tsc --noEmit -p demo/shop/tsconfig.demo.json && tsc --noEmit -p demo/todo_mvc/tsconfig.demo.json && tsc -p tsconfig.node.json",
74
77
  "check:pack": "publint && attw --pack . --profile esm-only",
75
78
  "test": "vitest",
76
79
  "test:run": "vitest run --reporter=verbose",
77
80
  "test:coverage": "vitest run --coverage",
78
81
  "demo:shop": "vite --config demo/shop/vite.config.ts",
79
82
  "demo:shop:bundled": "tsx demo/shop/vite.shop.bundle.ts",
80
- "demo:shop:build": "tsx demo/shop/vite.shop.ts && pnpm run demo:shop:bundled",
83
+ "demo:shop:build": "tsx demo/build-demo.ts shop && pnpm run demo:shop:bundled",
81
84
  "demo:shop:serve": "vite preview --outDir public/shop --port 5174 --host",
85
+ "demo:todo": "vite --config demo/todo_mvc/vite.config.ts",
86
+ "demo:todo:build": "tsx demo/build-demo.ts todo_mvc",
87
+ "demo:todo:serve": "vite preview --outDir public/todo_mvc --port 5175 --host",
82
88
  "typedoc": "typedoc --displayBasePath ./typedoc/",
83
89
  "bundle": "tsx vite.build.ts",
84
- "clean": "rm -rf dist public build",
85
- "build": "pnpm run clean && tsc -p tsconfig.lib.json && pnpm run test:coverage && pnpm run bundle && pnpm run check:pack && pnpm run typedoc && pnpm run demo:build && pnpm run demo:shop:build && find src -name '*.js' -delete",
90
+ "clean": "rm -rf dist public build coverage",
91
+ "build": "pnpm run clean && tsc -p tsconfig.lib.json && tsc -p tsconfig.cli.json && chmod +x dist/cli/index.js && pnpm run test:coverage && pnpm run bundle && pnpm run check:pack && pnpm run typedoc && pnpm run demo:build && pnpm run demo:shop:build && pnpm run demo:todo:build && find src -name '*.js' -delete",
86
92
  "demo:build": "tsx demo/web-test/vite.demo.ts",
87
- "dev": "vite preview --outDir public/test --port 10000 --host",
93
+ "dev": "vite preview --outDir build/web-test --port 10000 --host",
88
94
  "doc": "vite preview --outDir public/typedoc --port 11000 --host",
89
95
  "watch": "tsx watch.ts",
96
+ "cli": "tsx src/cli/index.ts",
90
97
  "mcp:dev": "tsx watch microcomponents-mcp-server.ts",
91
98
  "mcp:docs": "node mcp-docs-generate.ts",
92
99
  "mcp:run": "tsx microcomponents-mcp-server.ts",
@@ -113,4 +120,3 @@
113
120
  },
114
121
  "packageManager": "pnpm@12.4.1"
115
122
  }
116
-