@sfxcode/formkit-primevue 0.5.3 → 0.7.0

package/dist/formkit-primevue.es.js

@@ -1,34 +1,3 @@
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
 import { defineComponent, getCurrentInstance, watch, watchEffect, reactive, h, ref, inject, computed, provide, toRef, onUnmounted, isRef, isReactive, toRaw, markRaw, createTextVNode, resolveComponent, openBlock, createElementBlock, normalizeClass, unref, createCommentVNode, createVNode, createBlock, Fragment, toDisplayString } from "vue";
 function token() {
   return Math.random().toString(36).substring(2, 15);
@@ -154,7 +123,7 @@ function rmEscapes(str) {
 }
 function nodeProps(...sets) {
   return sets.reduce((valid, props2) => {
-    const _a = props2, { value, name, modelValue, config, plugins } = _a, validProps = __objRest(_a, ["value", "name", "modelValue", "config", "plugins"]);
+    const { value, name, modelValue, config, plugins, ...validProps } = props2;
     return Object.assign(valid, validProps);
   }, {});
 }
@@ -312,9 +281,9 @@ function createEmitter() {
       return;
     }
     if (listeners.has(event.name)) {
-      listeners.get(event.name).forEach((wrapper) => {
-        if (event.origin === node || wrapper.modifiers.includes("deep")) {
-          wrapper.listener(event);
+      listeners.get(event.name).forEach((wrapper2) => {
+        if (event.origin === node || wrapper2.modifiers.includes("deep")) {
+          wrapper2.listener(event);
         }
       });
     }
@@ -325,13 +294,13 @@ function createEmitter() {
   emitter.on = (eventName, listener) => {
     const [event, ...modifiers] = eventName.split(".");
     const receipt = listener.receipt || token();
-    const wrapper = {
+    const wrapper2 = {
       modifiers,
       event,
       listener,
       receipt
     };
-    listeners.has(event) ? listeners.get(event).push(wrapper) : listeners.set(event, [wrapper]);
+    listeners.has(event) ? listeners.get(event).push(wrapper2) : listeners.set(event, [wrapper2]);
     receipts2.has(receipt) ? receipts2.get(receipt).push(event) : receipts2.set(receipt, [event]);
     return receipt;
   };
@@ -341,7 +310,7 @@ function createEmitter() {
       (_a = receipts2.get(receipt)) === null || _a === void 0 ? void 0 : _a.forEach((event) => {
         const eventListeners = listeners.get(event);
         if (Array.isArray(eventListeners)) {
-          listeners.set(event, eventListeners.filter((wrapper) => wrapper.receipt !== receipt));
+          listeners.set(event, eventListeners.filter((wrapper2) => wrapper2.receipt !== receipt));
         }
       });
       receipts2.delete(receipt);
@@ -410,13 +379,14 @@ function error(code, data = {}) {
   throw Error(errorHandler.dispatch({ code, data }).message);
 }
 function createMessage(conf, node) {
-  const m = __spreadValues({
+  const m = {
     blocking: false,
     key: token(),
     meta: {},
     type: "state",
-    visible: true
-  }, conf);
+    visible: true,
+    ...conf
+  };
   if (node && m.value && m.meta.localize !== false) {
     m.value = node.t(m);
     m.meta.locale = node.config.locale;
@@ -498,7 +468,7 @@ function setMessage(messageStore, store, node, message2) {
 }
 function touchMessages(messageStore, store) {
   for (const key in messageStore) {
-    const message2 = __spreadValues({}, messageStore[key]);
+    const message2 = { ...messageStore[key] };
     store.set(message2);
   }
 }
@@ -758,7 +728,7 @@ function clearState(node) {
       if (message2.type === "error" || message2.type === "ui" && key === "incomplete") {
         n.store.remove(key);
       } else if (message2.type === "state") {
-        n.store.set(__spreadProps(__spreadValues({}, message2), { value: false }));
+        n.store.set({ ...message2, value: false });
       }
     }
   };
@@ -994,6 +964,14 @@ function define(node, context, definition) {
     type: node.type,
     value: context.value
   });
+  if (definition.forceTypeProp) {
+    if (node.props.type)
+      node.props.originalType = node.props.type;
+    context.props.type = definition.forceTypeProp;
+  }
+  if (definition.family) {
+    context.props.family = definition.family;
+  }
   if (definition.features) {
     definition.features.forEach((feature) => feature(node));
   }
@@ -1005,7 +983,7 @@ function define(node, context, definition) {
 function addProps(node, context, props2) {
   var _a;
   if (node.props.attrs) {
-    const attrs = __spreadValues({}, node.props.attrs);
+    const attrs = { ...node.props.attrs };
     node.props._emit = false;
     for (const attr in attrs) {
       const camelName = camel(attr);
@@ -1314,15 +1292,16 @@ function resetValue(node, _context, value) {
 }
 function setErrors$1(node, _context, localErrors, childErrors) {
   const sourceKey = `${node.name}-set`;
-  createMessages(node, localErrors, childErrors).forEach((errors2) => {
-    node.store.apply(errors2, (message2) => message2.meta.source === sourceKey);
+  const errors2 = node.hook.setErrors.dispatch({ localErrors, childErrors });
+  createMessages(node, errors2.localErrors, errors2.childErrors).forEach((errors3) => {
+    node.store.apply(errors3, (message2) => message2.meta.source === sourceKey);
   });
   return node;
 }
-function clearErrors$1(node, context, clearChildErrors = true) {
+function clearErrors$1(node, context, clearChildErrors = true, sourceKey) {
   setErrors$1(node, context, []);
   if (clearChildErrors) {
-    const sourceKey = `${node.name}-set`;
+    sourceKey = sourceKey || `${node.name}-set`;
     node.walk((child) => {
       child.store.filter((message2) => {
         return !(message2.type === "error" && message2.meta && message2.meta.source === sourceKey);
@@ -1489,11 +1468,11 @@ function sugar(node) {
     };
   }
   if (isSugar(node)) {
-    const _a = node, { $formkit: type, for: iterator, if: condition, children, key, bind } = _a, props2 = __objRest(_a, ["$formkit", "for", "if", "children", "key", "bind"]);
+    const { $formkit: type, for: iterator, if: condition, children, bind, ...props2 } = node;
     return Object.assign({
       $cmp: "FormKit",
-      props: __spreadProps(__spreadValues({}, props2), { type })
-    }, condition ? { if: condition } : {}, iterator ? { for: iterator } : {}, children ? { children } : {}, key ? { key } : {}, bind ? { bind } : {});
+      props: { ...props2, type }
+    }, condition ? { if: condition } : {}, iterator ? { for: iterator } : {}, children ? { children } : {}, bind ? { bind } : {});
   }
   return node;
 }
@@ -1768,64 +1747,56 @@ function compile(expr) {
     provide: provide2
   });
 }
-const outer = composable("outer", () => ({
+const FORMKIT_VERSION = "1.0.0-beta.10";
+const outer = createSection("outer", () => ({
   $el: "div",
   attrs: {
-    class: "$classes.outer",
+    key: "$id",
+    "data-family": "$family || undefined",
     "data-type": "$type",
-    "data-multiple": "$attrs.multiple",
+    "data-multiple": '$attrs.multiple || ($type != "select" && $options != undefined) || undefined',
     "data-disabled": "$disabled || undefined",
     "data-complete": "$state.complete || undefined",
     "data-invalid": "$state.valid === false && $state.validationVisible || undefined",
     "data-errors": "$state.errors || undefined",
-    "data-submitted": "$state.submitted || undefined"
-  }
-}));
-const wrapper$2 = composable("wrapper", () => ({
-  $el: "div",
-  attrs: {
-    class: "$classes.wrapper"
-  }
-}));
-const inner = composable("inner", () => ({
-  $el: "div",
+    "data-submitted": "$state.submitted || undefined",
+    "data-prefix-icon": "$_rawPrefixIcon !== undefined || undefined",
+    "data-suffix-icon": "$_rawSuffixIcon !== undefined || undefined",
+    "data-prefix-icon-click": "$onPrefixIconClick !== undefined || undefined",
+    "data-suffix-icon-click": "$onSuffixIconClick !== undefined || undefined"
+  }
+}), true);
+const inner = createSection("inner", "div");
+const wrapper = createSection("wrapper", "div");
+const label = createSection("label", () => ({
+  $el: "label",
+  if: "$label",
   attrs: {
-    class: "$classes.inner"
+    for: "$id"
   }
 }));
-const help = (schema = {}, children = [], target = "help", cond = "$help") => ({
-  if: `$slots.${target}`,
-  then: `$slots.${target}`,
-  else: extend({
-    $el: "div",
-    attrs: {
-      id: `$: "help-" + ${target == "optionHelp" ? "$option.attrs.id" : "$id"}`,
-      class: `$classes.${target}`
-    },
-    if: cond,
-    children
-  }, schema)
-});
-const messages = composable("messages", () => ({
+const messages = createSection("messages", () => ({
   $el: "ul",
-  if: "$fns.length($messages)",
-  attrs: {
-    class: "$classes.messages",
-    "aria-live": '$type === "form" && "assertive" || "polite"'
-  }
+  if: "$fns.length($messages)"
 }));
-const message = composable("message", () => ({
+const message = createSection("message", () => ({
   $el: "li",
   for: ["message", "$messages"],
   attrs: {
     key: "$message.key",
-    class: "$classes.message",
     id: `$id + '-' + $message.key`,
     "data-message-type": "$message.type"
   }
 }));
-const prefix = composable("prefix", () => ({ $el: null }));
-const suffix = composable("suffix", () => ({ $el: null }));
+const prefix = createSection("prefix", null);
+const suffix = createSection("suffix", null);
+const help = createSection("help", () => ({
+  $el: "div",
+  if: "$help",
+  attrs: {
+    id: '$: "help-" + $id'
+  }
+}));
 function isSchemaObject(schema) {
   return typeof schema === "object" && ("$el" in schema || "$cmp" in schema || "$formkit" in schema);
 }
@@ -1837,56 +1808,43 @@ function extendSchema(schema, extension = {}) {
   }
   return extend(schema, extension);
 }
-function composable(key, schema) {
-  return (extendWith = {}, children = void 0) => {
-    const root = typeof schema === "function" ? schema(children) : typeof schema === "object" ? clone(schema) : schema;
-    const isObj = isSchemaObject(root);
-    if (isObj && !("children" in root) && children) {
-      if (Array.isArray(children)) {
-        if (children.length) {
-          root.children = children;
+function useSchema(inputSection) {
+  return outer(wrapper(label("$label"), inner(prefix(), inputSection(), suffix())), help("$help"), messages(message("$message.value")));
+}
+function createSection(section, el, root = false) {
+  return (...children) => {
+    const extendable = (extensions) => {
+      const node = !el || typeof el === "string" ? { $el: el } : el();
+      if (isDOM(node) || isComponent$1(node)) {
+        if (!node.meta) {
+          node.meta = { section };
+        }
+        if (children.length && !node.children) {
+          node.children = [
+            ...children.map((child) => typeof child === "string" ? child : child(extensions))
+          ];
+        }
+        if (isDOM(node)) {
+          node.attrs = {
+            class: `$classes.${section}`,
+            ...node.attrs || {}
+          };
         }
-      } else {
-        root.children = [children];
       }
-    }
-    const extended = extendSchema(root, extendWith);
-    return {
-      if: `$slots.${key}`,
-      then: `$slots.${key}`,
-      else: Array.isArray(extended) ? extended : [extended]
+      return {
+        if: `$slots.${section}`,
+        then: `$slots.${section}`,
+        else: section in extensions ? extendSchema(node, extensions[section]) : node
+      };
     };
+    return root ? createRoot(extendable) : extendable;
   };
 }
-function useSchema(inputSchema) {
-  return (extensions = {}) => {
-    const input2 = composable("input", inputSchema)(extensions.input);
-    return [
-      outer(extensions.outer, [
-        wrapper$2(extensions.wrapper, [
-          label(extensions.label, "$label"),
-          inner(extensions.inner, [
-            prefix(extensions.prefix),
-            ...Array.isArray(input2) ? input2 : [input2],
-            suffix(extensions.suffix)
-          ])
-        ]),
-        help(extensions.help, "$help"),
-        messages(extensions.messages, [
-          message(extensions.message, "$message.value")
-        ])
-      ])
-    ];
+function createRoot(rootSection) {
+  return (extensions) => {
+    return [rootSection(extensions)];
   };
 }
-const label = composable("label", () => ({
-  $el: "label",
-  if: "$label",
-  attrs: {
-    for: "$id",
-    class: "$classes.label"
-  }
-}));
 createMessage({
   type: "state",
   blocking: true,
@@ -1894,6 +1852,88 @@ createMessage({
   value: true,
   key: "validating"
 });
+let documentStyles = void 0;
+const themeLoaded = new Promise((res) => {
+});
+const isClient = typeof window !== "undefined" && typeof fetch !== "undefined";
+documentStyles = isClient ? getComputedStyle(document.documentElement) : void 0;
+const iconRegistry = {};
+const iconRequests = {};
+function createIconHandler(iconLoader, iconLoaderUrl) {
+  return (iconName) => {
+    if (typeof iconName === "boolean") {
+      return;
+    }
+    if (iconName.startsWith("<svg")) {
+      return iconName;
+    }
+    if (typeof iconName !== "string")
+      return;
+    const icon = iconRegistry[iconName];
+    const isDefault = iconName.startsWith("default:");
+    iconName = isDefault ? iconName.split(":")[1] : iconName;
+    let loadedIcon = void 0;
+    if (icon || iconName in iconRegistry) {
+      return icon;
+    } else if (!iconRequests[iconName]) {
+      loadedIcon = getIconFromStylesheet(iconName);
+      loadedIcon = isClient && typeof loadedIcon === "undefined" ? Promise.resolve(loadedIcon) : loadedIcon;
+      if (loadedIcon instanceof Promise) {
+        iconRequests[iconName] = loadedIcon.then((iconValue) => {
+          if (!iconValue && typeof iconName === "string" && !isDefault) {
+            return loadedIcon = typeof iconLoader === "function" ? iconLoader(iconName) : getRemoteIcon(iconName, iconLoaderUrl);
+          }
+          return iconValue;
+        }).then((finalIcon) => {
+          if (typeof iconName === "string") {
+            iconRegistry[isDefault ? `default:${iconName}` : iconName] = finalIcon;
+          }
+          return finalIcon;
+        });
+      } else if (typeof loadedIcon === "string") {
+        iconRegistry[isDefault ? `default:${iconName}` : iconName] = loadedIcon;
+        return loadedIcon;
+      }
+    }
+    return iconRequests[iconName];
+  };
+}
+function getIconFromStylesheet(iconName) {
+  if (!isClient)
+    return;
+  {
+    return themeLoaded.then(() => {
+      return loadStylesheetIcon(iconName);
+    });
+  }
+}
+function loadStylesheetIcon(iconName) {
+  const cssVarIcon = documentStyles === null || documentStyles === void 0 ? void 0 : documentStyles.getPropertyValue(`--fk-icon-${iconName}`);
+  if (cssVarIcon) {
+    const icon = atob(cssVarIcon);
+    if (icon.startsWith("<svg")) {
+      iconRegistry[iconName] = icon;
+      return icon;
+    }
+  }
+  return void 0;
+}
+function getRemoteIcon(iconName, iconLoaderUrl) {
+  const formkitVersion = FORMKIT_VERSION.startsWith("__") ? "latest" : FORMKIT_VERSION;
+  const fetchUrl = typeof iconLoaderUrl === "function" ? iconLoaderUrl(iconName) : `https://cdn.jsdelivr.net/npm/@formkit/icons@${formkitVersion}/dist/icons/${iconName}.svg`;
+  if (!isClient)
+    return void 0;
+  return fetch(`${fetchUrl}`).then(async (r) => {
+    const icon = await r.text();
+    if (icon.startsWith("<svg")) {
+      return icon;
+    }
+    return void 0;
+  }).catch((e) => {
+    console.error(e);
+    return void 0;
+  });
+}
 let registered = false;
 const errors = {
   100: ({ data: node }) => `Only groups, lists, and forms can have children (${node.name}).`,
@@ -1915,7 +1955,8 @@ const warnings = {
   350: ({ data: node }) => `Invalid options prop for radio input (${node.name}). See https://formkit.com/inputs/radio`,
   650: 'Schema "$get()" must use the id of an input to access.',
   651: ({ data: id }) => `Cannot setErrors() on "${id}" because no such id exists.`,
-  652: ({ data: id }) => `Cannot clearErrors() on "${id}" because no such id exists.`
+  652: ({ data: id }) => `Cannot clearErrors() on "${id}" because no such id exists.`,
+  800: ({ data: name }) => `${name} is deprecated.`
 };
 const decodeErrors = (error2, next) => {
   if (error2.code in errors) {
@@ -2061,7 +2102,7 @@ function parseSchema(library, schema) {
       }
     }
     return () => {
-      const attrs = {};
+      const attrs = Array.isArray(unparsedAttrs) ? [] : {};
       setters.forEach((setter) => setter(attrs));
       return attrs;
     };
@@ -2196,14 +2237,18 @@ function parseSchema(library, schema) {
           return null;
         const instanceScope = instanceScopes.get(instanceKey) || [];
         for (const key in values) {
-          const iterationData = Object.defineProperty(__spreadValues(__spreadProps(__spreadValues({}, instanceScope.reduce((previousIterationData, scopedData) => {
-            if (previousIterationData.__idata) {
-              return __spreadValues(__spreadValues({}, previousIterationData), scopedData);
-            }
-            return scopedData;
-          }, {})), {
-            [valueName]: values[key]
-          }), keyName !== null ? { [keyName]: key } : {}), "__idata", { enumerable: false, value: true });
+          if (Array.isArray(values) && key === "length")
+            continue;
+          const iterationData = Object.defineProperty({
+            ...instanceScope.reduce((previousIterationData, scopedData) => {
+              if (previousIterationData.__idata) {
+                return { ...previousIterationData, ...scopedData };
+              }
+              return scopedData;
+            }, {}),
+            [valueName]: values[key],
+            ...keyName !== null ? { [keyName]: key } : {}
+          }, "__idata", { enumerable: false, value: true });
           instanceScope.unshift(iterationData);
           fragment.push(repeatedNode.bind(null, iterationData)());
           instanceScope.shift();
@@ -2406,7 +2451,8 @@ defineComponent({
     "update:modelValue": (_value) => true,
     node: (node) => !!node,
     submit: (_data, _node) => true,
-    submitRaw: (_event, _node) => true
+    submitRaw: (_event, _node) => true,
+    submitInvalid: (_node) => true
   },
   inheritAttrs: false,
   setup(props2, context) {
@@ -2418,7 +2464,7 @@ defineComponent({
         var _a;
         return h((_a = node.props.definition) === null || _a === void 0 ? void 0 : _a.component, {
           context: node.context
-        }, __spreadValues({}, context.slots));
+        }, { ...context.slots });
       };
     }
     const schema = ref([]);
@@ -2427,14 +2473,14 @@ defineComponent({
       const schemaDefinition = (_b = (_a = node.props) === null || _a === void 0 ? void 0 : _a.definition) === null || _b === void 0 ? void 0 : _b.schema;
       if (!schemaDefinition)
         error(601, node);
-      schema.value = typeof schemaDefinition === "function" ? schemaDefinition(__spreadValues({}, props2.sectionsSchema)) : schemaDefinition;
+      schema.value = typeof schemaDefinition === "function" ? schemaDefinition({ ...props2.sectionsSchema }) : schemaDefinition;
     };
     generateSchema();
     node.on("schema", generateSchema);
     context.emit("node", node);
     const library = node.props.definition.library;
     context.expose({ node });
-    return () => h(FormKitSchema, { schema: schema.value, data: node.context, library }, __spreadValues({}, context.slots));
+    return () => h(FormKitSchema, { schema: schema.value, data: node.context, library }, { ...context.slots });
   }
 });
 const optionsSymbol = Symbol.for("FormKitOptions");
@@ -2540,7 +2586,10 @@ const pseudoProps = [
   "preserve",
   /^preserve(-e|E)rrors/,
   /^[a-z]+(?:-visibility|Visibility)$/,
-  /^[a-zA-Z-]+(?:-class|Class)$/
+  /^[a-zA-Z-]+(?:-class|Class)$/,
+  "prefixIcon",
+  "suffixIcon",
+  /^[a-zA-Z-]+(?:-icon|Icon)$/
 ];
 function classesToNodeProps(node, props2) {
   if (props2.classes) {
@@ -2556,7 +2605,7 @@ function classesToNodeProps(node, props2) {
 function onlyListeners(props2) {
   if (!props2)
     return {};
-  const knownListeners = ["Submit", "SubmitRaw"].reduce((listeners, listener) => {
+  const knownListeners = ["Submit", "SubmitRaw", "SubmitInvalid"].reduce((listeners, listener) => {
     const name = `on${listener}`;
     if (name in props2) {
       if (typeof props2[name] === "function") {
@@ -2574,7 +2623,10 @@ function useInput(props2, context, options = {}) {
   const isVModeled = props2.modelValue !== void 0;
   const value = props2.modelValue !== void 0 ? props2.modelValue : cloneAny(context.attrs.value);
   function createInitialProps() {
-    const initialProps2 = __spreadValues(__spreadValues({}, nodeProps(props2)), listeners);
+    const initialProps2 = {
+      ...nodeProps(props2),
+      ...listeners
+    };
     const attrs = except(nodeProps(context.attrs), pseudoProps);
     initialProps2.attrs = attrs;
     const propValues = only(nodeProps(context.attrs), pseudoProps);
@@ -2660,6 +2712,8 @@ function useInput(props2, context, options = {}) {
     const sourceKey = `${node.name}-prop`;
     watchEffect(() => {
       const keys = Object.keys(props2.inputErrors);
+      if (!keys.length)
+        node.clearErrors(true, sourceKey);
       const messages2 = keys.reduce((messages3, key) => {
         let value2 = props2.inputErrors[key];
         if (typeof value2 === "string")
@@ -2717,27 +2771,87 @@ function isComponent(obj) {
   return typeof obj === "function" && obj.length === 2 || typeof obj === "object" && !Array.isArray(obj) && !("$el" in obj) && !("$cmp" in obj) && !("if" in obj);
 }
 function createInput(schemaOrComponent, definitionOptions = {}) {
-  const definition = __spreadValues({
-    type: "input"
-  }, definitionOptions);
-  let schema = void 0;
+  const definition = {
+    type: "input",
+    ...definitionOptions
+  };
+  let schema;
   if (isComponent(schemaOrComponent)) {
     const cmpName = `SchemaComponent${totalCreated++}`;
-    schema = () => ({
+    schema = createSection("input", () => ({
       $cmp: cmpName,
       props: {
         context: "$node.context"
       }
-    });
+    }));
     definition.library = { [cmpName]: markRaw(schemaOrComponent) };
-  } else {
+  } else if (typeof schemaOrComponent === "function") {
     schema = schemaOrComponent;
+  } else {
+    schema = createSection("input", () => cloneAny(schemaOrComponent));
   }
   definition.schema = useSchema(schema || "Schema undefined");
   return definition;
 }
-const _sfc_main$c = /* @__PURE__ */ defineComponent({
-  name: "PrimeInputText",
+defineComponent({
+  name: "FormKitIcon",
+  props: {
+    icon: {
+      type: String,
+      default: ""
+    },
+    iconLoader: {
+      type: Function,
+      default: null
+    },
+    iconLoaderUrl: {
+      type: Function,
+      default: null
+    }
+  },
+  setup(props2) {
+    var _a, _b;
+    const icon = ref(void 0);
+    const config = inject(optionsSymbol, {});
+    const parent = inject(parentSymbol, null);
+    let iconHandler = void 0;
+    if (props2.iconLoader && typeof props2.iconLoader === "function") {
+      iconHandler = createIconHandler(props2.iconLoader);
+    } else if (parent && ((_a = parent.props) === null || _a === void 0 ? void 0 : _a.iconLoader)) {
+      iconHandler = createIconHandler(parent.props.iconLoader);
+    } else if (props2.iconLoaderUrl && typeof props2.iconLoaderUrl === "function") {
+      iconHandler = createIconHandler(iconHandler, props2.iconLoaderUrl);
+    } else {
+      const iconPlugin = (_b = config === null || config === void 0 ? void 0 : config.plugins) === null || _b === void 0 ? void 0 : _b.find((plugin) => {
+        return typeof plugin.iconHandler === "function";
+      });
+      if (iconPlugin) {
+        iconHandler = iconPlugin.iconHandler;
+      }
+    }
+    if (iconHandler && typeof iconHandler === "function") {
+      const iconOrPromise = iconHandler(props2.icon);
+      if (iconOrPromise instanceof Promise) {
+        iconOrPromise.then((iconValue) => {
+          icon.value = iconValue;
+        });
+      } else {
+        icon.value = iconOrPromise;
+      }
+    }
+    return () => {
+      if (icon.value) {
+        return h("span", {
+          class: "formkit-icon",
+          innerHTML: icon.value
+        });
+      }
+      return null;
+    };
+  }
+});
+const _sfc_main$e = /* @__PURE__ */ defineComponent({
+  __name: "PrimeInputText",
   props: {
     context: Object
   },
@@ -3031,8 +3145,8 @@ var consola_browser = { exports: {} };
   });
 })(consola_browser);
 var consola = consola_browser.exports;
-const _sfc_main$b = /* @__PURE__ */ defineComponent({
-  name: "PrimeInputNumber",
+const _sfc_main$d = /* @__PURE__ */ defineComponent({
+  __name: "PrimeInputNumber",
   props: {
     context: Object
   },
@@ -3068,8 +3182,8 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$a = /* @__PURE__ */ defineComponent({
-  name: "PrimeInputMask",
+const _sfc_main$c = /* @__PURE__ */ defineComponent({
+  __name: "PrimeInputMask",
   props: {
     context: Object
   },
@@ -3098,8 +3212,8 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$9 = /* @__PURE__ */ defineComponent({
-  name: "PrimePassword",
+const _sfc_main$b = /* @__PURE__ */ defineComponent({
+  __name: "PrimePassword",
   props: {
     context: Object
   },
@@ -3125,8 +3239,8 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$8 = /* @__PURE__ */ defineComponent({
-  name: "PrimeInputTextArea",
+const _sfc_main$a = /* @__PURE__ */ defineComponent({
+  __name: "PrimeInputTextArea",
   props: {
     context: Object
   },
@@ -3159,8 +3273,8 @@ const _hoisted_2$1 = {
   key: 1,
   class: "formkit-prime-right"
 };
-const _sfc_main$7 = /* @__PURE__ */ defineComponent({
-  name: "PrimeCheckBox",
+const _sfc_main$9 = /* @__PURE__ */ defineComponent({
+  __name: "PrimeCheckBox",
   props: {
     context: Object
   },
@@ -3196,8 +3310,8 @@ const _hoisted_2 = {
   key: 1,
   class: "formkit-prime-right"
 };
-const _sfc_main$6 = /* @__PURE__ */ defineComponent({
-  name: "PrimeInputSwitch",
+const _sfc_main$8 = /* @__PURE__ */ defineComponent({
+  __name: "PrimeInputSwitch",
   props: {
     context: Object
   },
@@ -3227,8 +3341,8 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$5 = /* @__PURE__ */ defineComponent({
-  name: "PrimeEditor",
+const _sfc_main$7 = /* @__PURE__ */ defineComponent({
+  __name: "PrimeEditor",
   props: {
     context: Object
   },
@@ -3250,8 +3364,8 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$4 = /* @__PURE__ */ defineComponent({
-  name: "PrimeDropdown",
+const _sfc_main$6 = /* @__PURE__ */ defineComponent({
+  __name: "PrimeDropdown",
   props: {
     context: Object
   },
@@ -3280,8 +3394,8 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$3 = /* @__PURE__ */ defineComponent({
-  name: "PrimeMultiSelect",
+const _sfc_main$5 = /* @__PURE__ */ defineComponent({
+  __name: "PrimeMultiSelect",
   props: {
     context: Object
   },
@@ -3310,8 +3424,8 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$2 = /* @__PURE__ */ defineComponent({
-  name: "PrimeCalendar",
+const _sfc_main$4 = /* @__PURE__ */ defineComponent({
+  __name: "PrimeCalendar",
   props: {
     context: Object
   },
@@ -3340,8 +3454,8 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$1 = /* @__PURE__ */ defineComponent({
-  name: "PrimeSlider",
+const _sfc_main$3 = /* @__PURE__ */ defineComponent({
+  __name: "PrimeSlider",
   props: {
     context: Object
   },
@@ -3368,8 +3482,8 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  name: "PrimeRating",
+const _sfc_main$2 = /* @__PURE__ */ defineComponent({
+  __name: "PrimeRating",
   props: {
     context: Object
   },
@@ -3396,43 +3510,112 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const primeInputTextDefinition = createInput(_sfc_main$c, {
+const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+  __name: "PrimeChips",
+  props: {
+    context: Object
+  },
+  setup(__props) {
+    const props2 = __props;
+    const context = props2.context;
+    function handleInput(e) {
+      var _a;
+      context == null ? void 0 : context.node.input((_a = props2.context) == null ? void 0 : _a._value);
+    }
+    return (_ctx, _cache) => {
+      var _a, _b, _c;
+      const _component_Chips = resolveComponent("Chips");
+      return openBlock(), createBlock(_component_Chips, {
+        id: unref(context).id,
+        modelValue: unref(context)._value,
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => unref(context)._value = $event),
+        class: normalizeClass(unref(context).attrs.class),
+        "allow-duplicate": (_a = unref(context).attrs.allowDuplicate) != null ? _a : true,
+        "add-on-blur": (_b = unref(context).attrs.addOnBlur) != null ? _b : false,
+        max: (_c = unref(context).attrs.max) != null ? _c : void 0,
+        onAdd: handleInput,
+        onRemove: handleInput
+      }, null, 8, ["id", "modelValue", "class", "allow-duplicate", "add-on-blur", "max"]);
+    };
+  }
+});
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "PrimeKnob",
+  props: {
+    context: Object
+  },
+  setup(__props) {
+    const props2 = __props;
+    const context = props2.context;
+    function handleInput(e) {
+      var _a;
+      context == null ? void 0 : context.node.input((_a = props2.context) == null ? void 0 : _a._value);
+    }
+    return (_ctx, _cache) => {
+      var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
+      const _component_Knob = resolveComponent("Knob");
+      return openBlock(), createBlock(_component_Knob, {
+        id: unref(context).id,
+        modelValue: unref(context)._value,
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => unref(context)._value = $event),
+        min: (_a = unref(context).attrs.min) != null ? _a : 0,
+        max: (_b = unref(context).attrs.max) != null ? _b : 100,
+        step: (_c = unref(context).attrs.step) != null ? _c : void 0,
+        size: (_d = unref(context).attrs.max) != null ? _d : 100,
+        "stroke-width": (_e = unref(context).attrs.strokeWidth) != null ? _e : 14,
+        "show-value": (_f = unref(context).attrs.showValue) != null ? _f : true,
+        "value-color": (_g = unref(context).attrs.valueColor) != null ? _g : void 0,
+        "range-color": (_h = unref(context).attrs.rangeColor) != null ? _h : void 0,
+        "text-color": (_i = unref(context).attrs.textColor) != null ? _i : void 0,
+        "value-template": (_j = unref(context).attrs.valueTemplate) != null ? _j : void 0,
+        onChange: handleInput
+      }, null, 8, ["id", "modelValue", "min", "max", "step", "size", "stroke-width", "show-value", "value-color", "range-color", "text-color", "value-template"]);
+    };
+  }
+});
+const primeInputTextDefinition = createInput(_sfc_main$e, {
   props: ["iconRight", "iconLeft"]
 });
-const primeInputNumberDefinition = createInput(_sfc_main$b, {
+const primeInputNumberDefinition = createInput(_sfc_main$d, {
   props: ["iconRight", "iconLeft"]
 });
-const primeInputMaskDefinition = createInput(_sfc_main$a, {
+const primeInputMaskDefinition = createInput(_sfc_main$c, {
   props: []
 });
-const primePasswordDefinition = createInput(_sfc_main$9, {
+const primePasswordDefinition = createInput(_sfc_main$b, {
   props: ["feedback", "toggleMask"]
 });
-const primeInputTextAreaDefinition = createInput(_sfc_main$8, {
+const primeInputTextAreaDefinition = createInput(_sfc_main$a, {
   props: ["rows"]
 });
-const primeCheckBoxDefinition = createInput(_sfc_main$7, {
+const primeCheckBoxDefinition = createInput(_sfc_main$9, {
+  props: []
+});
+const primeInputSwitchDefinition = createInput(_sfc_main$8, {
+  props: []
+});
+const primeEditorDefinition = createInput(_sfc_main$7, {
   props: []
 });
-const primeInputSwitchDefinition = createInput(_sfc_main$6, {
+const primeDropdownDefinition = createInput(_sfc_main$6, {
   props: []
 });
-const primeEditorDefinition = createInput(_sfc_main$5, {
+const primeMultiSelectDefinition = createInput(_sfc_main$5, {
   props: []
 });
-const primeDropdownDefinition = createInput(_sfc_main$4, {
+const primeCalendarDefinition = createInput(_sfc_main$4, {
   props: []
 });
-const primeMultiSelectDefinition = createInput(_sfc_main$3, {
+const primeSliderDefinition = createInput(_sfc_main$3, {
   props: []
 });
-const primeCalendarDefinition = createInput(_sfc_main$2, {
+const primeRatingDefinition = createInput(_sfc_main$2, {
   props: []
 });
-const primeSliderDefinition = createInput(_sfc_main$1, {
+const primeChipsDefinition = createInput(_sfc_main$1, {
   props: []
 });
-const primeRatingDefinition = createInput(_sfc_main, {
+const primeKnobDefinition = createInput(_sfc_main, {
   props: []
 });
 const primeInputs = {
@@ -3447,6 +3630,8 @@ const primeInputs = {
   primeDropdown: primeDropdownDefinition,
   primeMultiSelect: primeMultiSelectDefinition,
   primeCalendar: primeCalendarDefinition,
-  primeSlider: primeSliderDefinition
+  primeSlider: primeSliderDefinition,
+  primeChips: primeChipsDefinition,
+  primeKnob: primeKnobDefinition
 };
-export { primeCalendarDefinition, primeCheckBoxDefinition, primeDropdownDefinition, primeEditorDefinition, primeInputMaskDefinition, primeInputNumberDefinition, primeInputSwitchDefinition, primeInputTextAreaDefinition, primeInputTextDefinition, primeInputs, primeMultiSelectDefinition, primePasswordDefinition, primeRatingDefinition, primeSliderDefinition };
+export { primeCalendarDefinition, primeCheckBoxDefinition, primeChipsDefinition, primeDropdownDefinition, primeEditorDefinition, primeInputMaskDefinition, primeInputNumberDefinition, primeInputSwitchDefinition, primeInputTextAreaDefinition, primeInputTextDefinition, primeInputs, primeKnobDefinition, primeMultiSelectDefinition, primePasswordDefinition, primeRatingDefinition, primeSliderDefinition };