@g3nomaly/ui 0.3.3 → 0.3.5

package/dist/registry/types.js

@@ -10,9 +10,37 @@ export const ComponentFileTypeSchema = z.enum([
     "type",
     "meta",
 ]);
-/** One file of a component; `path` is relative to the components directory, e.g. `basic/Card.tsx`. */
+/**
+ * @brief How a file reaches the app: `copy` (the default) writes it into the app for the user to own;
+ * `package` keeps it in the source package, where the component imports it from by package path.
+ */
+export const FileInstallSchema = z.enum(["copy", "package"]);
+/**
+ * @brief One file of a component; `path` is relative to the components directory, e.g. `basic/Card.tsx`.
+ *
+ * @property install - `package` for a file that stays in the source package, such as a store; absent to copy it.
+ */
 export const ComponentFileSchema = BaseFileEntrySchema.extend({
     type: ComponentFileTypeSchema,
+    install: FileInstallSchema.optional(),
+});
+/**
+ * @brief npm packages a component's files import, each as `name` or `name@range`, e.g. `radix-ui` or
+ * `recharts@3.8.0`, the way shadcn lists them.
+ */
+export const NpmDependenciesSchema = z.array(z.string().min(1));
+/**
+ * @brief Theme tokens a component needs in the app's global stylesheet, in shadcn's `cssVars` format:
+ * names without the leading `--`, e.g. `{ light: { sidebar: "oklch(0.98 0 0)" } }`.
+ *
+ * @property theme - Tokens for the `@theme inline` block.
+ * @property light - Tokens for the `:root` block.
+ * @property dark - Tokens for the `.dark` block.
+ */
+export const CssVarsSchema = z.object({
+    theme: z.record(z.string(), z.string()).optional(),
+    light: z.record(z.string(), z.string()).optional(),
+    dark: z.record(z.string(), z.string()).optional(),
 });
 /**
  * @brief A component as it ships: what a `*.meta.ts` file declares and what
@@ -20,7 +48,11 @@ export const ComponentFileSchema = BaseFileEntrySchema.extend({
  *
  * @property version - Set at build time from the package version.
  * @property registryDependencies - Keys of components this one needs installed beside it, e.g. `button`.
- * @property files - Files of the component, each with its path and `ComponentFileType`.
+ * @property dependencies - npm packages the app needs at runtime for this component, e.g. `radix-ui`.
+ * @property devDependencies - npm packages the app needs at build time only, e.g. `@types/d3`.
+ * @property cssVars - Theme tokens the component needs in the app's global stylesheet.
+ * @property files - Files of the component, each with its path and `ComponentFileType`; `install: "package"`
+ * marks one that stays in the package.
  */
 export const PackagedComponentSchema = z.object({
     name: z.string().min(1),
@@ -29,20 +61,31 @@ export const PackagedComponentSchema = z.object({
     category: z.string().optional(),
     author: z.string().optional(),
     registryDependencies: z.array(z.string()).optional(),
+    dependencies: NpmDependenciesSchema.optional(),
+    devDependencies: NpmDependenciesSchema.optional(),
+    cssVars: CssVarsSchema.optional(),
     files: z.array(ComponentFileSchema).min(1),
 });
 /**
  * @brief One installable component, read from a source by `readComponentSource`
- * or the shadcn adapter, and written per install into the g3nui manifest by
+ * or the shadcn adapter, and written per install into the ui manifest by
  * the `add` and `update` commands.
  *
  * @property group - Display group: the category, or the first folder of the first file, e.g. `basic`.
+ * @property dependencies - npm packages the app needs at runtime for this component.
+ * @property devDependencies - npm packages the app needs at build time only.
+ * @property cssVars - Theme tokens the component needs in the app's global stylesheet.
  * @property files - Files the install writes, each with its path and `ComponentFileType`.
+ * @property packageFiles - Files that stay in the source package, imported from it by package path; never written.
  */
 export const ComponentMetaSchema = OriginEntrySchema.extend({
     group: z.string().min(1),
     category: z.string().optional(),
     author: z.string().optional(),
+    dependencies: NpmDependenciesSchema.optional(),
+    devDependencies: NpmDependenciesSchema.optional(),
+    cssVars: CssVarsSchema.optional(),
     files: z.array(ComponentFileSchema).min(1),
+    packageFiles: z.array(ComponentFileSchema).optional(),
 });
 //# sourceMappingURL=types.js.map

package/dist/registry/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/registry/types.ts"],"names":[],"mappings":"AAAA,oCAAoC;AACpC,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AACxB,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAE7D,MAAM,CAAC,MAAM,uBAAuB,GAAG,CAAC,CAAC,IAAI,CAAC;IAC5C,WAAW;IACX,OAAO;IACP,MAAM;IACN,MAAM;IACN,MAAM;IACN,MAAM;CACP,CAAC,CAAC;AAKH,sGAAsG;AACtG,MAAM,CAAC,MAAM,mBAAmB,GAAG,mBAAmB,CAAC,MAAM,CAAC;IAC5D,IAAI,EAAE,uBAAuB;CAC9B,CAAC,CAAC;AAKH;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,uBAAuB,GAAG,CAAC,CAAC,MAAM,CAAC;IAC9C,IAAI,EAAkB,CAAC,CAAC,MAAM,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;IACvC,WAAW,EAAW,CAAC,CAAC,MAAM,EAAE,CAAC,QAAQ,EAAE;IAC3C,OAAO,EAAe,CAAC,CAAC,MAAM,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,QAAQ,EAAE;IAClD,QAAQ,EAAc,CAAC,CAAC,MAAM,EAAE,CAAC,QAAQ,EAAE;IAC3C,MAAM,EAAgB,CAAC,CAAC,MAAM,EAAE,CAAC,QAAQ,EAAE;IAC3C,oBAAoB,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,EAAE,CAAC,CAAC,QAAQ,EAAE;IACpD,KAAK,EAAiB,CAAC,CAAC,KAAK,CAAC,mBAAmB,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;CAC1D,CAAC,CAAC;AAKH;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG,iBAAiB,CAAC,MAAM,CAAC;IAC1D,KAAK,EAAK,CAAC,CAAC,MAAM,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;IAC3B,QAAQ,EAAE,CAAC,CAAC,MAAM,EAAE,CAAC,QAAQ,EAAE;IAC/B,MAAM,EAAI,CAAC,CAAC,MAAM,EAAE,CAAC,QAAQ,EAAE;IAC/B,KAAK,EAAK,CAAC,CAAC,KAAK,CAAC,mBAAmB,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;CAC9C,CAAC,CAAC"}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/registry/types.ts"],"names":[],"mappings":"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"}

