@ghentcdh/json-forms-vue 0.8.3 → 0.8.6

package/form.component.properties.d.ts

@@ -17,6 +17,10 @@ export declare const FormComponentProperties: {
         type: StringConstructor;
         required: boolean;
     };
+    name: {
+        type: StringConstructor;
+        default: string;
+    };
     /** JSON schema describing the shape of the form data. */
     schema: {
         type: PropType<any>;

package/form.component.vue.d.ts

@@ -4,6 +4,10 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         type: StringConstructor;
         required: boolean;
     };
+    name: {
+        type: StringConstructor;
+        default: string;
+    };
     schema: {
         type: import('vue').PropType<any>;
         required: boolean;
@@ -29,6 +33,10 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         type: StringConstructor;
         required: boolean;
     };
+    name: {
+        type: StringConstructor;
+        default: string;
+    };
     schema: {
         type: import('vue').PropType<any>;
         required: boolean;
@@ -51,6 +59,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
     };
 }>> & Readonly<{}>, {
     disabled: boolean;
+    name: string;
     renderers: import('@jsonforms/core').JsonFormsRendererRegistryEntry[];
     formData: Data;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLFormElement>;

package/index.js

@@ -38,6 +38,7 @@ class FormStore {
 const FormComponentProperties = {
   /** Unique id applied to the `<form>` element and used as `<json-forms>` key. */
   id: { type: String, required: true },
+  name: { type: String, default: "form" },
   /** JSON schema describing the shape of the form data. */
   schema: { type: Object, required: true },
   /** UI schema describing the layout and controls. */
@@ -214,6 +215,7 @@ const _sfc_main$j = /* @__PURE__ */ vue.defineComponent({
       formEvents.dispatch({
         event: "create",
         type: control.value.path,
+        data: control.value.data,
         onSuccess: (result) => {
           handleChange(result);
         }
@@ -237,18 +239,32 @@ const _sfc_main$i = /* @__PURE__ */ vue.defineComponent({
   props: { ...vue$1.rendererProps() },
   setup(__props) {
     const props = __props;
-    const { control, onChange, appliedOptions, onFocus, onBlur, controlWrapper } = useVanillaControlCustom(vue$1.useJsonFormsControl(props), (target) => {
+    const {
+      control,
+      handleChange: _handleChange,
+      appliedOptions,
+      onFocus,
+      onBlur,
+      controlWrapper
+    } = useVanillaControlCustom(vue$1.useJsonFormsControl(props), (target) => {
+      if (!target.value) {
+        handleChange(false);
+      }
       return Boolean(target.value) ?? false;
     });
+    const handleChange = (result) => {
+      const { path } = control.value;
+      _handleChange(path, result);
+    };
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createBlock(vue.unref(ui.Checkbox), vue.mergeProps(vue.unref(controlWrapper), {
         "model-value": vue.unref(control).data,
         enabled: vue.unref(control).enabled,
         config: vue.unref(appliedOptions),
-        onChange: vue.unref(onChange),
+        onChange: handleChange,
         onFocus: vue.unref(onFocus),
         onBlur: vue.unref(onBlur)
-      }), null, 16, ["model-value", "enabled", "config", "onChange", "onFocus", "onBlur"]);
+      }), null, 16, ["model-value", "enabled", "config", "onFocus", "onBlur"]);
     };
   }
 });
@@ -8256,6 +8272,7 @@ const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
                 vue.renderSlot(_ctx.$slots, "actions"),
                 recordId.value ? (vue.openBlock(), vue.createBlock(vue.unref(ui.Btn), {
                   key: 0,
+                  "aria-label": "Cancel",
                   outline: true,
                   onClick: cancel
                 }, {
@@ -8265,6 +8282,7 @@ const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
                   _: 1
                 })) : (vue.openBlock(), vue.createBlock(vue.unref(ui.Btn), {
                   key: 1,
+                  "aria-label": "Clear",
                   outline: true,
                   onClick: clear
                 }, {
@@ -8274,6 +8292,7 @@ const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
                   _: 1
                 })),
                 vue.createVNode(vue.unref(ui.Btn), {
+                  "aria-label": "Save",
                   color: vue.unref(ui.Color).primary,
                   disabled: submitted.value,
                   onClick: save
@@ -8359,6 +8378,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
           vue.createVNode(vue.unref(ui.Btn), {
             color: vue.unref(ui.Color).secondary,
             outline: true,
+            "aria-label": "Cancel",
             onClick: onCancel
           }, {
             default: vue.withCtx(() => [..._cache[3] || (_cache[3] = [
@@ -8368,6 +8388,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
           }, 8, ["color"]),
           vue.createVNode(vue.unref(ui.Btn), {
             disabled: !hasBeenValid.value,
+            "aria-label": "Save",
             onClick: onSubmit
           }, {
             default: vue.withCtx(() => [..._cache[4] || (_cache[4] = [

package/index.mjs

@@ -36,6 +36,7 @@ class FormStore {
 const FormComponentProperties = {
   /** Unique id applied to the `<form>` element and used as `<json-forms>` key. */
   id: { type: String, required: true },
+  name: { type: String, default: "form" },
   /** JSON schema describing the shape of the form data. */
   schema: { type: Object, required: true },
   /** UI schema describing the layout and controls. */
@@ -212,6 +213,7 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
       formEvents.dispatch({
         event: "create",
         type: control.value.path,
+        data: control.value.data,
         onSuccess: (result) => {
           handleChange(result);
         }
@@ -235,18 +237,32 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
   props: { ...rendererProps() },
   setup(__props) {
     const props = __props;
-    const { control, onChange, appliedOptions, onFocus, onBlur, controlWrapper } = useVanillaControlCustom(useJsonFormsControl(props), (target) => {
+    const {
+      control,
+      handleChange: _handleChange,
+      appliedOptions,
+      onFocus,
+      onBlur,
+      controlWrapper
+    } = useVanillaControlCustom(useJsonFormsControl(props), (target) => {
+      if (!target.value) {
+        handleChange(false);
+      }
       return Boolean(target.value) ?? false;
     });
+    const handleChange = (result) => {
+      const { path } = control.value;
+      _handleChange(path, result);
+    };
     return (_ctx, _cache) => {
       return openBlock(), createBlock(unref(Checkbox), mergeProps(unref(controlWrapper), {
         "model-value": unref(control).data,
         enabled: unref(control).enabled,
         config: unref(appliedOptions),
-        onChange: unref(onChange),
+        onChange: handleChange,
         onFocus: unref(onFocus),
         onBlur: unref(onBlur)
-      }), null, 16, ["model-value", "enabled", "config", "onChange", "onFocus", "onBlur"]);
+      }), null, 16, ["model-value", "enabled", "config", "onFocus", "onBlur"]);
     };
   }
 });
@@ -8254,6 +8270,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
                 renderSlot(_ctx.$slots, "actions"),
                 recordId.value ? (openBlock(), createBlock(unref(Btn), {
                   key: 0,
+                  "aria-label": "Cancel",
                   outline: true,
                   onClick: cancel
                 }, {
@@ -8263,6 +8280,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
                   _: 1
                 })) : (openBlock(), createBlock(unref(Btn), {
                   key: 1,
+                  "aria-label": "Clear",
                   outline: true,
                   onClick: clear
                 }, {
@@ -8272,6 +8290,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
                   _: 1
                 })),
                 createVNode(unref(Btn), {
+                  "aria-label": "Save",
                   color: unref(Color).primary,
                   disabled: submitted.value,
                   onClick: save
@@ -8357,6 +8376,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           createVNode(unref(Btn), {
             color: unref(Color).secondary,
             outline: true,
+            "aria-label": "Cancel",
             onClick: onCancel
           }, {
             default: withCtx(() => [..._cache[3] || (_cache[3] = [
@@ -8366,6 +8386,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           }, 8, ["color"]),
           createVNode(unref(Btn), {
             disabled: !hasBeenValid.value,
+            "aria-label": "Save",
             onClick: onSubmit
           }, {
             default: withCtx(() => [..._cache[4] || (_cache[4] = [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ghentcdh/json-forms-vue",
-  "version": "0.8.3",
+  "version": "0.8.6",
   "main": "./index.js",
   "module": "./index.mjs",
   "types": "./index.d.ts",