@yamada-ui/cli 0.0.0-dev-20230608024220

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 Hirotomo Yamada
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,42 @@
+# @yamada-ui/cli
+
+Generate TypeScript types to provide autocomplete for your custom theme.
+
+## Installation
+
+```sh
+$ pnpm add @yamada-ui/cli
+```
+
+or
+
+```sh
+$ yarn add @yamada-ui/cli
+```
+
+or
+
+```sh
+$ npm install @yamada-ui/cli
+```
+
+## Usage
+
+```sh
+pnpm yamada-cli token <path/to/your/theme.(js|ts)>
+```
+
+### Options
+
+- `--out <path>` output file to node_modules/@yamada-ui/core/dist/generated-theme.types.d.ts
+- `--watch [path]` Watch directory for changes and rebuild
+- `--help` display help for command
+
+## Contribution
+
+Wouldn't you like to contribute? That's amazing! We have prepared a [contribution guide](https://github.com/hirotomoyamada/yamada-ui/blob/main/CONTRIBUTING.md) to assist you.
+
+## Licence
+
+This package is licensed under the terms of the
+[MIT license](https://github.com/hirotomoyamada/yamada-ui/blob/main/LICENSE).

package/bin/index.js

@@ -0,0 +1,7 @@
+#!/usr/bin/env node
+const { run } = require('../dist/index.js')
+
+run().catch((e) => {
+  console.error(e)
+  process.exit(1)
+})

package/bin/tsconfig.json

@@ -0,0 +1,14 @@
+{
+  "compilerOptions": {
+    "module": "commonjs",
+    "baseUrl": "./",
+    "allowJs": true,
+    "strict": false,
+    "noImplicitAny": false,
+    "esModuleInterop": true
+  },
+  "ts-node": {
+    "swc": true,
+    "transpileOnly": true
+  }
+}

package/dist/command/tokens/config.js

@@ -0,0 +1,44 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/command/tokens/config.ts
+var config_exports = {};
+__export(config_exports, {
+  config: () => config
+});
+module.exports = __toCommonJS(config_exports);
+var config = [
+  { key: "borders" },
+  { key: "breakpoints", filter: (value) => Number.isNaN(Number(value)) },
+  { key: "colors", maxScanDepth: 3 },
+  { key: "fonts" },
+  { key: "fontSizes" },
+  { key: "fontWeights" },
+  { key: "letterSpacings" },
+  { key: "lineHeights" },
+  { key: "radii" },
+  { key: "shadows" },
+  { key: "sizes", maxScanDepth: 2 },
+  { key: "spaces", flatMap: (value) => [value, `-${value}`] },
+  { key: "zIndices" }
+];
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  config
+});

package/dist/command/tokens/create-theme-typings.js

