@plitzi/sdk-variables 0.30.19

package/dist/models/StyleVariableForm/StyleVariableForm.mjs

@@ -0,0 +1,150 @@
+import e from "@plitzi/plitzi-ui/Button";
+import { useCallback as t, useState as n } from "react";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import a, { useForm as o, useFormWatch as s } from "@plitzi/plitzi-ui/Form";
+import { z as c } from "zod";
+import { StyleVariableCategory as l } from "@plitzi/sdk-shared";
+//#region src/models/StyleVariableForm/StyleVariableForm.tsx
+var u = c.string().min(3, "Too Short").max(20, "Too Long").regex(/^(?:\w+\s+|)([a-zA-Z_][a-zA-Z0-9_-]+)$/i, "Invalid Name"), d = c.discriminatedUnion("category", [
+	c.object({
+		name: u,
+		category: c.literal(l.COLOR),
+		value: c.object({
+			light: c.string().min(1),
+			dark: c.string().min(1),
+			default: c.string().min(1)
+		})
+	}),
+	c.object({
+		name: u,
+		category: c.literal(l.SHADOW),
+		value: c.string().min(1)
+	}),
+	c.object({
+		name: u,
+		category: c.literal(l.SPACING),
+		value: c.string().trim().refine((e) => !!(e === "0" || e === "auto" || /^-?\d*\.?\d+(px|rem|em|%|vh|vw|vmin|vmax|dvh|svh|lvh|ch|ex|cm|mm|in|pt|pc)$/i.test(e) || /^(calc|min|max|clamp)\(.+\)$/i.test(e)), "Invalid CSS value")
+	}),
+	c.object({
+		name: u,
+		category: c.literal(l.CUSTOM),
+		value: c.string().min(1)
+	})
+]), f = (e, t, n) => {
+	switch (e) {
+		case l.COLOR: {
+			let { default: r = "", light: i = "", dark: a = "" } = n;
+			return {
+				name: t,
+				category: e,
+				value: {
+					light: i,
+					dark: a,
+					default: r
+				}
+			};
+		}
+		case l.SPACING:
+		case l.SHADOW:
+		case l.CUSTOM:
+		default: return {
+			name: t,
+			category: e,
+			value: typeof n == "string" ? n : ""
+		};
+	}
+}, p = ({ name: c = "New Page", category: u = l.COLOR, value: p, isNewRecord: m = !1, onClose: h, onSubmit: g }) => {
+	let [_, v] = n(f(u, c, p)), y = o({
+		defaultValues: _,
+		config: { schema: d }
+	}), b = s(y.formMethods, "category"), x = t((e) => {
+		y.formMethods.setValue("value", e === l.COLOR ? {
+			default: "",
+			light: "",
+			dark: ""
+		} : ""), v(f(e, c, e));
+	}, [y.formMethods, c]);
+	return /* @__PURE__ */ i(a, {
+		form: y,
+		onSubmit: t((e) => g?.(e), [g]),
+		className: "w-full gap-4 rounded border border-gray-300 bg-white p-2 text-zinc-700 dark:border-zinc-700 dark:bg-zinc-800/50 dark:text-zinc-300",
+		children: [/* @__PURE__ */ i(a.Body, {
+			gap: 2,
+			children: [
+				/* @__PURE__ */ r(a.Input, {
+					name: "name",
+					placeholder: "Name",
+					size: "xs",
+					disabled: !m
+				}),
+				/* @__PURE__ */ i(a.Select, {
+					name: "category",
+					size: "xs",
+					onChange: x,
+					children: [
+						/* @__PURE__ */ r("option", {
+							value: l.COLOR,
+							children: "Colors"
+						}),
+						/* @__PURE__ */ r("option", {
+							value: l.SPACING,
+							children: "Spacing"
+						}),
+						/* @__PURE__ */ r("option", {
+							value: l.SHADOW,
+							children: "Shadow"
+						}),
+						/* @__PURE__ */ r("option", {
+							value: l.CUSTOM,
+							children: "Custom"
+						})
+					]
+				}),
+				b === l.COLOR && /* @__PURE__ */ i("div", {
+					className: "flex w-full gap-2",
+					children: [
+						/* @__PURE__ */ r(a.Color, {
+							name: "value.default",
+							placeholder: "Default Value",
+							size: "xs",
+							allowVariables: !0,
+							className: "min-w-0 grow basis-0"
+						}),
+						/* @__PURE__ */ r(a.Color, {
+							name: "value.light",
+							placeholder: "Light Value",
+							size: "xs",
+							allowVariables: !0,
+							className: "min-w-0 grow basis-0"
+						}),
+						/* @__PURE__ */ r(a.Color, {
+							name: "value.dark",
+							placeholder: "Dark Value",
+							size: "xs",
+							allowVariables: !0,
+							className: "min-w-0 grow basis-0"
+						})
+					]
+				}),
+				b !== l.COLOR && /* @__PURE__ */ r(a.Input, {
+					name: "value",
+					placeholder: "Value",
+					size: "xs",
+					className: "grow basis-0"
+				})
+			]
+		}), /* @__PURE__ */ i(a.Footer, { children: [/* @__PURE__ */ r(e, {
+			onClick: h,
+			size: "xs",
+			className: "grow basis-0",
+			children: "Cancel"
+		}), /* @__PURE__ */ r(e, {
+			type: "submit",
+			size: "xs",
+			className: "grow basis-0",
+			children: m ? "Add" : "Update"
+		})] })]
+	});
+};
+//#endregion
+export { p as default, d as styleVariableFormSchema };

