@keenmate/web-components-devkit 0.0.0-stage → 1.0.0-rc01

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 (109) hide show
  1. package/CHANGELOG.md +76 -0
  2. package/LICENSE +21 -0
  3. package/README.md +417 -2
  4. package/components.json +189 -0
  5. package/package.json +75 -4
  6. package/src/cli/args.js +16 -0
  7. package/src/cli/commands/check-release.js +66 -0
  8. package/src/cli/commands/check-vars.js +116 -0
  9. package/src/cli/commands/doctor.js +289 -0
  10. package/src/cli/commands/new.js +302 -0
  11. package/src/cli/commands/readme.js +111 -0
  12. package/src/cli/commands/sync.js +48 -0
  13. package/src/cli/kmwc.js +72 -0
  14. package/src/cli/sync-plan.js +163 -0
  15. package/src/config.d.ts +147 -0
  16. package/src/config.js +257 -0
  17. package/src/examples/auto.js +20 -0
  18. package/src/examples/chapter-nav.js +246 -0
  19. package/src/examples/constants.js +80 -0
  20. package/src/examples/controls-persistence.js +97 -0
  21. package/src/examples/copy-link.js +89 -0
  22. package/src/examples/css/base.css +215 -0
  23. package/src/examples/css/chapter-nav.css +179 -0
  24. package/src/examples/css/content.css +251 -0
  25. package/src/examples/css/controls.css +205 -0
  26. package/src/examples/css/copy-link.css +82 -0
  27. package/src/examples/css/demo.css +50 -0
  28. package/src/examples/css/index-page.css +118 -0
  29. package/src/examples/css/style.css +30 -0
  30. package/src/examples/css/theme-switch.css +38 -0
  31. package/src/examples/css/tokens.css +110 -0
  32. package/src/examples/css/widgets.css +133 -0
  33. package/src/examples/demo-code.js +30 -0
  34. package/src/examples/index-page.js +78 -0
  35. package/src/examples/index.d.ts +107 -0
  36. package/src/examples/index.js +18 -0
  37. package/src/examples/kit.js +22 -0
  38. package/src/examples/page-config.js +30 -0
  39. package/src/examples/sections.js +53 -0
  40. package/src/examples/theme-switch.js +72 -0
  41. package/src/examples/version-badge.js +23 -0
  42. package/src/playwright/index.d.ts +15 -0
  43. package/src/playwright/index.js +66 -0
  44. package/src/template.js +11 -0
  45. package/src/vite/index.d.ts +28 -0
  46. package/src/vite/index.js +243 -0
  47. package/src/vite/page-composer.js +209 -0
  48. package/templates/Dockerfile.tmpl +39 -0
  49. package/templates/Makefile.tmpl +136 -0
  50. package/templates/claude-block.md +40 -0
  51. package/templates/dockerignore.tmpl +10 -0
  52. package/templates/examples-layout.html +13 -0
  53. package/templates/new/.claude/commands/publish.md +226 -0
  54. package/templates/new/CHANGELOG.md +13 -0
  55. package/templates/new/LICENSE +21 -0
  56. package/templates/new/README.md +71 -0
  57. package/templates/new/_gitignore +7 -0
  58. package/templates/new/component-variables.manifest.json +32 -0
  59. package/templates/new/custom-elements-manifest.config.mjs +23 -0
  60. package/templates/new/docs/accessibility.md +24 -0
  61. package/templates/new/docs/examples.md +33 -0
  62. package/templates/new/docs/theming.md +54 -0
  63. package/templates/new/docs/usage.md +51 -0
  64. package/templates/new/e2e/dark-mode.spec.ts +30 -0
  65. package/templates/new/e2e/smoke.spec.ts +26 -0
  66. package/templates/new/examples-basic.html +57 -0
  67. package/templates/new/examples-theming.html +28 -0
  68. package/templates/new/index.html +16 -0
  69. package/templates/new/partials/note.html +5 -0
  70. package/templates/new/playwright.config.ts +4 -0
  71. package/templates/new/src/__FEATURE__.ts +55 -0
  72. package/templates/new/src/css/animations.css +1 -0
  73. package/templates/new/src/css/base.css +43 -0
  74. package/templates/new/src/css/controls.css +20 -0
  75. package/templates/new/src/css/dark-mode.css +36 -0
  76. package/templates/new/src/css/floating.css +1 -0
  77. package/templates/new/src/css/main.css +27 -0
  78. package/templates/new/src/css/states.css +22 -0
  79. package/templates/new/src/css/variables.css +40 -0
  80. package/templates/new/src/env.d.ts +7 -0
  81. package/templates/new/src/index.ts +17 -0
  82. package/templates/new/src/logger.ts +11 -0
  83. package/templates/new/src/types.ts +25 -0
  84. package/templates/new/src/web-component.ts +73 -0
  85. package/templates/new/test/dark-mode.html +18 -0
  86. package/templates/new/test/fixture.html +11 -0
  87. package/templates/new/tsconfig.json +15 -0
  88. package/templates/new/vite.config.ts +5 -0
  89. package/templates/new-minimal/CHANGELOG.md +13 -0
  90. package/templates/new-minimal/README.md +71 -0
  91. package/templates/new-minimal/component-variables.manifest.json +24 -0
  92. package/templates/new-minimal/docs/accessibility.md +20 -0
  93. package/templates/new-minimal/docs/examples.md +17 -0
  94. package/templates/new-minimal/docs/theming.md +53 -0
  95. package/templates/new-minimal/docs/usage.md +43 -0
  96. package/templates/new-minimal/e2e/smoke.spec.ts +10 -0
  97. package/templates/new-minimal/examples-basic.html +23 -0
  98. package/templates/new-minimal/examples-theming.html +28 -0
  99. package/templates/new-minimal/src/__FEATURE__.ts +37 -0
  100. package/templates/new-minimal/src/css/base.css +48 -0
  101. package/templates/new-minimal/src/css/controls.css +1 -0
  102. package/templates/new-minimal/src/css/states.css +1 -0
  103. package/templates/new-minimal/src/css/variables.css +26 -0
  104. package/templates/new-minimal/src/index.ts +17 -0
  105. package/templates/new-minimal/src/types.ts +10 -0
  106. package/templates/new-minimal/src/web-component.ts +48 -0
  107. package/templates/new-minimal/test/dark-mode.html +18 -0
  108. package/templates/new-minimal/test/fixture.html +11 -0
  109. package/templates/nginx.conf.tmpl +43 -0
