cnhis-design-vue 3.1.5-beta.12 → 3.1.5-beta.15

package/es/packages/form-render/src/types/index.d.ts

@@ -1,8 +1,8 @@
-import { AnyObject } from 'cnhis-design-vue/es/src/types';
-import { Field } from "@formily/core";
-import { FieldItem } from "../types";
-import { AsyncQueue } from "../hooks";
-export * from "./fieldItem";
+import { AnyObject } from '../..\..\..\../es/src/types';
+import { DataField, Field } from '@formily/core';
+import { FieldItem } from '../types';
+import { AsyncQueue } from '../hooks';
+export * from './fieldItem';
 export interface FieldVisitorContext {
     field: FieldItem;
     replace(f: FieldItem): void;
@@ -10,7 +10,7 @@ export interface FieldVisitorContext {
     insertAfter(f: FieldItem | FieldItem[]): void;
 }
 export declare type FieldVisitor = Record<string, (context: FieldVisitorContext) => void>;
-export declare type FormRequestType = "post" | "get" | "patch" | "delete" | "put";
+export declare type FormRequestType = 'post' | 'get' | 'patch' | 'delete' | 'put';
 export interface FormAsyncQueueItem {
     key: any;
     url: string;
@@ -18,9 +18,19 @@ export interface FormAsyncQueueItem {
     params?: AnyObject;
 }
 export declare type FormAsyncQueue = AsyncQueue<FormAsyncQueueItem, any, AnyObject[]>;
-export declare type IdCardParseInfo = Record<"sex" | "birthday", string> & Record<"age" | "day" | "month" | "year", number>;
+export declare type IdCardParseInfo = Record<'sex' | 'birthday', string> & Record<'age' | 'day' | 'month' | 'year', number>;
 export declare type FormRenderExpose = {
     validate(): Promise<unknown>;
     getFormValues(): AnyObject;
     setFieldState(path: string, setter: (field: Field) => void): void;
 };
+export declare type FormChangeContext = Partial<{
+    currentOption: AnyObject;
+}>;
+export declare type FormChangePayload = {
+    value: any;
+    fieldKey: string;
+    fieldName: string;
+    fieldInstance: DataField;
+    context: FormChangeContext;
+};

package/es/packages/form-render/src/utils/index.d.ts

@@ -1,10 +1,14 @@
-import { GeneralField } from "@formily/core";
-import { InjectionKey } from "vue";
-import { IdCardParseInfo } from "../types";
+import { AnyObject } from '../..\..\..\../es/src/types';
+import { GeneralField } from '@formily/core';
+import { InjectionKey } from 'vue';
+import { IdCardParseInfo } from '../types';
 export declare function formRenderLog(message: string, type?: keyof Console): void;
 export declare function arrayed<T>(maybeArray: T): T extends Array<any> ? T : [T];
-export declare function assignUpdateValue(props: any, field: GeneralField): any;
+export declare function assignUpdateValue(props: AnyObject, field: GeneralField): {
+    [x: string]: any;
+};
 export declare function transformDateFormat(format: string): "date" | "datetime";
 export declare function isIdCard(idCardNo: string): boolean;
 export declare function parseIdCard(idCardNo: string): IdCardParseInfo;
 export declare function injectOrProvide<T>(key: InjectionKey<T>, creator: () => T): T;
+export declare function generateUrlParams(field: GeneralField, dependKeys?: string | string[]): AnyObject;

package/es/packages/form-render/src/utils/index.js

@@ -0,0 +1 @@
+export { arrayed, assignUpdateValue, formRenderLog, generateUrlParams, injectOrProvide, isIdCard, parseIdCard, transformDateFormat } from './index2.js';

package/es/packages/form-render/src/utils/index2.js

@@ -0,0 +1,71 @@
+import { FIELD_SEX_VALUE } from '../constants/index2.js';
+import { isField } from '@formily/core';
+import differenceInDays from '../../../../node_modules/date-fns/esm/differenceInDays/index.js';
+import differenceInMonths from '../../../../node_modules/date-fns/esm/differenceInMonths/index.js';
+import { inject, provide } from 'vue';
+
+function formRenderLog(message, type = "log") {
+  console[type](`[FormRender]: ${message}`);
+}
+function arrayed(maybeArray) {
+  if (Array.isArray(maybeArray))
+    return maybeArray;
+  return [maybeArray];
+}
+function assignUpdateValue(props, field) {
+  const _props = { ...props };
+  if (isField(field)) {
+    Object.assign(_props, {
+      "onUpdate:value"(value) {
+        field.setValue(value);
+      }
+    });
+  }
+  return _props;
+}
+function transformDateFormat(format) {
+  return format.includes("HH") ? "datetime" : "date";
+}
+function isIdCard(idCardNo) {
+  return /^\d{6}(((19|20)\d{2}(0[1-9]|1[0-2])(0[1-9]|[1-2]\d|3[0-1])\d{3}(\d|x|X))|(\d{2}(0[1-9]|1[0-2])(0[1-9]|[1-2]\d|3[0-1])\d{3}))$/.test(idCardNo);
+}
+function parseIdCard(idCardNo) {
+  const parseInner = (certificateNo, idxSexStart, birthYearSpan) => {
+    const res = {};
+    const idxSex = 1 - certificateNo.substr(idxSexStart, 1) % 2;
+    res.sex = idxSex === 1 ? FIELD_SEX_VALUE.FEMALE : FIELD_SEX_VALUE.MALE;
+    const year = (birthYearSpan == 2 ? "19" : "") + certificateNo.substr(6, birthYearSpan);
+    const month = certificateNo.substr(6 + birthYearSpan, 2);
+    const day = certificateNo.substr(8 + birthYearSpan, 2);
+    res.birthday = year + "-" + month + "-" + day;
+    const d = new Date();
+    const monthFloor = d.getMonth() + 1 < parseInt(month, 10) || d.getMonth() + 1 == parseInt(month, 10) && d.getDate() < parseInt(day, 10) ? 1 : 0;
+    res.age = res.year = d.getFullYear() - parseInt(year, 10) - monthFloor;
+    res.day = differenceInDays(d, new Date(res.birthday));
+    res.month = differenceInMonths(d, new Date(res.birthday));
+    return res;
+  };
+  return parseInner(idCardNo, idCardNo.length == 15 ? 14 : 16, idCardNo.length == 15 ? 2 : 4);
+}
+function injectOrProvide(key, creator) {
+  let injected = inject(key, null);
+  if (!injected) {
+    injected = creator();
+    provide(key, injected);
+  }
+  return injected;
+}
+function generateUrlParams(field, dependKeys) {
+  const result = {};
+  if (dependKeys) {
+    arrayed(dependKeys).forEach((dependKey) => {
+      const _field = field.query(dependKey).take();
+      if (isField(_field)) {
+        result[dependKey] = _field.value;
+      }
+    });
+  }
+  return result;
+}
+
+export { arrayed, assignUpdateValue, formRenderLog, generateUrlParams, injectOrProvide, isIdCard, parseIdCard, transformDateFormat };

package/es/packages/form-render/style/index.css

@@ -82,3 +82,11 @@
 .form-render__combinationContent {
   position: relative;
 }
+.form-render__complex {
+  width: 100%;
+}
+.form-render__complexContent {
+  display: grid !important;
+  grid-template-columns: repeat(var(--column), minmax(0px, 1fr));
+  gap: 0 8px;
+}

package/es/packages/form-render/style/index.less

@@ -118,4 +118,12 @@
       position: relative;
     }
   }