package/dist/models/StyleVariableForm/index.d.ts

@@ -0,0 +1,3 @@
+import { default as StyleVariableForm } from './StyleVariableForm';
+export * from './StyleVariableForm';
+export default StyleVariableForm;

package/dist/models/StyleVariableForm/index.mjs

@@ -0,0 +1,5 @@
+import e, { styleVariableFormSchema as t } from "./StyleVariableForm.mjs";
+//#region src/models/StyleVariableForm/index.ts
+var n = e;
+//#endregion
+export { n as default, t as styleVariableFormSchema };

package/dist/models/index.d.ts

@@ -0,0 +1,5 @@
+import { default as SchemaVariableForm } from './SchemaVariableForm';
+import { default as StyleVariableForm } from './StyleVariableForm';
+export * from './SchemaVariableForm';
+export * from './StyleVariableForm';
+export { SchemaVariableForm, StyleVariableForm };

package/dist/models/index.mjs

@@ -0,0 +1,14 @@
+import { __exportAll as e } from "../_virtual/_rolldown/runtime.mjs";
+import { schemaVariableFormSchema as t } from "./SchemaVariableForm/SchemaVariableForm.mjs";
+import n from "./SchemaVariableForm/index.mjs";
+import { styleVariableFormSchema as r } from "./StyleVariableForm/StyleVariableForm.mjs";
+import i from "./StyleVariableForm/index.mjs";
+//#region src/models/index.ts
+var a = /* @__PURE__ */ e({
+	SchemaVariableForm: () => n,
+	StyleVariableForm: () => i,
+	schemaVariableFormSchema: () => t,
+	styleVariableFormSchema: () => r
+});
+//#endregion
+export { n as SchemaVariableForm, i as StyleVariableForm, a as models_exports, t as schemaVariableFormSchema, r as styleVariableFormSchema };

package/package.json

