@vc-shell/framework 1.2.4-beta.3 → 1.2.4-beta.5

package/shared/modules/dynamic/components/fields/MultivalueField.ts

@@ -1,68 +1,68 @@
-import { ComponentSlots } from "@shared/utilities/vueUtils";
-import { h, resolveComponent, ExtractPropTypes, Component, VNode } from "vue";
-import { MultivalueField } from "@shared/modules/dynamic/components/factories";
-import componentProps from "@shared/modules/dynamic/components/fields/props";
-import ValidationField from "@shared/modules/dynamic/components/fields/ValidationField";
-import { MultivalueSchema } from "@shared/modules/dynamic/types";
-import { VcMultivalue } from "@ui/components";
-import { unrefNested } from "@shared/modules/dynamic/helpers/unrefNested";
-
-type TScope = Parameters<ComponentSlots<typeof VcMultivalue>["option"]>["0"] &
-  Parameters<ComponentSlots<typeof VcMultivalue>["selected-item"]>["0"];
-
-export default {
-  name: "MultivalueField",
-  props: componentProps,
-  setup(props: ExtractPropTypes<typeof componentProps> & { element: MultivalueSchema }) {
-    return () => {
-      const field = MultivalueField({
-        props: Object.assign(
-          {},
-          {
-            multivalue: props.element.multivalue,
-            type: props.element.variant,
-            optionValue: props.element.optionValue,
-            optionLabel: props.element.optionLabel,
-            options: props.element.options ? props.bladeContext.scope?.[props.element.options] : undefined,
-            currentLanguage: props.currentLocale,
-          },
-          unrefNested(props.baseProps),
-          {
-            class: unrefNested(props.baseProps).classNames ?? "",
-          },
-        ),
-
-        slots:
-          props.element.customTemplate &&
-          ["option", "selected-item"].reduce(
-            (obj, slot) => {
-              obj[slot] = (scope: TScope) =>
-                h(resolveComponent(props.element.customTemplate?.component as string), {
-                  context: scope,
-                  slotName: slot,
-                });
-              return obj;
-            },
-            {} as Record<string, (scope: TScope) => VNode>,
-          ),
-      });
-
-      const render = h(field.component as unknown as Component, field.props, field.slots);
-
-      if (field.props.rules) {
-        return h(
-          ValidationField,
-          {
-            props: field.props,
-            index: props.elIndex,
-            rows: props.rows,
-            key: `${String(field.props.key)}_validation`,
-          },
-          () => render,
-        );
-      } else {
-        return render;
-      }
-    };
-  },
-};
+import { ComponentSlots } from "@shared/utilities/vueUtils";
+import { h, resolveComponent, ExtractPropTypes, Component, VNode } from "vue";
+import { MultivalueField } from "@shared/modules/dynamic/components/factories";
+import componentProps from "@shared/modules/dynamic/components/fields/props";
+import ValidationField from "@shared/modules/dynamic/components/fields/ValidationField";
+import { MultivalueSchema } from "@shared/modules/dynamic/types";
+import { VcMultivalue } from "@ui/components/molecules/vc-multivalue";
+import { unrefNested } from "@shared/modules/dynamic/helpers/unrefNested";
+
+type TScope = Parameters<ComponentSlots<typeof VcMultivalue>["option"]>["0"] &
+  Parameters<ComponentSlots<typeof VcMultivalue>["selected-item"]>["0"];
+
+export default {
+  name: "MultivalueField",
+  props: componentProps,
+  setup(props: ExtractPropTypes<typeof componentProps> & { element: MultivalueSchema }) {
+    return () => {
+      const field = MultivalueField({
+        props: Object.assign(
+          {},
+          {
+            multivalue: props.element.multivalue,
+            type: props.element.variant,
+            optionValue: props.element.optionValue,
+            optionLabel: props.element.optionLabel,
+            options: props.element.options ? props.bladeContext.scope?.[props.element.options] : undefined,
+            currentLanguage: props.currentLocale,
+          },
+          unrefNested(props.baseProps),
+          {
+            class: unrefNested(props.baseProps).classNames ?? "",
+          },
+        ),
+
+        slots:
+          props.element.customTemplate &&
+          ["option", "selected-item"].reduce(
+            (obj, slot) => {
+              obj[slot] = (scope: TScope) =>
+                h(resolveComponent(props.element.customTemplate?.component as string), {
+                  context: scope,
+                  slotName: slot,
+                });
+              return obj;
+            },
+            {} as Record<string, (scope: TScope) => VNode>,
+          ),
+      });
+
+      const render = h(field.component as unknown as Component, field.props, field.slots);
+
+      if (field.props.rules) {
+        return h(
+          ValidationField,
+          {
+            props: field.props,
+            index: props.elIndex,
+            rows: props.rows,
+            key: `${String(field.props.key)}_validation`,
+          },
+          () => render,
+        );
+      } else {
+        return render;
+      }
+    };
+  },
+};

