npm - @kokimoki/kit - Versions diffs - 1.3.0 → 1.5.0 - Mend

@kokimoki/kit 1.3.0 → 1.5.0

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 (9) hide show

package/dist/index.d.ts +0 -1
package/dist/index.js +0 -1
package/dist/kokimoki-kit-plugin.d.ts +4 -2
package/dist/kokimoki-kit-plugin.js +65 -7
package/dist/preprocess-style.spec.d.ts +1 -0
package/dist/preprocess-style.spec.js +75 -0
package/dist/version.d.ts +1 -1
package/dist/version.js +1 -1
package/package.json +9 -3

package/dist/index.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
 export * from "./kokimoki-kit-plugin";
 export * from "./preprocess-style";
-export * from "./schema-builder";

package/dist/index.js CHANGED Viewed

@@ -16,4 +16,3 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./kokimoki-kit-plugin"), exports);
 __exportStar(require("./preprocess-style"), exports);
-__exportStar(require("./schema-builder"), exports);

package/dist/kokimoki-kit-plugin.d.ts CHANGED Viewed

@@ -1,12 +1,14 @@
 import type { Plugin } from "vite";
-import type { Form } from "./schema-builder";
+import { ZodTypeAny } from "zod";
 export interface KokimokiKitConfig {
     conceptId: string;
-    form: Form<any, any>;
+    schema: ZodTypeAny;
     deployCodes: {
         name: string;
         description: string;
         clientContext: any;
     }[];
+    defaultProjectConfigPath?: string;
+    defaultProjectStylePath?: string;
 }
 export declare function kokimokiKitPlugin(config: KokimokiKitConfig): Plugin;

package/dist/kokimoki-kit-plugin.js CHANGED Viewed

@@ -1,4 +1,27 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -8,18 +31,21 @@ const bson_objectid_1 = __importDefault(require("bson-objectid"));
 const promises_1 = __importDefault(require("fs/promises"));
 const preprocess_style_1 = require("./preprocess-style");
 const version_1 = require("./version");
