@opendevsociety/kine-ui 1.0.0

package/dist/index.js

@@ -0,0 +1,105 @@
+#!/usr/bin/env node
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+
+// src/index.ts
+var import_commander = require("commander");
+var import_prompts = __toESM(require("prompts"));
+var import_chalk = __toESM(require("chalk"));
+var import_path = __toESM(require("path"));
+var import_fs_extra = __toESM(require("fs-extra"));
+var import_ora = __toESM(require("ora"));
+var import_node_fetch = __toESM(require("node-fetch"));
+var import_child_process = require("child_process");
+var REGISTRY_URL = "https://kine-ui.vercel.app/r/styles/default";
+var program = new import_commander.Command();
+program.name("kine-ui").description("Add spatial computing gestures to your React applications.").version("1.0.0");
+program.command("init").description("Initialize Kine UI in your Next.js project").action(async () => {
+  console.log(import_chalk.default.bold.blue("Welcome to Kine UI!"));
+  console.log("Let's configure your spatial computing environment.\n");
+  const response = await (0, import_prompts.default)([
+    {
+      type: "text",
+      name: "componentsDir",
+      message: "Where would you like to install spatial components?",
+      initial: "components/kine"
+    }
+  ]);
+  if (!response.componentsDir) {
+    console.log(import_chalk.default.yellow("Initialization cancelled."));
+    process.exit(0);
+  }
+  const spinner = (0, import_ora.default)("Installing core dependencies (framer-motion, @mediapipe/tasks-vision)...").start();
+  try {
+    (0, import_child_process.execSync)("npm install framer-motion @mediapipe/tasks-vision", { stdio: "ignore" });
+    spinner.succeed("Core dependencies installed.");
+  } catch (error) {
+    spinner.fail("Failed to install dependencies.");
+    process.exit(1);
+  }
+  const configPath = import_path.default.join(process.cwd(), "kine-ui.json");
+  import_fs_extra.default.writeJSONSync(configPath, { componentsDir: response.componentsDir }, { spaces: 2 });
+  console.log(import_chalk.default.green("\n\u2713 Successfully initialized Kine UI and created kine-ui.json"));
+  console.log(import_chalk.default.gray("To start building, try adding the global provider and a gesture:\n"));
+  console.log(import_chalk.default.cyan("  npx kine-ui add kine-provider"));
+  console.log(import_chalk.default.cyan("  npx kine-ui add air-cursor"));
+});
+program.command("add").description("Add a Kine UI gesture component").argument("<component>", "the component to add (e.g. 'air-cursor', 'swipe-area', 'kine-provider')").action(async (component) => {
+  let config;
+  try {
+    config = import_fs_extra.default.readJSONSync(import_path.default.join(process.cwd(), "kine-ui.json"));
+  } catch (e) {
+    console.log(import_chalk.default.red("kine-ui.json not found. Please run `npx kine-ui init` first."));
+    process.exit(1);
+  }
+  const spinner = (0, import_ora.default)(`Fetching ${component} from registry...`).start();
+  try {
+    const res = await (0, import_node_fetch.default)(`${REGISTRY_URL}/${component}.json`);
+    if (!res.ok) {
+      if (res.status === 404) {
+        throw new Error(`Component '${component}' not found in registry.`);
+      }
+      throw new Error(`Failed to fetch component. Status: ${res.status}`);
+    }
+    const item = await res.json();
+    spinner.text = `Installing ${component}...`;
+    if (item.dependencies && item.dependencies.length > 0) {
+      const deps = item.dependencies.join(" ");
+      spinner.text = `Installing additional dependencies: ${deps}...`;
+      (0, import_child_process.execSync)(`npm install ${deps}`, { stdio: "ignore" });
+    }
+    const targetDir = import_path.default.join(process.cwd(), config.componentsDir);
+    import_fs_extra.default.ensureDirSync(targetDir);
+    for (const fileDoc of item.files) {
+      const filePath = import_path.default.join(process.cwd(), fileDoc.target);
+      import_fs_extra.default.ensureDirSync(import_path.default.dirname(filePath));
+      import_fs_extra.default.writeFileSync(filePath, fileDoc.content, "utf-8");
+    }
+    spinner.succeed(`Successfully installed ${import_chalk.default.green(component)} to ${config.componentsDir}`);
+  } catch (error) {
+    spinner.fail(error.message || "Failed to add component.");
+    process.exit(1);
+  }
+});
+program.parse();

package/package.json

@@ -0,0 +1,37 @@
+{
+  "name": "@opendevsociety/kine-ui",
+  "version": "1.0.0",
+  "description": "Spatial computing component registry for React.",
+  "main": "dist/index.js",
+  "bin": {
+    "kine-ui": "dist/index.js"
+  },
+  "scripts": {
+    "build": "tsup src/index.ts --format cjs",
+    "dev": "tsup src/index.ts --format cjs --watch"
+  },
+  "keywords": [
+    "react",
+    "spatial",
+    "components",
+    "shadcn"
+  ],
+  "author": "Open Dev Society",
+  "license": "MIT",
+  "dependencies": {
+    "chalk": "^4.1.2",
+    "commander": "^11.1.0",
+    "fs-extra": "^11.2.0",
+    "node-fetch": "^2.7.0",
+    "ora": "^5.4.1",
+    "prompts": "^2.4.2"
+  },
+  "devDependencies": {
+    "@types/fs-extra": "^11.0.4",
+    "@types/node": "^20.11.16",
+    "@types/node-fetch": "^2.6.11",
+    "@types/prompts": "^2.4.9",
+    "tsup": "^8.0.1",
+    "typescript": "^5.3.3"
+  }
+}