@@ -0,0 +1,48 @@
1
+ /**
2
+ * Element layer: the `<{{TAG}}>` custom element. Parses inputs (attribute +
3
+ * property, through the core input table), hosts the lifecycle and owns the
4
+ * shadow root. Talks to {{LOGIC_CLASS}} only — never to service classes directly.
5
+ */
6
+ import { BlissElement, adoptStyles, type InputDef } from '@keenmate/web-components-core';
7
+ import { {{LOGIC_CLASS}} } from './{{FEATURE}}.js';
8
+ import styles from './css/main.css?inline';
9
+
10
+ /**
11
+ * Every public input is one row: HTML attribute ⇔ config key, converter
12
+ * (parsing + validation), and what a change triggers, e.g.
13
+ *
14
+ * { configKey: 'isOpen', attribute: 'open', converter: toBool('default-false'), on: 'update', description: '…' },
15
+ *
16
+ * Attribute names read like HTML; config keys read like JavaScript.
17
+ */
18
+ export const ATTRIBUTE_TABLE: readonly InputDef[] = [];
19
+
20
+ export class {{ELEMENT_CLASS}} extends BlissElement {
21
+ protected static override inputs = ATTRIBUTE_TABLE;
22
+
23
+ #shadow: ShadowRoot | null = null;
24
+ /** The logic class renders here, so it never touches the adopted/fallback <style>. */
25
+ #logicContainer: HTMLElement | null = null;
26
+ #logic: {{LOGIC_CLASS}} | null = null;
27
+
28
+ /** First connect + any `on: 'reinit'` change: (re)build from the full config. */
29
+ protected override reinit(): void {
30
+ this.#shadow ??= this.attachShadow({ mode: 'open' });
31
+ adoptStyles(this.#shadow, styles);
32
+ this.#logicContainer ??= this.#shadow.appendChild(document.createElement('div'));
33
+ this.#logic?.destroy();
34
+ this.#logic = new {{LOGIC_CLASS}}(this.#logicContainer, {});
35
+ this.log.INIT?.debug('built');
36
+ }
37
+
38
+ /** `on: 'update'` changes: patch in place. */
39
+ protected override update(partial: Record<string, unknown>): void {
40
+ this.#logic?.update(partial);
41
+ }
42
+ }
43
+
44
+ // Importing this module registers the element. index.ts additionally publishes
45
+ // the global API via registerComponent(); both defines are idempotent.
46
+ if (typeof customElements !== 'undefined' && !customElements.get('{{TAG}}')) {
47
+ customElements.define('{{TAG}}', {{ELEMENT_CLASS}});
48
+ }
@@ -0,0 +1,18 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en" data-kmwc="off">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <title>{{TAG}} dark-mode fixture</title>
6
+ </head>
7
+ <body>
8
+ <{{TAG}} id="light-default">light default</{{TAG}}>
9
+ <{{TAG}} id="dark-instance" data-theme="dark">dark instance</{{TAG}}>
10
+ <div data-theme="dark">
11
+ <{{TAG}} id="dark-ancestor">dark ancestor</{{TAG}}>
12
+ </div>
13
+ <div style="--base-main-bg: rgb(255, 0, 0)">
14
+ <{{TAG}} id="base-themed">--base-main-bg</{{TAG}}>
15
+ </div>
16
+ <script type="module" src="/src/index.ts"></script>
17
+ </body>
18
+ </html>
@@ -0,0 +1,11 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en" data-kmwc="off">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <title>{{TAG}} fixture</title>
6
+ </head>
7
+ <body>
8
+ <{{TAG}} id="subject">fixture</{{TAG}}>
9
+ <script type="module" src="/src/index.ts"></script>
10
+ </body>
11
+ </html>
@@ -0,0 +1,43 @@
1
+ {{HEADER}}
2
+ #
3
+ # Static server for the {{ID}} examples site. 100% static (HTML + bundled
4
+ # assets + demo data), no backend — so the vulnerability scanners that probe the
5
+ # public host (leakix/l9scan et al. hitting /api/gql, info.php, .git, .env, …)
6
+ # have nothing to exploit. Drop that traffic with 444 (close, no response).
7
+
8
+ server {
9
+ listen 80;
10
+ server_name _;
11
+ root /usr/share/nginx/html;
12
+ index index.html;
13
+
14
+ # 1. Known vulnerability scanners by User-Agent → close immediately.
15
+ if ($http_user_agent ~* "(l9scan|leakix|nikto|sqlmap|nmap|masscan|zgrab|censys|nuclei|httpx|semrush|petalbot)") {
16
+ return 444;
17
+ }
18
+
19
+ # 2. Exploit-probe file extensions this static site never serves.
20
+ location ~* \.(php|phtml|asp|aspx|jsp|cgi|pl|env|ini|sh|bak|old|sql)$ {
21
+ access_log off;
22
+ return 444;
23
+ }
24
+
25
+ # 3. Exploit-probe paths (app frameworks, VCS/CI metadata, dotfiles).
26
+ location ~* /(\.git|\.svn|\.hg|\.env|wp-admin|wp-login|wp-content|wp-includes|xmlrpc|telescope|actuator|vendor|META-INF|WEB-INF|phpmyadmin|pma|adminer|owa)(/|$) {
27
+ access_log off;
28
+ return 444;
29
+ }
30
+
31
+ # 4. Vite-bundled assets carry a content hash in their name — cache forever.
32
+ location /assets/ {
33
+ try_files $uri =404;
34
+ add_header Cache-Control "public, max-age=31536000, immutable" always;
35
+ }
36
+
37
+ # 5. Pages and un-hashed files (demo data, docs): always revalidate (cheap
38
+ # 304 via ETag), so a redeploy is visible immediately.
39
+ location / {
40
+ try_files $uri $uri/ =404;
41
+ add_header Cache-Control "no-cache" always;
42
+ }
43
+ }