package/dist/sources/builtins.d.ts

@@ -1,8 +1,4 @@
 import type { SourceRecord } from "@g3nomaly/core/sources";
-/**
- * @brief Sources every project has without registering them; they cannot be
- * removed. `g3nui` is this package's own folder, so the components always
- * match the CLI that installs them.
- */
+/** Sources every project has without registering them; they cannot be removed. */
 export declare const BUILTIN_SOURCES: SourceRecord;
 //# sourceMappingURL=builtins.d.ts.map

package/dist/sources/builtins.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"builtins.d.ts","sourceRoot":"","sources":["../../src/sources/builtins.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAG3D;;;;GAIG;AACH,eAAO,MAAM,eAAe,EAAE,YAE7B,CAAC"}
+{"version":3,"file":"builtins.d.ts","sourceRoot":"","sources":["../../src/sources/builtins.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAE3D,kFAAkF;AAClF,eAAO,MAAM,eAAe,EAAE,YAE7B,CAAC"}

package/dist/sources/builtins.js

@@ -1,10 +1,5 @@
-import { findPackageRoot } from "@g3nomaly/core/utils";
-/**
- * @brief Sources every project has without registering them; they cannot be
- * removed. `g3nui` is this package's own folder, so the components always
- * match the CLI that installs them.
- */
+/** Sources every project has without registering them; they cannot be removed. */
 export const BUILTIN_SOURCES = {
-    g3nui: { kind: "local", path: findPackageRoot(import.meta.dir) },
+    "g3n-ui": { kind: "npm", package: "@g3nomaly/g3n-ui" },
 };
 //# sourceMappingURL=builtins.js.map

package/dist/sources/builtins.js.map

@@ -1 +1 @@
-{"version":3,"file":"builtins.js","sourceRoot":"","sources":["../../src/sources/builtins.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAEvD;;;;GAIG;AACH,MAAM,CAAC,MAAM,eAAe,GAAiB;IAC3C,KAAK,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,eAAe,CAAC,OAAO,IAAI,CAAC,GAAG,CAAC,EAAE;CACjE,CAAC"}
+{"version":3,"file":"builtins.js","sourceRoot":"","sources":["../../src/sources/builtins.ts"],"names":[],"mappings":"AAGA,kFAAkF;AAClF,MAAM,CAAC,MAAM,eAAe,GAAiB;IAC3C,QAAQ,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,kBAAkB,EAAE;CACvD,CAAC"}

package/dist/theme/cssVars.d.ts

@@ -0,0 +1,43 @@
+import type { CssVars } from "../registry/types";
+/**
+ * @brief One token added to a stylesheet.
+ *
+ * @property block - Selector of the block it went into, e.g. `:root`.
+ * @property name - Its name with the leading `--`, e.g. `--sidebar`.
+ * @property value - Its value, e.g. `oklch(0.98 0 0)`.
+ */
+export interface AddedToken {
+    block: string;
+    name: string;
+    value: string;
+}
+/**
+ * @brief The result of adding tokens to a stylesheet.
+ *
+ * @property css - The stylesheet with the missing tokens added.
+ * @property added - Each token added, in block order.
+ */
+export interface CssVarsMerge {
+    css: string;
+    added: AddedToken[];
+}
+/**
+ * @brief Adds the theme tokens a stylesheet lacks: `light` to `:root`, `dark` to `.dark`, `theme` to
+ * `@theme inline`. When the stylesheet has a `@theme` block (Tailwind v4), each token whose value is a
+ * colour also gets its `--color-<name>: var(--<name>)` mapping there, the way shadcn adds them, so
+ * Tailwind classes such as `bg-sidebar` work. Tokens the stylesheet defines, in any block of the same
+ * kind, keep their value: the app's theme wins.
+ *
+ * @param css - The stylesheet, e.g. the contents of `src/index.css`.
+ * @param vars - Tokens to add.
+ * @returns The stylesheet with the missing tokens added, and which were added.
+ */
+export declare function addCssVars(css: string, vars: CssVars): CssVarsMerge;
+/**
+ * @brief Merges the theme tokens of several components; the first component naming a token wins.
+ *
+ * @param all - Tokens per component, in install order.
+ * @returns One set of tokens.
+ */
+export declare function mergeCssVars(all: readonly CssVars[]): CssVars;
+//# sourceMappingURL=cssVars.d.ts.map

package/dist/theme/cssVars.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"cssVars.d.ts","sourceRoot":"","sources":["../../src/theme/cssVars.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAqBjD;;;;;;GAMG;AACH,MAAM,WAAW,UAAU;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAG,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED;;;;;GAKG;AACH,MAAM,WAAW,YAAY;IAC3B,GAAG,EAAI,MAAM,CAAC;IACd,KAAK,EAAE,UAAU,EAAE,CAAC;CACrB;AAkED;;;;;;;;;;GAUG;AACH,wBAAgB,UAAU,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,GAAG,YAAY,CAanE;AAED;;;;;GAKG;AACH,wBAAgB,YAAY,CAAC,GAAG,EAAE,SAAS,OAAO,EAAE,GAAG,OAAO,CAM7D"}

package/dist/theme/cssVars.js

@@ -0,0 +1,107 @@
+const ROOT = { selector: ":root", find: /(^|\n)[ \t]*:root[ \t]*\{/g };
+const DARK = { selector: ".dark", find: /(^|\n)[ \t]*\.dark[ \t]*\{/g };
+const THEME = { selector: "@theme inline", find: /(^|\n)[ \t]*@theme(?:[ \t]+inline)?[ \t]*\{/g };
+/** A value that is a colour: a colour function, a `var()` that may hold one, a hex colour or a colour keyword. */
+const COLOUR_VALUE = /^(?:(?:rgba?|hsla?|hwb|lab|lch|oklab|oklch|color|color-mix|light-dark|var)\(|#[\da-f]{3,8}$|(?:transparent|currentcolor)$)/i;
+/** A token name with its leading `--`, e.g. `--sidebar` for `sidebar`. */
+function property(name) {
+    return name.startsWith("--") ? name : `--${name}`;
+}
+/**
+ * @brief Where a block's body ends: the index of its closing brace.
+ *
+ * @param css - The stylesheet.
+ * @param open - Index just past the block's opening brace.
+ * @returns The index of the matching closing brace, or `-1` when the braces do not balance.
+ */
+function closingBrace(css, open) {
+    let depth = 1;
+    for (let i = open; i < css.length; i++) {
+        if (css[i] === "{")
+            depth++;
+        else if (css[i] === "}" && --depth === 0)
+            return i;
+    }
+    return -1;
+}
+/**
+ * @brief Adds the tokens no block of a kind defines, before the closing brace of the first block
+ * written as `selector` (so `@theme inline` before a plain `@theme`), else of the first block of the
+ * kind, else as a new block at the end. A token any block of the kind defines keeps its value.
+ *
+ * @param css - The stylesheet.
+ * @param block - The kind of block to add to.
+ * @param tokens - Tokens by name, with or without the leading `--`.
+ * @returns The stylesheet and the names of the tokens added.
+ */
+function addToBlock(css, block, tokens) {
+    const bodies = [...css.matchAll(block.find)].flatMap((match) => {
+        const open = match.index + match[0].length;
+        const end = closingBrace(css, open);
+        return end === -1 ? [] : [{ opening: match[0], open, end }];
+    });
+    const target = bodies.find((body) => body.opening.includes(block.selector)) ?? bodies[0];
+    const close = target?.end ?? -1;
+    const defined = new Set(bodies.flatMap(({ open, end }) => [...css.slice(open, end).matchAll(/(--[\w-]+)\s*:/g)].map((m) => m[1])));
+    const missing = Object.entries(tokens).map(([name, value]) => [property(name), value]).filter(([name]) => !defined.has(name));
+    if (missing.length === 0)
+        return { css, added: [] };
+    const lines = missing.map(([name, value]) => `  ${name}: ${value};\n`).join("");
+    const added = missing.map(([name, value]) => ({ block: block.selector, name, value }));
+    if (close === -1)
+        return { css: `${css.trimEnd()}\n\n${block.selector} {\n${lines}}\n`, added };
+    const before = css.slice(0, close);
+    return { css: `${before}${before.endsWith("\n") ? "" : "\n"}${lines}${css.slice(close)}`, added };
+}
+/**
+ * @brief The names of the `light` and `dark` tokens whose value is a colour, without the leading `--`.
+ * A token counts when its light or its dark value is one.
+ *
+ * @param vars - Tokens to look through.
+ * @returns Names such as `sidebar`, each once; `radius: 0.5rem` and `font-sans: Inter` are left out.
+ */
+function colourTokens(vars) {
+    const values = [...Object.entries(vars.light ?? {}), ...Object.entries(vars.dark ?? {})];
+    const names = values.filter(([, value]) => COLOUR_VALUE.test(value.trim())).map(([name]) => name.replace(/^--/, ""));
+    return [...new Set(names)];
+}
+/**
+ * @brief Adds the theme tokens a stylesheet lacks: `light` to `:root`, `dark` to `.dark`, `theme` to
+ * `@theme inline`. When the stylesheet has a `@theme` block (Tailwind v4), each token whose value is a
+ * colour also gets its `--color-<name>: var(--<name>)` mapping there, the way shadcn adds them, so
+ * Tailwind classes such as `bg-sidebar` work. Tokens the stylesheet defines, in any block of the same
+ * kind, keep their value: the app's theme wins.
+ *
+ * @param css - The stylesheet, e.g. the contents of `src/index.css`.
+ * @param vars - Tokens to add.
+ * @returns The stylesheet with the missing tokens added, and which were added.
+ */
+export function addCssVars(css, vars) {
+    const hasTheme = [...css.matchAll(THEME.find)].length > 0;
+    const mappings = hasTheme ? Object.fromEntries(colourTokens(vars).map((name) => [`color-${name}`, `var(--${name})`])) : {};
+    let result = css;
+    const added = [];
+    for (const [block, tokens] of [[ROOT, vars.light], [DARK, vars.dark], [THEME, { ...mappings, ...vars.theme }]]) {
+        if (tokens === undefined || Object.keys(tokens).length === 0)
+            continue;
+        const merged = addToBlock(result, block, tokens);
+        result = merged.css;
+        added.push(...merged.added);
+    }
+    return { css: result, added };
+}
+/**
+ * @brief Merges the theme tokens of several components; the first component naming a token wins.
+ *
+ * @param all - Tokens per component, in install order.
+ * @returns One set of tokens.
+ */
+export function mergeCssVars(all) {
+    const merged = { theme: {}, light: {}, dark: {} };
+    for (const vars of all) {
+        for (const block of ["theme", "light", "dark"])
+            merged[block] = { ...vars[block], ...merged[block] };
+    }
+    return merged;
+}
+//# sourceMappingURL=cssVars.js.map

package/dist/theme/cssVars.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cssVars.js","sourceRoot":"","sources":["../../src/theme/cssVars.ts"],"names":[],"mappings":"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"}

package/dist/theme/detectCssFile.d.ts

@@ -0,0 +1,9 @@
+/**
+ * @brief Finds the project's global stylesheet: the one shadcn's `components.json` names, else the
+ * first common location that exists.
+ *
+ * @param projectRoot - Absolute project root.
+ * @returns The path relative to the project root, e.g. `src/index.css`, or `undefined` when none is found.
+ */
+export declare function detectCssFile(projectRoot: string): string | undefined;
+//# sourceMappingURL=detectCssFile.d.ts.map

package/dist/theme/detectCssFile.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"detectCssFile.d.ts","sourceRoot":"","sources":["../../src/theme/detectCssFile.ts"],"names":[],"mappings":"AA8BA;;;;;;GAMG;AACH,wBAAgB,aAAa,CAAC,WAAW,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAIrE"}

package/dist/theme/detectCssFile.js

@@ -0,0 +1,41 @@
+// packages/ui/src/theme/detectCssFile.ts
+import fs from "node:fs";
+import path from "node:path";
+import { z } from "zod";
+/** Where Vite, Next.js and shadcn templates keep the global stylesheet, most common first. */
+const CANDIDATES = [
+    "src/index.css",
+    "src/app/globals.css",
+    "app/globals.css",
+    "src/styles/globals.css",
+    "styles/globals.css",
+    "src/globals.css",
+];
+const ShadcnConfigSchema = z.object({ tailwind: z.object({ css: z.string().min(1).optional() }).optional() });
+/**
+ * @brief The stylesheet shadcn's own `components.json` names, when the project has one.
+ *
+ * @param projectRoot - Absolute project root.
+ * @returns The path relative to the project root, or `undefined` when there is no such file or field.
+ */
+function fromShadcnConfig(projectRoot) {
+    const file = path.join(projectRoot, "components.json");
+    if (!fs.existsSync(file))
+        return undefined;
+    const parsed = ShadcnConfigSchema.safeParse(JSON.parse(fs.readFileSync(file, "utf8")));
+    return parsed.success ? parsed.data.tailwind?.css : undefined;
+}
+/**
+ * @brief Finds the project's global stylesheet: the one shadcn's `components.json` names, else the
+ * first common location that exists.
+ *
+ * @param projectRoot - Absolute project root.
+ * @returns The path relative to the project root, e.g. `src/index.css`, or `undefined` when none is found.
+ */
+export function detectCssFile(projectRoot) {
+    const named = fromShadcnConfig(projectRoot);
+    if (named !== undefined && fs.existsSync(path.join(projectRoot, named)))
+        return named;
+    return CANDIDATES.find((candidate) => fs.existsSync(path.join(projectRoot, candidate)));
+}
+//# sourceMappingURL=detectCssFile.js.map

package/dist/theme/detectCssFile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"detectCssFile.js","sourceRoot":"","sources":["../../src/theme/detectCssFile.ts"],"names":[],"mappings":"AAAA,yCAAyC;AACzC,OAAO,EAAE,MAAM,SAAS,CAAC;AACzB,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAExB,8FAA8F;AAC9F,MAAM,UAAU,GAAG;IACjB,eAAe;IACf,qBAAqB;IACrB,iBAAiB;IACjB,wBAAwB;IACxB,oBAAoB;IACpB,iBAAiB;CAClB,CAAC;AAEF,MAAM,kBAAkB,GAAG,CAAC,CAAC,MAAM,CAAC,EAAE,QAAQ,EAAE,CAAC,CAAC,MAAM,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC,MAAM,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;AAE9G;;;;;GAKG;AACH,SAAS,gBAAgB,CAAC,WAAmB;IAC3C,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,iBAAiB,CAAC,CAAC;IACvD,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC;QAAE,OAAO,SAAS,CAAC;IAC3C,MAAM,MAAM,GAAG,kBAAkB,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,YAAY,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC;IACvF,OAAO,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC,CAAC,SAAS,CAAC;AAChE,CAAC;AAED;;;;;;GAMG;AACH,MAAM,UAAU,aAAa,CAAC,WAAmB;IAC/C,MAAM,KAAK,GAAG,gBAAgB,CAAC,WAAW,CAAC,CAAC;IAC5C,IAAI,KAAK,KAAK,SAAS,IAAI,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,KAAK,CAAC,CAAC;QAAE,OAAO,KAAK,CAAC;IACtF,OAAO,UAAU,CAAC,IAAI,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;AAC1F,CAAC"}

package/package.json

@@ -1,10 +1,10 @@
 {
   "name": "@g3nomaly/ui",
-  "version": "0.3.3",
-  "description": "Component library with CLI installer for g3n projects.",
+  "version": "0.3.5",
+  "description": "Installs React components from any registered source into a project, the way shadcn does.",
   "type": "module",
   "bin": {
-    "g3nui": "./dist/cli/index.js"
+    "g3n-ui": "./dist/cli/index.js"
   },
   "main": "./dist/index.js",
   "module": "./dist/index.js",
@@ -33,21 +33,20 @@
     }
   },
   "files": [
-    "dist"
+    "dist",
+    "template"
   ],
   "scripts": {
     "build:types": "tsc --project tsconfig.build.json",
-    "build:components": "bun scripts/build-components.ts",
-    "build:registry": "bun scripts/build-registry.ts",
-    "build": "rm -rf dist && bun run build:types && bun run build:components && bun run build:registry",
+    "build": "rm -rf dist && bun run build:types",
     "dev": "tsc --project tsconfig.build.json --watch",
     "typecheck": "tsc --noEmit",
     "lint": "eslint src --ext .ts,.tsx",
-    "g3nui": "bun run src/cli/index.ts"
+    "ui": "bun run src/cli/index.ts"
   },
   "dependencies": {
     "@clack/prompts": "^1.7.0",
-    "@g3nomaly/core": "^0.3.3",
+    "@g3nomaly/core": "^0.3.5",
     "chalk": "^6.0.0",
     "commander": "^15.0.0",
     "glob": "^13.0.6",
@@ -61,18 +60,6 @@
     "@types/node": "^26.2.0",
     "typescript": "^7.0.2"
   },
-  "peerDependencies": {
-    "react": "latest",
-    "react-dom": "latest"
-  },
-  "peerDependenciesMeta": {
-    "react": {
-      "optional": true
-    },
-    "react-dom": {
-      "optional": true
-    }
-  },
   "keywords": [
     "components",
     "ui",

package/template/build.ts

@@ -0,0 +1,32 @@
+// Builds the source: copies src/components to dist/components and writes dist/components.json, which
+// lists every component with a hash per file. Run it with `bun run build`. It runs on Bun only, because
+// it imports each `.meta.ts` file directly.
+//
+// The installer compares those hashes with the files in an app, so `update` installs any change you
+// build, even under the same version. Raise the version in package.json for every release anyway:
+// it is stamped on every component, and `update` shows it as `0.1.0 → 0.2.0`.
+//
+// How apps get the source. Apps add it with `bun add`, not `-d`, when a component keeps files in the
+// package, since the app then imports them at runtime:
+// - npm: `bun publish`. Apps run `bun add <name>`, then `bunx @g3nomaly/ui source add npm:<name>`.
+// - git: commit dist/, since the installer reads a git source as it is and never builds it. Apps
+//   install it as `bun add github:<owner>/<repo>#<tag>` and register it as an npm source.
+// - a workspace: put this package and the app in one Bun workspace, add it as `"<name>": "workspace:*"`
+//   and register it as an npm source. The best way to work on a source next to an app.
+// - a folder: apps run `bun add file:<path>` and register it as an npm source. When a component keeps
+//   files in the package, the installer swaps the link for a packed copy (`bun pm pack`, which runs
+//   `prepack` and so this build) on every `add` and `update`, because a link to this folder would load
+//   this folder's own node_modules, such as a second React. `source add <path>` reads the folder
+//   directly, but cannot serve files kept in the package.
+import fs from "node:fs";
+import path from "node:path";
+import { COMPONENTS_DIR, COMPONENTS_JSON, writeComponentsJson } from "@g3nomaly/ui/registry";
+
+const root      = import.meta.dir;
+const { version } = JSON.parse(fs.readFileSync(path.join(root, "package.json"), "utf8")) as { version: string };
+const builtDir  = path.join(root, COMPONENTS_DIR);
+
+fs.rmSync(path.join(root, "dist"), { recursive: true, force: true });
+fs.cpSync(path.join(root, "src", "components"), builtDir, { recursive: true });
+const count = await writeComponentsJson(builtDir, path.join(root, COMPONENTS_JSON), version);
+console.log(`wrote ${COMPONENTS_JSON} with ${count} component${count === 1 ? "" : "s"}`);

package/template/package.json

@@ -0,0 +1,22 @@
+{
+  "name": "my-components",
+  "version": "0.1.0",
+  "description": "React components for @g3nomaly/ui.",
+  "type": "module",
+  "files": [
+    "dist"
+  ],
+  "exports": {
+    "./*": "./dist/components/*.ts"
+  },
+  "scripts": {
+    "build": "bun build.ts",
+    "prepack": "bun run build"
+  },
+  "peerDependencies": {
+    "react": ">=18"
+  },
+  "devDependencies": {
+    "@g3nomaly/ui": "*"
+  }
+}

package/template/src/components/example/Example.css

@@ -0,0 +1,20 @@
+/*
+ * Colours come from the app's theme: the tokens shadcn and tweakcn define in the app's one globals.css,
+ * such as --background, --foreground, --primary, --muted and --border. They switch with dark mode,
+ * so a component never needs its own dark styles. Avoid fixed colours. A token of your own goes in
+ * `cssVars` in the meta file, which adds it to the app's stylesheet.
+ */
+.my-components {
+  &.example {
+    padding: 1rem;
+    border: 1px solid var(--border);
+    border-radius: var(--radius);
+    background-color: var(--card);
+    color: var(--card-foreground);
+
+    &--muted {
+      background-color: var(--muted);
+      color: var(--muted-foreground);
+    }
+  }
+}

package/template/src/components/example/Example.tsx

@@ -0,0 +1,26 @@
+// The app gets this file as source and owns it from then on. `update` replaces it only while the app
+// has not changed it, so keep components small and let apps edit them.
+import React from "react";
+// A relative import: Example.css is installed next to this file.
+import "./Example.css";
+
+/**
+ * @brief Props of Example: the native div attributes plus its look.
+ *
+ * @property tone - Look of the box: `default` or `muted`, set as the `example--<tone>` class.
+ */
+export interface ExampleProps extends React.HTMLAttributes<HTMLDivElement> {
+  tone?: "default" | "muted";
+}
+
+export const Example = React.forwardRef<HTMLDivElement, ExampleProps>(
+  ({ children, className = "", tone = "default", ...props }, ref) => (
+    // `my-components` scopes the CSS of this source, so it does not leak into the app. Use one class
+    // per source, named after it.
+    <div ref={ref} className={`my-components example example--${tone} ${className}`} {...props}>
+      {children}
+    </div>
+  ),
+);
+
+Example.displayName = "Example";

package/template/src/components/example/example.meta.ts

@@ -0,0 +1,69 @@
+// The meta file of one component. The build reads every `*.meta.ts` under src/components and writes
+// dist/components.json from them, which is what @g3nomaly/ui reads when it lists and installs components.
+//
+// Rename this file and the component together: `<name>.meta.ts` next to `<Name>.tsx`. One meta file
+// describes one component, and every file in this folder belongs to exactly one meta file.
+import type { PackagedComponent } from "@g3nomaly/ui/types";
+
+export default {
+  // The component's name. Its key is this name in lowercase, so people install it with
+  // `bunx @g3nomaly/ui add example`. Keys must be unique within this source.
+  name: "Example",
+
+  description: "A starting point for your own component. Replace it.",
+
+  // The group the component is listed under, and the folder it sits in. Keep the two equal:
+  // `add example-group` installs every component in the group. Two sources may use the same group
+  // name, in which case the installer asks which one to take, so pick names that say what they hold.
+  category: "example",
+
+  // Every file the component installs. A path is relative to src/components, and the app gets the
+  // file at the same path below its own components folder: `example/Example.tsx` lands in
+  // `src/components/ui/example/Example.tsx`. Files are copied byte for byte, so any import between
+  // files must be relative and must match this layout. Path aliases such as `@/` do not resolve in
+  // the app.
+  //
+  // Types: `component`, `style`, `util`, `hook`, `type`. The meta file itself is added by the build.
+  //
+  // Logic the app should not edit, such as a store that manages the component's data, stays in this
+  // package: mark it `install: "package"` and keep it in the component's folder. The installer never
+  // copies it. The component imports it by package path, `import { exampleStore } from
+  // "my-components/example/exampleStore"`, which the `exports` field in package.json resolves to
+  // dist/components/example/exampleStore.ts. The build fails when no export reaches the file.
+  // Apps then need this package installed with `bun add`, and update the store with `bun install`.
+  // `add --include-unsafe` gives an app a copy anyway, which its components do not import.
+  //
+  // Such a file runs in the app, so every package it imports must be in `peerDependencies` of
+  // package.json, so it loads the app's copy and not a second one, such as a second React. List it in
+  // `devDependencies` too to build here. The build fails on an import that is not a peer.
+  //
+  // A component needs at least one file the app gets copied; the build fails otherwise. A helper that
+  // several stores share needs no meta file of its own: keep it in a component's folder, inside the
+  // `exports`, and import it by package path.
+  files: [
+    { path: "example/Example.tsx", type: "component" },
+    { path: "example/Example.css", type: "style" },
+    // { path: "example/exampleStore.ts", type: "util", install: "package" },
+  ],
+
+  // Other components this one needs, installed alongside it:
+  // - `card`, a component of this source,
+  // - `button@g3n-ui`, a component of another source,
+  // - `@shadcn/tooltip`, a shadcn component. shadcn files land in `<components folder>/shadcn/`,
+  //   so import them as `../shadcn/tooltip` from a group folder.
+  registryDependencies: [],
+
+  // npm packages the files import, as `name` or `name@range`, e.g. `radix-ui` or `recharts@^3`.
+  // After `add` and `update`, the installer lists the ones the app's package.json lacks, and adds
+  // them with `--install`. Use `devDependencies` for packages needed at build time only.
+  dependencies: [],
+
+  // Theme tokens the CSS uses that a shadcn / tweakcn globals.css does not define, in shadcn's format:
+  // names without `--`. After `add` and `update`, the installer adds the ones the app's stylesheet
+  // lacks: `light` to `:root`, `dark` to `.dark`, `theme` to `@theme inline`, plus a `--color-<name>`
+  // mapping per colour so Tailwind classes such as `bg-example-accent` work. The app's own values win.
+  // cssVars: {
+  //   light: { "example-accent": "oklch(0.7 0.15 250)" },
+  //   dark:  { "example-accent": "oklch(0.5 0.15 250)" },
+  // },
+} satisfies PackagedComponent;

package/dist/components/basic/Card.css

@@ -1,32 +0,0 @@
-.g3nui {
-  &.card {
-    border-radius: 0.5rem;
-    background-color: white;
-    overflow: hidden;
-    transition: all 0.2s ease;
-    
-    /* Variants */
-    &--default {
-      border: 1px solid #e5e7eb;
-    }
-    
-    &--outlined {
-      border: 2px solid #d1d5db;
-    }
-    
-    &--elevated {
-      border: 1px solid #e5e7eb;
-      box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
-      
-      &:hover {
-        box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
-      }
-    }
-    
-    /* Dark mode support */
-    @media (prefers-color-scheme: dark) {
-      background-color: #1f2937;
-      border-color: #374151;
-    }
-  }
-}

package/dist/components/basic/Card.debug.ts

@@ -1,5 +0,0 @@
-// packages/ui/src/components/basic/Card.debug.ts
-export const __debug = {
-  componentName: "Card",
-  version: "0.1.0",
-};