@narrative.io/jsonforms-provider-protocols 1.1.0-beta.2 → 1.1.0-beta.4
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.
- package/dist/jsonforms-provider-protocols.css +1 -1
- package/dist/vue/composables/useDerive.d.ts +13 -0
- package/dist/vue/composables/useDerive.d.ts.map +1 -0
- package/dist/vue/composables/useDerive.js +59 -0
- package/dist/vue/composables/useDerive.js.map +1 -0
- package/dist/vue/primevue/JfBoolean.vue.d.ts +1 -1
- package/dist/vue/primevue/JfEnum.vue.d.ts +1 -1
- package/dist/vue/primevue/JfEnum.vue.d.ts.map +1 -1
- package/dist/vue/primevue/JfEnum.vue.js +1 -1
- package/dist/vue/primevue/JfEnum.vue2.js +67 -9
- package/dist/vue/primevue/JfEnum.vue2.js.map +1 -1
- package/dist/vue/primevue/JfEnumArray.vue.d.ts +1 -1
- package/dist/vue/primevue/JfEnumArray.vue.d.ts.map +1 -1
- package/dist/vue/primevue/JfEnumArray.vue.js +56 -8
- package/dist/vue/primevue/JfEnumArray.vue.js.map +1 -1
- package/dist/vue/primevue/JfNumber.vue.d.ts +1 -1
- package/dist/vue/primevue/JfNumber.vue.d.ts.map +1 -1
- package/dist/vue/primevue/JfNumber.vue.js +15 -5
- package/dist/vue/primevue/JfNumber.vue.js.map +1 -1
- package/dist/vue/primevue/JfText.vue.d.ts +1 -1
- package/dist/vue/primevue/JfText.vue.d.ts.map +1 -1
- package/dist/vue/primevue/JfText.vue.js +94 -11
- package/dist/vue/primevue/JfText.vue.js.map +1 -1
- package/dist/vue/primevue/JfTextArea.vue.d.ts +1 -1
- package/dist/vue/primevue/JfTextArea.vue.d.ts.map +1 -1
- package/dist/vue/primevue/JfTextArea.vue.js +12 -6
- package/dist/vue/primevue/JfTextArea.vue.js.map +1 -1
- package/dist/vue/primevue/index.d.ts +1 -1
- package/package.json +1 -1
- package/src/vue/composables/useDerive.ts +85 -0
- package/src/vue/primevue/JfEnum.vue +88 -9
- package/src/vue/primevue/JfEnumArray.vue +76 -9
- package/src/vue/primevue/JfNumber.vue +19 -4
- package/src/vue/primevue/JfText.vue +115 -8
- package/src/vue/primevue/JfTextArea.vue +16 -5
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { type Ref } from "vue";
|
|
2
|
+
import { type ControlElement } from "@jsonforms/core";
|
|
3
|
+
interface DeriveOptions {
|
|
4
|
+
control: Ref<{
|
|
5
|
+
uischema: ControlElement;
|
|
6
|
+
path: string;
|
|
7
|
+
data: unknown;
|
|
8
|
+
}>;
|
|
9
|
+
handleChange: (path: string, value: unknown) => void;
|
|
10
|
+
}
|
|
11
|
+
export declare function useDerive({ control, handleChange }: DeriveOptions): void;
|
|
12
|
+
export {};
|
|
13
|
+
//# sourceMappingURL=useDerive.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useDerive.d.ts","sourceRoot":"","sources":["../../../src/vue/composables/useDerive.ts"],"names":[],"mappings":"AAAA,OAAO,EAA2B,KAAK,GAAG,EAAE,MAAM,KAAK,CAAC;AACxD,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAEtD,UAAU,aAAa;IACrB,OAAO,EAAE,GAAG,CAAC;QACX,QAAQ,EAAE,cAAc,CAAC;QACzB,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,EAAE,OAAO,CAAC;KACf,CAAC,CAAC;IACH,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;CACtD;AAED,wBAAgB,SAAS,CAAC,EAAE,OAAO,EAAE,YAAY,EAAE,EAAE,aAAa,QAwCjE"}
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
import { inject, computed, watch } from "vue";
|
|
2
|
+
import "@jsonforms/core";
|
|
3
|
+
function useDerive({ control, handleChange }) {
|
|
4
|
+
const injectedFormData = inject("formData", {
|
|
5
|
+
value: {}
|
|
6
|
+
});
|
|
7
|
+
const rootData = computed(() => injectedFormData.value || {});
|
|
8
|
+
const deriveConfig = computed(() => {
|
|
9
|
+
const options = control.value.uischema?.options;
|
|
10
|
+
return {
|
|
11
|
+
expression: options?.derive,
|
|
12
|
+
mode: options?.mode || "follow"
|
|
13
|
+
// 'follow' = auto-update, 'manual' = user controlled
|
|
14
|
+
};
|
|
15
|
+
});
|
|
16
|
+
watch(
|
|
17
|
+
[rootData, deriveConfig],
|
|
18
|
+
([data, config]) => {
|
|
19
|
+
if (!config.expression || config.mode !== "follow") {
|
|
20
|
+
return;
|
|
21
|
+
}
|
|
22
|
+
try {
|
|
23
|
+
const derivedValue = resolveDeriveExpression(config.expression, data);
|
|
24
|
+
if (derivedValue !== control.value.data) {
|
|
25
|
+
handleChange(control.value.path, derivedValue);
|
|
26
|
+
}
|
|
27
|
+
} catch (error) {
|
|
28
|
+
console.warn(
|
|
29
|
+
`Failed to derive value for ${control.value.path}:`,
|
|
30
|
+
error
|
|
31
|
+
);
|
|
32
|
+
}
|
|
33
|
+
},
|
|
34
|
+
{ deep: true, immediate: true }
|
|
35
|
+
);
|
|
36
|
+
}
|
|
37
|
+
function resolveDeriveExpression(expression, data) {
|
|
38
|
+
if (!expression.includes("(") && !expression.includes("+") && !expression.includes("?")) {
|
|
39
|
+
return resolvePropertyPath(expression, data);
|
|
40
|
+
}
|
|
41
|
+
return resolvePropertyPath(expression, data);
|
|
42
|
+
}
|
|
43
|
+
function resolvePropertyPath(path, data) {
|
|
44
|
+
if (!path || !data) return "";
|
|
45
|
+
const keys = path.split(".");
|
|
46
|
+
let value = data;
|
|
47
|
+
for (const key of keys) {
|
|
48
|
+
if (value && typeof value === "object" && key in value) {
|
|
49
|
+
value = value[key];
|
|
50
|
+
} else {
|
|
51
|
+
return null;
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
return value;
|
|
55
|
+
}
|
|
56
|
+
export {
|
|
57
|
+
useDerive
|
|
58
|
+
};
|
|
59
|
+
//# sourceMappingURL=useDerive.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useDerive.js","sources":["../../../src/vue/composables/useDerive.ts"],"sourcesContent":["import { computed, watch, inject, type Ref } from \"vue\";\nimport { type ControlElement } from \"@jsonforms/core\";\n\ninterface DeriveOptions {\n control: Ref<{\n uischema: ControlElement;\n path: string;\n data: unknown;\n }>;\n handleChange: (path: string, value: unknown) => void;\n}\n\nexport function useDerive({ control, handleChange }: DeriveOptions) {\n // Get the root form data from JSONForms context\n const injectedFormData = inject<{ value: unknown }>(\"formData\", {\n value: {},\n });\n const rootData = computed(() => injectedFormData.value || {});\n\n // Extract derive configuration from uischema options\n const deriveConfig = computed(() => {\n const options = control.value.uischema?.options as\n | { derive?: string; mode?: string }\n | undefined;\n return {\n expression: options?.derive,\n mode: options?.mode || \"follow\", // 'follow' = auto-update, 'manual' = user controlled\n };\n });\n\n // Watch for changes in form data and update derived field\n watch(\n [rootData, deriveConfig],\n ([data, config]) => {\n if (!config.expression || config.mode !== \"follow\") {\n return;\n }\n\n try {\n const derivedValue = resolveDeriveExpression(config.expression, data);\n if (derivedValue !== control.value.data) {\n handleChange(control.value.path, derivedValue);\n }\n } catch (error) {\n console.warn(\n `Failed to derive value for ${control.value.path}:`,\n error,\n );\n }\n },\n { deep: true, immediate: true },\n );\n}\n\nfunction resolveDeriveExpression(expression: string, data: unknown): unknown {\n // Handle simple property paths like \"country.name\"\n if (\n !expression.includes(\"(\") &&\n !expression.includes(\"+\") &&\n !expression.includes(\"?\")\n ) {\n return resolvePropertyPath(expression, data);\n }\n\n // For now, we'll only support simple property paths\n // Complex expressions would require a safe expression evaluator\n return resolvePropertyPath(expression, data);\n}\n\nfunction resolvePropertyPath(path: string, data: unknown): unknown {\n if (!path || !data) return \"\";\n\n const keys = path.split(\".\");\n let value: unknown = data;\n\n for (const key of keys) {\n if (value && typeof value === \"object\" && key in value) {\n value = (value as Record<string, unknown>)[key];\n } else {\n return null;\n }\n }\n\n return value;\n}\n"],"names":[],"mappings":";;AAYO,SAAS,UAAU,EAAE,SAAS,gBAA+B;AAElE,QAAM,mBAAmB,OAA2B,YAAY;AAAA,IAC9D,OAAO,CAAA;AAAA,EAAC,CACT;AACD,QAAM,WAAW,SAAS,MAAM,iBAAiB,SAAS,CAAA,CAAE;AAG5D,QAAM,eAAe,SAAS,MAAM;AAClC,UAAM,UAAU,QAAQ,MAAM,UAAU;AAGxC,WAAO;AAAA,MACL,YAAY,SAAS;AAAA,MACrB,MAAM,SAAS,QAAQ;AAAA;AAAA,IAAA;AAAA,EAE3B,CAAC;AAGD;AAAA,IACE,CAAC,UAAU,YAAY;AAAA,IACvB,CAAC,CAAC,MAAM,MAAM,MAAM;AAClB,UAAI,CAAC,OAAO,cAAc,OAAO,SAAS,UAAU;AAClD;AAAA,MACF;AAEA,UAAI;AACF,cAAM,eAAe,wBAAwB,OAAO,YAAY,IAAI;AACpE,YAAI,iBAAiB,QAAQ,MAAM,MAAM;AACvC,uBAAa,QAAQ,MAAM,MAAM,YAAY;AAAA,QAC/C;AAAA,MACF,SAAS,OAAO;AACd,gBAAQ;AAAA,UACN,8BAA8B,QAAQ,MAAM,IAAI;AAAA,UAChD;AAAA,QAAA;AAAA,MAEJ;AAAA,IACF;AAAA,IACA,EAAE,MAAM,MAAM,WAAW,KAAA;AAAA,EAAK;AAElC;AAEA,SAAS,wBAAwB,YAAoB,MAAwB;AAE3E,MACE,CAAC,WAAW,SAAS,GAAG,KACxB,CAAC,WAAW,SAAS,GAAG,KACxB,CAAC,WAAW,SAAS,GAAG,GACxB;AACA,WAAO,oBAAoB,YAAY,IAAI;AAAA,EAC7C;AAIA,SAAO,oBAAoB,YAAY,IAAI;AAC7C;AAEA,SAAS,oBAAoB,MAAc,MAAwB;AACjE,MAAI,CAAC,QAAQ,CAAC,KAAM,QAAO;AAE3B,QAAM,OAAO,KAAK,MAAM,GAAG;AAC3B,MAAI,QAAiB;AAErB,aAAW,OAAO,MAAM;AACtB,QAAI,SAAS,OAAO,UAAU,YAAY,OAAO,OAAO;AACtD,cAAS,MAAkC,GAAG;AAAA,IAChD,OAAO;AACL,aAAO;AAAA,IACT;AAAA,EACF;AAEA,SAAO;AACT;"}
|
|
@@ -66,10 +66,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
66
66
|
default: undefined;
|
|
67
67
|
};
|
|
68
68
|
}>> & Readonly<{}>, {
|
|
69
|
+
config: Record<string, any>;
|
|
69
70
|
enabled: boolean;
|
|
70
71
|
renderers: import("@jsonforms/core").JsonFormsRendererRegistryEntry[];
|
|
71
72
|
cells: import("@jsonforms/core").JsonFormsCellRendererRegistryEntry[];
|
|
72
|
-
config: Record<string, any>;
|
|
73
73
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
74
74
|
export default _default;
|
|
75
75
|
//# sourceMappingURL=JfBoolean.vue.d.ts.map
|
|
@@ -66,10 +66,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
66
66
|
default: undefined;
|
|
67
67
|
};
|
|
68
68
|
}>> & Readonly<{}>, {
|
|
69
|
+
config: Record<string, any>;
|
|
69
70
|
enabled: boolean;
|
|
70
71
|
renderers: import("@jsonforms/core").JsonFormsRendererRegistryEntry[];
|
|
71
72
|
cells: import("@jsonforms/core").JsonFormsCellRendererRegistryEntry[];
|
|
72
|
-
config: Record<string, any>;
|
|
73
73
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
74
74
|
export default _default;
|
|
75
75
|
//# sourceMappingURL=JfEnum.vue.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"JfEnum.vue.d.ts","sourceRoot":"","sources":["../../../src/vue/primevue/JfEnum.vue"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"JfEnum.vue.d.ts","sourceRoot":"","sources":["../../../src/vue/primevue/JfEnum.vue"],"names":[],"mappings":"AAoJA,OAAO,KAAK,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuPlE,wBAEG"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import _sfc_main from "./JfEnum.vue2.js";
|
|
2
2
|
/* empty css */
|
|
3
3
|
import _export_sfc from "../../_virtual/_plugin-vue_export-helper.js";
|
|
4
|
-
const JfEnum = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-
|
|
4
|
+
const JfEnum = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-feb82abc"]]);
|
|
5
5
|
export {
|
|
6
6
|
JfEnum as default
|
|
7
7
|
};
|
|
@@ -1,5 +1,7 @@
|
|
|
1
|
-
import { defineComponent, computed, createElementBlock, openBlock, createCommentVNode, createVNode, unref, toDisplayString } from "vue";
|
|
1
|
+
import { defineComponent, computed, inject, ref, createElementBlock, openBlock, createCommentVNode, createVNode, unref, toDisplayString } from "vue";
|
|
2
2
|
import { rendererProps, useJsonFormsControl } from "@jsonforms/vue";
|
|
3
|
+
import { useProvider } from "../composables/useProvider.js";
|
|
4
|
+
import { useDerive } from "../composables/useDerive.js";
|
|
3
5
|
import Dropdown from "primevue/dropdown";
|
|
4
6
|
const _hoisted_1 = { class: "flex flex-column gap-2" };
|
|
5
7
|
const _hoisted_2 = {
|
|
@@ -12,6 +14,11 @@ const _hoisted_3 = {
|
|
|
12
14
|
};
|
|
13
15
|
const _hoisted_4 = {
|
|
14
16
|
key: 2,
|
|
17
|
+
class: "p-error",
|
|
18
|
+
role: "alert"
|
|
19
|
+
};
|
|
20
|
+
const _hoisted_5 = {
|
|
21
|
+
key: 3,
|
|
15
22
|
class: "p-error"
|
|
16
23
|
};
|
|
17
24
|
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
@@ -33,11 +40,61 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
33
40
|
}));
|
|
34
41
|
return [];
|
|
35
42
|
};
|
|
36
|
-
const
|
|
37
|
-
|
|
43
|
+
const binding = computed(() => {
|
|
44
|
+
const provider = control.value.uischema?.options?.provider;
|
|
45
|
+
if (provider && typeof provider === "object" && !provider.load) {
|
|
46
|
+
return { ...provider, load: "mount" };
|
|
47
|
+
}
|
|
48
|
+
return provider;
|
|
49
|
+
});
|
|
50
|
+
const deps = computed(
|
|
51
|
+
() => control.value.schema?.["x-provider"]?.dependsOn ?? []
|
|
38
52
|
);
|
|
39
|
-
const
|
|
40
|
-
|
|
53
|
+
const depValues = computed(() => {
|
|
54
|
+
return deps.value.map((dep) => {
|
|
55
|
+
const path = dep.startsWith("#/") ? dep.slice(2) : dep;
|
|
56
|
+
const keys = path.replace(/\//g, ".").split(".");
|
|
57
|
+
let value = rootData.value;
|
|
58
|
+
for (const key of keys) {
|
|
59
|
+
if (value && typeof value === "object" && key in value) {
|
|
60
|
+
value = value[key];
|
|
61
|
+
} else {
|
|
62
|
+
return null;
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
return value;
|
|
66
|
+
});
|
|
67
|
+
});
|
|
68
|
+
const injectedFormData = inject("formData", { value: {} });
|
|
69
|
+
const rootData = computed(() => injectedFormData.value || {});
|
|
70
|
+
const {
|
|
71
|
+
items: providerItems,
|
|
72
|
+
loading,
|
|
73
|
+
error
|
|
74
|
+
} = useProvider(binding, {
|
|
75
|
+
data: rootData,
|
|
76
|
+
path: control.value.path,
|
|
77
|
+
dependsOnValues: depValues.value
|
|
78
|
+
});
|
|
79
|
+
const placeholder = computed(() => {
|
|
80
|
+
if (loading.value) return "Loading…";
|
|
81
|
+
return control.value.uischema?.options?.placeholder ?? control.value.description;
|
|
82
|
+
});
|
|
83
|
+
const options = computed(() => {
|
|
84
|
+
if (binding.value && providerItems.value.length > 0) {
|
|
85
|
+
return providerItems.value;
|
|
86
|
+
}
|
|
87
|
+
return toOptions(control.value.schema);
|
|
88
|
+
});
|
|
89
|
+
useDerive({ control, handleChange });
|
|
90
|
+
const hasInteracted = ref(false);
|
|
91
|
+
const showErrors = computed(() => hasInteracted.value && control.value.errors);
|
|
92
|
+
const onSelect = (val) => {
|
|
93
|
+
handleChange(control.value.path, val);
|
|
94
|
+
};
|
|
95
|
+
const onBlur = () => {
|
|
96
|
+
hasInteracted.value = true;
|
|
97
|
+
};
|
|
41
98
|
return (_ctx, _cache) => {
|
|
42
99
|
return openBlock(), createElementBlock("div", _hoisted_1, [
|
|
43
100
|
unref(control).label ? (openBlock(), createElementBlock("label", _hoisted_2, toDisplayString(unref(control).label), 1)) : createCommentVNode("", true),
|
|
@@ -49,12 +106,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
49
106
|
"option-value": "value",
|
|
50
107
|
"model-value": unref(control).data ?? null,
|
|
51
108
|
placeholder: placeholder.value,
|
|
52
|
-
disabled: !unref(control).enabled,
|
|
53
|
-
"aria-invalid": !!
|
|
109
|
+
disabled: !unref(control).enabled || unref(loading),
|
|
110
|
+
"aria-invalid": !!showErrors.value || void 0,
|
|
54
111
|
"show-clear": true,
|
|
55
|
-
"onUpdate:modelValue": onSelect
|
|
112
|
+
"onUpdate:modelValue": onSelect,
|
|
113
|
+
onBlur
|
|
56
114
|
}, null, 8, ["options", "model-value", "placeholder", "disabled", "aria-invalid"]),
|
|
57
|
-
unref(
|
|
115
|
+
unref(error) ? (openBlock(), createElementBlock("small", _hoisted_4, "Failed to load: " + toDisplayString(unref(error)), 1)) : showErrors.value ? (openBlock(), createElementBlock("small", _hoisted_5, toDisplayString(unref(control).errors), 1)) : createCommentVNode("", true)
|
|
58
116
|
]);
|
|
59
117
|
};
|
|
60
118
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"JfEnum.vue2.js","sources":["../../../src/vue/primevue/JfEnum.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { ControlElement, JsonSchema } from \"@jsonforms/core\";\nimport { rendererProps, useJsonFormsControl } from \"@jsonforms/vue\";\nimport { computed } from \"vue\";\nimport Dropdown from \"primevue/dropdown\";\n\ndefineOptions({ name: \"JfEnum\" });\n\nconst props = defineProps(rendererProps<ControlElement>());\nconst { control, handleChange } = useJsonFormsControl(props);\n\ntype Opt = { label: string; value: unknown };\nconst toOptions = (schema?: JsonSchema): Opt[] => {\n if (!schema) return [];\n const s = schema as {\n enum?: unknown[];\n oneOf?: Array<{ title?: string; const: unknown }>;\n };\n if (Array.isArray(s.enum))\n return s.enum.map((v: unknown) => ({ label: String(v), value: v }));\n if (Array.isArray(s.oneOf))\n return s.oneOf.map((o) => ({\n label: o.title ?? String(o.const),\n value: o.const,\n }));\n return [];\n};\n\nconst placeholder = computed<string | undefined>(\n ()
|
|
1
|
+
{"version":3,"file":"JfEnum.vue2.js","sources":["../../../src/vue/primevue/JfEnum.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { ControlElement, JsonSchema } from \"@jsonforms/core\";\nimport { rendererProps, useJsonFormsControl } from \"@jsonforms/vue\";\nimport { computed, ref, inject } from \"vue\";\nimport { useProvider } from \"../composables/useProvider\";\nimport { useDerive } from \"../composables/useDerive\";\nimport Dropdown from \"primevue/dropdown\";\n\ndefineOptions({ name: \"JfEnum\" });\n\nconst props = defineProps(rendererProps<ControlElement>());\nconst { control, handleChange } = useJsonFormsControl(props);\n\ntype Opt = { label: string; value: unknown };\nconst toOptions = (schema?: JsonSchema): Opt[] => {\n if (!schema) return [];\n const s = schema as {\n enum?: unknown[];\n oneOf?: Array<{ title?: string; const: unknown }>;\n };\n if (Array.isArray(s.enum))\n return s.enum.map((v: unknown) => ({ label: String(v), value: v }));\n if (Array.isArray(s.oneOf))\n return s.oneOf.map((o) => ({\n label: o.title ?? String(o.const),\n value: o.const,\n }));\n return [];\n};\n\n// Provider support\nconst binding = computed(() => {\n const provider = control.value.uischema?.options?.provider;\n // Ensure load property is set to 'mount' by default\n if (provider && typeof provider === \"object\" && !provider.load) {\n return { ...provider, load: \"mount\" };\n }\n return provider;\n});\n\nconst deps = computed(\n () =>\n ((\n (control.value.schema as Record<string, unknown>)?.[\n \"x-provider\"\n ] as Record<string, unknown>\n )?.dependsOn as string[]) ?? [],\n);\nconst depValues = computed(() => {\n return deps.value.map((dep) => {\n // Resolve dependency value from form data using JSON pointer-like path\n const path = dep.startsWith(\"#/\") ? dep.slice(2) : dep;\n const keys = path.replace(/\\//g, \".\").split(\".\");\n let value: unknown = rootData.value;\n for (const key of keys) {\n if (value && typeof value === \"object\" && key in value) {\n value = (value as Record<string, unknown>)[key];\n } else {\n return null;\n }\n }\n return value;\n });\n});\n\n// Get the root form data from JSONForms context for template URL resolution\nconst injectedFormData = inject<{ value: unknown }>(\"formData\", { value: {} });\nconst rootData = computed(() => injectedFormData.value || {});\n\n// Use provider if available, otherwise fall back to schema enum/oneOf\nconst {\n items: providerItems,\n loading,\n error,\n} = useProvider(binding, {\n data: rootData,\n path: control.value.path,\n dependsOnValues: depValues.value,\n});\n\nconst placeholder = computed<string | undefined>(() => {\n if (loading.value) return \"Loading…\";\n return (\n (control.value.uischema as { options?: { placeholder?: string } })?.options\n ?.placeholder ?? control.value.description\n );\n});\n\nconst options = computed(() => {\n // Use provider items if available, otherwise fall back to schema enum/oneOf\n if (binding.value && providerItems.value.length > 0) {\n return providerItems.value;\n }\n return toOptions(control.value.schema);\n});\n\n// Add derive functionality\nuseDerive({ control, handleChange });\n\n// Track user interaction\nconst hasInteracted = ref(false);\n\nconst showErrors = computed(() => hasInteracted.value && control.value.errors);\n\nconst onSelect = (val: unknown) => {\n handleChange(control.value.path, val);\n};\n\nconst onBlur = () => {\n hasInteracted.value = true;\n};\n</script>\n\n<template>\n <div class=\"flex flex-column gap-2\">\n <label v-if=\"control.label\" class=\"text-color text-left\">{{\n control.label\n }}</label>\n <div v-if=\"control.description\" class=\"text-color-secondary text-left\">\n {{ control.description }}\n </div>\n <Dropdown\n class=\"w-full\"\n :options=\"options\"\n option-label=\"label\"\n option-value=\"value\"\n :model-value=\"control.data ?? null\"\n :placeholder=\"placeholder\"\n :disabled=\"!control.enabled || loading\"\n :aria-invalid=\"!!showErrors || undefined\"\n :show-clear=\"true\"\n @update:model-value=\"onSelect\"\n @blur=\"onBlur\"\n />\n <small v-if=\"error\" class=\"p-error\" role=\"alert\"\n >Failed to load: {{ error }}</small\n >\n <small v-else-if=\"showErrors\" class=\"p-error\">{{ control.errors }}</small>\n </div>\n</template>\n\n<style scoped>\n:deep(.p-dropdown-label) {\n text-align: left;\n}\n</style>\n"],"names":["_openBlock","_createElementBlock","_unref","_toDisplayString","_createVNode"],"mappings":"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"}
|
|
@@ -66,10 +66,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
66
66
|
default: undefined;
|
|
67
67
|
};
|
|
68
68
|
}>> & Readonly<{}>, {
|
|
69
|
+
config: Record<string, any>;
|
|
69
70
|
enabled: boolean;
|
|
70
71
|
renderers: import("@jsonforms/core").JsonFormsRendererRegistryEntry[];
|
|
71
72
|
cells: import("@jsonforms/core").JsonFormsCellRendererRegistryEntry[];
|
|
72
|
-
config: Record<string, any>;
|
|
73
73
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
74
74
|
export default _default;
|
|
75
75
|
//# sourceMappingURL=JfEnumArray.vue.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"JfEnumArray.vue.d.ts","sourceRoot":"","sources":["../../../src/vue/primevue/JfEnumArray.vue"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"JfEnumArray.vue.d.ts","sourceRoot":"","sources":["../../../src/vue/primevue/JfEnumArray.vue"],"names":[],"mappings":"AA0JA,OAAO,KAAK,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiPlE,wBAEG"}
|
|
@@ -1,5 +1,7 @@
|
|
|
1
|
-
import { defineComponent, computed, createElementBlock, openBlock, createCommentVNode, createVNode, unref, toDisplayString } from "vue";
|
|
1
|
+
import { defineComponent, computed, inject, createElementBlock, openBlock, createCommentVNode, createVNode, unref, toDisplayString } from "vue";
|
|
2
2
|
import { rendererProps, useJsonFormsControl } from "@jsonforms/vue";
|
|
3
|
+
import { useProvider } from "../composables/useProvider.js";
|
|
4
|
+
import { useDerive } from "../composables/useDerive.js";
|
|
3
5
|
import MultiSelect from "primevue/multiselect";
|
|
4
6
|
const _hoisted_1 = { class: "flex flex-column gap-2" };
|
|
5
7
|
const _hoisted_2 = {
|
|
@@ -12,6 +14,11 @@ const _hoisted_3 = {
|
|
|
12
14
|
};
|
|
13
15
|
const _hoisted_4 = {
|
|
14
16
|
key: 2,
|
|
17
|
+
class: "p-error",
|
|
18
|
+
role: "alert"
|
|
19
|
+
};
|
|
20
|
+
const _hoisted_5 = {
|
|
21
|
+
key: 3,
|
|
15
22
|
class: "p-error"
|
|
16
23
|
};
|
|
17
24
|
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
@@ -33,12 +40,53 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
33
40
|
}));
|
|
34
41
|
return [];
|
|
35
42
|
};
|
|
36
|
-
const
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
43
|
+
const binding = computed(() => {
|
|
44
|
+
const provider = control.value.uischema?.options?.provider;
|
|
45
|
+
if (provider && typeof provider === "object" && !provider.load) {
|
|
46
|
+
return { ...provider, load: "mount" };
|
|
47
|
+
}
|
|
48
|
+
return provider;
|
|
49
|
+
});
|
|
50
|
+
const deps = computed(
|
|
51
|
+
() => control.value.schema?.["x-provider"]?.dependsOn ?? []
|
|
41
52
|
);
|
|
53
|
+
const depValues = computed(() => {
|
|
54
|
+
return deps.value.map((dep) => {
|
|
55
|
+
const path = dep.startsWith("#/") ? dep.slice(2) : dep;
|
|
56
|
+
const keys = path.replace(/\//g, ".").split(".");
|
|
57
|
+
let value = rootData.value;
|
|
58
|
+
for (const key of keys) {
|
|
59
|
+
if (value && typeof value === "object" && key in value) {
|
|
60
|
+
value = value[key];
|
|
61
|
+
} else {
|
|
62
|
+
return null;
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
return value;
|
|
66
|
+
});
|
|
67
|
+
});
|
|
68
|
+
const injectedFormData = inject("formData", { value: {} });
|
|
69
|
+
const rootData = computed(() => injectedFormData.value || {});
|
|
70
|
+
const {
|
|
71
|
+
items: providerItems,
|
|
72
|
+
loading,
|
|
73
|
+
error
|
|
74
|
+
} = useProvider(binding, {
|
|
75
|
+
data: rootData,
|
|
76
|
+
path: control.value.path,
|
|
77
|
+
dependsOnValues: depValues.value
|
|
78
|
+
});
|
|
79
|
+
const options = computed(() => {
|
|
80
|
+
if (binding.value && providerItems.value.length > 0) {
|
|
81
|
+
return providerItems.value;
|
|
82
|
+
}
|
|
83
|
+
return toOptions(control.value.schema?.items);
|
|
84
|
+
});
|
|
85
|
+
useDerive({ control, handleChange });
|
|
86
|
+
const placeholder = computed(() => {
|
|
87
|
+
if (loading.value) return "Loading…";
|
|
88
|
+
return control.value.uischema?.options?.placeholder ?? control.value.description;
|
|
89
|
+
});
|
|
42
90
|
const sameSet = (a, b) => {
|
|
43
91
|
if (!Array.isArray(a) || !Array.isArray(b) || a.length !== b.length)
|
|
44
92
|
return false;
|
|
@@ -69,11 +117,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
69
117
|
"option-value": "value",
|
|
70
118
|
"data-key": "value",
|
|
71
119
|
display: "chip",
|
|
72
|
-
disabled: !unref(control).enabled,
|
|
120
|
+
disabled: !unref(control).enabled || unref(loading),
|
|
73
121
|
"aria-invalid": !!unref(control).errors || void 0,
|
|
74
122
|
placeholder: placeholder.value
|
|
75
123
|
}, null, 8, ["modelValue", "options", "disabled", "aria-invalid", "placeholder"]),
|
|
76
|
-
unref(control).errors ? (openBlock(), createElementBlock("small",
|
|
124
|
+
unref(error) ? (openBlock(), createElementBlock("small", _hoisted_4, "Failed to load: " + toDisplayString(unref(error)), 1)) : unref(control).errors ? (openBlock(), createElementBlock("small", _hoisted_5, toDisplayString(unref(control).errors), 1)) : createCommentVNode("", true)
|
|
77
125
|
]);
|
|
78
126
|
};
|
|
79
127
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"JfEnumArray.vue.js","sources":["../../../src/vue/primevue/JfEnumArray.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { ControlElement, JsonSchema } from \"@jsonforms/core\";\nimport { rendererProps, useJsonFormsControl } from \"@jsonforms/vue\";\nimport { computed } from \"vue\";\nimport MultiSelect from \"primevue/multiselect\";\n\ndefineOptions({ name: \"JfEnumArray\" });\n\nconst props = defineProps(rendererProps<ControlElement>());\nconst { control, handleChange } = useJsonFormsControl(props);\n\ntype Opt = { label: string; value: unknown };\nconst toOptions = (schema?: JsonSchema): Opt[] => {\n if (!schema) return [];\n const s = schema as {\n enum?: unknown[];\n oneOf?: Array<{ title?: string; const: unknown }>;\n };\n if (Array.isArray(s.enum))\n return s.enum.map((v: unknown) => ({ label: String(v), value: v }));\n if (Array.isArray(s.oneOf))\n return s.oneOf.map((o) => ({\n label: o.title ?? String(o.const),\n value: o.const,\n }));\n return [];\n};\n\nconst options = computed(() =>\n toOptions((control.value.schema as { items?: JsonSchema })?.items)
|
|
1
|
+
{"version":3,"file":"JfEnumArray.vue.js","sources":["../../../src/vue/primevue/JfEnumArray.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { ControlElement, JsonSchema } from \"@jsonforms/core\";\nimport { rendererProps, useJsonFormsControl } from \"@jsonforms/vue\";\nimport { computed, inject } from \"vue\";\nimport { useProvider } from \"../composables/useProvider\";\nimport { useDerive } from \"../composables/useDerive\";\nimport MultiSelect from \"primevue/multiselect\";\n\ndefineOptions({ name: \"JfEnumArray\" });\n\nconst props = defineProps(rendererProps<ControlElement>());\nconst { control, handleChange } = useJsonFormsControl(props);\n\ntype Opt = { label: string; value: unknown };\nconst toOptions = (schema?: JsonSchema): Opt[] => {\n if (!schema) return [];\n const s = schema as {\n enum?: unknown[];\n oneOf?: Array<{ title?: string; const: unknown }>;\n };\n if (Array.isArray(s.enum))\n return s.enum.map((v: unknown) => ({ label: String(v), value: v }));\n if (Array.isArray(s.oneOf))\n return s.oneOf.map((o) => ({\n label: o.title ?? String(o.const),\n value: o.const,\n }));\n return [];\n};\n\n// Provider support\nconst binding = computed(() => {\n const provider = control.value.uischema?.options?.provider;\n // Ensure load property is set to 'mount' by default\n if (provider && typeof provider === \"object\" && !provider.load) {\n return { ...provider, load: \"mount\" };\n }\n return provider;\n});\n\nconst deps = computed(\n () =>\n ((\n (control.value.schema as Record<string, unknown>)?.[\n \"x-provider\"\n ] as Record<string, unknown>\n )?.dependsOn as string[]) ?? [],\n);\nconst depValues = computed(() => {\n return deps.value.map((dep) => {\n // Resolve dependency value from form data using JSON pointer-like path\n const path = dep.startsWith(\"#/\") ? dep.slice(2) : dep;\n const keys = path.replace(/\\//g, \".\").split(\".\");\n let value: unknown = rootData.value;\n for (const key of keys) {\n if (value && typeof value === \"object\" && key in value) {\n value = (value as Record<string, unknown>)[key];\n } else {\n return null;\n }\n }\n return value;\n });\n});\n\n// Get the root form data from JSONForms context for template URL resolution\nconst injectedFormData = inject<{ value: unknown }>(\"formData\", { value: {} });\nconst rootData = computed(() => injectedFormData.value || {});\n\n// Use provider if available, otherwise fall back to schema enum/oneOf\nconst {\n items: providerItems,\n loading,\n error,\n} = useProvider(binding, {\n data: rootData,\n path: control.value.path,\n dependsOnValues: depValues.value,\n});\n\nconst options = computed(() => {\n // Use provider items if available, otherwise fall back to schema enum/oneOf\n if (binding.value && providerItems.value.length > 0) {\n return providerItems.value;\n }\n return toOptions((control.value.schema as { items?: JsonSchema })?.items);\n});\n\n// Add derive functionality\nuseDerive({ control, handleChange });\n\nconst placeholder = computed<string | undefined>(() => {\n if (loading.value) return \"Loading…\";\n return (\n (control.value.uischema as { options?: { placeholder?: string } })?.options\n ?.placeholder ?? control.value.description\n );\n});\n\n// order-insensitive shallow equality for primitive enums\nconst sameSet = (a: unknown[], b: unknown[]) => {\n if (!Array.isArray(a) || !Array.isArray(b) || a.length !== b.length)\n return false;\n const s = new Set(b);\n return a.every((v) => s.has(v));\n};\n\n// v-model with guard to avoid recursive updates\nconst model = computed<unknown[]>({\n get() {\n const curr = Array.isArray(control.value.data) ? control.value.data : [];\n // return a fresh copy so PrimeMultiSelect can't mutate JSONForms' array in place\n return [...curr];\n },\n set(val) {\n const next = Array.isArray(val) ? [...val] : [];\n const curr = Array.isArray(control.value.data) ? control.value.data : [];\n if (!sameSet(curr, next)) handleChange(control.value.path, next);\n },\n});\n</script>\n\n<template>\n <div class=\"flex flex-column gap-2\">\n <label v-if=\"control.label\" class=\"text-color text-left\">{{\n control.label\n }}</label>\n <div v-if=\"control.description\" class=\"text-color-secondary text-left\">\n {{ control.description }}\n </div>\n\n <MultiSelect\n v-model=\"model\"\n class=\"w-full\"\n :options=\"options\"\n option-label=\"label\"\n option-value=\"value\"\n data-key=\"value\"\n display=\"chip\"\n :disabled=\"!control.enabled || loading\"\n :aria-invalid=\"!!control.errors || undefined\"\n :placeholder=\"placeholder\"\n />\n\n <small v-if=\"error\" class=\"p-error\" role=\"alert\"\n >Failed to load: {{ error }}</small\n >\n <small v-else-if=\"control.errors\" class=\"p-error\">{{\n control.errors\n }}</small>\n </div>\n</template>\n"],"names":["_openBlock","_createElementBlock","_unref","_toDisplayString","_createVNode"],"mappings":"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"}
|
|
@@ -66,10 +66,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
66
66
|
default: undefined;
|
|
67
67
|
};
|
|
68
68
|
}>> & Readonly<{}>, {
|
|
69
|
+
config: Record<string, any>;
|
|
69
70
|
enabled: boolean;
|
|
70
71
|
renderers: import("@jsonforms/core").JsonFormsRendererRegistryEntry[];
|
|
71
72
|
cells: import("@jsonforms/core").JsonFormsCellRendererRegistryEntry[];
|
|
72
|
-
config: Record<string, any>;
|
|
73
73
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
74
74
|
export default _default;
|
|
75
75
|
//# sourceMappingURL=JfNumber.vue.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"JfNumber.vue.d.ts","sourceRoot":"","sources":["../../../src/vue/primevue/JfNumber.vue"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"JfNumber.vue.d.ts","sourceRoot":"","sources":["../../../src/vue/primevue/JfNumber.vue"],"names":[],"mappings":"AAmGA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmMtD,wBAEG"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { defineComponent, computed, createElementBlock, openBlock, createCommentVNode, createVNode, unref, toDisplayString } from "vue";
|
|
1
|
+
import { defineComponent, computed, ref, createElementBlock, openBlock, createCommentVNode, createVNode, unref, toDisplayString } from "vue";
|
|
2
2
|
import { rendererProps, useJsonFormsControl } from "@jsonforms/vue";
|
|
3
|
+
import { useDerive } from "../composables/useDerive.js";
|
|
3
4
|
import InputNumber from "primevue/inputnumber";
|
|
4
5
|
const _hoisted_1 = { class: "flex flex-column gap-2" };
|
|
5
6
|
const _hoisted_2 = {
|
|
@@ -27,6 +28,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
27
28
|
const placeholder = computed(
|
|
28
29
|
() => options.value.placeholder ?? control.value.description
|
|
29
30
|
);
|
|
31
|
+
useDerive({ control, handleChange });
|
|
30
32
|
const mode = computed(() => {
|
|
31
33
|
if (options.value.currency) return "currency";
|
|
32
34
|
if (options.value.decimal || typeof options.value.precision === "number")
|
|
@@ -52,7 +54,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
52
54
|
if (mode.value === "currency") return true;
|
|
53
55
|
return options.value.useGrouping === true;
|
|
54
56
|
});
|
|
55
|
-
const
|
|
57
|
+
const hasInteracted = ref(false);
|
|
58
|
+
const showErrors = computed(() => hasInteracted.value && control.value.errors);
|
|
59
|
+
const onNumber = (val) => {
|
|
60
|
+
handleChange(control.value.path, val ?? void 0);
|
|
61
|
+
};
|
|
62
|
+
const onBlur = () => {
|
|
63
|
+
hasInteracted.value = true;
|
|
64
|
+
};
|
|
56
65
|
return (_ctx, _cache) => {
|
|
57
66
|
return openBlock(), createElementBlock("div", _hoisted_1, [
|
|
58
67
|
unref(control).label ? (openBlock(), createElementBlock("label", _hoisted_2, toDisplayString(unref(control).label), 1)) : createCommentVNode("", true),
|
|
@@ -68,10 +77,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
68
77
|
"model-value": typeof unref(control).data === "number" ? unref(control).data : null,
|
|
69
78
|
placeholder: placeholder.value,
|
|
70
79
|
disabled: !unref(control).enabled,
|
|
71
|
-
"aria-invalid": !!
|
|
72
|
-
"onUpdate:modelValue": onNumber
|
|
80
|
+
"aria-invalid": !!showErrors.value || void 0,
|
|
81
|
+
"onUpdate:modelValue": onNumber,
|
|
82
|
+
onBlur
|
|
73
83
|
}, null, 8, ["use-grouping", "mode", "currency", "min-fraction-digits", "max-fraction-digits", "model-value", "placeholder", "disabled", "aria-invalid"]),
|
|
74
|
-
|
|
84
|
+
showErrors.value ? (openBlock(), createElementBlock("small", _hoisted_4, toDisplayString(unref(control).errors), 1)) : createCommentVNode("", true)
|
|
75
85
|
]);
|
|
76
86
|
};
|
|
77
87
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"JfNumber.vue.js","sources":["../../../src/vue/primevue/JfNumber.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { ControlElement } from \"@jsonforms/core\";\nimport { rendererProps, useJsonFormsControl } from \"@jsonforms/vue\";\nimport { computed } from \"vue\";\nimport InputNumber from \"primevue/inputnumber\";\n\ndefineOptions({ name: \"JfNumber\" });\n\nconst props = defineProps(rendererProps<ControlElement>());\nconst { control, handleChange } = useJsonFormsControl(props);\n\nconst options = computed(\n () =>\n (control.value.uischema as { options?: Record<string, unknown> })\n ?.options ?? {},\n);\n\nconst placeholder = computed<string | undefined>(\n () => (options.value.placeholder as string) ?? control.value.description,\n);\n\n// Currency and decimal configuration\nconst mode = computed(() => {\n if (options.value.currency) return \"currency\";\n if (options.value.decimal || typeof options.value.precision === \"number\")\n return \"decimal\";\n return undefined;\n});\n\nconst currency = computed(() =>\n typeof options.value.currency === \"string\" ? options.value.currency : \"USD\",\n);\n\nconst minFractionDigits = computed(() => {\n if (mode.value === \"currency\") return 2;\n if (typeof options.value.precision === \"number\")\n return options.value.precision;\n return undefined;\n});\n\nconst maxFractionDigits = computed(() => {\n if (mode.value === \"currency\") return 2;\n if (typeof options.value.precision === \"number\")\n return options.value.precision;\n return undefined;\n});\n\nconst useGrouping = computed(() => {\n // Enable grouping for currency by default, or if explicitly set\n if (mode.value === \"currency\") return true;\n return options.value.useGrouping === true;\n});\n\nconst onNumber = (val: number | null)
|
|
1
|
+
{"version":3,"file":"JfNumber.vue.js","sources":["../../../src/vue/primevue/JfNumber.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { ControlElement } from \"@jsonforms/core\";\nimport { rendererProps, useJsonFormsControl } from \"@jsonforms/vue\";\nimport { computed, ref } from \"vue\";\nimport { useDerive } from \"../composables/useDerive\";\nimport InputNumber from \"primevue/inputnumber\";\n\ndefineOptions({ name: \"JfNumber\" });\n\nconst props = defineProps(rendererProps<ControlElement>());\nconst { control, handleChange } = useJsonFormsControl(props);\n\nconst options = computed(\n () =>\n (control.value.uischema as { options?: Record<string, unknown> })\n ?.options ?? {},\n);\n\nconst placeholder = computed<string | undefined>(\n () => (options.value.placeholder as string) ?? control.value.description,\n);\n\n// Add derive functionality\nuseDerive({ control, handleChange });\n\n// Currency and decimal configuration\nconst mode = computed(() => {\n if (options.value.currency) return \"currency\";\n if (options.value.decimal || typeof options.value.precision === \"number\")\n return \"decimal\";\n return undefined;\n});\n\nconst currency = computed(() =>\n typeof options.value.currency === \"string\" ? options.value.currency : \"USD\",\n);\n\nconst minFractionDigits = computed(() => {\n if (mode.value === \"currency\") return 2;\n if (typeof options.value.precision === \"number\")\n return options.value.precision;\n return undefined;\n});\n\nconst maxFractionDigits = computed(() => {\n if (mode.value === \"currency\") return 2;\n if (typeof options.value.precision === \"number\")\n return options.value.precision;\n return undefined;\n});\n\nconst useGrouping = computed(() => {\n // Enable grouping for currency by default, or if explicitly set\n if (mode.value === \"currency\") return true;\n return options.value.useGrouping === true;\n});\n\n// Track user interaction\nconst hasInteracted = ref(false);\n\nconst showErrors = computed(() => hasInteracted.value && control.value.errors);\n\nconst onNumber = (val: number | null) => {\n handleChange(control.value.path, val ?? undefined);\n};\n\nconst onBlur = () => {\n hasInteracted.value = true;\n};\n</script>\n\n<template>\n <div class=\"flex flex-column gap-2\">\n <label v-if=\"control.label\" class=\"text-color text-left\">{{\n control.label\n }}</label>\n <div v-if=\"control.description\" class=\"text-color-secondary text-left\">\n {{ control.description }}\n </div>\n <InputNumber\n class=\"w-full\"\n input-class=\"w-full\"\n :use-grouping=\"useGrouping\"\n :mode=\"mode\"\n :currency=\"currency\"\n :min-fraction-digits=\"minFractionDigits\"\n :max-fraction-digits=\"maxFractionDigits\"\n :model-value=\"typeof control.data === 'number' ? control.data : null\"\n :placeholder=\"placeholder\"\n :disabled=\"!control.enabled\"\n :aria-invalid=\"!!showErrors || undefined\"\n @update:model-value=\"onNumber\"\n @blur=\"onBlur\"\n />\n <small v-if=\"showErrors\" class=\"p-error\">{{ control.errors }}</small>\n </div>\n</template>\n"],"names":["_openBlock","_createElementBlock","_unref","_toDisplayString","_createVNode"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AASA,UAAM,QAAQ;AACd,UAAM,EAAE,SAAS,iBAAiB,oBAAoB,KAAK;AAE3D,UAAM,UAAU;AAAA,MACd,MACG,QAAQ,MAAM,UACX,WAAW,CAAA;AAAA,IAAC;AAGpB,UAAM,cAAc;AAAA,MAClB,MAAO,QAAQ,MAAM,eAA0B,QAAQ,MAAM;AAAA,IAAA;AAI/D,cAAU,EAAE,SAAS,cAAc;AAGnC,UAAM,OAAO,SAAS,MAAM;AAC1B,UAAI,QAAQ,MAAM,SAAU,QAAO;AACnC,UAAI,QAAQ,MAAM,WAAW,OAAO,QAAQ,MAAM,cAAc;AAC9D,eAAO;AACT,aAAO;AAAA,IACT,CAAC;AAED,UAAM,WAAW;AAAA,MAAS,MACxB,OAAO,QAAQ,MAAM,aAAa,WAAW,QAAQ,MAAM,WAAW;AAAA,IAAA;AAGxE,UAAM,oBAAoB,SAAS,MAAM;AACvC,UAAI,KAAK,UAAU,WAAY,QAAO;AACtC,UAAI,OAAO,QAAQ,MAAM,cAAc;AACrC,eAAO,QAAQ,MAAM;AACvB,aAAO;AAAA,IACT,CAAC;AAED,UAAM,oBAAoB,SAAS,MAAM;AACvC,UAAI,KAAK,UAAU,WAAY,QAAO;AACtC,UAAI,OAAO,QAAQ,MAAM,cAAc;AACrC,eAAO,QAAQ,MAAM;AACvB,aAAO;AAAA,IACT,CAAC;AAED,UAAM,cAAc,SAAS,MAAM;AAEjC,UAAI,KAAK,UAAU,WAAY,QAAO;AACtC,aAAO,QAAQ,MAAM,gBAAgB;AAAA,IACvC,CAAC;AAGD,UAAM,gBAAgB,IAAI,KAAK;AAE/B,UAAM,aAAa,SAAS,MAAM,cAAc,SAAS,QAAQ,MAAM,MAAM;AAE7E,UAAM,WAAW,CAAC,QAAuB;AACvC,mBAAa,QAAQ,MAAM,MAAM,OAAO,MAAS;AAAA,IACnD;AAEA,UAAM,SAAS,MAAM;AACnB,oBAAc,QAAQ;AAAA,IACxB;;AAIE,aAAAA,UAAA,GAAAC,mBAuBM,OAvBN,YAuBM;AAAA,QAtBSC,MAAA,OAAA,EAAQ,SAArBF,UAAA,GAAAC,mBAEU,SAFV,YAEUE,gBADRD,MAAA,OAAA,EAAQ,KAAK,GAAA,CAAA;QAEJA,MAAA,OAAA,EAAQ,eAAnBF,UAAA,GAAAC,mBAEM,OAFN,YAEME,gBADDD,MAAA,OAAA,EAAQ,WAAW,GAAA,CAAA;QAExBE,YAcEF,MAAA,WAAA,GAAA;AAAA,UAbA,OAAM;AAAA,UACN,eAAY;AAAA,UACX,gBAAc,YAAA;AAAA,UACd,MAAM,KAAA;AAAA,UACN,UAAU,SAAA;AAAA,UACV,uBAAqB,kBAAA;AAAA,UACrB,uBAAqB,kBAAA;AAAA,UACrB,sBAAoBA,MAAA,OAAA,EAAQ,SAAI,WAAgBA,MAAA,OAAA,EAAQ,OAAI;AAAA,UAC5D,aAAa,YAAA;AAAA,UACb,UAAQ,CAAGA,MAAA,OAAA,EAAQ;AAAA,UACnB,gBAAY,CAAA,CAAI,WAAA,SAAc;AAAA,UAC9B,uBAAoB;AAAA,UACpB;AAAA,QAAA;QAEU,WAAA,SAAbF,UAAA,GAAAC,mBAAqE,SAArE,YAAqEE,gBAAzBD,MAAA,OAAA,EAAQ,MAAM,GAAA,CAAA;;;;;"}
|
|
@@ -66,10 +66,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
66
66
|
default: undefined;
|
|
67
67
|
};
|
|
68
68
|
}>> & Readonly<{}>, {
|
|
69
|
+
config: Record<string, any>;
|
|
69
70
|
enabled: boolean;
|
|
70
71
|
renderers: import("@jsonforms/core").JsonFormsRendererRegistryEntry[];
|
|
71
72
|
cells: import("@jsonforms/core").JsonFormsCellRendererRegistryEntry[];
|
|
72
|
-
config: Record<string, any>;
|
|
73
73
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
74
74
|
export default _default;
|
|
75
75
|
//# sourceMappingURL=JfText.vue.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"JfText.vue.d.ts","sourceRoot":"","sources":["../../../src/vue/primevue/JfText.vue"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"JfText.vue.d.ts","sourceRoot":"","sources":["../../../src/vue/primevue/JfText.vue"],"names":[],"mappings":"AA4JA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsTtD,wBAEG"}
|