package/shared/modules/dynamic/components/fields/RadioButtonGroup.ts

@@ -1,82 +1,83 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-import { Component, ExtractPropTypes, h, toValue, unref } from "vue";
-import { unrefNested } from "@shared/modules/dynamic/helpers/unrefNested";
-import componentProps from "@shared/modules/dynamic/components/fields/props";
-import ValidationField from "@shared/modules/dynamic/components/fields/ValidationField";
-import { RadioButton } from "@shared/modules/dynamic/components/factories";
-import { RadioButtonSchema } from "@shared/modules/dynamic/types";
-import { getModel } from "@shared/modules/dynamic/helpers/getters";
-import * as _ from "lodash-es";
-import { VcLabel, VcHint } from "@ui/components";
-
-export default {
-  name: "RadioButtonGroup",
-  props: componentProps,
-  setup(props: ExtractPropTypes<typeof componentProps> & { element: RadioButtonSchema }) {
-    return () => {
-      const label = unrefNested(props.baseProps).label;
-      const options: any[] =
-        toValue(getModel(props.element.options, props.fieldContext ?? {})) ||
-        toValue(unref(props.bladeContext.scope)?.[props.element.options]);
-
-      const fields = options.map((opt) =>
-        RadioButton({
-          props: Object.assign(
-            {},
-            {
-              value: props.element.optionValue ? toValue(getModel(props.element.optionValue, opt ?? {})) : opt,
-              binary: props.element.binary,
-              label: props.element.optionLabel ? toValue(getModel(props.element.optionLabel, opt ?? {})) : opt,
-            },
-            _.omit(unrefNested(props.baseProps), "label"),
-            {
-              class: unrefNested(props.baseProps).classNames ?? "",
-            },
-          ),
-        }),
-      );
-
-      const render = [
-        label
-          ? h(
-              VcLabel,
-              { required: props.element.rules?.required },
-              {
-                default: () => label,
-                tooltip: unrefNested(props.baseProps).tooltip ? () => unrefNested(props.baseProps).tooltip : undefined,
-              },
-            )
-          : undefined,
-        fields.map((field) => h(field.component as Component, field.props)),
-        h({
-          props: ["error", "errorMessage"],
-          components: { VcHint },
-          template: `
-            <VcHint v-if="error" class="vc-textarea__error">
-              {{ errorMessage }}
-            </VcHint>
-            `,
-        }),
-      ];
-
-      if (props.element.rules) {
-        return h(
-          ValidationField,
-          {
-            props: {
-              rules: props.element.rules,
-              modelValue: unrefNested(props.baseProps).modelValue,
-              label: unrefNested(props.baseProps).label,
-              name: unrefNested(props.baseProps).name,
-            },
-            index: props.elIndex,
-            rows: props.rows,
-          },
-          () => render,
-        );
-      } else {
-        return render;
-      }
-    };
-  },
-};
+/* eslint-disable @typescript-eslint/no-explicit-any */
+import { Component, ExtractPropTypes, h, toValue, unref } from "vue";
+import { unrefNested } from "@shared/modules/dynamic/helpers/unrefNested";
+import componentProps from "@shared/modules/dynamic/components/fields/props";
+import ValidationField from "@shared/modules/dynamic/components/fields/ValidationField";
+import { RadioButton } from "@shared/modules/dynamic/components/factories";
+import { RadioButtonSchema } from "@shared/modules/dynamic/types";
+import { getModel } from "@shared/modules/dynamic/helpers/getters";
+import * as _ from "lodash-es";
+import { VcLabel } from "@ui/components/atoms/vc-label";
+import { VcHint } from "@ui/components/atoms/vc-hint";
+
+export default {
+  name: "RadioButtonGroup",
+  props: componentProps,
+  setup(props: ExtractPropTypes<typeof componentProps> & { element: RadioButtonSchema }) {
+    return () => {
+      const label = unrefNested(props.baseProps).label;
+      const options: any[] =
+        toValue(getModel(props.element.options, props.fieldContext ?? {})) ||
+        toValue(unref(props.bladeContext.scope)?.[props.element.options]);
+
+      const fields = options.map((opt) =>
+        RadioButton({
+          props: Object.assign(
+            {},
+            {
+              value: props.element.optionValue ? toValue(getModel(props.element.optionValue, opt ?? {})) : opt,
+              binary: props.element.binary,
+              label: props.element.optionLabel ? toValue(getModel(props.element.optionLabel, opt ?? {})) : opt,
+            },
+            _.omit(unrefNested(props.baseProps), "label"),
+            {
+              class: unrefNested(props.baseProps).classNames ?? "",
+            },
+          ),
+        }),
+      );
+
+      const render = [
+        label
+          ? h(
+              VcLabel,
+              { required: props.element.rules?.required },
+              {
+                default: () => label,
+                tooltip: unrefNested(props.baseProps).tooltip ? () => unrefNested(props.baseProps).tooltip : undefined,
+              },
+            )
+          : undefined,
+        fields.map((field) => h(field.component as Component, field.props)),
+        h({
+          props: ["error", "errorMessage"],
+          components: { VcHint },
+          template: `
+            <VcHint v-if="error" class="vc-textarea__error">
+              {{ errorMessage }}
+            </VcHint>
+            `,
+        }),
+      ];
+
+      if (props.element.rules) {
+        return h(
+          ValidationField,
+          {
+            props: {
+              rules: props.element.rules,
+              modelValue: unrefNested(props.baseProps).modelValue,
+              label: unrefNested(props.baseProps).label,
+              name: unrefNested(props.baseProps).name,
+            },
+            index: props.elIndex,
+            rows: props.rows,
+          },
+          () => render,
+        );
+      } else {
+        return render;
+      }
+    };
+  },
+};

