@sfxcode/formkit-primevue 3.3.5 → 3.3.6

package/dist/index.d.ts

@@ -1,116 +1,116 @@
-import type { FormKitBaseSlots, FormKitInputs } from "@formkit/inputs";
-import type { AutoCompleteSlots, CascadeSelectSlots, CheckboxSlots, ColorPickerSlots, DatePickerSlots, InputMaskSlots, InputNumberSlots, InputOtpSlots, InputTextSlots, KnobSlots, ListboxSlots, MultiSelectSlots, PasswordSlots, RadioButtonSlots, RatingSlots, SelectButtonSlots, SelectSlots, SliderSlots, TextareaSlots, ToggleButtonSlots, ToggleSwitchSlots, TreeSelectSlots } from "primevue";
-import type { CascadeSelectProps } from "primevue/cascadeselect";
-import type { ListboxProps } from "primevue/listbox";
-import type { MultiSelectProps } from "primevue/multiselect";
-import type { SelectProps } from "primevue/select";
-import type { SelectButtonProps } from "primevue/selectbutton";
-import type { TreeSelectProps } from "primevue/treeselect";
-import { FormKitDataEdit, FormKitDataView } from "./components/index.ts";
-import { useFormKitRepeater, useFormKitSchema, useInputEditor, useInputEditorSchema, usePrimeInputs } from "./composables/index.ts";
-import { primeInputs, primeOutputs } from "./definitions/index.ts";
+import type { FormKitBaseSlots, FormKitInputs } from '@formkit/inputs';
+import type { AutoCompleteSlots, CascadeSelectSlots, CheckboxSlots, ColorPickerSlots, DatePickerSlots, InputMaskSlots, InputNumberSlots, InputOtpSlots, InputTextSlots, KnobSlots, ListboxSlots, MultiSelectSlots, PasswordSlots, RadioButtonSlots, RatingSlots, SelectButtonSlots, SelectSlots, SliderSlots, TextareaSlots, ToggleButtonSlots, ToggleSwitchSlots, TreeSelectSlots } from 'primevue';
+import type { CascadeSelectProps } from 'primevue/cascadeselect';
+import type { ListboxProps } from 'primevue/listbox';
+import type { MultiSelectProps } from 'primevue/multiselect';
+import type { SelectProps } from 'primevue/select';
+import type { SelectButtonProps } from 'primevue/selectbutton';
+import type { TreeSelectProps } from 'primevue/treeselect';
+import { FormKitDataEdit, FormKitDataView } from './components';
+import { useFormKitRepeater, useFormKitSchema, useInputEditor, useInputEditorSchema, usePrimeInputs } from './composables';
+import { primeInputs, primeOutputs } from './definitions';
 export { FormKitDataEdit, FormKitDataView, primeInputs, primeOutputs, useFormKitRepeater, useFormKitSchema, useInputEditor, useInputEditorSchema, usePrimeInputs, };
 /**
  * Keeps all slots from 1st argument, add any slots from 2nd type which do not collide with the 1st's names.
  */
 type MergeSlots<A, B> = A & Omit<B, keyof A>;
