@sfxcode/formkit-primevue 1.9.0 → 1.9.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (20) hide show
  1. package/README.md +16 -3
  2. package/dist/components/PrimeAutoComplete.vue +1 -1
  3. package/dist/components/PrimeCalendar.vue +1 -1
  4. package/dist/components/PrimeCascadeSelect.vue +1 -1
  5. package/dist/components/PrimeCheckbox.vue +1 -1
  6. package/dist/components/PrimeChips.vue +1 -1
  7. package/dist/components/PrimeColorPicker.vue +1 -1
  8. package/dist/components/PrimeInputSwitch.vue +1 -1
  9. package/dist/components/PrimeListbox.vue +1 -1
  10. package/dist/components/PrimeMultiSelect.vue +1 -1
  11. package/dist/components/PrimeRadioButton.vue +2 -2
  12. package/dist/components/PrimeRating.vue +1 -1
  13. package/dist/components/PrimeSelectButton.vue +1 -1
  14. package/dist/components/PrimeToggleButton.vue +1 -1
  15. package/dist/components/PrimeTreeSelect.vue +1 -1
  16. package/dist/components/PrimeTriStateCheckbox.vue +1 -1
  17. package/dist/composables/useFormKitSchema.d.ts +1 -1
  18. package/dist/composables/useFormKitSchema.js +18 -16
  19. package/dist/composables/useFormKitSchema.mjs +16 -16
  20. package/package.json +9 -9
package/README.md CHANGED
@@ -23,9 +23,14 @@ import { primeInputs } from '@sfxcode/formkit-primevue'
23
23
  }))
