@type32/yaml-editor-form 1.0.0

package/dist/runtime/composables/useYamlFieldTypes.js

@@ -0,0 +1,136 @@
+export const DEFAULT_FIELD_TYPES = [
+  {
+    type: "string",
+    label: "Text",
+    icon: "i-lucide-type",
+    defaultValue: "",
+    detect: (value) => typeof value === "string" && !isDateString(value) && !isDateTimeString(value)
+  },
+  {
+    type: "textarea",
+    label: "Long Text",
+    icon: "i-lucide-align-left",
+    defaultValue: "",
+    component: "textarea"
+  },
+  {
+    type: "number",
+    label: "Number",
+    icon: "i-lucide-hash",
+    defaultValue: 0,
+    detect: (value) => typeof value === "number"
+  },
+  {
+    type: "boolean",
+    label: "Boolean",
+    icon: "i-lucide-circle-check",
+    defaultValue: false,
+    detect: (value) => typeof value === "boolean"
+  },
+  {
+    type: "date",
+    label: "Date",
+    icon: "i-lucide-calendar",
+    defaultValue: () => /* @__PURE__ */ new Date(),
+    detect: (value) => isDateObject(value) || isDateString(value)
+  },
+  {
+    type: "datetime",
+    label: "Date & Time",
+    icon: "i-lucide-calendar-clock",
+    defaultValue: () => /* @__PURE__ */ new Date(),
+    detect: (value) => isDateTimeString(value)
+  },
+  {
+    type: "string-array",
+    label: "Tags",
+    icon: "i-lucide-tags",
+    defaultValue: [],
+    detect: (value) => isStringArray(value)
+  },
+  {
+    type: "array",
+    label: "Array",
+    icon: "i-lucide-list",
+    defaultValue: [],
+    detect: (value) => Array.isArray(value) && !isStringArray(value)
+  },
+  {
+    type: "object",
+    label: "Object",
+    icon: "i-lucide-box",
+    defaultValue: {},
+    detect: (value) => typeof value === "object" && value !== null && !Array.isArray(value) && !isDateObject(value)
+  },
+  {
+    type: "null",
+    label: "Null",
+    icon: "i-lucide-circle-slash",
+    defaultValue: null,
+    detect: (value) => value === null
+  }
+];
+function isDateObject(value) {
+  return value instanceof Date;
+}
+function isDateString(value) {
+  if (typeof value !== "string") return false;
+  return /^\d{4}-\d{2}-\d{2}$/.test(value);
+}
+function isDateTimeString(value) {
+  if (typeof value !== "string") return false;
+  return /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}/.test(value);
+}
+function isStringArray(value) {
+  return Array.isArray(value) && value.length > 0 && value.every((item) => typeof item === "string");
+}
+export function useYamlFieldTypes(customTypes) {
+  const fieldTypes = computed(() => {
+    const types = [...DEFAULT_FIELD_TYPES];
+    if (customTypes) {
+      for (const customType of customTypes) {
+        const existingIndex = types.findIndex((t) => t.type === customType.type);
+        if (existingIndex >= 0) {
+          types[existingIndex] = customType;
+        } else {
+          types.push(customType);
+        }
+      }
+    }
+    return types;
+  });
+  const getFieldType = (type) => {
+    return fieldTypes.value.find((t) => t.type === type);
+  };
+  const detectFieldType = (value) => {
+    for (const fieldType of fieldTypes.value) {
+      if (fieldType.detect && fieldType.detect(value)) {
+        return fieldType;
+      }
+    }
+    return fieldTypes.value.find((t) => t.type === "string");
+  };
+  const getDefaultValue = (type) => {
+    const fieldType = getFieldType(type);
+    if (!fieldType) return "";
+    return typeof fieldType.defaultValue === "function" ? fieldType.defaultValue() : fieldType.defaultValue;
+  };
+  const getIcon = (type) => {
+    return getFieldType(type)?.icon || "i-lucide-circle-question-mark";
+  };
+  const getTypeMenuItems = (onSelect) => {
+    return fieldTypes.value.map((fieldType) => ({
+      label: fieldType.label,
+      icon: fieldType.icon,
+      onSelect: () => onSelect(fieldType.type)
+    }));
+  };
+  return {
+    fieldTypes,
+    getFieldType,
+    detectFieldType,
+    getDefaultValue,
+    getIcon,
+    getTypeMenuItems
+  };
+}

package/dist/runtime/composables/useYamlFormData.d.ts