-declare module "@formkit/inputs" {
+declare module '@formkit/inputs' {
     interface FormKitInputProps<Props extends FormKitInputs<Props>> {
         primeAutoComplete: {
-            type: "primeAutoComplete";
+            type: 'primeAutoComplete';
         };
         primeInputText: {
-            type: "primeInputText";
+            type: 'primeInputText';
         };
         primeInputNumber: {
-            type: "primeInputNumber";
+            type: 'primeInputNumber';
         };
         primeInputMask: {
-            type: "primeInputMask";
+            type: 'primeInputMask';
         };
         primePassword: {
-            type: "primePassword";
+            type: 'primePassword';
         };
         primeCheckbox: {
-            type: "primeCheckbox";
+            type: 'primeCheckbox';
         };
         primeToggleSwitch: {
-            type: "primeToggleSwitch";
+            type: 'primeToggleSwitch';
         };
         primeTextarea: {
-            type: "primeTextarea";
+            type: 'primeTextarea';
         };
         primeSelect: {
-            type: "primeSelect";
-            options?: SelectProps["options"];
+            type: 'primeSelect';
+            options?: SelectProps['options'];
         };
         primeMultiSelect: {
-            type: "primeMultiSelect";
-            options?: MultiSelectProps["options"];
+            type: 'primeMultiSelect';
+            options?: MultiSelectProps['options'];
         };
         primeDatePicker: {
-            type: "primeDatePicker";
+            type: 'primeDatePicker';
         };
         primeSlider: {
-            type: "primeSlider";
+            type: 'primeSlider';
         };
         primeKnob: {
-            type: "primeKnob";
+            type: 'primeKnob';
         };
         primeRating: {
-            type: "primeRating";
+            type: 'primeRating';
         };
         primeRadioButton: {
-            type: "primeRadioButton";
+            type: 'primeRadioButton';
         };
         primeColorPicker: {
-            type: "primeColorPicker";
+            type: 'primeColorPicker';
         };
         primeToggleButton: {
-            type: "primeToggleButton";
+            type: 'primeToggleButton';
         };
         primeListbox: {
-            type: "primeListbox";
-            options?: ListboxProps["options"];
+            type: 'primeListbox';
+            options?: ListboxProps['options'];
         };
         primeSelectButton: {
-            type: "primeSelectButton";
-            options?: SelectButtonProps["options"];
+            type: 'primeSelectButton';
+            options?: SelectButtonProps['options'];
         };
         primeCascadeSelect: {
-            type: "primeCascadeSelect";
-            options?: CascadeSelectProps["options"];
+            type: 'primeCascadeSelect';
+            options?: CascadeSelectProps['options'];
         };
         primeTreeSelect: {
-            type: "primeTreeSelect";
-            options?: TreeSelectProps["options"];
+            type: 'primeTreeSelect';
+            options?: TreeSelectProps['options'];
         };
         primeInputOtp: {
-            type: "primeInputOtp";
+            type: 'primeInputOtp';
         };
         primeOutputText: {
-            type: "primeOutputText";
+            type: 'primeOutputText';
         };
         primeOutputLink: {
-            type: "primeOutputLink";
+            type: 'primeOutputLink';
         };
         primeOutputReference: {
-            type: "primeOutputReference";
+            type: 'primeOutputReference';
         };
         primeOutputNumber: {
-            type: "primeOutputNumber";
+            type: 'primeOutputNumber';
         };
         primeOutputDate: {
-            type: "primeOutputDate";
+            type: 'primeOutputDate';
         };
         primeOutputBoolean: {
-            type: "primeOutputBoolean";
+            type: 'primeOutputBoolean';
         };
         primeOutputDuration: {
-            type: "primeOutputDuration";
+            type: 'primeOutputDuration';
         };
         primeOutputList: {
-            type: "primeOutputList";
+            type: 'primeOutputList';
         };
     }
     interface FormKitInputSlots<Props extends FormKitInputs<Props>> {

package/dist/index.js

@@ -6,57 +6,57 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "FormKitDataEdit", {
   enumerable: true,
   get: function () {
-    return _index.FormKitDataEdit;
+    return _components.FormKitDataEdit;
   }
 });
 Object.defineProperty(exports, "FormKitDataView", {
   enumerable: true,
   get: function () {
-    return _index.FormKitDataView;
+    return _components.FormKitDataView;
   }
 });
 Object.defineProperty(exports, "primeInputs", {
   enumerable: true,
   get: function () {
-    return _index3.primeInputs;
+    return _definitions.primeInputs;
   }
 });
 Object.defineProperty(exports, "primeOutputs", {
   enumerable: true,
   get: function () {
-    return _index3.primeOutputs;
+    return _definitions.primeOutputs;
   }
 });
 Object.defineProperty(exports, "useFormKitRepeater", {
   enumerable: true,
   get: function () {
-    return _index2.useFormKitRepeater;
+    return _composables.useFormKitRepeater;
   }
 });
 Object.defineProperty(exports, "useFormKitSchema", {
   enumerable: true,
   get: function () {
-    return _index2.useFormKitSchema;
+    return _composables.useFormKitSchema;
   }
 });
 Object.defineProperty(exports, "useInputEditor", {
   enumerable: true,
   get: function () {
-    return _index2.useInputEditor;
+    return _composables.useInputEditor;
   }
 });
 Object.defineProperty(exports, "useInputEditorSchema", {
   enumerable: true,
   get: function () {
-    return _index2.useInputEditorSchema;
+    return _composables.useInputEditorSchema;
   }
 });
 Object.defineProperty(exports, "usePrimeInputs", {
   enumerable: true,
   get: function () {
-    return _index2.usePrimeInputs;
+    return _composables.usePrimeInputs;
   }
 });
-var _index = require("./components/index.ts");
-var _index2 = require("./composables/index.ts");
-var _index3 = require("./definitions/index.ts");
+var _components = require("./components");
+var _composables = require("./composables");
+var _definitions = require("./definitions");

package/dist/index.mjs

@@ -1,12 +1,6 @@
-import { FormKitDataEdit, FormKitDataView } from "./components/index.ts";
-import {
-  useFormKitRepeater,
-  useFormKitSchema,
-  useInputEditor,
-  useInputEditorSchema,
-  usePrimeInputs
-} from "./composables/index.ts";
-import { primeInputs, primeOutputs } from "./definitions/index.ts";
+import { FormKitDataEdit, FormKitDataView } from "./components/index.mjs";
+import { useFormKitRepeater, useFormKitSchema, useInputEditor, useInputEditorSchema, usePrimeInputs } from "./composables/index.mjs";
+import { primeInputs, primeOutputs } from "./definitions/index.mjs";
 export {
   FormKitDataEdit,
   FormKitDataView,

package/dist/plugins/index.d.ts

@@ -1,3 +1,3 @@
-import type { FormKitNode } from "@formkit/core";
+import type { FormKitNode } from '@formkit/core';
 export declare function addPrimeAsteriskPlugin(node: FormKitNode): void;
 export declare function addLabelPlugin(node: FormKitNode): void;

package/dist/plugins/index.mjs

@@ -1,21 +1,19 @@
 export function addPrimeAsteriskPlugin(node) {
-  if (!node.props.type.startsWith("prime") || node.props.type.startsWith("primeOutput")) return;
+  if (!node.props.type.startsWith("prime") || node.props.type.startsWith("primeOutput"))
+    return;
   node.on("created", () => {
     if (node.props.definition?.schema) {
       const schemaFn = node.props.definition?.schema;
       node.props.definition.schema = (sectionsSchema = {}) => {
         sectionsSchema.label = {
-          children: [
-            "$label",
-            {
-              $el: "span",
-              if: "$state.required",
-              attrs: {
-                class: "p-formkit-asterisk"
-              },
-              children: ["*"]
-            }
-          ]
+          children: ["$label", {
+            $el: "span",
+            if: "$state.required",
+            attrs: {
+              class: "p-formkit-asterisk"
+            },
+            children: ["*"]
+          }]
         };
         return schemaFn(sectionsSchema);
       };
@@ -23,31 +21,29 @@ export function addPrimeAsteriskPlugin(node) {
   });
 }
 export function addLabelPlugin(node) {
-  if (!node.props.type.startsWith("prime")) return;
+  if (!node.props.type.startsWith("prime"))
+    return;
   node.on("created", () => {
     if (node.props.definition?.schema) {
       const schemaFn = node.props.definition?.schema;
       node.props.definition.schema = (sectionsSchema = {}) => {
         sectionsSchema.label = {
-          children: [
-            {
-              $el: "span",
-              attrs: {
-                title: "$help",
-                class: "p-formkit-label"
-              },
-              children: ["$label"]
+          children: [{
+            $el: "span",
+            attrs: {
+              title: "$help",
+              class: "p-formkit-label"
+            },
+            children: ["$label"]
+          }, {
+            $el: "span",
+            if: "$state.required",
+            attrs: {
+              class: "p-formkit-required",
+              title: "$help"
             },
-            {
-              $el: "span",
-              if: "$state.required",
-              attrs: {
-                class: "p-formkit-required",
-                title: "$help"
-              },
-              children: ["*"]
-            }
-          ]
+            children: ["*"]
+          }]
         };
         sectionsSchema.help = {
           children: []

package/dist/sass/formkit-primevue.scss

@@ -1,15 +1,15 @@
-@use "sass:math";
-@use "sass:map";
+@use 'sass:math';
+@use 'sass:map';
 
 $gutter-width: 0.5rem;
 
 // Breakpoints e.g. https://tailwindcss.com/docs/responsive-design
 $grid-breakpoints: (
-  sm: 640px,
-  md: 768px,
-  lg: 1024px,
-  xl: 1280px,
-  xxl: 1536px,
+        sm: 640px,
+        md: 768px,
+        lg: 1024px,
+        xl: 1280px,
+        xxl: 1536px
 ) !default;
 
 @function breakpoint-min($name, $breakpoints: $grid-breakpoints) {
@@ -69,12 +69,7 @@ $grid-breakpoints: (
           width: 100%;
         }
 
-        .p-inputtext,
-        .p-textarea,
-        .p-password,
-        .p-multiselect,
-        .p-select,
-        .p-editor {
+        .p-inputtext, .p-textarea, .p-password, .p-multiselect, .p-select, .p-editor {
           box-sizing: border-box;
           width: 100%;
 
@@ -82,6 +77,7 @@ $grid-breakpoints: (
             width: 2rem;
           }
         }
+
       }
     }
 
@@ -90,6 +86,7 @@ $grid-breakpoints: (
       font-size: 0.8rem;
       color: var(--text-color-secondary);
     }
+
   }
 
   // Label for single form element
@@ -106,8 +103,7 @@ $grid-breakpoints: (
     > * {
       margin-right: 0.5rem;
 
-      &:last-child,
-      &:only-child {
+      &:last-child, &:only-child {
         margin-right: 0;
       }
     }
@@ -119,7 +115,7 @@ $grid-breakpoints: (
     flex-wrap: wrap;
     gap: 0.5rem;
 
-    .p-formkit-option {
+    .p-formkit-option  {
       display: flex;
       align-items: center;
       label {
@@ -159,9 +155,10 @@ $grid-breakpoints: (
     button {
       margin-right: 0.5rem;
     }
+
   }
 
-  .p-action-buttons {
+  .p-action-buttons  {
     margin-top: 0.25rem;
     .p-button {
       margin-right: 0.5rem;
@@ -184,117 +181,117 @@ $grid-breakpoints: (
 
 // data view only
 .p-formkit-data-view {
-  .formkit-outer {
-    padding-bottom: 0.5rem;
-  }
+    .formkit-outer {
+      padding-bottom:  0.5rem;
+    }
 
-  &.form-horizontal {
-    padding-bottom: 0.8rem;
-  }
+    &.form-horizontal {
+      padding-bottom: 0.8rem;
+    }
 
-  .formkit-help {
-    padding-top: 0.25rem;
-    margin: 0;
-  }
+    .formkit-help {
+      padding-top:  0.25rem;
+      margin: 0;
+    }
 
-  ul,
-  ol {
-    padding-inline-start: 1rem;
-    margin-block-start: 0;
-    margin-block-end: 0;
-  }
+    ul, ol {
+      padding-inline-start: 1rem;
+      margin-block-start: 0;
+      margin-block-end: 0;
+    }
 }
 
 // data edit only
 .p-formkit-data-edit {
-  .formkit-label {
-    //font-weight: normal;
-  }
+    .formkit-label {
+      //font-weight: normal;
+    }
 
-  // specific checkbox stylings
-  .formkit-outer[data-type="primeCheckbox"] {
-    //padding-left: 0;
+    // specific checkbox stylings
+    .formkit-outer[data-type="primeCheckbox"] {
+      //padding-left: 0;
 
-    .formkit-wrapper {
-      display: flex;
-      flex-wrap: wrap;
+      .formkit-wrapper {
+        display: flex;
+        flex-wrap: wrap;
 
-      .formkit-inner {
-        width: auto !important;
-      }
+        .formkit-inner {
+          width: auto !important;
+        }
 
-      label {
-        width: auto;
-        order: 2;
-        padding: 0.125rem 0;
+        label {
+          width: auto;
+          order: 2;
+          padding: 0.125rem 0;
 
-        &:after {
-          content: "";
-        }
+          &:after {
+            content: "";
+          }
 
-        // styling of output when label is used in schema
-        + .formkit-inner {
-          margin-left: 0 !important;
-          order: 1;
-          flex-basis: 2rem;
-          flex-grow: 0;
-          flex-shrink: 0;
-          overflow: hidden;
-          // styling of suffix when suffix is used in addition to label
-          &:has(label) {
-            flex-grow: 1;
-            flex-basis: 100%;
+          // styling of output when label is used in schema
+          + .formkit-inner {
+            margin-left: 0 !important;
+            order: 1;
+            flex-basis: 2rem;
+            flex-grow: 0;
+            flex-shrink: 0;
+            overflow: hidden;
+            // styling of suffix when suffix is used in addition to label
+            &:has( label) {
+              flex-grow: 1;
+              flex-basis: 100%;
+            }
           }
         }
-      }
 
-      // styling when both prefix and suffix are used in schema
-      label:first-child:nth-last-child(3),
-      label:first-child:nth-last-child(3) ~ label {
-        width: auto;
-      }
+        // styling when both prefix and suffix are used in schema
+        label:first-child:nth-last-child(3), label:first-child:nth-last-child(3) ~ label {
+          width: auto;
+        }
 
-      label:first-child:nth-last-child(3) {
-        order: 1;
+        label:first-child:nth-last-child(3) {
+          order: 1;
 
-        + div.p-checkbox {
-          order: 2;
-          width: auto;
+          + div.p-checkbox {
+            order: 2;
+            width: auto;
+          }
         }
-      }
 
-      label:first-child:nth-last-child(3) ~ label {
-        order: 3;
-      }
+        label:first-child:nth-last-child(3) ~ label {
+          order: 3
+        }
+
+        // end styling when both prefix and suffix are used in schema
 
-      // end styling when both prefix and suffix are used in schema
 
-      // styling of output when only suffix is used in schema
-      .formkit-inner:first-child {
-        margin-left: 0 !important;
+        // styling of output when only suffix is used in schema
+        .formkit-inner:first-child {
+          margin-left: 0 !important;
 
-        .p-formkit {
-          display: flex;
+          .p-formkit {
+            display: flex;
+          }
         }
-      }
 
-      .p-checkbox:not(:only-child) {
-        width: 2rem;
-        overflow: hidden;
+        .p-checkbox:not(:only-child) {
+          width: 2rem;
+          overflow: hidden;
+        }
       }
-    }
 
-    .formkit-help {
-      width: auto !important;
-      //padding-left: 2rem;
+      .formkit-help {
+        width: auto !important;
+        //padding-left: 2rem;
+      }
     }
-  }
 }
 
+
+
 // Debug
 .p-formkit-data-debug {
-  pre,
-  span {
+  pre, span {
     font-size: 0.75rem;
     line-height: 1rem;
   }
@@ -325,7 +322,9 @@ $grid-breakpoints: (
 
 @include media-breakpoint-up(md) {
   .formkit-form {
+
     &.form-horizontal {
+
       .formkit-wrapper {
         display: flex;
 
@@ -347,6 +346,7 @@ $grid-breakpoints: (
           }
         }
       }
+
     }
 
     .p-formkit-data-view & {
@@ -358,7 +358,9 @@ $grid-breakpoints: (
     }
 
     .p-formkit-data-edit & {
+
       &.form-horizontal {
+
         .formkit-outer {
           width: 100%;
 
@@ -378,7 +380,7 @@ $grid-breakpoints: (
             margin-left: auto;
 
             .p-formkit {
-              display: flex;
+              display: flex
             }
 
             label {
@@ -388,8 +390,7 @@ $grid-breakpoints: (
           }
         }
 
-        .formkit-help,
-        .formkit-messages {
+        .formkit-help, .formkit-messages {
           width: calc((8 / 12) * 100%);
           margin-left: auto;
         }
@@ -397,3 +398,4 @@ $grid-breakpoints: (
     }
   }
 }
+