@sfxcode/formkit-primevue 2.8.6 → 2.8.7
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.
|
@@ -1,31 +1,61 @@
|
|
|
1
1
|
<script setup lang='ts'>
|
|
2
2
|
import type { FormKitFrameworkContext } from '@formkit/core'
|
|
3
3
|
import type { PropType } from 'vue'
|
|
4
|
+
import { computed } from 'vue'
|
|
4
5
|
import { useFormKitSection } from '../composables'
|
|
5
6
|
|
|
7
|
+
export interface FormKitOutputListProps {
|
|
8
|
+
listStyle?: 'div' | 'ul' | 'ol' | 'span'
|
|
9
|
+
}
|
|
10
|
+
|
|
6
11
|
const props = defineProps({
|
|
7
12
|
context: {
|
|
8
|
-
type: Object as PropType<FormKitFrameworkContext>,
|
|
13
|
+
type: Object as PropType<FormKitFrameworkContext & FormKitOutputListProps>,
|
|
9
14
|
required: true,
|
|
10
15
|
},
|
|
11
16
|
})
|
|
12
17
|
|
|
18
|
+
const listStyle = computed(() => {
|
|
19
|
+
return props.context?.listStyle || 'span'
|
|
20
|
+
})
|
|
21
|
+
|
|
13
22
|
const { hasPrefix, hasPrefixIcon, hasSuffix, hasSuffixIcon } = useFormKitSection(props.context)
|
|
14
23
|
</script>
|
|
15
24
|
|
|
16
25
|
<template>
|
|
17
26
|
<div class="p-formkit p-output-list">
|
|
18
27
|
<i v-if="hasPrefixIcon" class="formkit-prefix-icon" :class="context?.iconPrefix" />
|
|
19
|
-
<span v-if="hasPrefix" class="formkit-prefix">
|
|
28
|
+
<span v-if="hasPrefix && listStyle === 'span'" class="formkit-prefix">
|
|
20
29
|
{{ context?.prefix }}
|
|
21
30
|
</span>
|
|
22
|
-
<span :id="context?.id" :style="context?.attrs?.style" class="p-output-list-items" :class="context?.attrs?.class">
|
|
31
|
+
<span v-if="listStyle === 'span'" :id="context?.id" :style="context?.attrs?.style" class="p-output-list-items" :class="context?.attrs?.class">
|
|
23
32
|
<template v-for="(value, index) of context?._value" :key="index">
|
|
24
33
|
<span v-if="index !== 0" class="p-output-list-divider" :class="context?.dividerClass">{{ context?.divider ?? ', ' }}</span>
|
|
25
34
|
<span class="p-output-list-item" :class="context?.itemClass">{{ value }}</span>
|
|
26
35
|
</template>
|
|
27
36
|
</span>
|
|
28
|
-
<
|
|
37
|
+
<div v-if="listStyle === 'div'" :id="context?.id" :style="context?.attrs?.style" class="p-output-list-items" :class="context?.attrs?.class">
|
|
38
|
+
<template v-for="(value, index) of context?._value" :key="index">
|
|
39
|
+
<div class="p-output-list-item" :class="context?.itemClass">
|
|
40
|
+
{{ value }}
|
|
41
|
+
</div>
|
|
42
|
+
</template>
|
|
43
|
+
</div>
|
|
44
|
+
<ul v-if="listStyle === 'ul'" :id="context?.id" :style="context?.attrs?.style" class="p-output-list-items" :class="context?.attrs?.class">
|
|
45
|
+
<li v-for="(value, index) of context?._value" :key="index">
|
|
46
|
+
<span class="p-output-list-item" :class="context?.itemClass">
|
|
47
|
+
{{ value }}
|
|
48
|
+
</span>
|
|
49
|
+
</li>
|
|
50
|
+
</ul>
|
|
51
|
+
<ol v-if="listStyle === 'ol'" :id="context?.id" :style="context?.attrs?.style" class="p-output-list-items" :class="context?.attrs?.class">
|
|
52
|
+
<li v-for="(value, index) of context?._value" :key="index">
|
|
53
|
+
<span class="p-output-list-item" :class="context?.itemClass">
|
|
54
|
+
{{ value }}
|
|
55
|
+
</span>
|
|
56
|
+
</li>
|
|
57
|
+
</ol>
|
|
58
|
+
<span v-if="hasSuffix && listStyle === 'span'" class="formkit-suffix">
|
|
29
59
|
{{ context?.suffix }}
|
|
30
60
|
</span>
|
|
31
61
|
<i v-if="hasSuffixIcon" class="formkit-suffix-icon" :class="context?.iconSuffix" />
|
|
@@ -36,5 +36,5 @@ const primeOutputDurationDefinition = exports.primeOutputDurationDefinition = (0
|
|
|
36
36
|
props: ["prefix", "suffix", "iconPrefix", "iconSuffix"]
|
|
37
37
|
});
|
|
38
38
|
const primeOutputListDefinition = exports.primeOutputListDefinition = (0, _vue.createInput)(_PrimeOutputList.default, {
|
|
39
|
-
props: ["prefix", "suffix", "iconPrefix", "iconSuffix", "divider", "itemClass", "dividerClass"]
|
|
39
|
+
props: ["prefix", "suffix", "iconPrefix", "iconSuffix", "divider", "itemClass", "dividerClass", "listStyle"]
|
|
40
40
|
});
|
|
@@ -29,5 +29,5 @@ export const primeOutputDurationDefinition = createInput(PrimeOutputDuration, {
|
|
|
29
29
|
props: ["prefix", "suffix", "iconPrefix", "iconSuffix"]
|
|
30
30
|
});
|
|
31
31
|
export const primeOutputListDefinition = createInput(PrimeOutputList, {
|
|
32
|
-
props: ["prefix", "suffix", "iconPrefix", "iconSuffix", "divider", "itemClass", "dividerClass"]
|
|
32
|
+
props: ["prefix", "suffix", "iconPrefix", "iconSuffix", "divider", "itemClass", "dividerClass", "listStyle"]
|
|
33
33
|
});
|
|
@@ -179,7 +179,7 @@ $grid-breakpoints: (
|
|
|
179
179
|
.p-formkit-data-view {
|
|
180
180
|
.formkit-form {
|
|
181
181
|
.formkit-outer {
|
|
182
|
-
padding-bottom: 0.
|
|
182
|
+
padding-bottom: 0.5rem;
|
|
183
183
|
}
|
|
184
184
|
|
|
185
185
|
&.form-horizontal {
|
|
@@ -187,8 +187,15 @@ $grid-breakpoints: (
|
|
|
187
187
|
}
|
|
188
188
|
|
|
189
189
|
.formkit-help {
|
|
190
|
+
padding-top: 0.25rem;
|
|
190
191
|
margin: 0;
|
|
191
192
|
}
|
|
193
|
+
|
|
194
|
+
ul, ol {
|
|
195
|
+
padding-inline-start: 1rem;
|
|
196
|
+
margin-block-start: 0;
|
|
197
|
+
margin-block-end: 0;
|
|
198
|
+
}
|
|
192
199
|
}
|
|
193
200
|
}
|
|
194
201
|
|
package/dist/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--formkit-error-color: #ef9a9a}.formkit-form .formkit-messages{margin:.125rem 0;padding-top:.5rem;padding-left:.5rem}.formkit-form .formkit-message{list-style:none;padding:0;margin:0;color:var(--formkit-error-color);font-size:.8rem}.formkit-form .formkit-outer{padding-bottom:.8rem}.formkit-form .formkit-outer .formkit-messages{margin:.125rem 0;padding-top:.25rem;padding-left:0}.formkit-form .formkit-outer .formkit-inner .p-formkit .p-formkit-icon{box-sizing:border-box;width:100%}.formkit-form .formkit-outer .formkit-inner .p-formkit .p-inputtext,.formkit-form .formkit-outer .formkit-inner .p-formkit .p-textarea,.formkit-form .formkit-outer .formkit-inner .p-formkit .p-password,.formkit-form .formkit-outer .formkit-inner .p-formkit .p-multiselect,.formkit-form .formkit-outer .formkit-inner .p-formkit .p-select,.formkit-form .formkit-outer .formkit-inner .p-formkit .p-editor{box-sizing:border-box;width:100%}.formkit-form .formkit-outer .formkit-inner .p-formkit .p-inputtext.p-colorpicker-preview,.formkit-form .formkit-outer .formkit-inner .p-formkit .p-textarea.p-colorpicker-preview,.formkit-form .formkit-outer .formkit-inner .p-formkit .p-password.p-colorpicker-preview,.formkit-form .formkit-outer .formkit-inner .p-formkit .p-multiselect.p-colorpicker-preview,.formkit-form .formkit-outer .formkit-inner .p-formkit .p-select.p-colorpicker-preview,.formkit-form .formkit-outer .formkit-inner .p-formkit .p-editor.p-colorpicker-preview{width:2rem}.formkit-form .formkit-outer .formkit-help{margin:.25rem 0 0 0;font-size:.8rem;color:var(--text-color-secondary)}.formkit-form .formkit-label{display:block;margin:0;padding-bottom:.5rem;font-weight:bold;font-size:.8rem}.formkit-form .p-formkit>*{margin-right:.5rem}.formkit-form .p-formkit>*:last-child,.formkit-form .p-formkit>*:only-child{margin-right:0}.formkit-form .p-formkit-options{display:flex;flex-wrap:wrap;gap:.5rem}.formkit-form .p-formkit-options .p-formkit-option{display:flex;align-items:center}.formkit-form .p-formkit-options .p-formkit-option label{margin-left:.5rem}.formkit-form .formkit-fieldset{margin:0;padding:0;border-radius:0;border:0}.formkit-form .formkit-fieldset:focus-within{border:0}.formkit-form .formkit-fieldset>.formkit-help{margin-top:0;margin-bottom:0}.formkit-form .formkit-legend{display:block;margin:0;padding:0}.formkit-form .formkit-actions{padding-top:.5rem;display:flex}.formkit-form .formkit-actions button{margin-right:.5rem}.formkit-form .p-action-buttons{margin-top:.25rem}.formkit-form .p-action-buttons .p-button{margin-right:.5rem}.formkit-form .p-action-buttons span .p-space{margin-right:3rem}.formkit-form .p-chip-item{align-items:center;background:var(--p-surface-500);color:var(--p-surface-0);border-radius:1rem;padding:.2rem .5rem}.p-formkit-data-view .formkit-form .formkit-outer{padding-bottom:.
|
|
1
|
+
:root{--formkit-error-color: #ef9a9a}.formkit-form .formkit-messages{margin:.125rem 0;padding-top:.5rem;padding-left:.5rem}.formkit-form .formkit-message{list-style:none;padding:0;margin:0;color:var(--formkit-error-color);font-size:.8rem}.formkit-form .formkit-outer{padding-bottom:.8rem}.formkit-form .formkit-outer .formkit-messages{margin:.125rem 0;padding-top:.25rem;padding-left:0}.formkit-form .formkit-outer .formkit-inner .p-formkit .p-formkit-icon{box-sizing:border-box;width:100%}.formkit-form .formkit-outer .formkit-inner .p-formkit .p-inputtext,.formkit-form .formkit-outer .formkit-inner .p-formkit .p-textarea,.formkit-form .formkit-outer .formkit-inner .p-formkit .p-password,.formkit-form .formkit-outer .formkit-inner .p-formkit .p-multiselect,.formkit-form .formkit-outer .formkit-inner .p-formkit .p-select,.formkit-form .formkit-outer .formkit-inner .p-formkit .p-editor{box-sizing:border-box;width:100%}.formkit-form .formkit-outer .formkit-inner .p-formkit .p-inputtext.p-colorpicker-preview,.formkit-form .formkit-outer .formkit-inner .p-formkit .p-textarea.p-colorpicker-preview,.formkit-form .formkit-outer .formkit-inner .p-formkit .p-password.p-colorpicker-preview,.formkit-form .formkit-outer .formkit-inner .p-formkit .p-multiselect.p-colorpicker-preview,.formkit-form .formkit-outer .formkit-inner .p-formkit .p-select.p-colorpicker-preview,.formkit-form .formkit-outer .formkit-inner .p-formkit .p-editor.p-colorpicker-preview{width:2rem}.formkit-form .formkit-outer .formkit-help{margin:.25rem 0 0 0;font-size:.8rem;color:var(--text-color-secondary)}.formkit-form .formkit-label{display:block;margin:0;padding-bottom:.5rem;font-weight:bold;font-size:.8rem}.formkit-form .p-formkit>*{margin-right:.5rem}.formkit-form .p-formkit>*:last-child,.formkit-form .p-formkit>*:only-child{margin-right:0}.formkit-form .p-formkit-options{display:flex;flex-wrap:wrap;gap:.5rem}.formkit-form .p-formkit-options .p-formkit-option{display:flex;align-items:center}.formkit-form .p-formkit-options .p-formkit-option label{margin-left:.5rem}.formkit-form .formkit-fieldset{margin:0;padding:0;border-radius:0;border:0}.formkit-form .formkit-fieldset:focus-within{border:0}.formkit-form .formkit-fieldset>.formkit-help{margin-top:0;margin-bottom:0}.formkit-form .formkit-legend{display:block;margin:0;padding:0}.formkit-form .formkit-actions{padding-top:.5rem;display:flex}.formkit-form .formkit-actions button{margin-right:.5rem}.formkit-form .p-action-buttons{margin-top:.25rem}.formkit-form .p-action-buttons .p-button{margin-right:.5rem}.formkit-form .p-action-buttons span .p-space{margin-right:3rem}.formkit-form .p-chip-item{align-items:center;background:var(--p-surface-500);color:var(--p-surface-0);border-radius:1rem;padding:.2rem .5rem}.p-formkit-data-view .formkit-form .formkit-outer{padding-bottom:.5rem}.p-formkit-data-view .formkit-form.form-horizontal{padding-bottom:.8rem}.p-formkit-data-view .formkit-form .formkit-help{padding-top:.25rem;margin:0}.p-formkit-data-view .formkit-form ul,.p-formkit-data-view .formkit-form ol{padding-inline-start:1rem;margin-block-start:0;margin-block-end:0}.p-formkit-data-edit .formkit-form .formkit-outer[data-type=primeCheckbox] .formkit-wrapper{display:flex;flex-wrap:wrap}.p-formkit-data-edit .formkit-form .formkit-outer[data-type=primeCheckbox] .formkit-wrapper .formkit-inner{width:auto !important}.p-formkit-data-edit .formkit-form .formkit-outer[data-type=primeCheckbox] .formkit-wrapper label{width:auto;order:2;padding:.125rem 0}.p-formkit-data-edit .formkit-form .formkit-outer[data-type=primeCheckbox] .formkit-wrapper label:after{content:""}.p-formkit-data-edit .formkit-form .formkit-outer[data-type=primeCheckbox] .formkit-wrapper label+.formkit-inner{margin-left:0 !important;order:1;flex-basis:2rem;flex-grow:0;flex-shrink:0;overflow:hidden}.p-formkit-data-edit .formkit-form .formkit-outer[data-type=primeCheckbox] .formkit-wrapper label+.formkit-inner:has(label){flex-grow:1;flex-basis:100%}.p-formkit-data-edit .formkit-form .formkit-outer[data-type=primeCheckbox] .formkit-wrapper label:first-child:nth-last-child(3),.p-formkit-data-edit .formkit-form .formkit-outer[data-type=primeCheckbox] .formkit-wrapper label:first-child:nth-last-child(3)~label{width:auto}.p-formkit-data-edit .formkit-form .formkit-outer[data-type=primeCheckbox] .formkit-wrapper label:first-child:nth-last-child(3){order:1}.p-formkit-data-edit .formkit-form .formkit-outer[data-type=primeCheckbox] .formkit-wrapper label:first-child:nth-last-child(3)+div.p-checkbox{order:2;width:auto}.p-formkit-data-edit .formkit-form .formkit-outer[data-type=primeCheckbox] .formkit-wrapper label:first-child:nth-last-child(3)~label{order:3}.p-formkit-data-edit .formkit-form .formkit-outer[data-type=primeCheckbox] .formkit-wrapper .formkit-inner:first-child{margin-left:0 !important}.p-formkit-data-edit .formkit-form .formkit-outer[data-type=primeCheckbox] .formkit-wrapper .formkit-inner:first-child .p-formkit{display:flex}.p-formkit-data-edit .formkit-form .formkit-outer[data-type=primeCheckbox] .formkit-wrapper .p-checkbox:not(:only-child){width:2rem;overflow:hidden}.p-formkit-data-edit .formkit-form .formkit-outer[data-type=primeCheckbox] .formkit-help{width:auto !important}.p-formkit-data-debug pre,.p-formkit-data-debug span{font-size:.75rem;line-height:1rem}@media(min-width: 1024px){.formkit-form{display:flex;flex-wrap:wrap;margin-left:-0.5rem;margin-right:-0.5rem}.formkit-form>*{flex-shrink:0;width:100%;max-width:100%;padding-left:.5rem;padding-right:.5rem}.col-1{width:8.3333333333%}.col-2{width:16.6666666667%}.col-3{width:25%}.col-4{width:33.3333333333%}.col-5{width:41.6666666667%}.col-6{width:50%}.col-7{width:58.3333333333%}.col-8{width:66.6666666667%}.col-9{width:75%}.col-10{width:83.3333333333%}.col-11{width:91.6666666667%}.col-12{width:100%}}@media(min-width: 768px){.formkit-form.form-horizontal .formkit-wrapper{display:flex}.formkit-form.form-horizontal .formkit-wrapper label{display:inline-block;padding:0 .25rem 0 0;font-size:inherit}.formkit-form.form-horizontal .formkit-wrapper label:after{content:":"}}@media(min-width: 768px)and (min-width: 768px){.formkit-form.form-horizontal.form-horizontal-checkbox-indent .formkit-outer[data-type=primeCheckbox]{padding-left:33.3333333333%}}@media(min-width: 768px){.p-formkit-data-view .formkit-form.form-horizontal label{white-space:nowrap}.p-formkit-data-edit .formkit-form.form-horizontal .formkit-outer{width:100%}.p-formkit-data-edit .formkit-form.form-horizontal .formkit-outer label{width:33.3333333333%;padding-top:.25rem;line-height:normal}.p-formkit-data-edit .formkit-form.form-horizontal .formkit-outer .formkit-inner{width:66.6666666667%}.p-formkit-data-edit .formkit-form.form-horizontal div[data-type=primeCheckbox] .formkit-inner{margin-left:auto}.p-formkit-data-edit .formkit-form.form-horizontal div[data-type=primeCheckbox] .formkit-inner .p-formkit{display:flex}.p-formkit-data-edit .formkit-form.form-horizontal div[data-type=primeCheckbox] .formkit-inner label{width:auto;padding:0}.p-formkit-data-edit .formkit-form.form-horizontal .formkit-help,.p-formkit-data-edit .formkit-form.form-horizontal .formkit-messages{width:66.6666666667%;margin-left:auto}}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sfxcode/formkit-primevue",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "2.8.
|
|
4
|
+
"version": "2.8.7",
|
|
5
5
|
"packageManager": "pnpm@10.10.0+sha512.d615db246fe70f25dcfea6d8d73dee782ce23e2245e3c4f6f888249fb568149318637dca73c2c5c8ef2a4ca0d5657fb9567188bfab47f566d1ee6ce987815c39",
|
|
6
6
|
"author": {
|
|
7
7
|
"name": "Tom",
|
|
@@ -103,7 +103,7 @@
|
|
|
103
103
|
"@antfu/eslint-config": "^4.13.0",
|
|
104
104
|
"@formkit/core": "^1.6.9",
|
|
105
105
|
"@primeuix/themes": "^1.1.1",
|
|
106
|
-
"@types/node": "^22.15.
|
|
106
|
+
"@types/node": "^22.15.18",
|
|
107
107
|
"@types/uuid": "^10.0.0",
|
|
108
108
|
"@unocss/preset-icons": "66.1.1",
|
|
109
109
|
"@unocss/preset-uno": "66.1.1",
|
|
@@ -114,7 +114,7 @@
|
|
|
114
114
|
"@vue/server-renderer": "^3.5.13",
|
|
115
115
|
"@vue/test-utils": "^2.4.6",
|
|
116
116
|
"@vue/tsconfig": "^0.7.0",
|
|
117
|
-
"@vueuse/core": "^13.
|
|
117
|
+
"@vueuse/core": "^13.2.0",
|
|
118
118
|
"@vueuse/head": "^2.0.0",
|
|
119
119
|
"changelogen": "^0.6.1",
|
|
120
120
|
"chart.js": "^4.4.9",
|