@@ -0,0 +1,24 @@
+import type { YamlFormData } from "../types/types.js";
+/**
+ * Composable for working with YAML form data
+ * Provides utilities for parsing, stringifying, and validating YAML
+ */
+export declare function useYamlFormData(): {
+    parseYaml: (yamlString: string) => YamlFormData;
+    stringifyYaml: (data: YamlFormData) => string;
+    validateYaml: (yamlString: string) => {
+        valid: boolean;
+        error?: string;
+    };
+    cloneYaml: (data: YamlFormData) => YamlFormData;
+    mergeYaml: (target: YamlFormData, source: YamlFormData) => YamlFormData;
+    getValueAtPath: (data: YamlFormData, path: string) => any;
+    setValueAtPath: (data: YamlFormData, path: string, value: any) => YamlFormData;
+    isEmpty: (data: YamlFormData) => boolean;
+    getAllKeys: (data: YamlFormData, prefix?: string) => string[];
+    diffYaml: (oldData: YamlFormData, newData: YamlFormData) => {
+        added: string[];
+        removed: string[];
+        modified: string[];
+    };
+};

package/dist/runtime/composables/useYamlFormData.js

@@ -0,0 +1,122 @@
+import YAML from "yaml";
+export function useYamlFormData() {
+  function parseYaml(yamlString) {
+    try {
+      return YAML.parse(yamlString) || {};
+    } catch (error) {
+      console.error("Failed to parse YAML:", error);
+      return {};
+    }
+  }
+  function stringifyYaml(data) {
+    try {
+      return YAML.stringify(data, {
+        indent: 2,
+        lineWidth: 0,
+        // Don't wrap lines
+        minContentWidth: 0
+      });
+    } catch (error) {
+      console.error("Failed to stringify YAML:", error);
+      return "";
+    }
+  }
+  function validateYaml(yamlString) {
+    try {
+      YAML.parse(yamlString);
+      return { valid: true };
+    } catch (error) {
+      return {
+        valid: false,
+        error: error?.message || "Invalid YAML"
+      };
+    }
+  }
+  function cloneYaml(data) {
+    return JSON.parse(JSON.stringify(data));
+  }
+  function mergeYaml(target, source) {
+    const result = { ...target };
+    for (const key in source) {
+      const targetValue = result[key];
+      const sourceValue = source[key];
+      if (typeof targetValue === "object" && !Array.isArray(targetValue) && targetValue !== null && typeof sourceValue === "object" && !Array.isArray(sourceValue) && sourceValue !== null) {
+        result[key] = mergeYaml(targetValue, sourceValue);
+      } else {
+        result[key] = sourceValue;
+      }
+    }
+    return result;
+  }
+  function getValueAtPath(data, path) {
+    const keys = path.split(/\.|\[|\]/).filter(Boolean);
+    let current = data;
+    for (const key of keys) {
+      if (current === null || current === void 0) return void 0;
+      current = current[key];
+    }
+    return current;
+  }
+  function setValueAtPath(data, path, value) {
+    const keys = path.split(/\.|\[|\]/).filter(Boolean);
+    const result = cloneYaml(data);
+    let current = result;
+    for (let i = 0; i < keys.length - 1; i++) {
+      const key = keys[i];
+      if (!key) continue;
+      if (!(key in current)) {
+        const nextKey = keys[i + 1];
+        if (nextKey) {
+          current[key] = /^\d+$/.test(nextKey) ? [] : {};
+        }
+      }
+      current = current[key];
+    }
+    const lastKey = keys[keys.length - 1];
+    if (lastKey) {
+      current[lastKey] = value;
+    }
+    return result;
+  }
+  function isEmpty(data) {
+    if (!data) return true;
+    return Object.keys(data).length === 0;
+  }
+  function getAllKeys(data, prefix = "") {
+    const keys = [];
+    for (const key in data) {
+      const fullKey = prefix ? `${prefix}.${key}` : key;
+      keys.push(fullKey);
+      const value = data[key];
+      if (typeof value === "object" && value !== null && !Array.isArray(value)) {
+        keys.push(...getAllKeys(value, fullKey));
+      }
+    }
+    return keys;
+  }
+  function diffYaml(oldData, newData) {
+    const oldKeys = getAllKeys(oldData);
+    const newKeys = getAllKeys(newData);
+    const added = newKeys.filter((key) => !oldKeys.includes(key));
+    const removed = oldKeys.filter((key) => !newKeys.includes(key));
+    const modified = newKeys.filter((key) => {
+      if (added.includes(key)) return false;
+      const oldValue = getValueAtPath(oldData, key);
+      const newValue = getValueAtPath(newData, key);
+      return JSON.stringify(oldValue) !== JSON.stringify(newValue);
+    });
+    return { added, removed, modified };
+  }
+  return {
+    parseYaml,
+    stringifyYaml,
+    validateYaml,
+    cloneYaml,
+    mergeYaml,
+    getValueAtPath,
+    setValueAtPath,
+    isEmpty,
+    getAllKeys,
+    diffYaml
+  };
+}