+
+  &__complex {
+    width: 100%;
+
+    &Content {
+      @display();
+    }
+  }
 }

package/es/packages/form-table/index.js

@@ -0,0 +1 @@
+export { default } from './index2.js';

package/es/packages/form-table/index2.js

@@ -0,0 +1,11 @@
+import { COMPONENT_NAMESPACE } from '../../src/global/variable';
+import { safeComponentRegister } from '../../src/utils';
+import './src/FormTable2.js';
+import script from './src/FormTable.vue_vue_type_script_setup_true_lang.js';
+
+const FormTable = script;
+FormTable.install = function(app) {
+  safeComponentRegister(app, FormTable, COMPONENT_NAMESPACE + "FormTable");
+};
+
+export { FormTable as default };

package/es/packages/form-table/src/FormTable.js

@@ -0,0 +1,2 @@
+import './FormTable2.js';
+export { default } from './FormTable.vue_vue_type_script_setup_true_lang.js';

package/es/packages/form-table/src/FormTable.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,473 @@
+import { defineComponent, ref, computed, h, watch, onMounted, openBlock, createElementBlock, normalizeClass, normalizeStyle, unref, createVNode, withCtx, createCommentVNode } from 'vue';
+import { useMessage } from 'naive-ui';
+import { useComponents } from '../..\\../packages/form-table/src/components';
+import '../..\\../packages/form-table/src/configs';
+import { useValidate } from '../..\\../packages/form-table/src/hooks';
+import CGrid from '../..\\../packages/grid';
+import vexutils from '../..\\../src/utils/vexutils';
+
+const _hoisted_1 = { key: 0 };
+var script = /* @__PURE__ */ defineComponent({
+  props: {
+    data: Array,
+    columnConfig: Object,
+    emptyItems: {
+      type: Object,
+      default: () => {
+        return {
+          noDataImg: "nodata",
+          noDataTip: ""
+        };
+      }
+    },
+    isOnlyDisplay: Boolean,
+    userInfo: {
+      type: Object,
+      default: () => ({})
+    },
+    styleSetting: {
+      type: Object,
+      default: () => ({})
+    },
+    defaultValue: {
+      type: Array,
+      default: () => []
+    },
+    dbParams: {
+      type: Object
+    },
+    cacheUniqueKey: {
+      type: Object,
+      default: () => {
+        return {};
+      }
+    },
+    formType: {
+      type: Object,
+      default: () => {
+        return {};
+      }
+    },
+    formConfig: {
+      type: Object,
+      default: () => {
+        return {};
+      }
+    },
+    formTableItem: {
+      type: Object,
+      default: () => {
+        return {};
+      }
+    },
+    isDetail: {
+      type: Boolean,
+      default: false
+    }
+  },
+  emits: ["AddComplete", "formTableBlur", "DeleteComplete"],
+  setup(__props, { emit }) {
+    const props = __props;
+    const $message = useMessage();
+    const { cmps, getComName } = useComponents();
+    useValidate({ message: $message });
+    const isShowEmpty = ref(false);
+    const tableList = ref([]);
+    const fullTableList = ref([]);
+    const multipleSelected = ref({});
+    const columns = ref([]);
+    const columnsLevel = ref(1);
+    const formTableGridRef = ref();
+    function $t(...args) {
+    }
+    const handleRowId = computed(() => {
+      var _a;
+      return ((_a = props.columnConfig) == null ? void 0 : _a.primaryKey) || "field";
+    });
+    computed(() => {
+      return function(name, item) {
+        let tag = cmps[name];
+        return tag ? h(tag, {
+          attrs: { item }
+        }) : null;
+      };
+    });
+    computed(() => {
+      var _a, _b;
+      return (_b = (_a = props.formTableItem) == null ? void 0 : _a.wordbook) == null ? void 0 : _b.idField;
+    });
+    computed(() => {
+      var _a, _b;
+      return ((_b = (_a = props.formTableItem) == null ? void 0 : _a.wordbook) == null ? void 0 : _b.delFlagField) || "deleteKey";
+    });
+    const rowH = computed(() => {
+      var _a;
+      if (props.isDetail || !((_a = tableList.value) == null ? void 0 : _a.length))
+        return 50;
+      let hasTextarea = columns.value.map((item) => {
+        if (item.html_type == "TEXTAREA")
+          return item.initialize_high ? +item.initialize_high : 3;
+        return null;
+      }).filter(Boolean);
+      let MaxH = 50;
+      if (hasTextarea.length) {
+        MaxH = Math.max(...hasTextarea) * 20 + 10 + 4 + 18;
+      }
+      return MaxH;
+    });
+    const minHeight = computed(() => {
+      return rowH.value + columnsLevel.value * 40 + 10 + "px";
+    });
+    const maxHeight = computed(() => {
+      return rowH.value * 6 + columnsLevel.value * 40 + 10 + "px";
+    });
+    const tableHeight = computed(() => {
+      var _a;
+      let len = ((_a = tableList.value) == null ? void 0 : _a.length) || 1;
+      return len * rowH.value + columnsLevel.value * 40 + 10;
+    });
+    function loadColumn(config) {
+      const columnsFormatted = handleGroupColums(columns.value);
+      if (columnsFormatted) {
+        columns.value = columnsFormatted;
+      }
+      const table = formTableGridRef.value;
+      if (!table)
+        return;
+      table && table.reloadColumn(columns.value);
+    }
+    function handleGroupColums(columns2) {
+      var _a;
+      let { rowGroupSetting } = ((_a = props.formTableItem) == null ? void 0 : _a.wordbook) || {};
+      if (!rowGroupSetting || !Object.keys(rowGroupSetting).length)
+        return columns2;
+      let { firstRowGroup, secondRowGroup } = rowGroupSetting;
+      if (!firstRowGroup || !firstRowGroup.length)
+        return columns2;
+      handleRowColumns(firstRowGroup, columns2, "val_key");
+      columnsLevel.value = 2;
+      if (!secondRowGroup || !secondRowGroup.length)
+        return columns2;
+      handleRowColumns(secondRowGroup, columns2, "title");
+      columnsLevel.value = 3;
+      return columns2;
+    }
+    function handleRowColumns(rowColumns, columns2, key) {
+      rowColumns.map((item) => {
+        var _a;
+        let children = [];
+        let spliceIndex = -1;
+        let indexArr = [];
+        ((_a = item.list) == null ? void 0 : _a.length) && item.list.forEach((v) => {
+          let matchItem = columns2.find((column) => column[key] === v);
+          if (matchItem) {
+            let matchIndex = columns2.findIndex((column) => column[key] === v);
+            indexArr.push(matchIndex);
+            delete matchItem.fixed;
+            children.push(matchItem);
+            columns2.splice(matchIndex, 1);
+          }
+        });
+        let obj = {
+          title: $t(item.titleI18n || item.title),
+          visible: true,
+          children
+        };
+        spliceIndex = Math.min.apply(Math, indexArr);
+        spliceIndex > -1 && columns2.splice(spliceIndex, 0, obj);
+      });
+    }
+    async function loadData(list) {
+      if (!list || !list.length)
+        return;
+      tableList.value = vexutils.clone(list, true);
+      fullTableList.value = vexutils.clone(list, true);
+      handlerFieldToggleList(tableList.value);
+      const table = formTableGridRef.value;
+      if (!table)
+        return;
+      await table.loadData(tableList.value);
+      handleMultipleSelected(list, false);
+    }
+    function handleMultipleSelected(list, isAdd) {
+      var _a, _b;
+      let multipleSelectedValue = {};
+      let fieldList = (_b = (_a = props.columnConfig) == null ? void 0 : _a.columns) != null ? _b : [];
+      list.forEach((item, i) => {
+        let field = item.field;
+        multipleSelectedValue[field] = {};
+        for (let key in item) {
+          if (!ignoreKey(key)) {
+            let isSearchMore = fieldList.find((v) => v.val_key === key);
+            if ((isSearchMore == null ? void 0 : isSearchMore.html_type) === "SEARCH_MORE") {
+              multipleSelectedValue[field][key] = [];
+            }
+          }
+        }
+      });
+      if (isAdd) {
+        Object.assign(multipleSelected.value, {
+          ...multipleSelectedValue
+        });
+      } else {
+        multipleSelected.value = multipleSelectedValue;
+      }
+    }
+    function ignoreKey(key) {
+      return key.startsWith("_") && key.endsWith("_") || key == "field";
+    }
+    function handlerClickRow({ row, $event = {}, $rowIndex, triggerCheckbox, triggerTreeNode }) {
+      var _a, _b, _c, _d;
+      let { className } = $event.target || {};
+      $event.preventDefault();
+      $event.stopPropagation();
+      if (className == null ? void 0 : className.includes("vxe-checkbox--icon"))
+        return;
+      let table = formTableGridRef.value;
+      let isChecked = table.isCheckedByCheckboxRow(row);
+      let checkedLen = (_a = table.getCheckboxRecords()) == null ? void 0 : _a.length;
+      let isCheckCell = !triggerCheckbox && (className.includes("col--checkbox") || ((_d = (_c = (_b = $event.target) == null ? void 0 : _b.lastChild) == null ? void 0 : _c.className) == null ? void 0 : _d.includes("vxe-cell--checkbox")));
+      if (isCheckCell)
+        return;
+      table.setAllCheckboxRow(false);
+      if (!checkedLen && !isChecked) {
+        table.setCheckboxRow([row], true);
+        return;
+      }
+      if (checkedLen == 1 && isChecked) {
+        table.setCheckboxRow([row], false);
+        return;
+      }
+      table.setCheckboxRow(row, true);
+    }
+    function handlerFieldToggleList(list) {
+      if (!list.length)
+        return;
+      let { fieldToggleSetting } = props.formConfig || {};
+      if (!fieldToggleSetting || !Object.keys(fieldToggleSetting).length)
+        return;
+      list.forEach((row) => {
+        handlerFieldToggle(fieldToggleSetting, row);
+      });
+    }
+    function handlerFieldToggle(fieldToggleSetting, formData = {}) {
+      const configList = [
+        {
+          key: "is_show",
+          value: true
+        },
+        {
+          key: "is_show",
+          value: false
+        },
+        {
+          key: "is_null",
+          value: false
+        },
+        {
+          key: "is_null",
+          value: true
+        },
+        {
+          key: "is_edit",
+          value: true
+        },
+        {
+          key: "is_edit",
+          value: false
+        }
+      ];
+      const checkList = (list) => list.forEach((l) => {
+      });
+      let resetObj = {};
+      let resetType = {};
+      let fieldObj = formData.__fieldObj__ || {};
+      fieldToggleSetting.forEach((item) => {
+        let FlagList = handleGetFlagRes(item.conObj, formData);
+        let {
+          showField = [],
+          hideField = [],
+          requiredField = [],
+          notRequiredField = [],
+          enabledField = [],
+          disabledField = [],
+          isRestoreDefault = true
+        } = item;
+        let fieldLists = [[], hideField, requiredField, notRequiredField, enabledField, disabledField];
+        const checkArr = [fieldLists];
+        checkArr.forEach((c) => {
+          checkList(c);
+        });
+        let falg = false;
+        falg = FlagList.every((f) => f);
+        if (falg) {
+          showField.forEach((el) => {
+            let findItem = handleGetItem(fieldObj, el);
+            handleSetItem(findItem, configList[0]);
+            resetObj[el] = false;
+          });
+          fieldLists.forEach((f, j) => {
+            f.forEach((el) => {
+              let findItem = handleGetItem(fieldObj, el);
+              if (findItem) {
+                let { key, value } = configList[j];
+                if (key === "is_show" && value === false) {
+                  resetObj[el] = !(isRestoreDefault !== void 0 && !isRestoreDefault);
+                  resetType[el] = findItem.html_type;
+                }
+                handleSetItem(findItem, configList[j]);
+              }
+            });
+          });
+        }
+        resetFields(resetObj, resetType, formData);
+      });
+    }
+    function resetFields(resetObj, resetType, formData) {
+      let fieldObj = formData.__fieldObj__ || {};
+      Object.keys(resetObj || {}).forEach((v) => {
+        if (resetObj[v]) {
+          let defObj = fieldObj[v].__defObj__ || {};
+          if (resetType[v] != "SEARCH") {
+            let errKey = handleGetErrKey(fieldObj[v]);
+            formData[v] = defObj.defVal;
+            fieldObj[v][errKey] = void 0;
+          } else {
+            if (formData[v] != defObj.defVal && resetType[v] == "SEARCH") {
+              if (!formData[v] && !defObj.defVal)
+                return;
+              let errKey = handleGetErrKey(fieldObj[v]);
+              formData[v] = defObj.defVal;
+              fieldObj[v][errKey] = void 0;
+            }
+          }
+        }
+      });
+    }
+    function handleGetErrKey(field = {}) {
+      return `__${field.val_key}-errorMsg__`;
+    }
+    function handleGetItem(fieldObj, el) {
+      return fieldObj[el];
+    }
+    function handleSetItem(findItem, config) {
+      if (!((findItem == null ? void 0 : findItem.val_key) || ""))
+        return;
+      const { key, value } = config;
+      let flagVal = value ? 1 : 0;
+      findItem && (findItem[key] = flagVal);
+    }
+    function handleGetFlagRes(list, formData = {}) {
+      let FlagList = [];
+      if (!Array.isArray(list))
+        return FlagList;
+      list.forEach((ele) => {
+        if (!handleCheckFlag(ele, formData)) {
+          FlagList.push(false);
+        } else {
+          FlagList.push(true);
+        }
+      });
+      return FlagList;
+    }
+    function handleCheckFlag(data = {}, formData = {}) {
+      var _a, _b;
+      const is_number = (val) => !(parseFloat(Number(val) + "").toString() == "NaN");
+      const all_number = (a, b) => is_number(a) && is_number(b);
+      let obj = {
+        table: {
+          ...formData
+        },
+        form: {
+          ...formData
+        },
+        sys: ((_b = (_a = props == null ? void 0 : props.userInfo) == null ? void 0 : _a.map) == null ? void 0 : _b.sysParams) || {},
+        db: props.dbParams || {}
+      };
+      const field_key = data.field_key;
+      let field_val = typeof field_key === "string" && /\${(.*?)}/g.test(field_key) ? vexutils.handleSysParams(field_key, obj) : formData[field_key];
+      let data_value = typeof data.value === "string" ? vexutils.handleSysParams(data.value, obj) : data.value;
+      if (data.con == "EQ") {
+        return field_val == data_value;
+      } else if (data.con == "NEQ") {
+        return field_val != data_value;
+      } else if (data.con == "NULL") {
+        return !field_val && String(field_val) !== "0";
+      } else if (data.con == "NOT_NULL") {
+        return !!field_val || String(field_val) === "0";
+      } else if (data.con == "CL") {
+        return field_val && field_val.includes(data_value);
+      } else if (data.con == "NC") {
+        return !field_val || field_val && !field_val.includes(data_value);
+      } else if (data.con == "BIG") {
+        if (all_number(field_val, data_value)) {
+          return +field_val > +data_value;
+        }
+      } else if (data.con == "BIGEQ") {
+        if (all_number(field_val, data_value)) {
+          return +field_val >= +data_value;
+        }
+      } else if (data.con == "LESS") {
+        if (all_number(field_val, data_value)) {
+          return +field_val < +data_value;
+        }
+      } else if (data.con == "LESSEQ") {
+        if (all_number(field_val, data_value)) {
+          return +field_val <= +data_value;
+        }
+      }
+    }
+    watch(() => props.columnConfig, (config) => {
+      if (!config || !Object.keys(config).length)
+        return;
+      loadColumn();
+    });
+    watch(() => props.data, (value) => {
+      if (!value || !value.length) {
+        isShowEmpty.value = true;
+      }
+      loadData(value);
+    });
+    onMounted(() => {
+      if (!props.isOnlyDisplay)
+        return;
+      loadColumn(props.columnConfig);
+      loadData(props.data);
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(["formTable-page", { "formTable-page-disabled--detail": __props.isDetail }]),
+        style: normalizeStyle({ height: unref(tableHeight) + "px", minHeight: unref(minHeight), maxHeight: unref(maxHeight) })
+      }, [
+        createVNode(unref(CGrid), {
+          ref_key: "formTableGridRef",
+          ref: formTableGridRef,
+          style: { height: "100%" },
+          border: "",
+          "show-header-overflow": "",
+          "highlight-hover-row": "",
+          "highlight-current-row": "",
+          "show-footer-overflow": "title",
+          height: "auto",
+          resizable: "",
+          "auto-resize": "",
+          "row-id": unref(handleRowId),
+          "row-key": true,
+          "checkbox-config": {
+            trigger: "cell",
+            reserve: true,
+            highlight: true
+          },
+          onCellClick: handlerClickRow
+        }, {
+          empty: withCtx(() => [
+            isShowEmpty.value ? (openBlock(), createElementBlock("div", _hoisted_1, "\u6682\u65E0\u6570\u636E")) : createCommentVNode("v-if", true)
+          ]),
+          _: 1
+        }, 8, ["row-id"])
+      ], 6);
+    };
+  }
+});
+
+export { script as default };

package/es/packages/form-table/src/FormTable2.js

@@ -0,0 +1,4 @@
+import script from './FormTable.vue_vue_type_script_setup_true_lang.js';
+export { default } from './FormTable.vue_vue_type_script_setup_true_lang.js';
+
+script.__file = "packages/form-table/src/FormTable.vue";

package/es/packages/form-table/src/components/index.js

@@ -0,0 +1 @@
+export { useComponents } from './index2.js';