+const yaml = __importStar(require("yaml"));
+const zod_to_json_schema_1 = __importDefault(require("zod-to-json-schema"));
 function kokimokiKitPlugin(config) {
     return {
         name: "kokimoki-kit",
         async transform(code, id) {
             if (id.endsWith("kokimoki.style.css")) {
+                console.warn(`[kokimoki-kit] importing kokimoki.style.css directly is deprecated, use defaultProjectStylePath instead`);
                 return (0, preprocess_style_1.preprocessStyle)(code);
             }
             return code;
         },
         async transformIndexHtml(html) {
-            // NOTE: Try https://github.com/jsdom/jsdom instead of regex parsing
             if (process.env.NODE_ENV !== "development") {
+                // NOTE: Try https://github.com/jsdom/jsdom instead of regex parsing
                 return html
                     .replace("<head>", `<head>
               <base href="%KM_BASE%">
@@ -79,6 +105,12 @@ function kokimokiKitPlugin(config) {
                 appId = new bson_objectid_1.default().toHexString();
                 await promises_1.default.writeFile(".kokimoki/app-id", appId);
             }
+            // Get default config
+            let defaultProjectConfig = config.schema.parse(undefined);
+            if (config.defaultProjectConfigPath) {
+                const defaultProjectConfigFile = await promises_1.default.readFile(config.defaultProjectConfigPath, "utf8");
+                defaultProjectConfig = yaml.parse(defaultProjectConfigFile);
+            }
             // Inject the app id into the index.html
             html = html.replace("<head>", `<head>
           <script id="kokimoki-env" type="application/json">
@@ -87,11 +119,16 @@ function kokimokiKitPlugin(config) {
             "test": true,
             "host": "y-wss.kokimoki.com",
             "appId": "${appId}",
-            "configObject": ${JSON.stringify(config.form.value)},
+            "configObject": ${JSON.stringify(defaultProjectConfig)},
             "base": "/",
             "assets": "/"
           }
           </script>`);
+            // Inject default project style in development
+            if (config.defaultProjectStylePath) {
+                const defaultProjectStyle = await promises_1.default.readFile(config.defaultProjectStylePath, "utf8");
+                html = html.replace("</body>", `<style id="km-dev-style">${(0, preprocess_style_1.preprocessStyle)(defaultProjectStyle)}</style></body>`);
+            }
             return html;
         },
         // write kokimoki metadata to .kokimoki directory
@@ -102,13 +139,34 @@ function kokimokiKitPlugin(config) {
                 conceptId: config.conceptId,
                 deployCodes: config.deployCodes,
                 build: "dist",
+                defaultProjectConfigPath: config.defaultProjectConfigPath,
+                defaultProjectStylePath: config.defaultProjectStylePath,
             }, null, 2));
             // write schema
-            const schema = JSON.stringify(config.form.schema, null, 2);
-            await promises_1.default.writeFile(".kokimoki/schema.json", schema);
-            // write scheme defaults
-            const defaultValue = JSON.stringify(config.form.value, null, 2);
-            await promises_1.default.writeFile(".kokimoki/schema-defaults.json", defaultValue);
+            const jsonSchema = (0, zod_to_json_schema_1.default)(config.schema);
+            const defaultJsonSchemaValue = config.schema.parse(undefined);
+            await promises_1.default.writeFile(".kokimoki/schema.json", JSON.stringify(jsonSchema, null, 2));
+            // write schema defaults as json
+            await promises_1.default.writeFile(".kokimoki/schema-defaults.json", JSON.stringify(defaultJsonSchemaValue, null, 2));
+            // write schema defaults as yaml
+            await promises_1.default.writeFile(".kokimoki/schema-defaults.yaml", yaml.stringify(defaultJsonSchemaValue));
+        },
+        configureServer(server) {
+            // reload when defaultProjectConfigPath or defaultProjectStylePath changes
+            if (config.defaultProjectConfigPath) {
+                server.watcher.add(config.defaultProjectConfigPath);
+            }
+            if (config.defaultProjectStylePath) {
+                server.watcher.add(config.defaultProjectStylePath);
+            }
+            server.watcher.on("change", (file) => {
+                if (config.defaultProjectConfigPath?.match(file) ||
+                    config.defaultProjectStylePath?.match(file)) {
+                    server.ws.send({
+                        type: "full-reload",
+                    });
+                }
+            });
         },
     };
 }

package/dist/preprocess-style.spec.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ export {};

package/dist/preprocess-style.spec.js ADDED Viewed

@@ -0,0 +1,75 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const preprocess_style_1 = require("./preprocess-style");
+const assert_1 = __importDefault(require("assert"));
+describe("rgb-utils", () => {
+    // data-theme detection
+    describe("data-theme detection", () => {
+        it("should transform data-theme=gfc content", () => {
+            const result = (0, preprocess_style_1.preprocessStyle)(`[data-theme=gfc] { --on-primary: #aabbcc; }`);
+            assert_1.default.equal(result, `[data-theme="gfc"] { --on-primary: 170 187 204; }`);
+        });
+        it("should transform data-theme='gfc' content", () => {
+            const result = (0, preprocess_style_1.preprocessStyle)(`[data-theme='gfc'] { --on-primary: #aabbcc; }`);
+            assert_1.default.equal(result, `[data-theme="gfc"] { --on-primary: 170 187 204; }`);
+        });
+        it('should transform data-theme="gfc" content', () => {
+            const result = (0, preprocess_style_1.preprocessStyle)(`[data-theme="gfc"] { --on-primary: #aabbcc; }`);
+            assert_1.default.equal(result, `[data-theme="gfc"] { --on-primary: 170 187 204; }`);
+        });
+    });
+    // gfc skeleton theme system
+    describe("gfc", () => {
+        it("should transform --on-primary hex value to rgb tuple", () => {
+            const result = (0, preprocess_style_1.preprocessStyle)(`[data-theme="gfc"] { --on-primary: #aabbcc; }`);
+            assert_1.default.equal(result, `[data-theme="gfc"] { --on-primary: 170 187 204; }`);
+        });
+        it("should generate color palette for --color-primary", () => {
+            const result = (0, preprocess_style_1.preprocessStyle)(`[data-theme="gfc"] { --color-primary: #ff0000; }`);
+            (0, assert_1.default)(result.includes("--color-primary-50:"));
+            (0, assert_1.default)(result.includes("--color-primary-100:"));
+            (0, assert_1.default)(result.includes("--color-primary-200:"));
+            (0, assert_1.default)(result.includes("--color-primary-300:"));
+            (0, assert_1.default)(result.includes("--color-primary-400:"));
+            (0, assert_1.default)(result.includes("--color-primary-500:"));
+            (0, assert_1.default)(result.includes("--color-primary-600:"));
+            (0, assert_1.default)(result.includes("--color-primary-700:"));
+            (0, assert_1.default)(result.includes("--color-primary-800:"));
+            (0, assert_1.default)(result.includes("--color-primary-900:"));
+        });
+        it("should not transform --p variable", () => {
+            const result = (0, preprocess_style_1.preprocessStyle)(`[data-theme="gfc"] { --p: white; }`);
+            assert_1.default.equal(result, `[data-theme="gfc"] { --p: white; }`);
+        });
+    });
+    // daisy theme system
+    describe("daisy", () => {
+        for (const theme of ["light", "dark"]) {
+            describe(theme, () => {
+                it("should transform theme name", () => {
+                    const result = (0, preprocess_style_1.preprocessStyle)(`[data-theme="daisy-${theme}"] {}`);
+                    assert_1.default.equal(result, `[data-theme="${theme}"] {}`);
+                });
+                it("should transform variables from hex to oklch tuple", () => {
+                    const result = (0, preprocess_style_1.preprocessStyle)(`[data-theme="daisy-${theme}"] {\n--p: #7480ff;\n--pc: #050617;\n--b1: #1d232a;\n--bc: #a6adbb;\n}`);
+                    assert_1.default.equal(result, `[data-theme="${theme}"] {\n--p: 65.3% 0.186 275.9;\n--pc: 13.3% 0.038 276.4;\n--b1: 25.3% 0.016 252.4;\n--bc: 74.6% 0.022 264.4;\n}`);
+                });
+                it("should transform variables from color names to oklch tuple", () => {
+                    const result = (0, preprocess_style_1.preprocessStyle)(`[data-theme="daisy-${theme}"] { --p: red; }`);
+                    assert_1.default.equal(result, `[data-theme="${theme}"] { --p: 62.8% 0.258 29.2; }`);
+                });
+                it("should transform achromatic color to oklch tuple", () => {
+                    const result = (0, preprocess_style_1.preprocessStyle)(`[data-theme="daisy-${theme}"] { --p: white; }`);
+                    assert_1.default.equal(result, `[data-theme="${theme}"] { --p: 100.0% 0.000 0.0; }`);
+                });
+                it("should not transform --on-primary variable", () => {
+                    const result = (0, preprocess_style_1.preprocessStyle)(`[data-theme="daisy-${theme}"] { --on-primary: black; }`);
+                    assert_1.default.equal(result, `[data-theme="${theme}"] { --on-primary: black; }`);
+                });
+            });
+        }
+    });
+});