@@ -0,0 +1,163 @@
+{
+  "name": "@plitzi/sdk-variables",
+  "version": "0.30.19",
+  "license": "AGPL-3.0",
+  "files": [
+    "dist"
+  ],
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs"
+    },
+    "./VariablesContext": {
+      "types": "./dist/VariablesContext.d.ts",
+      "import": "./dist/VariablesContext.mjs"
+    },
+    "./VariablesHelper": {
+      "types": "./dist/VariablesHelper.d.ts",
+      "import": "./dist/VariablesHelper.mjs"
+    },
+    "./components": {
+      "types": "./dist/components/index.d.ts",
+      "import": "./dist/components/index.mjs"
+    },
+    "./components/SchemaVariables": {
+      "types": "./dist/components/SchemaVariables/index.d.ts",
+      "import": "./dist/components/SchemaVariables/index.mjs"
+    },
+    "./components/SchemaVariables/SchemaVariable": {
+      "types": "./dist/components/SchemaVariables/SchemaVariable.d.ts",
+      "import": "./dist/components/SchemaVariables/SchemaVariable.mjs"
+    },
+    "./components/SchemaVariables/SchemaVariables": {
+      "types": "./dist/components/SchemaVariables/SchemaVariables.d.ts",
+      "import": "./dist/components/SchemaVariables/SchemaVariables.mjs"
+    },
+    "./components/SchemaVariables/VariableActions": {
+      "types": "./dist/components/SchemaVariables/VariableActions.d.ts",
+      "import": "./dist/components/SchemaVariables/VariableActions.mjs"
+    },
+    "./components/SchemaVariables/VariableDetails": {
+      "types": "./dist/components/SchemaVariables/VariableDetails.d.ts",
+      "import": "./dist/components/SchemaVariables/VariableDetails.mjs"
+    },
+    "./components/SchemaVariables/VariableValue": {
+      "types": "./dist/components/SchemaVariables/VariableValue.d.ts",
+      "import": "./dist/components/SchemaVariables/VariableValue.mjs"
+    },
+    "./components/SchemaVariables/index": {
+      "types": "./dist/components/SchemaVariables/index.d.ts",
+      "import": "./dist/components/SchemaVariables/index.mjs"
+    },
+    "./components/StyleVariables": {
+      "types": "./dist/components/StyleVariables/index.d.ts",
+      "import": "./dist/components/StyleVariables/index.mjs"
+    },
+    "./components/StyleVariables/StyleVariable": {
+      "types": "./dist/components/StyleVariables/StyleVariable.d.ts",
+      "import": "./dist/components/StyleVariables/StyleVariable.mjs"
+    },
+    "./components/StyleVariables/StyleVariables": {
+      "types": "./dist/components/StyleVariables/StyleVariables.d.ts",
+      "import": "./dist/components/StyleVariables/StyleVariables.mjs"
+    },
+    "./components/StyleVariables/VariableActions": {
+      "types": "./dist/components/StyleVariables/VariableActions.d.ts",
+      "import": "./dist/components/StyleVariables/VariableActions.mjs"
+    },
+    "./components/StyleVariables/VariableDetails": {
+      "types": "./dist/components/StyleVariables/VariableDetails.d.ts",
+      "import": "./dist/components/StyleVariables/VariableDetails.mjs"
+    },
+    "./components/StyleVariables/VariableGroup": {
+      "types": "./dist/components/StyleVariables/VariableGroup.d.ts",
+      "import": "./dist/components/StyleVariables/VariableGroup.mjs"
+    },
+    "./components/StyleVariables/VariableList": {
+      "types": "./dist/components/StyleVariables/VariableList.d.ts",
+      "import": "./dist/components/StyleVariables/VariableList.mjs"
+    },
+    "./components/StyleVariables/VariableValue": {
+      "types": "./dist/components/StyleVariables/VariableValue.d.ts",
+      "import": "./dist/components/StyleVariables/VariableValue.mjs"
+    },
+    "./components/StyleVariables/index": {
+      "types": "./dist/components/StyleVariables/index.d.ts",
+      "import": "./dist/components/StyleVariables/index.mjs"
+    },
+    "./components/index": {
+      "types": "./dist/components/index.d.ts",
+      "import": "./dist/components/index.mjs"
+    },
+    "./index": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs"
+    },
+    "./models": {
+      "types": "./dist/models/index.d.ts",
+      "import": "./dist/models/index.mjs"
+    },
+    "./models/SchemaVariableForm": {
+      "types": "./dist/models/SchemaVariableForm/index.d.ts",
+      "import": "./dist/models/SchemaVariableForm/index.mjs"
+    },
+    "./models/SchemaVariableForm/SchemaVariableForm": {
+      "types": "./dist/models/SchemaVariableForm/SchemaVariableForm.d.ts",
+      "import": "./dist/models/SchemaVariableForm/SchemaVariableForm.mjs"
+    },
+    "./models/SchemaVariableForm/VariableSubValue": {
+      "types": "./dist/models/SchemaVariableForm/VariableSubValue.d.ts",
+      "import": "./dist/models/SchemaVariableForm/VariableSubValue.mjs"
+    },
+    "./models/SchemaVariableForm/VariableSubValueActions": {
+      "types": "./dist/models/SchemaVariableForm/VariableSubValueActions.d.ts",
+      "import": "./dist/models/SchemaVariableForm/VariableSubValueActions.mjs"
+    },
+    "./models/SchemaVariableForm/VariableValue": {
+      "types": "./dist/models/SchemaVariableForm/VariableValue.d.ts",
+      "import": "./dist/models/SchemaVariableForm/VariableValue.mjs"
+    },
+    "./models/SchemaVariableForm/index": {
+      "types": "./dist/models/SchemaVariableForm/index.d.ts",
+      "import": "./dist/models/SchemaVariableForm/index.mjs"
+    },
+    "./models/StyleVariableForm": {
+      "types": "./dist/models/StyleVariableForm/index.d.ts",
+      "import": "./dist/models/StyleVariableForm/index.mjs"
+    },
+    "./models/StyleVariableForm/StyleVariableForm": {
+      "types": "./dist/models/StyleVariableForm/StyleVariableForm.d.ts",
+      "import": "./dist/models/StyleVariableForm/StyleVariableForm.mjs"
+    },
+    "./models/StyleVariableForm/index": {
+      "types": "./dist/models/StyleVariableForm/index.d.ts",
+      "import": "./dist/models/StyleVariableForm/index.mjs"
+    },
+    "./models/index": {
+      "types": "./dist/models/index.d.ts",
+      "import": "./dist/models/index.mjs"
+    }
+  },
+  "type": "module",
+  "sideEffects": false,
+  "scripts": {
+    "lint": "eslint ./src",
+    "typecheck": "tsc -p tsconfig.app.json --noEmit",
+    "build:dev": "vite build --mode development --minify false && node ../sdk-shared/scripts/generate-exports.mjs",
+    "build:dev-watch": "vite build --mode development --watch --minify false",
+    "build:prod": "vite build && node ../sdk-shared/scripts/generate-exports.mjs"
+  },
+  "dependencies": {
+    "@plitzi/plitzi-ui": "^1.6.2",
+    "@plitzi/sdk-shared": "0.30.19",
+    "clsx": "^2.1.1",
+    "eslint": "^9.39.4",
+    "zod": "^4.4.1"
+  },
+  "devDependencies": {
+    "eslint": "^9.39.4",
+    "typescript": "^6.0.3",
+    "vite": "^8.0.10"
+  }
+}