24
24
  ```
25
25
 
26
+ ### Schema Helper Functions
27
+
28
+ [useFormKitSchema](https://github.com/sfxcode/formkit-primevue/blob/main/src/composables/useFormKitSchema.ts) provide functions to simplify the usage of elements, components, lists, ...
29
+
30
+
26
31
  ### Basic Styling
27
32
 
28
- Basic styling is provided with the **formkit-primevue.scss** file.
33
+ Basic styling is provided with the [formkit-primevue.scss](https://github.com/sfxcode/formkit-primevue/blob/main/src/sass/formkit-primevue.scss) file.
29
34
 
30
35
  Features:
31
36
 
@@ -40,7 +45,14 @@ You can use it or take it as base for your own styling.
40
45
  - All inputs are wrapped in a div with a **p-formkit** class
41
46
  - Most Prime Components have access to class / styles attributes
42
47
  - PT and PTOptions are available ([https://primevue.org/passthrough/](https://primevue.org/passthrough/))
43
- - [Styling](https://formkit-primevue.netlify.app/demo/styling), [Grid](https://formkit-primevue.netlify.app/demo/grid) and [PT](https://formkit-primevue.netlify.app/demo/passThrough) demo available
48
+ - [Styling](https://formkit-primevue.netlify.app/styling/base) and [PT](https://formkit-primevue.netlify.app/styling/passThrough) demo available
49
+
50
+ ### Samples
51
+
52
+ Some samples for common tasks are available
53
+
54
+ - [Repeater](https://formkit-primevue.netlify.app/samples/repeater) (with the help of the useFormKitSchema composable)
55
+ - [Grid](https://formkit-primevue.netlify.app/samples/grid)
44
56
 
45
57
  ## Showcases
46
58
 
@@ -50,9 +62,11 @@ You can use it or take it as base for your own styling.
50
62
 
51
63
  ## Supported Inputs
52
64
 
65
+ - AutoComplete
53
66
  - Calendar
54
67
  - CascadeSelect
55
68
  - Checkbox
69
+ - Chips
56
70
  - Dropdown
57
71
  - Editor (HTML Editor)
58
72
  - InputMask
@@ -63,7 +77,6 @@ You can use it or take it as base for your own styling.
63
77
  - MultiSelect
64
78
  - Password
65
79
  - Ranking
66
- - Chips
67
80
  - Knob
68
81
  - ColorPicker
69
82
  - Listbox
package/dist/components/PrimeAutoComplete.vue CHANGED
@@ -27,7 +27,7 @@ function search(event: AutoCompleteCompleteEvent) {
27
27
  suggestions.value = props.context?.attrs.complete(event.query)
28
28
  }
29
29
 
30
- function handleInput(e: any) {
30
+ function handleInput(_: any) {
31
31
  props.context?.node.input(props.context?._value)
32
32
  }
33
33
 
package/dist/components/PrimeCalendar.vue CHANGED
@@ -57,7 +57,7 @@ const props = defineProps({
57
57
  },
58
58
  })
59
59
 
60
- function handleInput(e: any) {
60
+ function handleInput(_: any) {
61
61
  props.context?.node.input(props.context?._value)
62
62
  }
63
63
 
package/dist/components/PrimeCascadeSelect.vue CHANGED
@@ -22,7 +22,7 @@ const props = defineProps({
22
22
  },
23
23
  })
24
24
 
25
- function handleInput(e: any) {
25
+ function handleInput(_: any) {
26
26
  props.context?.node.input(props.context?._value)
27
27
  }
28
28
 
package/dist/components/PrimeCheckbox.vue CHANGED
@@ -21,7 +21,7 @@ const props = defineProps({
21
21
  },
22
22
  })
23
23
 
24
- function handleInput(e: any) {
24
+ function handleInput(_: any) {
25
25
  props.context?.node.input(props.context?._value)
26
26
  }
27
27
 
package/dist/components/PrimeChips.vue CHANGED
@@ -21,7 +21,7 @@ const props = defineProps({
21
21
  },
22
22
  })
23
23
 
24
- function handleInput(e: any) {
24
+ function handleInput(_: any) {
25
25
  props.context?.node.input(props.context?._value)
26
26
  }
27
27
  const styleClass = computed(() => (props.context?.state.validationVisible && !props.context?.state.valid) ? `${props.context?.attrs?.class} p-invalid` : props.context?.attrs?.class)
package/dist/components/PrimeColorPicker.vue CHANGED
@@ -19,7 +19,7 @@ const props = defineProps({
19
19
  },
20
20
  })
21
21
 
22
- function handleChange(e: any) {
22
+ function handleChange(_: any) {
23
23
  props.context?.node.input(props.context?._value)
24
24
  }
25
25
  </script>
package/dist/components/PrimeInputSwitch.vue CHANGED
@@ -20,7 +20,7 @@ const props = defineProps({
20
20
  },
21
21
  })
22
22
 
23
- function handleInput(e: any) {
23
+ function handleInput(_: any) {
24
24
  props.context?.node.input(props.context?._value)
25
25
  }
26
26
 
package/dist/components/PrimeListbox.vue CHANGED
@@ -27,7 +27,7 @@ const props = defineProps({
27
27
  },
28
28
  })
29
29
 
30
- function handleInput(e: any) {
30
+ function handleInput(_: any) {
31
31
  props.context?.node.input(props.context?._value)
32
32
  }
33
33
 
package/dist/components/PrimeMultiSelect.vue CHANGED
@@ -49,7 +49,7 @@ const props = defineProps({
49
49
  },
50
50
  })
51
51
 
52
- function handleChange(e: any) {
52
+ function handleChange(_: any) {
53
53
  props.context?.node.input(props.context?._value)
54
54
  }
55
55
 
package/dist/components/PrimeRadioButton.vue CHANGED
@@ -18,7 +18,7 @@ const props = defineProps({
18
18
  },
19
19
  })
20
20
 
21
- function handleChange(e: any) {
21
+ function handleChange(_: any) {
22
22
  props.context?.node.input(props.context?._value)
23
23
  }
24
24
 
@@ -47,7 +47,7 @@ const styleClass = computed(() => (props.context?.state.validationVisible && !pr
47
47
  :unstyled="context.unstyled ?? false"
48
48
  @click="handleChange"
49
49
  @change="handleChange"
50
- @blur="handleChange"
50
+ @blur="handleBlur"
51
51
  />
52
52
  <label :for="option.value" class="p-formkit-radio-label">{{ option.label }}</label>
53
53
  </div>
package/dist/components/PrimeRating.vue CHANGED
@@ -21,7 +21,7 @@ const props = defineProps({
21
21
  },
22
22
  })
23
23
 
24
- function handleInput(e: any) {
24
+ function handleInput(_: any) {
25
25
  props.context?.node.input(props.context?._value)
26
26
  }
27
27
 
package/dist/components/PrimeSelectButton.vue CHANGED
@@ -23,7 +23,7 @@ const props = defineProps({
23
23
  },
24
24
  })
25
25
 
26
- function handleChange(e: any) {
26
+ function handleChange(_: any) {
27
27
  props.context?.node.input(props.context?._value)
28
28
  }
29
29
 
package/dist/components/PrimeToggleButton.vue CHANGED
@@ -21,7 +21,7 @@ const props = defineProps({
21
21
  },
22
22
  })
23
23
 
24
- function handleChange(e: any) {
24
+ function handleChange(_: any) {
25
25
  props.context?.node.input(props.context?._value)
26
26
  }
27
27
 
package/dist/components/PrimeTreeSelect.vue CHANGED
@@ -26,7 +26,7 @@ const props = defineProps({
26
26
  },
27
27
  })
28
28
 
29
- function handleInput(e: any) {
29
+ function handleInput(_: any) {
30
30
  props.context?.node.input(props.context?._value)
31
31
  }
32
32
 
package/dist/components/PrimeTriStateCheckbox.vue CHANGED
@@ -19,7 +19,7 @@ const props = defineProps({
19
19
  },
20
20
  })
21
21
 
22
- function handleChange(e: any) {
22
+ function handleChange(_: any) {
23
23
  props.context?.node.input(props.context?._value)
24
24
  }
25
25
 
package/dist/composables/useFormKitSchema.d.ts CHANGED
@@ -27,5 +27,5 @@ export declare function useFormKitSchema(): {
27
27
  index: string;
28
28
  children: object[];
29
29
  };
30
- addListGroupFunctions: (data: any) => void;
30
+ addListGroupFunctions: (data: any, addNodeDefaultObject?: object) => void;
31
31
  };
package/dist/composables/useFormKitSchema.js CHANGED
@@ -48,30 +48,32 @@ function useFormKitSchema() {
48
48
  children
49
49
  };
50
50
  };
51
- function addListGroupFunctions(data) {
51
+ function addListGroupFunctions(data, addNodeDefaultObject = {}) {
52
52
  const swapElements = (array, index1, index2) => {
53
53
  array[index1] = array.splice(index2, 1, array[index1])[0];
54
54
  return array;
55
55
  };
56
- data.addNode = node => () => {
57
- const newArray = [...node.value, {}];
58
- node.input(newArray, false);
56
+ data.addNode = parentNode => () => {
57
+ const newArray = [...parentNode.value, addNodeDefaultObject];
58
+ parentNode.input(newArray, false);
59
59
  };
60
- data.removeNode = (node, index) => () => {
61
- node.input(node._value.filter((_, i) => i !== index), false);
60
+ data.removeNode = (parentNode, index) => () => {
61
+ parentNode.input(parentNode._value.filter((_, i) => i !== index), false);
62
62
  };
63
- data.moveNodeUp = (node, index) => () => {
64
- const array = [...node.value];
65
- if (index > 0) node.input(swapElements(array, index - 1, index), false);
63
+ data.moveNodeUp = (parentNode, index) => () => {
64
+ const array = [...parentNode.value];
65
+ if (index > 0) parentNode.input(swapElements(array, index - 1, index), false);
66
66
  };
67
- data.moveNodeDown = (node, index) => () => {
68
- const array = [...node.value];
69
- if (index < array.length - 1) node.input(swapElements(array, index, index + 1), false);
67
+ data.moveNodeDown = (parentNode, index) => () => {
68
+ const array = [...parentNode.value];
69
+ if (index < array.length - 1) parentNode.input(swapElements(array, index, index + 1), false);
70
70
  };
71
- data.insertDuplicate = (node, index) => () => {
72
- const obj = node.value[index];
73
- const newArray = [...node.value, obj];
74
- node.input(newArray, false);
71
+ data.copyNode = (parentNode, index) => () => {
72
+ const obj = parentNode.value[index];
73
+ const newArray = [...parentNode.value, {
74
+ ...obj
75
+ }];
76
+ parentNode.input(newArray, false);
75
77
  };
76
78
  }
77
79
  return {
package/dist/composables/useFormKitSchema.mjs CHANGED
@@ -42,32 +42,32 @@ export function useFormKitSchema() {
42
42
  children
43
43
  };
44
44
  };
45
- function addListGroupFunctions(data) {
45
+ function addListGroupFunctions(data, addNodeDefaultObject = {}) {
46
46
  const swapElements = (array, index1, index2) => {
47
47
  array[index1] = array.splice(index2, 1, array[index1])[0];
48
48
  return array;
49
49
  };
50
- data.addNode = (node) => () => {
51
- const newArray = [...node.value, {}];
52
- node.input(newArray, false);
50
+ data.addNode = (parentNode) => () => {
51
+ const newArray = [...parentNode.value, addNodeDefaultObject];
52
+ parentNode.input(newArray, false);
53
53
  };
54
- data.removeNode = (node, index) => () => {
55
- node.input(node._value.filter((_, i) => i !== index), false);
54
+ data.removeNode = (parentNode, index) => () => {
55
+ parentNode.input(parentNode._value.filter((_, i) => i !== index), false);
56
56
  };
57
- data.moveNodeUp = (node, index) => () => {
58
- const array = [...node.value];
57
+ data.moveNodeUp = (parentNode, index) => () => {
58
+ const array = [...parentNode.value];
59
59
  if (index > 0)
60
- node.input(swapElements(array, index - 1, index), false);
60
+ parentNode.input(swapElements(array, index - 1, index), false);
61
61
  };
62
- data.moveNodeDown = (node, index) => () => {
63
- const array = [...node.value];
62
+ data.moveNodeDown = (parentNode, index) => () => {
63
+ const array = [...parentNode.value];
64
64
  if (index < array.length - 1)
65
- node.input(swapElements(array, index, index + 1), false);
65
+ parentNode.input(swapElements(array, index, index + 1), false);
66
66
  };
67
- data.insertDuplicate = (node, index) => () => {
68
- const obj = node.value[index];
69
- const newArray = [...node.value, obj];
70
- node.input(newArray, false);
67
+ data.copyNode = (parentNode, index) => () => {
68
+ const obj = parentNode.value[index];
69
+ const newArray = [...parentNode.value, { ...obj }];
70
+ parentNode.input(newArray, false);
71
71
  };
72
72
  }
73
73
  return { addComponent, addElement, addGroup, addList, addListGroup, addListGroupFunctions };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@sfxcode/formkit-primevue",
3
3
  "type": "module",
4
- "version": "1.9.0",
4
+ "version": "1.9.2",
5
5
  "author": {
6
6
  "name": "Tom",
7
7
  "email": "tom@sfxcode.com"
@@ -60,16 +60,16 @@
60
60
  "vue": "^3.4.0"
61
61
  },
62
62
  "dependencies": {
63
- "@formkit/addons": "^1.5.9",
64
- "@formkit/i18n": "^1.5.9",
65
- "@formkit/vue": "^1.5.9",
63
+ "@formkit/addons": "^1.6.0",
64
+ "@formkit/i18n": "^1.6.0",
65
+ "@formkit/vue": "^1.6.0",
66
66
  "primeicons": "^6.0.1",
67
67
  "primevue": "^3.49.1"
68
68
  },
69
69
  "devDependencies": {
70
70
  "@antfu/eslint-config": "2.8.0",
71
- "@formkit/core": "^1.5.9",
72
- "@types/node": "^20.11.24",
71
+ "@formkit/core": "^1.6.0",
72
+ "@types/node": "^20.11.25",
73
73
  "@unocss/preset-icons": "^0.58.5",
74
74
  "@unocss/preset-uno": "0.58.5",
75
75
  "@vitejs/plugin-vue": "^5.0.4",
@@ -89,13 +89,13 @@
89
89
  "quill": "^1.3.7",
90
90
  "sass": "^1.71.1",
91
91
  "tslib": "^2.6.2",
92
- "typescript": "^5.3.3",
92
+ "typescript": "^5.4.2",
93
93
  "unbuild": "2.0.0",
94
94
  "unocss": "^0.58.5",
95
95
  "unplugin-auto-import": "^0.17.5",
96
96
  "unplugin-vue-components": "^0.26.0",
97
97
  "vanilla-jsoneditor": "^0.22.0",
98
- "vite": "^5.1.5",
98
+ "vite": "^5.1.6",
99
99
  "vite-plugin-dts": "^3.7.3",
100
100
  "vite-plugin-eslint": "^1.8.1",
101
101
  "vite-plugin-pages": "^0.32.0",
@@ -104,7 +104,7 @@
104
104
  "vue": "^3.4.21",
105
105
  "vue-demi": "^0.14.7",
106
106
  "vue-router": "^4.3.0",
107
- "vue-tsc": "^2.0.5"
107
+ "vue-tsc": "^2.0.6"
108
108
  },
109
109
  "scripts": {
110
110
  "build": "unbuild",