@narrative.io/jsonforms-provider-protocols 1.1.0-beta.1 → 1.1.0-beta.2

package/dist/vue/primevue/JfNumber.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"JfNumber.vue.d.ts","sourceRoot":"","sources":["../../../src/vue/primevue/JfNumber.vue"],"names":[],"mappings":"AA4CA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6HtD,wBAEG"}
+{"version":3,"file":"JfNumber.vue.d.ts","sourceRoot":"","sources":["../../../src/vue/primevue/JfNumber.vue"],"names":[],"mappings":"AAoFA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8KtD,wBAEG"}

package/dist/vue/primevue/JfNumber.vue.js

@@ -21,9 +21,37 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   setup(__props) {
     const props = __props;
     const { control, handleChange } = useJsonFormsControl(props);
+    const options = computed(
+      () => control.value.uischema?.options ?? {}
+    );
     const placeholder = computed(
-      () => control.value.uischema?.options?.placeholder ?? control.value.description
+      () => options.value.placeholder ?? control.value.description
+    );
+    const mode = computed(() => {
+      if (options.value.currency) return "currency";
+      if (options.value.decimal || typeof options.value.precision === "number")
+        return "decimal";
+      return void 0;
+    });
+    const currency = computed(
+      () => typeof options.value.currency === "string" ? options.value.currency : "USD"
     );
+    const minFractionDigits = computed(() => {
+      if (mode.value === "currency") return 2;
+      if (typeof options.value.precision === "number")
+        return options.value.precision;
+      return void 0;
+    });
+    const maxFractionDigits = computed(() => {
+      if (mode.value === "currency") return 2;
+      if (typeof options.value.precision === "number")
+        return options.value.precision;
+      return void 0;
+    });
+    const useGrouping = computed(() => {
+      if (mode.value === "currency") return true;
+      return options.value.useGrouping === true;
+    });
     const onNumber = (val) => handleChange(control.value.path, val ?? void 0);
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1, [
@@ -32,13 +60,17 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         createVNode(unref(InputNumber), {
           class: "w-full",
           "input-class": "w-full",
-          "use-grouping": false,
+          "use-grouping": useGrouping.value,
+          mode: mode.value,
+          currency: currency.value,
+          "min-fraction-digits": minFractionDigits.value,
+          "max-fraction-digits": maxFractionDigits.value,
           "model-value": typeof unref(control).data === "number" ? unref(control).data : null,
           placeholder: placeholder.value,
           disabled: !unref(control).enabled,
           "aria-invalid": !!unref(control).errors || void 0,
           "onUpdate:modelValue": onNumber
-        }, null, 8, ["model-value", "placeholder", "disabled", "aria-invalid"]),
+        }, null, 8, ["use-grouping", "mode", "currency", "min-fraction-digits", "max-fraction-digits", "model-value", "placeholder", "disabled", "aria-invalid"]),
         unref(control).errors ? (openBlock(), createElementBlock("small", _hoisted_4, toDisplayString(unref(control).errors), 1)) : createCommentVNode("", true)
       ]);
     };

package/dist/vue/primevue/JfNumber.vue.js.map

