aplance-ui 1.0.2 → 1.1.0

package/dist/api.d.ts

@@ -58,10 +58,10 @@ interface MakeDefaultOptions {
     utilities?: boolean;
     cssConfigPlacement?: CssConfigPlacement;
 }
-declare const makeDefaultConfig: (opts: MakeDefaultOptions) => ComponentsConfig;
 declare const configExists: (cwd: string) => boolean;
 declare const loadConfig: (cwd: string) => ComponentsConfig;
 declare const resolvePaths: (cwd: string, cfg: ComponentsConfig) => ResolvedPaths;
+declare const makeDefaultConfig: (opts: MakeDefaultOptions) => ComponentsConfig;
 
 type UnitKind = "component" | "hook" | "lib";
 type UnitGroup = "ui" | "primitives" | null;
@@ -70,6 +70,8 @@ interface RegistryUnit {
     kind: UnitKind;
     group: UnitGroup;
     files: string[];
+    /** Source files that should receive a Next.js "use client" directive. */
+    clientFiles?: string[];
     deps: string[];
     /**
      * External npm packages (root specifiers, e.g. `react`, `@tanstack/react-table`)

package/dist/api.js

@@ -218,7 +218,7 @@ var resolveRegistryRoot = () => {
     `This indicates a packaging problem - reinstall the aplance-ui CLI.`
   );
 };
-var EXPECTED_VERSION = 3;
+var EXPECTED_VERSION = 4;
 var EMPTY_INSTALL_META = {
   baseDependencies: {},
   baseDevDependencies: {},
@@ -435,16 +435,23 @@ var remap = (relFile, paths) => {
   }
   return relFile;
 };
+var hasUseClientDirective = (content) => /^\s*["']use client["'];?/.test(content);
+var withUseClientDirective = (content) => hasUseClientDirective(content) ? content : `"use client";
+
+${content}`;
 var planComponentOps = (opts) => {
   const ops = [];
   for (const unit of opts.units) {
+    const nextClientFiles = new Set(unit.clientFiles ?? []);
     for (const relFile of unit.files) {
       const sourceAbs = join3(opts.registry.root, relFile);
       const mapped = remap(relFile, opts.paths);
       const targetAbs = join3(opts.targetSrcDir, mapped);
+      const sourceContent = readFileSync4(sourceAbs, "utf8");
+      const content = opts.template === "next" && nextClientFiles.has(relFile) ? withUseClientDirective(sourceContent) : sourceContent;
       ops.push({
         target: targetAbs,
-        content: readFileSync4(sourceAbs, "utf8"),
+        content,
         label: mapped
       });
     }
@@ -1188,9 +1195,9 @@ var getInlineHostPath = (template, project) => FRAMEWORK_META[template].resolveI
 
 // src/lib/config.ts
 import { existsSync as existsSync7, readFileSync as readFileSync8, writeFileSync as writeFileSync2 } from "fs";
-import { join as join7 } from "path";
+import { isAbsolute, join as join7 } from "path";
 var CONFIG_FILE_NAME = "components.json";
-var CONFIG_SCHEMA_URL = "https://aplance-ui.dev/schema.json";
+var CONFIG_SCHEMA_URL = "https://ui.aplance.com/components.schema.json";
 var SUPPORTED_TEMPLATES = [
   "vite-react",
   "next",
@@ -1212,21 +1219,6 @@ var TEMPLATE_DEFAULT_SRCDIR = {
   astro: "src",
   "electron-vite": "src/renderer/src"
 };
-var makeDefaultConfig = (opts) => ({
-  $schema: CONFIG_SCHEMA_URL,
-  template: opts.template,
-  srcDir: opts.srcDir ?? TEMPLATE_DEFAULT_SRCDIR[opts.template],
-  alias: opts.alias ?? "@",
-  theme: {
-    color: opts.color ?? "default",
-    radius: opts.radius ?? "default",
-    spacing: opts.spacing ?? "default"
-  },
-  paths: { ...DEFAULT_PATHS },
-  cssModules: { pretty: opts.pretty ?? false },
-  utilities: { enabled: opts.utilities ?? false },
-  cssConfig: { placement: opts.cssConfigPlacement ?? "auto" }
-});
 var configPath = (cwd) => join7(cwd, CONFIG_FILE_NAME);
 var configExists = (cwd) => existsSync7(configPath(cwd));
 var loadConfig = (cwd) => {
@@ -1251,6 +1243,10 @@ var loadConfig = (cwd) => {
   return validateConfig(parsed, p3);
 };
 var resolvePaths = (cwd, cfg) => {
+  assertSafeRelativePath("srcDir", cfg.srcDir);
+  for (const key of ["styles", "components", "hooks", "lib"]) {
+    assertSafeRelativePath(`paths.${key}`, cfg.paths[key]);
+  }
   const srcDir = join7(cwd, cfg.srcDir);
   return {
     srcDir,
@@ -1274,6 +1270,37 @@ var normalizeTheme = (raw) => {
   }
   return { color: "default", radius: "default", spacing: "default" };
 };
+var isSafeRelativePath = (value) => {
+  if (value.includes("\0") || isAbsolute(value)) return false;
+  return !value.split(/[\\/]+/).some((segment) => segment === "..");
+};
+var assertSafeRelativePath = (label, value) => {
+  if (!isSafeRelativePath(value)) {
+    throw new ConfigError(
+      "E_CONFIG_INVALID",
+      `${label} must be a relative path inside the project.`
+    );
+  }
+};
+var makeDefaultConfig = (opts) => {
+  const srcDir = opts.srcDir ?? TEMPLATE_DEFAULT_SRCDIR[opts.template];
+  assertSafeRelativePath("srcDir", srcDir);
+  return {
+    $schema: CONFIG_SCHEMA_URL,
+    template: opts.template,
+    srcDir,
+    alias: opts.alias ?? "@",
+    theme: {
+      color: opts.color ?? "default",
+      radius: opts.radius ?? "default",
+      spacing: opts.spacing ?? "default"
+    },
+    paths: { ...DEFAULT_PATHS },
+    cssModules: { pretty: opts.pretty ?? false },
+    utilities: { enabled: opts.utilities ?? false },
+    cssConfig: { placement: opts.cssConfigPlacement ?? "auto" }
+  };
+};
 var validateConfig = (raw, file) => {
   if (!raw || typeof raw !== "object") {
     throw new ConfigError(
@@ -1291,11 +1318,13 @@ var validateConfig = (raw, file) => {
     `"template" must be one of: ${SUPPORTED_TEMPLATES.join(", ")} (got "${c.template}").`
   );
   must(typeof c.srcDir === "string" && c.srcDir.length > 0, `"srcDir" must be a non-empty string.`);
+  must(isSafeRelativePath(c.srcDir), `"srcDir" must be a relative path inside the project.`);
   must(typeof c.alias === "string" && c.alias.length > 0, `"alias" must be a non-empty string.`);
   must(c.paths && typeof c.paths === "object", `"paths" must be an object.`);
   const ps = c.paths;
   for (const k of ["styles", "components", "hooks", "lib"]) {
     must(typeof ps[k] === "string" && ps[k].length > 0, `"paths.${k}" must be a non-empty string.`);
+    must(isSafeRelativePath(ps[k]), `"paths.${k}" must be a relative path inside "srcDir".`);
   }
   must(c.cssModules && typeof c.cssModules === "object", `"cssModules" must be an object.`);
   must(typeof c.cssModules.pretty === "boolean", `"cssModules.pretty" must be a boolean.`);
@@ -1481,6 +1510,32 @@ var describePlan = (plan) => {
   return lines.join("\n");
 };
 
+// src/lib/unit-hints.ts
+var importPath = (cfg, path) => `${cfg.alias}/${path}`.replace(/\/+/g, "/");
+var getUnitHints = ({ cfg, units }) => {
+  const selected = new Set(units.map((unit) => unit.name));
+  const hints = [];
+  if (selected.has("toast")) {
+    const toastImport = importPath(
+      cfg,
+      `${cfg.paths.components}/ui/toast/toast`
+    );
+    hints.push(
+      [
+        "Toast needs one app-level Toaster mount before toast calls render.",
+        `import { Toaster } from "${toastImport}";`,
+        cfg.template === "next" ? "For Next.js, place it in a small Client Component such as app/providers.tsx." : "Place it once near your app root."
+      ].join("\n")
+    );
+  }
+  if (cfg.template === "next" && units.some((unit) => (unit.clientFiles?.length ?? 0) > 0)) {
+    hints.push(
+      'Next.js output adds "use client" only to files that need client runtime APIs.'
+    );
+  }
+  return hints;
+};
+
 // src/commands/init.ts
 var resolveConflictMode = (opts) => {
   if (opts.dryRun) return "dry-run";
@@ -1627,6 +1682,9 @@ var runInit = async (opts) => {
   const registry = loadRegistry();
   const project = detectProject(opts.cwd);
   const { cfg, existed } = await resolveConfig(opts, project, registry);
+  findColor(registry, cfg.theme.color);
+  findRadius(registry, cfg.theme.radius);
+  findSpacing(registry, cfg.theme.spacing);
   const placement = resolveEffectivePlacement(
     cfg.template,
     cfg.cssConfig.placement,
@@ -1683,7 +1741,8 @@ var runInit = async (opts) => {
         registry,
         targetSrcDir: paths.srcDir,
         units,
-        paths: cfg.paths
+        paths: cfg.paths,
+        template: cfg.template
       })
     );
     info(`planned ${units.length} unit${units.length === 1 ? "" : "s"} to copy`);
@@ -1748,6 +1807,10 @@ var runInit = async (opts) => {
       `manual install (skipped)`
     );
   }
+  const unitHints = getUnitHints({ cfg, units });
+  if (unitHints.length > 0) {
+    note2(unitHints.join("\n\n"), "usage hints");
+  }
   const steps = [
     `${pc4.cyan("1")}  ${pc4.bold("Import styles once at your app entry")}
     import "./${cfg.paths.styles}/globals.css";`
@@ -1805,7 +1868,8 @@ var runAdd = async (opts) => {
     registry,
     targetSrcDir: paths.srcDir,
     units,
-    paths: cfg.paths
+    paths: cfg.paths,
+    template: cfg.template
   });
   if (cfg.utilities.enabled) {
     ops.push(planUtilitiesGitignoreOp({ targetStylesDir: paths.stylesDir }));
@@ -1868,21 +1932,31 @@ var runAdd = async (opts) => {
       "manual install (skipped)"
     );
   }
+  const unitHints = getUnitHints({ cfg, units });
+  if (unitHints.length > 0) {
+    note2(unitHints.join("\n\n"), "usage hints");
+  }
   logger.info(summary);
   goodbye(`Added ${units.length} unit${units.length === 1 ? "" : "s"}.`);
 };
 var computeRuntimePlan = (registry, units, project) => {
   const dependencies = {};
+  const skipped = [];
   const meta = registry.installMeta;
   for (const unit of units) {
     for (const pkg of unit.externalDeps) {
       const version = meta.packageVersions[pkg];
       if (!version) continue;
-      if (project.declaredDeps.has(pkg)) continue;
+      if (project.declaredDeps.has(pkg)) {
+        if (!skipped.some((entry) => entry.name === pkg)) {
+          skipped.push({ name: pkg, reason: "already-declared" });
+        }
+        continue;
+      }
       dependencies[pkg] = version;
     }
   }
-  return { dependencies, devDependencies: {}, skipped: [] };
+  return { dependencies, devDependencies: {}, skipped };
 };
 var pickUnits = async (all) => multiselect2({
   message: `Select units to add ${pc5.dim("(space to toggle, enter to confirm)")}`,