@sfxcode/formkit-primevue 2.3.0 → 2.3.2

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 sfxcode
+
+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/dist/composables/index.d.ts

@@ -1,4 +1,5 @@
 import { useFormKitInput } from './useFormKitInput';
 import { useFormKitSchema } from './useFormKitSchema';
+import { useInputEditor } from './useInputEditor';
 import { useInputEditorSchema } from './useInputEditorSchema';
-export { useFormKitInput, useFormKitSchema, useInputEditorSchema, };
+export { useFormKitInput, useFormKitSchema, useInputEditor, useInputEditorSchema, };

package/dist/composables/index.js

@@ -15,6 +15,12 @@ Object.defineProperty(exports, "useFormKitSchema", {
     return _useFormKitSchema.useFormKitSchema;
   }
 });
+Object.defineProperty(exports, "useInputEditor", {
+  enumerable: true,
+  get: function () {
+    return _useInputEditor.useInputEditor;
+  }
+});
 Object.defineProperty(exports, "useInputEditorSchema", {
   enumerable: true,
   get: function () {
@@ -23,4 +29,5 @@ Object.defineProperty(exports, "useInputEditorSchema", {
 });
 var _useFormKitInput = require("./useFormKitInput");
 var _useFormKitSchema = require("./useFormKitSchema");
+var _useInputEditor = require("./useInputEditor");
 var _useInputEditorSchema = require("./useInputEditorSchema");

package/dist/composables/index.mjs

@@ -1,8 +1,10 @@
 import { useFormKitInput } from "./useFormKitInput.mjs";
 import { useFormKitSchema } from "./useFormKitSchema.mjs";
+import { useInputEditor } from "./useInputEditor.mjs";
 import { useInputEditorSchema } from "./useInputEditorSchema.mjs";
 export {
   useFormKitInput,
   useFormKitSchema,
+  useInputEditor,
   useInputEditorSchema
 };

package/dist/composables/useInputEditor.d.ts

@@ -0,0 +1,8 @@
+export declare function useInputEditor(): {
+    primeInputNames: string[];
+    generateSchemaItemId: () => string;
+    editorDataToSchema: (data: any) => any;
+    editorDataToJson: (data: any) => string;
+    editorDataToCode: (data: any) => string;
+    schemaToEditorData: (schema: any) => any;
+};

package/dist/composables/useInputEditor.js

@@ -0,0 +1,109 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useInputEditor = useInputEditor;
+function useInputEditor() {
+  const primeInputWithOptionNames = ["CascadeSelect", "Listbox", "MultiSelect", "RadioButton", "Select", "SelectButton", "TreeSelect"];
+  const primeInputNames = [...primeInputWithOptionNames, "AutoComplete", "Checkbox", "ColorPicker", "DatePicker", "Editor", "InputMask", "InputNumber", "InputOtp", "InputText", "Knob", "Password", "Rating", "Slider", "Textarea", "ToggleButton", "ToggleSwitch"].sort();
+  function generateSchemaItemId() {
+    return `id-${Math.random().toString(36).substring(2, 15)}`;
+  }
+  function editorDataToSchema(data) {
+    if (!data) return {};
+    const formkitInput = data?._dollar_formkit;
+    let tempData = {};
+    if (data.prime && data.prime?.length > 0) {
+      const mapped = data.prime?.map(entry => {
+        const key = entry.prime_key;
+        let value = entry.prime_value;
+        if (formkitInput === "primeInputOtp" && key === "length") value = +value;
+        return [key, value];
+      });
+      tempData = Object.assign(...mapped.map(([key, val]) => ({
+        [key]: val
+      })));
+    }
+    const readonlyValue = data.readonly ? true : void 0;
+    const disabledValue = data.disabled ? true : void 0;
+    const preserveValue = data.preserve ? true : void 0;
+    const defaultObject = {
+      readonly: readonlyValue,
+      disabled: disabledValue,
+      preserve: preserveValue
+    };
+    const undefinedObject = {
+      prime: void 0,
+      schemaResultFormKey: void 0,
+      _dollar_formkit: void 0,
+      slots: void 0,
+      selectButton: void 0
+    };
+    const useOptions = primeInputWithOptionNames.map(s => `prime${s}`).includes(formkitInput);
+    let result = {};
+    if (useOptions) result = {
+      ...data,
+      $formkit: formkitInput,
+      ...tempData,
+      ...undefinedObject,
+      ...defaultObject,
+      optionLabel: "label",
+      optionValue: "value"
+    };else result = {
+      ...data,
+      $formkit: formkitInput,
+      ...tempData,
+      ...undefinedObject,
+      ...defaultObject,
+      options: void 0
+    };
+    return result;
+  }
+  function dataToSchema(data) {
+    const schema = editorDataToSchema(data);
+    if (schema.options) {
+      const options = schema.options.map(o => JSON.parse(JSON.stringify(o)));
+      return {
+        ...schema,
+        options
+      };
+    } else {
+      return schema;
+    }
+  }
+  function editorDataToJson(data) {
+    return JSON.stringify(dataToSchema(data));
+  }
+  function objectToString(data) {
+    return `{${Object.entries(data).map(([key, value]) => {
+      if (key === "options" && value.length > 0) {
+        let result = "[";
+        value.forEach(o => result = `${result + objectToString(o)}, `);
+        return `${key}: ${result.substring(0, result.length - 2)}]`;
+      } else if (key === "primeInputOtp") {
+        return `${key}: ${value}`;
+      } else {
+        return `${key}: '${value}'`;
+      }
+    }).join()}}`;
+  }
+  function editorDataToObject(data) {
+    return objectToString(JSON.parse(editorDataToJson(data)));
+  }
+  function schemaToEditorData(schema) {
+    const formkitInput = schema?.$formkit;
+    return {
+      ...schema,
+      _dollar_formkit: formkitInput
+    };
+  }
+  return {
+    primeInputNames,
+    generateSchemaItemId,
+    editorDataToSchema,
+    editorDataToJson,
+    editorDataToCode: editorDataToObject,
+    schemaToEditorData
+  };
+}

package/dist/composables/useInputEditor.mjs

@@ -0,0 +1,68 @@
+export function useInputEditor() {
+  const primeInputWithOptionNames = ["CascadeSelect", "Listbox", "MultiSelect", "RadioButton", "Select", "SelectButton", "TreeSelect"];
+  const primeInputNames = [...primeInputWithOptionNames, "AutoComplete", "Checkbox", "ColorPicker", "DatePicker", "Editor", "InputMask", "InputNumber", "InputOtp", "InputText", "Knob", "Password", "Rating", "Slider", "Textarea", "ToggleButton", "ToggleSwitch"].sort();
+  function generateSchemaItemId() {
+    return `id-${Math.random().toString(36).substring(2, 15)}`;
+  }
+  function editorDataToSchema(data) {
+    if (!data)
+      return {};
+    const formkitInput = data?._dollar_formkit;
+    let tempData = {};
+    if (data.prime && data.prime?.length > 0) {
+      const mapped = data.prime?.map((entry) => {
+        const key = entry.prime_key;
+        let value = entry.prime_value;
+        if (formkitInput === "primeInputOtp" && key === "length")
+          value = +value;
+        return [key, value];
+      });
+      tempData = Object.assign(...mapped.map(([key, val]) => ({ [key]: val })));
+    }
+    const readonlyValue = data.readonly ? true : void 0;
+    const disabledValue = data.disabled ? true : void 0;
+    const preserveValue = data.preserve ? true : void 0;
+    const defaultObject = { readonly: readonlyValue, disabled: disabledValue, preserve: preserveValue };
+    const undefinedObject = { prime: void 0, schemaResultFormKey: void 0, _dollar_formkit: void 0, slots: void 0, selectButton: void 0 };
+    const useOptions = primeInputWithOptionNames.map((s) => `prime${s}`).includes(formkitInput);
+    let result = {};
+    if (useOptions)
+      result = { ...data, $formkit: formkitInput, ...tempData, ...undefinedObject, ...defaultObject, optionLabel: "label", optionValue: "value" };
+    else
+      result = { ...data, $formkit: formkitInput, ...tempData, ...undefinedObject, ...defaultObject, options: void 0 };
+    return result;
+  }
+  function dataToSchema(data) {
+    const schema = editorDataToSchema(data);
+    if (schema.options) {
+      const options = schema.options.map((o) => JSON.parse(JSON.stringify(o)));
+      return { ...schema, options };
+    } else {
+      return schema;
+    }
+  }
+  function editorDataToJson(data) {
+    return JSON.stringify(dataToSchema(data));
+  }
+  function objectToString(data) {
+    return `{${Object.entries(data).map(([key, value]) => {
+      if (key === "options" && value.length > 0) {
+        let result = "[";
+        value.forEach((o) => result = `${result + objectToString(o)}, `);
+        return `${key}: ${result.substring(0, result.length - 2)}]`;
+      } else if (key === "primeInputOtp") {
+        return `${key}: ${value}`;
+      } else {
+        return `${key}: '${value}'`;
+      }
+    }).join()}}`;
+  }
+  function editorDataToObject(data) {
+    return objectToString(JSON.parse(editorDataToJson(data)));
+  }
+  function schemaToEditorData(schema) {
+    const formkitInput = schema?.$formkit;
+    return { ...schema, _dollar_formkit: formkitInput };
+  }
+  return { primeInputNames, generateSchemaItemId, editorDataToSchema, editorDataToJson, editorDataToCode: editorDataToObject, schemaToEditorData };
+}

package/dist/composables/useInputEditorSchema.d.ts

@@ -56,13 +56,8 @@ export declare function useInputEditorSchema(): {
         id?: undefined;
         allowEmpty?: undefined;
     })[];