@@ -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 placeholder = computed<string | undefined>(\n  () =>\n    (control.value.uischema as { options?: { placeholder?: string } })?.options\n      ?.placeholder ?? control.value.description,\n);\n\nconst onNumber = (val: number | null) =>\n  handleChange(control.value.path, val ?? undefined);\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=\"false\"\n      :model-value=\"typeof control.data === 'number' ? control.data : null\"\n      :placeholder=\"placeholder\"\n      :disabled=\"!control.enabled\"\n      :aria-invalid=\"!!control.errors || undefined\"\n      @update:model-value=\"onNumber\"\n    />\n    <small v-if=\"control.errors\" class=\"p-error\">{{ control.errors }}</small>\n  </div>\n</template>\n"],"names":["_openBlock","_createElementBlock","_unref","_toDisplayString","_createVNode"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAQA,UAAM,QAAQ;AACd,UAAM,EAAE,SAAS,iBAAiB,oBAAoB,KAAK;AAE3D,UAAM,cAAc;AAAA,MAClB,MACG,QAAQ,MAAM,UAAqD,SAChE,eAAe,QAAQ,MAAM;AAAA,IAAA;AAGrC,UAAM,WAAW,CAAC,QAChB,aAAa,QAAQ,MAAM,MAAM,OAAO,MAAS;;AAIjD,aAAAA,UAAA,GAAAC,mBAkBM,OAlBN,YAkBM;AAAA,QAjBSC,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,YASEF,MAAA,WAAA,GAAA;AAAA,UARA,OAAM;AAAA,UACN,eAAY;AAAA,UACX,gBAAc;AAAA,UACd,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,CAAIA,MAAA,OAAA,EAAQ,UAAU;AAAA,UAClC,uBAAoB;AAAA,QAAA;QAEVA,MAAA,OAAA,EAAQ,UAArBF,UAAA,GAAAC,mBAAyE,SAAzE,YAAyEE,gBAAzBD,MAAA,OAAA,EAAQ,MAAM,GAAA,CAAA;;;;;"}
+{"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) =>\n  handleChange(control.value.path, val ?? undefined);\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=\"!!control.errors || undefined\"\n      @update:model-value=\"onNumber\"\n    />\n    <small v-if=\"control.errors\" class=\"p-error\">{{ control.errors }}</small>\n  </div>\n</template>\n"],"names":["_openBlock","_createElementBlock","_unref","_toDisplayString","_createVNode"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAQA,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,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;AAED,UAAM,WAAW,CAAC,QAChB,aAAa,QAAQ,MAAM,MAAM,OAAO,MAAS;;AAIjD,aAAAA,UAAA,GAAAC,mBAsBM,OAtBN,YAsBM;AAAA,QArBSC,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,YAaEF,MAAA,WAAA,GAAA;AAAA,UAZA,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,CAAIA,MAAA,OAAA,EAAQ,UAAU;AAAA,UAClC,uBAAoB;AAAA,QAAA;QAEVA,MAAA,OAAA,EAAQ,UAArBF,UAAA,GAAAC,mBAAyE,SAAzE,YAAyEE,gBAAzBD,MAAA,OAAA,EAAQ,MAAM,GAAA,CAAA;;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@narrative.io/jsonforms-provider-protocols",
-	"version": "1.1.0-beta.1",
+	"version": "1.1.0-beta.2",
 	"description": "Dynamic data provider capabilities for JSONForms with Vue 3 integration",
 	"type": "module",
 	"author": "Narrative I/O",

package/src/vue/primevue/JfNumber.vue

@@ -9,12 +9,48 @@ defineOptions({ name: "JfNumber" });
 const props = defineProps(rendererProps<ControlElement>());
 const { control, handleChange } = useJsonFormsControl(props);
 
-const placeholder = computed<string | undefined>(
+const options = computed(
   () =>
-    (control.value.uischema as { options?: { placeholder?: string } })?.options
-      ?.placeholder ?? control.value.description,
+    (control.value.uischema as { options?: Record<string, unknown> })
+      ?.options ?? {},
+);
+
+const placeholder = computed<string | undefined>(
+  () => (options.value.placeholder as string) ?? control.value.description,
+);
+
+// Currency and decimal configuration
+const mode = computed(() => {
+  if (options.value.currency) return "currency";
+  if (options.value.decimal || typeof options.value.precision === "number")
+    return "decimal";
+  return undefined;
+});
+
+const currency = computed(() =>
+  typeof options.value.currency === "string" ? options.value.currency : "USD",
 );
 
+const minFractionDigits = computed(() => {
+  if (mode.value === "currency") return 2;
+  if (typeof options.value.precision === "number")
+    return options.value.precision;
+  return undefined;
+});
+
+const maxFractionDigits = computed(() => {
+  if (mode.value === "currency") return 2;
+  if (typeof options.value.precision === "number")
+    return options.value.precision;
+  return undefined;
+});
+
+const useGrouping = computed(() => {
+  // Enable grouping for currency by default, or if explicitly set
+  if (mode.value === "currency") return true;
+  return options.value.useGrouping === true;
+});
+
 const onNumber = (val: number | null) =>
   handleChange(control.value.path, val ?? undefined);
 </script>
@@ -30,7 +66,11 @@ const onNumber = (val: number | null) =>
     <InputNumber
       class="w-full"
       input-class="w-full"
-      :use-grouping="false"
+      :use-grouping="useGrouping"
+      :mode="mode"
+      :currency="currency"
+      :min-fraction-digits="minFractionDigits"
+      :max-fraction-digits="maxFractionDigits"
       :model-value="typeof control.data === 'number' ? control.data : null"
       :placeholder="placeholder"
       :disabled="!control.enabled"