package/shared/modules/dynamic/components/fields/SelectField.ts

@@ -1,72 +1,72 @@
-import { ComponentSlots } from "@shared/utilities/vueUtils";
-import { h, resolveComponent, ExtractPropTypes, Component, VNode } from "vue";
-import { SelectField } from "@shared/modules/dynamic/components/factories";
-import componentProps from "@shared/modules/dynamic/components/fields/props";
-import ValidationField from "@shared/modules/dynamic/components/fields/ValidationField";
-import { SelectSchema } from "@shared/modules/dynamic/types";
-import { VcSelect } from "@ui/components";
-import { unrefNested } from "@shared/modules/dynamic/helpers/unrefNested";
-
-type TScope =
-  | Parameters<ComponentSlots<typeof VcSelect>["option"]>["0"]
-  | Parameters<ComponentSlots<typeof VcSelect>["selected-item"]>["0"];
-
-export default {
-  name: "SelectField",
-  props: componentProps,
-  setup(props: ExtractPropTypes<typeof componentProps> & { element: SelectSchema }) {
-    return () => {
-      const field = SelectField({
-        props: Object.assign(
-          {},
-          {
-            optionValue: props.element.optionValue,
-            optionLabel: props.element.optionLabel,
-            emitValue: props.element.emitValue,
-            mapOptions: props.element.mapOptions,
-            options: props.bladeContext.scope?.[props.element.optionsMethod],
-            currentLanguage: props.currentLocale,
-            clearable: props.element.clearable || false,
-            searchable: props.element.searchable || false,
-            multiple: props.element.multiple || false,
-          },
-          unrefNested(props.baseProps),
-          {
-            class: unrefNested(props.baseProps).classNames ?? "",
-          },
-        ),
-
-        slots:
-          props.element.customTemplate &&
-          ["selected-item", "option"].reduce(
-            (obj, slot) => {
-              obj[slot] = (scope: TScope) =>
-                h(resolveComponent(props.element.customTemplate?.component as string), {
-                  context: scope,
-                  slotName: slot,
-                });
-              return obj;
-            },
-            {} as Record<string, (scope: TScope) => VNode>,
-          ),
-      });
-
-      const render = h(field.component as unknown as Component, field.props, field.slots);
-
-      if (field.props.rules) {
-        return h(
-          ValidationField,
-          {
-            props: field.props,
-            index: props.elIndex,
-            rows: props.rows,
-            key: `${String(field.props.key)}_validation`,
-          },
-          () => render,
-        );
-      } else {
-        return render;
-      }
-    };
-  },
-};
+import { ComponentSlots } from "@shared/utilities/vueUtils";
+import { h, resolveComponent, ExtractPropTypes, Component, VNode } from "vue";
+import { SelectField } from "@shared/modules/dynamic/components/factories";
+import componentProps from "@shared/modules/dynamic/components/fields/props";
+import ValidationField from "@shared/modules/dynamic/components/fields/ValidationField";
+import { SelectSchema } from "@shared/modules/dynamic/types";
+import { VcSelect } from "@ui/components/molecules/vc-select";
+import { unrefNested } from "@shared/modules/dynamic/helpers/unrefNested";
+
+type TScope =
+  | Parameters<ComponentSlots<typeof VcSelect>["option"]>["0"]
+  | Parameters<ComponentSlots<typeof VcSelect>["selected-item"]>["0"];
+
+export default {
+  name: "SelectField",
+  props: componentProps,
+  setup(props: ExtractPropTypes<typeof componentProps> & { element: SelectSchema }) {
+    return () => {
+      const field = SelectField({
+        props: Object.assign(
+          {},
+          {
+            optionValue: props.element.optionValue,
+            optionLabel: props.element.optionLabel,
+            emitValue: props.element.emitValue,
+            mapOptions: props.element.mapOptions,
+            options: props.bladeContext.scope?.[props.element.optionsMethod],
+            currentLanguage: props.currentLocale,
+            clearable: props.element.clearable || false,
+            searchable: props.element.searchable || false,
+            multiple: props.element.multiple || false,
+          },
+          unrefNested(props.baseProps),
+          {
+            class: unrefNested(props.baseProps).classNames ?? "",
+          },
+        ),
+
+        slots:
+          props.element.customTemplate &&
+          ["selected-item", "option"].reduce(
+            (obj, slot) => {
+              obj[slot] = (scope: TScope) =>
+                h(resolveComponent(props.element.customTemplate?.component as string), {
+                  context: scope,
+                  slotName: slot,
+                });
+              return obj;
+            },
+            {} as Record<string, (scope: TScope) => VNode>,
+          ),
+      });
+
+      const render = h(field.component as unknown as Component, field.props, field.slots);
+
+      if (field.props.rules) {
+        return h(
+          ValidationField,
+          {
+            props: field.props,
+            index: props.elIndex,
+            rows: props.rows,
+            key: `${String(field.props.key)}_validation`,
+          },
+          () => render,
+        );
+      } else {
+        return render;
+      }
+    };
+  },
+};