package/src/index.ts

@@ -0,0 +1,127 @@
+#!/usr/bin/env node
+
+import { Command } from "commander";
+import prompts from "prompts";
+import chalk from "chalk";
+import path from "path";
+import fs from "fs-extra";
+import ora from "ora";
+import fetch from "node-fetch";
+import { execSync } from "child_process";
+
+// Kine UI public registry URL
+const REGISTRY_URL = "https://kine-ui.vercel.app/r/styles/default";
+
+const program = new Command();
+
+program
+    .name("kine-ui")
+    .description("Add spatial computing gestures to your React applications.")
+    .version("1.0.0");
+
+program
+    .command("init")
+    .description("Initialize Kine UI in your Next.js project")
+    .action(async () => {
+        console.log(chalk.bold.blue("Welcome to Kine UI!"));
+        console.log("Let's configure your spatial computing environment.\n");
+
+        const response = await prompts([
+            {
+                type: "text",
+                name: "componentsDir",
+                message: "Where would you like to install spatial components?",
+                initial: "components/kine",
+            }
+        ]);
+
+        if (!response.componentsDir) {
+            console.log(chalk.yellow("Initialization cancelled."));
+            process.exit(0);
+        }
+
+        const spinner = ora("Installing core dependencies (framer-motion, @mediapipe/tasks-vision)...").start();
+
+        try {
+            execSync("npm install framer-motion @mediapipe/tasks-vision", { stdio: "ignore" });
+            spinner.succeed("Core dependencies installed.");
+        } catch (error) {
+            spinner.fail("Failed to install dependencies.");
+            process.exit(1);
+        }
+
+        // Save a config file so `add` knows where to put things
+        const configPath = path.join(process.cwd(), "kine-ui.json");
+        fs.writeJSONSync(configPath, { componentsDir: response.componentsDir }, { spaces: 2 });
+
+        console.log(chalk.green("\n✓ Successfully initialized Kine UI and created kine-ui.json"));
+        console.log(chalk.gray("To start building, try adding the global provider and a gesture:\n"));
+        console.log(chalk.cyan("  npx kine-ui add kine-provider"));
+        console.log(chalk.cyan("  npx kine-ui add air-cursor"));
+    });
+
+program
+    .command("add")
+    .description("Add a Kine UI gesture component")
+    .argument("<component>", "the component to add (e.g. 'air-cursor', 'swipe-area', 'kine-provider')")
+    .action(async (component) => {
+        let config;
+        try {
+            config = fs.readJSONSync(path.join(process.cwd(), "kine-ui.json"));
+        } catch (e) {
+            console.log(chalk.red("kine-ui.json not found. Please run `npx kine-ui init` first."));
+            process.exit(1);
+        }
+
+        const spinner = ora(`Fetching ${component} from registry...`).start();
+
+        try {
+            // Note: In production this would point to standard registry endpoints
+            // For now, it will look at the public/r/styles/default output
+            const res = await fetch(`${REGISTRY_URL}/${component}.json`);
+
+            if (!res.ok) {
+                if (res.status === 404) {
+                    throw new Error(`Component '${component}' not found in registry.`);
+                }
+                throw new Error(`Failed to fetch component. Status: ${res.status}`);
+            }
+
+            interface RegistryItem {
+                dependencies?: string[];
+                files: { target: string; content: string }[];
+            }
+
+            const item = await res.json() as RegistryItem;
+            spinner.text = `Installing ${component}...`;
+
+            // Install specific dependencies if the component asks for them
+            if (item.dependencies && item.dependencies.length > 0) {
+                const deps = item.dependencies.join(" ");
+                spinner.text = `Installing additional dependencies: ${deps}...`;
+                execSync(`npm install ${deps}`, { stdio: "ignore" });
+            }
+
+            // Ensure TARGET directory exists
+            const targetDir = path.join(process.cwd(), config.componentsDir);
+            fs.ensureDirSync(targetDir);
+
+            // Write all files attached to this component
+            for (const fileDoc of item.files) {
+                const filePath = path.join(process.cwd(), fileDoc.target);
+
+                // create the directory for the file itself in case it's nested (like core/kine-engine.ts)
+                fs.ensureDirSync(path.dirname(filePath));
+
+                fs.writeFileSync(filePath, fileDoc.content, "utf-8");
+            }
+
+            spinner.succeed(`Successfully installed ${chalk.green(component)} to ${config.componentsDir}`);
+
+        } catch (error: any) {
+            spinner.fail(error.message || "Failed to add component.");
+            process.exit(1);
+        }
+    });
+
+program.parse();