-    primeInputNames: string[];
     primeInputOptions: (list: string[]) => {
         label: string;
         value: string;
     }[];
-    editorDataToSchema: (data: any) => any;
-    editorDataToJson: (data: any) => string;
-    editorDataToCode: (data: any) => string;
-    schemaToEditorData: (schema: any) => any;
 };

package/dist/composables/useInputEditorSchema.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.useInputEditorSchema = useInputEditorSchema;
 var _useFormKitSchema = require("./useFormKitSchema");
+var _useInputEditor = require("./useInputEditor");
 function useInputEditorSchema() {
   const {
     addElement,
@@ -12,6 +13,9 @@ function useInputEditorSchema() {
     addListGroup,
     addComponent
   } = (0, _useFormKitSchema.useFormKitSchema)();
+  const {
+    primeInputNames
+  } = (0, _useInputEditor.useInputEditor)();
   function addFlexElement(children) {
     return addElement("div", children, {
       style: "max-width: 40rem;display: flex;gap: 1rem;"
@@ -41,8 +45,6 @@ function useInputEditorSchema() {
       style: "padding-top: 1.5rem;"
     });
   }
-  const primeInputWithOptionNames = ["CascadeSelect", "Listbox", "MultiSelect", "RadioButton", "Select", "SelectButton", "TreeSelect"];
-  const primeInputNames = [...primeInputWithOptionNames, "AutoComplete", "Checkbox", "ColorPicker", "DatePicker", "Editor", "InputMask", "InputNumber", "InputOtp", "InputText", "Knob", "Password", "Rating", "Slider", "Textarea", "ToggleButton", "ToggleSwitch"].sort();
   function primeInputOptions(list) {
     return list.map(name => {
       return {
@@ -87,66 +89,6 @@ function useInputEditorSchema() {
     label: "Right",
     value: "right"
   }];
-  function editorDataToSchema(data) {
-    const formkitInput = data?._dollar_formkit;
-    let tempData = {};
-    if (data.prime?.length > 0) {
-      const mapped = data.prime?.map(entry => {
-        const key = entry.prime_key;
-        let value = entry.prime_value;
-        if (formkitInput === "primeInputOtp" && key === "length") value = +value;
-        return [key, value];
-      });
-      tempData = Object.assign(...mapped.map(([key, val]) => ({
-        [key]: val
-      })));
-    }
-    const readonlyValue = data.readonly ? true : void 0;
-    const disabledValue = data.disabled ? true : void 0;
-    const preserveValue = data.preserve ? true : void 0;
-    const defaultObject = {
-      readonly: readonlyValue,
-      disabled: disabledValue,
-      preserve: preserveValue
-    };
-    const undefinedObject = {
-      prime: void 0,
-      schemaResultFormKey: void 0,
-      _dollar_formkit: void 0,
-      slots: void 0,
-      selectButton: void 0
-    };
-    const useOptions = primeInputWithOptionNames.map(s => `prime${s}`).includes(formkitInput);
-    if (useOptions) return {
-      ...data,
-      $formkit: formkitInput,
-      ...tempData,
-      ...undefinedObject,
-      ...defaultObject,
-      optionLabel: "label",
-      optionValue: "value"
-    };else return {
-      ...data,
-      $formkit: formkitInput,
-      ...tempData,
-      ...undefinedObject,
-      ...defaultObject,
-      options: void 0
-    };
-  }
-  function editorDataToJson(data) {
-    return JSON.stringify(editorDataToSchema(data));
-  }
-  function editorDataToObject(data) {
-    return `{${Object.entries(JSON.parse(editorDataToJson(data))).map(([key, value]) => `${key}: '${value}'`).join()}}`;
-  }
-  function schemaToEditorData(schema) {
-    const formkitInput = schema?.$formkit;
-    return {
-      ...schema,
-      _dollar_formkit: formkitInput
-    };
-  }
   function editorSchema(inputOptions = primeInputOptions(primeInputNames)) {
     return [addGridElement([{
       $formkit: "primeSelect",
@@ -345,11 +287,6 @@ function useInputEditorSchema() {
   }
   return {
     editorSchema,
-    primeInputNames,
-    primeInputOptions,
-    editorDataToSchema,
-    editorDataToJson,
-    editorDataToCode: editorDataToObject,
-    schemaToEditorData
+    primeInputOptions
   };
 }

package/dist/composables/useInputEditorSchema.mjs

@@ -1,6 +1,8 @@
 import { useFormKitSchema } from "./useFormKitSchema.mjs";
+import { useInputEditor } from "./useInputEditor.mjs";
 export function useInputEditorSchema() {
   const { addElement, addList, addListGroup, addComponent } = useFormKitSchema();
+  const { primeInputNames } = useInputEditor();
   function addFlexElement(children) {
     return addElement("div", children, { style: "max-width: 40rem;display: flex;gap: 1rem;" });
   }
@@ -20,8 +22,6 @@ export function useInputEditorSchema() {
       addElement("span", [], { style: "margin-left: 0.5rem;margin-right: 2.5rem;" }, "$index == $node.value.length -1")
     ], { style: "padding-top: 1.5rem;" });
   }
-  const primeInputWithOptionNames = ["CascadeSelect", "Listbox", "MultiSelect", "RadioButton", "Select", "SelectButton", "TreeSelect"];
-  const primeInputNames = [...primeInputWithOptionNames, "AutoComplete", "Checkbox", "ColorPicker", "DatePicker", "Editor", "InputMask", "InputNumber", "InputOtp", "InputText", "Knob", "Password", "Rating", "Slider", "Textarea", "ToggleButton", "ToggleSwitch"].sort();
   function primeInputOptions(list) {
     return list.map((name) => {
       return { label: name, value: `prime${name}` };
@@ -44,40 +44,6 @@ export function useInputEditorSchema() {
     { label: "Left", value: "left" },
     { label: "Right", value: "right" }
   ];
-  function editorDataToSchema(data) {
-    const formkitInput = data?._dollar_formkit;
-    let tempData = {};
-    if (data.prime?.length > 0) {
-      const mapped = data.prime?.map((entry) => {
-        const key = entry.prime_key;
-        let value = entry.prime_value;
-        if (formkitInput === "primeInputOtp" && key === "length")
-          value = +value;
-        return [key, value];
-      });
-      tempData = Object.assign(...mapped.map(([key, val]) => ({ [key]: val })));
-    }
-    const readonlyValue = data.readonly ? true : void 0;
-    const disabledValue = data.disabled ? true : void 0;
-    const preserveValue = data.preserve ? true : void 0;
-    const defaultObject = { readonly: readonlyValue, disabled: disabledValue, preserve: preserveValue };
-    const undefinedObject = { prime: void 0, schemaResultFormKey: void 0, _dollar_formkit: void 0, slots: void 0, selectButton: void 0 };
-    const useOptions = primeInputWithOptionNames.map((s) => `prime${s}`).includes(formkitInput);
-    if (useOptions)
-      return { ...data, $formkit: formkitInput, ...tempData, ...undefinedObject, ...defaultObject, optionLabel: "label", optionValue: "value" };
-    else
-      return { ...data, $formkit: formkitInput, ...tempData, ...undefinedObject, ...defaultObject, options: void 0 };
-  }
-  function editorDataToJson(data) {
-    return JSON.stringify(editorDataToSchema(data));
-  }
-  function editorDataToObject(data) {
-    return `{${Object.entries(JSON.parse(editorDataToJson(data))).map(([key, value]) => `${key}: '${value}'`).join()}}`;
-  }
-  function schemaToEditorData(schema) {
-    const formkitInput = schema?.$formkit;
-    return { ...schema, _dollar_formkit: formkitInput };
-  }
   function editorSchema(inputOptions = primeInputOptions(primeInputNames)) {
     return [
       addGridElement([
@@ -313,5 +279,5 @@ export function useInputEditorSchema() {
       ], true, "$get(selectButton).value === 'showPrime'", { key: "schema_prime", preserve: true })
     ];
   }
-  return { editorSchema, primeInputNames, primeInputOptions, editorDataToSchema, editorDataToJson, editorDataToCode: editorDataToObject, schemaToEditorData };
+  return { editorSchema, primeInputOptions };
 }

package/dist/index.d.ts

@@ -1,3 +1,3 @@
-import { useFormKitSchema, useInputEditorSchema } from './composables';
+import { useFormKitSchema, useInputEditor, useInputEditorSchema } from './composables';
 import { primeInputs } from './definitions';
-export { useFormKitSchema, useInputEditorSchema, primeInputs, };
+export { useFormKitSchema, useInputEditor, useInputEditorSchema, primeInputs, };

package/dist/index.js

@@ -15,6 +15,12 @@ Object.defineProperty(exports, "useFormKitSchema", {
     return _composables.useFormKitSchema;
   }
 });
+Object.defineProperty(exports, "useInputEditor", {
+  enumerable: true,
+  get: function () {
+    return _composables.useInputEditor;
+  }
+});
 Object.defineProperty(exports, "useInputEditorSchema", {
   enumerable: true,
   get: function () {

package/dist/index.mjs

@@ -1,7 +1,8 @@
-import { useFormKitSchema, useInputEditorSchema } from "./composables/index.mjs";
+import { useFormKitSchema, useInputEditor, useInputEditorSchema } from "./composables/index.mjs";
 import { primeInputs } from "./definitions/index.mjs";
 export {
   useFormKitSchema,
+  useInputEditor,
   useInputEditorSchema,
   primeInputs
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@sfxcode/formkit-primevue",
   "type": "module",
-  "version": "2.3.0",
+  "version": "2.3.2",
   "packageManager": "pnpm@9.4.0+sha256.b6fd0bfda555e7e584ad7e56b30c68b01d5a04f9ee93989f4b93ca8473c49c74",
   "author": {
     "name": "Tom",
@@ -72,7 +72,7 @@
     "dev": "vite serve dev",
     "dev:build": "vite build dev",
     "dev:preview": "vite preview dev",
-    "release": "npm run lint && npm run build && changelogen --release && npm publish --access public && git push --follow-tags",
+    "release": "npm run lint && npm run build && changelogen --patch --release  && npm publish --access public && git push --follow-tags",
     "lint": "eslint ./src",
     "lint:fix": "eslint . --fix",
     "prepublishOnly": "pnpm build",
@@ -88,21 +88,22 @@
   },
   "dependencies": {
     "@formkit/addons": "^1.6.5",
+    "@formkit/drag-and-drop": "^0.1.6",
     "@formkit/i18n": "^1.6.5",
     "@formkit/vue": "^1.6.5",
     "primeicons": "^7.0.0",
-    "primevue": "4.0.0"
+    "primevue": "4.0.1"
   },
   "devDependencies": {
-    "@antfu/eslint-config": "2.23.0",
+    "@antfu/eslint-config": "2.23.2",
     "@formkit/core": "^1.6.5",
-    "@primevue/themes": "4.0.0",
+    "@primevue/themes": "4.0.1",
     "@types/node": "^20.14.11",
     "@unocss/preset-icons": "0.61.5",
     "@unocss/preset-uno": "0.61.5",
     "@vitejs/plugin-vue": "^5.0.5",
-    "@vitest/coverage-v8": "^2.0.3",
-    "@vitest/ui": "^2.0.3",
+    "@vitest/coverage-v8": "^2.0.4",
+    "@vitest/ui": "^2.0.4",
     "@vue/compiler-sfc": "^3.4.33",
     "@vue/server-renderer": "^3.4.33",
     "@vue/test-utils": "^2.4.6",
@@ -119,7 +120,7 @@
     "json-editor-vue": "^0.15.1",
     "mkdist": "^1.5.4",
     "quill": "^2.0.2",
-    "sass": "^1.77.8",
+    "sass": "^1.76.0",
     "tslib": "^2.6.3",
     "typescript": "^5.5.3",
     "unbuild": "2.0.0",
@@ -133,10 +134,10 @@
     "vite-plugin-pages": "^0.32.3",
     "vite-ssg": "^0.23.8",
     "vitepress": "1.3.1",
-    "vitest": "^2.0.3",
+    "vitest": "^2.0.4",
     "vue": "^3.4.33",
     "vue-demi": "^0.14.8",
     "vue-router": "^4.4.0",
-    "vue-tsc": "^2.0.26"
+    "vue-tsc": "^2.0.28"
   }
 }