@@ -0,0 +1,213 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __esm = (fn, res) => function __init() {
+  return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// ../../node_modules/.pnpm/tsup@6.7.0_@swc+core@1.3.62_postcss@8.4.23_ts-node@10.9.1_typescript@4.9.4/node_modules/tsup/assets/cjs_shims.js
+var init_cjs_shims = __esm({
+  "../../node_modules/.pnpm/tsup@6.7.0_@swc+core@1.3.62_postcss@8.4.23_ts-node@10.9.1_typescript@4.9.4/node_modules/tsup/assets/cjs_shims.js"() {
+  }
+});
+
+// src/command/tokens/create-theme-typings.ts
+var create_theme_typings_exports = {};
+__export(create_theme_typings_exports, {
+  createThemeTypings: () => createThemeTypings,
+  extractColorSchemes: () => extractColorSchemes,
+  extractComponents: () => extractComponents,
+  extractKeys: () => extractKeys,
+  extractPaths: () => extractPaths,
+  extractTransitions: () => extractTransitions,
+  print: () => print,
+  printComponent: () => printComponent
+});
+module.exports = __toCommonJS(create_theme_typings_exports);
+init_cjs_shims();
+
+// src/utils/assertion.ts
+init_cjs_shims();
+var isObject = (obj) => obj !== null && (typeof obj === "object" || typeof obj === "function") && !Array.isArray(obj);
+var isArray = (value) => Array.isArray(value);
+
+// src/utils/prettier.ts
+init_cjs_shims();
+var import_prettier = require("prettier");
+var prettier = async (content) => {
+  const prettierConfig = await (0, import_prettier.resolveConfig)(process.cwd());
+  try {
+    return (0, import_prettier.format)(content, {
+      ...prettierConfig,
+      parser: "typescript"
+    });
+  } catch {
+    return content;
+  }
+};
+
+// src/command/tokens/config.ts
+init_cjs_shims();
+var config = [
+  { key: "borders" },
+  { key: "breakpoints", filter: (value) => Number.isNaN(Number(value)) },
+  { key: "colors", maxScanDepth: 3 },
+  { key: "fonts" },
+  { key: "fontSizes" },
+  { key: "fontWeights" },
+  { key: "letterSpacings" },
+  { key: "lineHeights" },
+  { key: "radii" },
+  { key: "shadows" },
+  { key: "sizes", maxScanDepth: 2 },
+  { key: "spaces", flatMap: (value) => [value, `-${value}`] },
+  { key: "zIndices" }
+];
+
+// src/command/tokens/create-theme-typings.ts
+var defaultColors = ["primary", "secondary", "warning", "danger", "link"];
+var hues = ["50", "100", "200", "300", "400", "500", "600", "700", "800", "900"];
+var printComponent = (components) => `components: { ${Object.entries(components).map(
+  ([key, unions]) => `${key.match(/^[a-zA-Z0-9\-_]+$/) ? key : `"${key}"`}: { ${print(unions)}}`
+).join(`
+`)} }`;
+var print = (unions) => Object.entries(unions).sort(([a], [b]) => a.localeCompare(b)).map(
+  ([key, union]) => `${key}: ${union.map((value) => `"${value}"`).concat(["(string & {})"]).join(" | ")};`
+).join("\n");
+var extractComponents = ({
+  components = {}
+}) => Object.entries(components).reduce(
+  (obj, [key, { sizes, variants }]) => {
+    if (sizes || variants) {
+      obj[key] = {
+        sizes: Object.keys(sizes ?? {}),
+        variants: Object.keys(variants ?? {})
+      };
+    }
+    return obj;
+  },
+  {}
+);
+var extractTransitions = (theme) => {
+  let transitionProperty = [];
+  let transitionDuration = [];
+  let transitionEasing = [];
+  const { transitions } = theme;
+  if (!isObject(transitions))
+    return { transitionProperty, transitionDuration, transitionEasing };
+  Object.entries(transitions).forEach(([key, value]) => {
+    switch (key) {
+      case "property":
+        transitionProperty = extractPaths(value);
+        break;
+      case "duration":
+        transitionDuration = extractPaths(value);
+        break;
+      case "easing":
+        transitionEasing = extractPaths(value);
+        break;
+      default:
+        return;
+    }
+  });
+  return { transitionProperty, transitionDuration, transitionEasing };
+};
+var isHue = (value) => {
+  if (!isObject(value))
+    return false;
+  const keys = Object.keys(value);
+  return hues.every((key) => keys.includes(key));
+};
+var isDefaultColor = (key) => defaultColors.includes(key);
+var extractColorSchemes = (theme) => {
+  const { colors } = theme;
+  if (!isObject(colors))
+    return [];
+  return Object.entries(colors).reduce((array, [key, value]) => {
+    if (isHue(value) || isDefaultColor(key))
+      array.push(key);
+    return array;
+  }, []);
+};
+var extractPaths = (target, maxDepth = 3) => {
+  if (!isObject(target) && !Array.isArray(target) || !maxDepth)
+    return [];
+  return Object.entries(target).reduce((array, [key, value]) => {
+    if (isObject(value)) {
+      extractPaths(value, maxDepth - 1).forEach((nestedKey) => array.push(`${key}.${nestedKey}`));
+    } else {
+      array.push(key);
+    }
+    return array;
+  }, []);
+};
+var extractKeys = (theme, key) => {
+  const keys = key.split(".");
+  const property = keys.reduce((obj, key2) => obj[key2] ?? {}, theme);
+  if (!isObject(property))
+    return [];
+  return Object.keys(property);
+};
+var createThemeTypings = async (theme) => {
+  const unions = config.reduce(
+    (obj, { key, maxScanDepth, filter = () => true, flatMap = (value) => value }) => {
+      const target = theme[key];
+      obj[key] = [];
+      if (isObject(target) || isArray(target)) {
+        obj[key] = extractPaths(target, maxScanDepth).filter(filter).flatMap(flatMap);
+      }
+      if (isObject(theme.semantics)) {
+        const semanticKeys = extractKeys(theme.semantics, key).filter(filter).flatMap(flatMap);
+        obj[key].push(...semanticKeys);
+      }
+      return obj;
+    },
+    {}
+  );
+  const textStyles = extractKeys(theme, "styles.textStyles");
+  const layerStyles = extractKeys(theme, "styles.layerStyles");
+  const colorSchemes = extractColorSchemes(theme);
+  const { transitionProperty, transitionDuration, transitionEasing } = extractTransitions(theme);
+  const componentTypes = extractComponents(theme);
+  return prettier(
+    `import { UITheme } from './ui-theme.types'
+
+export interface GeneratedTheme extends UITheme { ${print(
+      {
+        ...unions,
+        textStyles,
+        layerStyles,
+        colorSchemes,
+        transitionProperty,
+        transitionDuration,
+        transitionEasing
+      }
+    )} ${printComponent(componentTypes)} }`
+  );
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  createThemeTypings,
+  extractColorSchemes,
+  extractComponents,
+  extractKeys,
+  extractPaths,
+  extractTransitions,
+  print,
+  printComponent
+});