package/dist/version.d.ts CHANGED Viewed

	@@ -1 +1 @@
1	- export declare const KOKIMOKI_KIT_VERSION = "1.3.0";
1	+ export declare const KOKIMOKI_KIT_VERSION = "1.5.0";

package/dist/version.js CHANGED Viewed

@@ -1,4 +1,4 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.KOKIMOKI_KIT_VERSION = void 0;
-exports.KOKIMOKI_KIT_VERSION = "1.3.0";
+exports.KOKIMOKI_KIT_VERSION = "1.5.0";

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@kokimoki/kit",
-  "version": "1.3.0",
+  "version": "1.5.0",
   "description": "",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -8,7 +8,7 @@
     "dist"
   ],
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1",
+    "test": "ts-mocha  src/**/*.spec.ts --exit",
     "prebuild": "node -p \"'export const KOKIMOKI_KIT_VERSION = ' + JSON.stringify(require('./package.json').version) + ';'\" > src/version.ts",
     "build": "tsc"
   },
@@ -16,12 +16,18 @@
   "license": "Apache-2.0",
   "devDependencies": {
     "@types/colornames": "^1.1.4",
+    "@types/expect": "^24.3.2",
+    "mocha": "^11.1.0",
+    "ts-mocha": "^10.0.0",
     "vite": "^5.4.8"
   },
   "dependencies": {
     "bson-objectid": "^2.0.4",
     "colorjs.io": "^0.5.2",
-    "colornames": "^1.1.1"
+    "colornames": "^1.1.1",
+    "yaml": "^2.7.0",
+    "zod": "^3.24.2",
+    "zod-to-json-schema": "^3.24.5"
   },
   "peerDependencies": {
     "vite": ">=5"