package/dist/runtime/server/tsconfig.json

@@ -0,0 +1,3 @@
+{
+  "extends": "../../../.nuxt/tsconfig.server.json",
+}

package/dist/runtime/types/types.d.ts

@@ -0,0 +1,30 @@
+export type YamlFormData<T extends object = {}> = {
+	title?: string;
+	description?: string;
+	date?: Date;
+	draft?: boolean;
+	tags?: string[];
+	categories?: string[];
+	image?: string;
+	slug?: string;
+	[key: string]: any;
+} & T
+
+/**
+ * YAML Field Type Definition
+ * Centralized schema for all field types supported by the YAML editor
+ */
+export interface YamlFieldType {
+	/** Unique type identifier */
+	type: string
+	/** Display label */
+	label: string
+	/** Lucide icon name */
+	icon: string
+	/** Default value when creating new field of this type */
+	defaultValue: any
+	/** Optional slot name for custom component rendering */
+	component?: string
+	/** Optional detection function for auto-typing existing values */
+	detect?: (value: any) => boolean
+}

package/dist/types.d.mts

@@ -0,0 +1,3 @@
+export { default } from './module.mjs'
+
+export { type ModuleOptions } from './module.mjs'

package/package.json

@@ -0,0 +1,68 @@
+{
+	"name": "@type32/yaml-editor-form",
+	"version": "1.0.0",
+	"description": "A powerful, schema-driven YAML/frontmatter editor for Nuxt v4 with Nuxt UI components. Supports custom field types, nested structures, and extensible type system.",
+	"repository": "https://github.com/CTRL-Neo-Studios/yaml-editor-form",
+	"license": "MIT",
+	"type": "module",
+	"exports": {
+		".": {
+			"types": "./dist/types.d.mts",
+			"import": "./dist/module.mjs"
+		}
+	},
+	"main": "./dist/module.mjs",
+	"typesVersions": {
+		"*": {
+			".": [
+				"./dist/types.d.mts"
+			]
+		}
+	},
+	"files": [
+		"dist"
+	],
+	"workspaces": [
+		"playground"
+	],
+	"scripts": {
+		"prepack": "bunx nuxt-module-build build",
+		"dev": "bun run dev:prepare && bunx nuxi dev playground",
+		"dev:build": "bunx nuxi build playground",
+		"dev:prepare": "bunx nuxt-module-build build --stub && bunx nuxt-module-build prepare && bunx nuxi prepare playground",
+		"release": "bun run prepack && bunx changelogen --release && bun publish && git push --follow-tags",
+		"lint": "bunx eslint .",
+		"test": "bunx vitest run",
+		"test:watch": "bunx vitest watch",
+		"test:types": "bunx vue-tsc --noEmit && cd playground && bunx vue-tsc --noEmit"
+	},
+	"dependencies": {
+		"@iconify-json/lucide": "^1.2.87",
+		"@iconify-json/simple-icons": "^1.2.68",
+		"@internationalized/date": "^3.10.1",
+		"@nuxt/icon": "2.2.1",
+		"@nuxt/kit": "^4.3.0",
+		"@nuxt/ui": "4.4.0",
+		"@tiptap/extension-collaboration": "^3.17.1",
+		"@tiptap/extension-node-range": "^3.17.1",
+		"@tiptap/y-tiptap": "^3.0.2",
+		"tailwindcss": "^4.1.18",
+		"yaml": "^2.8.2",
+		"yjs": "^13.6.29"
+	},
+	"devDependencies": {
+		"@nuxt/devtools": "^3.1.1",
+		"@nuxt/eslint-config": "^1.13.0",
+		"@nuxt/hints": "1.0.0-alpha.6",
+		"@nuxt/image": "2.0.0",
+		"@nuxt/module-builder": "^1.0.2",
+		"@nuxt/schema": "^4.3.0",
+		"@nuxt/test-utils": "^3.23.0",
+		"@types/node": "^25.0.10",
+		"changelogen": "^0.6.2",
+		"nuxt": "^4.3.0",
+		"typescript": "~5.9.3",
+		"vitest": "^4.0.18",
+		"vue-tsc": "^3.2.4"
+	}
+}