@opentiny/vue-renderless 3.9.2 → 3.10.0

package/nav-menu/index.js

@@ -148,6 +148,10 @@ const getSelectedIndex = (state) => (path) => {
   let length = state.data.length;
   let index = -1;
   if (path !== "/") {
+    const queryIndex = path.indexOf("?");
+    if (queryIndex !== -1) {
+      path = path.slice(0, queryIndex);
+    }
     path = path.replace(/^#?\//, "");
     let exp = new RegExp('("url":"#/?' + path + '"|"url":"/?' + path + '"|"route":"/?' + path + '")', "i");
     for (let i = 0; i < length; i++) {
@@ -171,6 +175,10 @@ const showSubMenu = ({ api, nextTick, parent, state }) => (list, { more, index }
     state.showMore = !!more;
     state.subMenu = list;
     state.showPopmenu = true;
+    state.enterMenu = true;
+    state.subItemSelectedIndex = -1;
+    state.subIndex = -1;
+    state.moreItemSelectedIndex = -1;
     nextTick(() => {
       const popmenu = parent.$el.querySelector(".popmenu");
       if (popmenu) {
@@ -206,6 +214,7 @@ const hideSubMenu = ({ api, parent, state }) => () => {
 };
 const willHideSubMenu = ({ api, state }) => () => {
   api.stopHideSubMenu();
+  state.enterMenu = false;
   state.timer = setTimeout(() => {
     api.hideSubMenu();
   }, 20);
@@ -216,6 +225,10 @@ const stopHideSubMenu = (state) => () => {
 const setSubMenu = (state) => (value, index) => {
   state.subActiveIndex = index;
   state.subMenu = value;
+  state.enterMoreMenu = true;
+};
+const leaveMoreMune = (state) => () => {
+  state.enterMoreMenu = false;
 };
 const isHide = ({ parent, state }) => (event) => !state.width || event.offsetTop >= parent.$el.offsetHeight;
 const hidePopmenu = (api) => (item) => {
@@ -224,7 +237,21 @@ const hidePopmenu = (api) => (item) => {
     api.hideSubMenu();
   }
 };
-const clickMenu = ({ api, props }) => (item, index) => {
+const clickMenu = ({ api, props, state }) => (item, index, parentIndex) => {
+  if (index === void 0) {
+    return;
+  }
+  if (state.enterMenu) {
+    state.subIndex = -1;
+    state.subItemSelectedIndex = -1;
+    api.setActiveMenu(index);
+  }
+  if (state.enterMoreMenu) {
+    state.moreItemSelectedIndex = index;
+  } else {
+    state.subItemSelectedIndex = index;
+    state.subIndex = parentIndex;
+  }
   if (item.url || item.route) {
     if (props.beforeSkip) {
       props.beforeSkip(item) && api.skip(item, true);
@@ -232,7 +259,6 @@ const clickMenu = ({ api, props }) => (item, index) => {
       api.skip(item);
     }
   }
-  index !== void 0 && api.setActiveMenu(index);
   api.hidePopmenu(item);
 };
 const skip = ({ api, router, fields }) => (item, flag = false) => {
@@ -241,7 +267,7 @@ const skip = ({ api, router, fields }) => (item, flag = false) => {
     const router2 = item[urlField] || item.route;
     return window.open(xss.filterUrl(router2)).opener = null;
   }
-  const address = !item.route || !flag ? api.getUrl(item).replace(/^#/, "") : item.route.replace(/^\/+/, "/").replace("#/", "");
+  const address = !item.route || !flag ? api.getUrl(item).replace(/^#/, "") : `/${item.route || ""}`.replace(/^\/+/, "/").replace("#/", "");
   if (address) {
     return router.push(address);
   } else {
@@ -282,7 +308,9 @@ const getUrl = () => (item) => item.url || "";
 const getRoute = (props) => (item) => !props.beforeSkip ? `/${item.route || ""}`.replace(/^\/+/, "/").replace("#/", "") : "";
 const setActiveMenu = (state) => (index) => state.selectedIndex = typeof index !== "undefined" ? index : -1;
 const initService = ({ props, service }) => {
-  const fetchMenuData = () => Promise.reject(new Error("[TINY Error][NavMenu] Prop fetchMenuData is not configured"));
+  const fetchMenuData = () => Promise.reject(
+    new Error("[TINY Error][NavMenu] Prop fetchMenuData is mandatory when the framework service is not used")
+  );
   const { base = {}, setting = {} } = service || {};
   const { options = {} } = setting;
   return {
@@ -309,6 +337,7 @@ export {
   initData,
   initService,
   isHide,
+  leaveMoreMune,
   mounted,
   setActiveMenu,
   setSubMenu,

package/nav-menu/vue.js

@@ -17,6 +17,7 @@ import {
   willHideSubMenu,
   stopHideSubMenu,
   setSubMenu,
+  leaveMoreMune,
   isHide,
   hidePopmenu,
   clickMenu,
@@ -40,6 +41,7 @@ const api = [
   "willHideSubMenu",
   "stopHideSubMenu",
   "setSubMenu",
+  "leaveMoreMune",
   "isHide",
   "hidePopmenu",
   "clickMenu",
@@ -56,14 +58,19 @@ const initState = ({ reactive, api: api2, computed }) => reactive({
   data: [],
   more: [],
   width: -1,
+  enterMenu: false,
   popMenuTop: 0,
   subMenu: [],
   showMore: false,
   showPopmenu: false,
+  enterMoreMenu: false,
   timer: null,
   activeIndex: -1,
   subActiveIndex: -1,
   selectedIndex: -1,
+  subItemSelectedIndex: -1,
+  moreItemSelectedIndex: -1,
+  subIndex: -1,
   isShowSetting: false,
   marginLeft: 0,
   isShowMore: computed(() => api2.computedIsShowMore()),
@@ -79,6 +86,7 @@ const initApi = ({ api: api2, state, props, parent, fetchMenuData, fields, route
     getTag: getTag(props),
     getRoute: getRoute(props),
     setSubMenu: setSubMenu(state),
+    leaveMoreMune: leaveMoreMune(state),
     isHide: isHide({ parent, state }),
     setActiveMenu: setActiveMenu(state),
     willHideSetting: willHideSetting(state),
@@ -95,7 +103,7 @@ const initApi = ({ api: api2, state, props, parent, fetchMenuData, fields, route
     skip: skip({ api: api2, router, fields }),
     hidePopmenu: hidePopmenu(api2),
     getPoint: getPoint({ api: api2, parent }),
-    clickMenu: clickMenu({ api: api2, props }),
+    clickMenu: clickMenu({ api: api2, props, state }),
     unMounted: unMounted({ api: api2, state, router }),
     mounted: mounted({ api: api2, props, router, route, state }),
     classify: classify({ api: api2, props, state }),

package/notify/vue.js

@@ -1,5 +1,16 @@
 import "../chunk-PKUHTIDK.js";
-import { clearTimer, startTimer, close, bindEvent, unBindEvent, click, watchClosed, getOffsetStyle, getPositionSide, getZindex } from "./index";
+import {
+  clearTimer,
+  startTimer,
+  close,
+  bindEvent,
+  unBindEvent,
+  click,
+  watchClosed,
+  getOffsetStyle,
+  getPositionSide,
+  getZindex
+} from "./index";
 const api = [
   "state",
   "clearTimer",

package/numeric/vue.js

@@ -52,8 +52,12 @@ const initState = ({ reactive, computed, props, api: api2, $service, parent }) =
     inputDisabled: computed(() => props.disabled || state.formDisabled),
     displayValue: computed(() => api2.displayValue()),
     numPrecision: computed(() => api2.getNumPecision()),
-    minDisabled: computed(() => !props.circulate && state.currentValue <= props.min || state.formDisabled),
-    maxDisabled: computed(() => !props.circulate && state.currentValue >= props.max || state.formDisabled),
+    minDisabled: computed(
+      () => !props.circulate && state.currentValue <= props.min || state.formDisabled
+    ),
+    maxDisabled: computed(
+      () => !props.circulate && state.currentValue >= props.max || state.formDisabled
+    ),
     controlsAtRight: computed(() => props.controls && props.controlsPosition === "right"),
     format: computed(() => getUnitPrecision({ service: $service, props })),
     isDisplayOnly: computed(() => props.displayOnly || (parent.tinyForm || {}).displayOnly)

package/option/index.js

@@ -27,6 +27,8 @@ const hoverItem = ({ select, props, state, vm }) => () => {
 };
 const selectOptionClick = ({ props, state, select, constants, vm }) => () => {
   if (props.disabled !== true && state.groupDisabled !== true) {
+    if (select.multiple && props.required === true)
+      return;
     select.state.selectEmitter.emit(constants.EVENT_NAME.handleOptionClick, vm, true);
   }
 };
@@ -34,16 +36,22 @@ const queryChange = ({ select, props, state }) => (query) => {
   state.visible = new RegExp(escapeRegexpString(query), "i").test(state.currentLabel) || props.created;
   select.state.filteredOptionsCount += state.visible ? 1 : -1;
 };
-const toggleEvent = ({ props, refs, type }) => {
-  const optionEl = refs.option;
+const toggleEvent = ({ props, vm, type }) => {
+  const optionEl = vm.$refs.option;
   Object.keys(props.events).forEach((ev) => {
     optionEl[type + "EventListener"](ev, props.events[ev]);
   });
 };
+const initValue = ({ select, props, constants, vm }) => () => {
+  if (select.multiple && props.required) {
+    select.state.selectEmitter.emit(constants.EVENT_NAME.initValue, vm);
+  }
+};
 export {
   contains,
   handleGroupDisabled,
   hoverItem,
+  initValue,
   isEqual,
   queryChange,
   selectOptionClick,

package/option/vue.js

@@ -1,5 +1,14 @@
 import "../chunk-PKUHTIDK.js";
-import { isEqual, contains, handleGroupDisabled, hoverItem, selectOptionClick, queryChange, toggleEvent } from "./index";
+import {
+  isEqual,
+  contains,
+  handleGroupDisabled,
+  hoverItem,
+  selectOptionClick,
+  queryChange,
+  toggleEvent,
+  initValue
+} from "./index";
 const api = ["state", "visible", "hoverItem", "selectOptionClick"];
 const initState = ({ reactive, computed, props, api: api2, markRaw, select, parent }) => {
   const state = reactive({
@@ -42,7 +51,8 @@ const initApi = ({ api: api2, props, state, select, constants, vm }) => {
     hoverItem: hoverItem({ select, vm, props, state }),
     queryChange: queryChange({ select, props, state }),
     selectOptionClick: selectOptionClick({ constants, vm, props, state, select }),
-    handleGroupDisabled: handleGroupDisabled(state)
+    handleGroupDisabled: handleGroupDisabled(state),
+    initValue: initValue({ select, props, constants, vm })
   });
 };
 const initWatch = ({ watch, props, state, select, constants }) => {
@@ -67,32 +77,33 @@ const initWatch = ({ watch, props, state, select, constants }) => {
     }
   );
 };
-const initOnMounted = ({ onMounted, props, api: api2, vm, state, refs, constants, select }) => {
+const initOnMounted = ({ onMounted, props, api: api2, vm, state, constants, select }) => {
   onMounted(() => {
     state.el = vm.$el;
-    toggleEvent({ props, refs, type: "add" });
+    toggleEvent({ props, vm, type: "add" });
     select.state.selectEmitter.on(constants.EVENT_NAME.queryChange, api2.queryChange);
+    api2.initValue();
   });
 };
-const initOnBeforeUnmount = ({ onBeforeUnmount, props, select, refs, vm }) => {
+const initOnBeforeUnmount = ({ onBeforeUnmount, props, select, vm }) => {
   onBeforeUnmount(() => {
     const index = select.state.cachedOptions.indexOf(vm);
-    toggleEvent({ props, refs, type: "remove" });
+    toggleEvent({ props, vm, type: "remove" });
     if (index === -1) {
       select.state.cachedOptions.splice(index, 1);
     }
     select.onOptionDestroy(select.state.options.indexOf(vm));
   });
 };
-const renderless = (props, { computed, onMounted, onBeforeUnmount, reactive, watch, inject, markRaw }, { vm, refs, parent }) => {
+const renderless = (props, { computed, onMounted, onBeforeUnmount, reactive, watch, inject, markRaw }, { vm, parent }) => {
   const api2 = {};
   const select = inject("select");
   const constants = select._constants;
   const state = initState({ reactive, computed, props, api: api2, markRaw, select, parent });
   initApi({ api: api2, props, state, select, constants, vm });
   initWatch({ watch, props, state, select, constants });
-  initOnMounted({ onMounted, props, api: api2, vm, state, refs, constants, select });
-  initOnBeforeUnmount({ onBeforeUnmount, props, select, refs, vm });
+  initOnMounted({ onMounted, props, api: api2, vm, state, constants, select });
+  initOnBeforeUnmount({ onBeforeUnmount, props, select, vm });
   select.state.options.push(markRaw(vm));
   select.state.cachedOptions.push(markRaw(vm));
   select.state.optionsCount++;

package/option-group/index.js

@@ -2,7 +2,9 @@ import "../chunk-PKUHTIDK.js";
 const queryChange = ({ select, state, vm }) => () => {
   state.visible = true;
   if (Array.isArray(select.state.options)) {
-    const groupOptions = select.state.options.filter((option) => option.state.parent && vm && option.state.parent.label === vm.label);
+    const groupOptions = select.state.options.filter(
+      (option) => option.state.parent && vm && option.state.parent.label === vm.label
+    );
     if (Array.isArray(groupOptions)) {
       state.visible = groupOptions.some((option) => option.visible === true);
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opentiny/vue-renderless",
-  "version": "3.9.2",
+  "version": "3.10.0",
   "description": "An enterprise-class UI component library, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.",
   "homepage": "https://opentiny.design/tiny-vue",
   "keywords": [
@@ -24,6 +24,7 @@
     "url": "https://github.com/opentiny/tiny-vue/issues"
   },
   "sideEffects": false,
+  "type": "module",
   "scripts": {
     "build": "tsup",
     "build:fast": "npm run build && npm run release",

package/picker/index.js

@@ -10,11 +10,21 @@ import { formatDate, parseDate, isDateObject, getWeekNumber } from "../common/de
 import { extend } from "../common/object";
 import globalTimezone from "../picker/timezone";
 const iso8601Reg = /^\d{4}-\d{2}-\d{2}(.)\d{2}:\d{2}:\d{2}(.+)$/;
-const getPanel = ({ DatePanel, DateRangePanel, MonthRangePanel, TimePanel, TimeRangePanel, TimeSelect }) => (type) => {
+const getPanel = ({
+  DatePanel,
+  DateRangePanel,
+  MonthRangePanel,
+  YearRangePanel,
+  TimePanel,
+  TimeRangePanel,
+  TimeSelect
+}) => (type) => {
   if (type === DATEPICKER.DateRange || type === DATEPICKER.DateTimeRange) {
     return DateRangePanel;
   } else if (type === DATEPICKER.MonthRange) {
     return MonthRangePanel;
+  } else if (type === DATEPICKER.YearRange) {
+    return YearRangePanel;
   } else if (type === DATEPICKER.TimeRange) {
     return TimeRangePanel;
   } else if (type === DATEPICKER.Time) {
@@ -62,8 +72,8 @@ const getMode = ({ state }) => () => {
     return DATEPICKER.Week;
   } else if (state.type === DATEPICKER.Month) {
     return DATEPICKER.Month;
-  } else if (state.type === DATEPICKER.Year) {
-    return DATEPICKER.Year;
+  } else if ([DATEPICKER.Year, DATEPICKER.Years, DATEPICKER.YearRange].includes(state.type)) {
+    return state.type;
   } else if (state.type === DATEPICKER.Dates) {
     return DATEPICKER.Dates;
   }
@@ -80,11 +90,14 @@ const formatAsFormatAndType = ({ api }) => (value, customFormat, type) => {
 const displayValue = ({ api, props, state }) => () => {
   const formattedValue = api.formatAsFormatAndType(state.parsedValue, state.format, state.type, props.rangeSeparator);
   if (Array.isArray(state.userInput)) {
-    return [state.userInput[0] || formattedValue && formattedValue[0] || "", state.userInput[1] || formattedValue && formattedValue[1] || ""];
+    return [
+      state.userInput[0] || formattedValue && formattedValue[0] || "",
+      state.userInput[1] || formattedValue && formattedValue[1] || ""
+    ];
   } else if (state.userInput !== null) {
     return state.userInput;
   } else if (formattedValue) {
-    return state.type === DATEPICKER.Dates ? formattedValue.join(", ") : formattedValue;
+    return [DATEPICKER.Dates, DATEPICKER.Years].includes(state.type) ? formattedValue.join(", ") : formattedValue;
   }
   return "";
 };
@@ -253,7 +266,9 @@ const getDatesOfTypeValueResolveMap = (api) => ({
     return value.map((date) => api.dateFormatter(date, format));
   },
   parser(value, format) {
-    return (typeof value === "string" ? value.split(", ") : value).map((date) => date instanceof Date ? date : api.dateParser(date, format));
+    return (typeof value === "string" ? value.split(", ") : value).map(
+      (date) => date instanceof Date ? date : api.dateParser(date, format)
+    );
   }
 });
 const typeValueResolveMap = ({ api, t }) => () => ({
@@ -268,6 +283,8 @@ const typeValueResolveMap = ({ api, t }) => () => ({
   time: { formatter: api.dateFormatter, parser: api.dateParser },
   month: { formatter: api.dateFormatter, parser: api.dateParser },
   year: { formatter: api.dateFormatter, parser: api.dateParser },
+  years: getDatesOfTypeValueResolveMap(api),
+  yearrange: getDatesOfTypeValueResolveMap(api),
   number: getNumberOfTypeValueResolveMap(),
   dates: getDatesOfTypeValueResolveMap(api)
 });
@@ -295,7 +312,7 @@ const secondInputId = ({ props, state }) => () => {
   }
   return obj;
 };
-const focus = ({ api, props, refs }) => () => !props.ranged ? refs.reference.focus() : api.handleFocus();
+const focus = ({ api, props, vm }) => () => !props.ranged ? vm.$refs.reference.focus() : api.handleFocus();
 const blur = (state) => () => state.refInput.forEach((input) => input.blur());
 const parseValue = ({ api, props, state }) => (value) => {
   const isParsed = isDateObject(value) || Array.isArray(value) && value.every(isDateObject);
@@ -365,20 +382,31 @@ const handleStartChange = ({ api, state }) => () => {
     if (state.displayValue[1]) {
       state.userInput = [api.formatToString(value), state.displayValue[1]];
       newValue = [value, state.picker.state.value && state.picker.state.value[1]];
+      state.startStatus = true;
     } else {
-      let now = /* @__PURE__ */ new Date();
+      let now = new Date();
       if (now.getTime() < value.getTime()) {
         state.userInput = [api.formatToString(value), api.formatToString(value)];
         newValue = [value, value];
       } else {
-        state.userInput = [api.formatToString(value), api.formatToString(now)];
-        newValue = [value, now];
+        state.userInput = [api.formatToString(value), ""];
+        newValue = [value, ""];
       }
     }
-    state.picker.state.value = newValue;
     if (api.isValidValue(newValue)) {
+      state.picker.state.value = newValue;
+      state.historyUserInput = [value, state.picker.state.value && state.picker.state.value[1]];
+      state.historyUserValue = newValue;
       api.emitInput(newValue);
       state.userInput = null;
+    } else {
+      if (state.startStatus) {
+        state.picker.state.value = state.historyUserValue ? state.historyUserValue : state.historyValue;
+        api.emitInput(state.historyUserValue ? state.historyUserValue : state.historyValue);
+        state.userInput = state.historyUserInput ? state.historyUserInput : state.historyInput;
+      } else {
+        state.picker.state.value = newValue;
+      }
     }
   }
 };
@@ -389,8 +417,9 @@ const handleEndChange = ({ api, state }) => () => {
     if (state.displayValue[0]) {
       state.userInput = [state.displayValue[0], api.formatToString(value)];
       newValue = [state.picker.state.value && state.picker.state.value[0], value];
+      state.endStatus = true;
     } else {
-      let now = /* @__PURE__ */ new Date();
+      let now = new Date();
       if (now.getTime() < value.getTime()) {
         state.userInput = [api.formatToString(now), api.formatToString(value)];
         newValue = [now, value];
@@ -399,10 +428,21 @@ const handleEndChange = ({ api, state }) => () => {
         newValue = [value, value];
       }
     }
-    state.picker.state.value = newValue;
     if (api.isValidValue(newValue)) {
+      state.historyValue = newValue;
+      state.historyInput = [state.displayValue[0], api.formatToString(value)];
+      state.picker.state.value = newValue;
       api.emitInput(newValue);
       state.userInput = null;
+    } else {
+      if (state.endStatus) {
+        state.picker.state.value = state.historyValue;
+        api.emitInput(state.historyValue);
+        state.userInput = state.historyInput;
+      } else {
+        state.picker.state.value = state.historyValue;
+        state.userInput = state.historyInput;
+      }
     }
   }
 };
@@ -433,12 +473,12 @@ const handleClose = ({ api, props, state }) => () => {
     api.emitInput(oldValue);
   }
 };
-const handleFocus = ({ emit, refs, state }) => () => {
+const handleFocus = ({ emit, vm, state }) => () => {
   const type = state.type;
   if (DATEPICKER.TriggerTypes.includes(type) && !state.pickerVisible) {
     state.pickerVisible = true;
   }
-  emit("focus", refs.reference);
+  emit("focus", vm.$refs.reference);
 };
 const handleKeydown = ({ api, state }) => (event) => {
   const keyCode = event.keyCode;
@@ -662,6 +702,13 @@ const getType = ({ props }) => () => {
   return DATEPICKER.TimeSelect;
 };
 const watchModelValue = ({ api, props, state, dispatch }) => (value, oldValue) => {
+  state.historyInput = state.displayValue;
+  if (state.picker) {
+    state.historyValue = [
+      state.picker.state.value && state.picker.state.value[0],
+      api.parseString(state.historyInput && state.historyInput[1])
+    ];
+  }
   api.emitChange(props.modelValue);
   if (!valueEquals(value, oldValue) && !state.pickerVisible && props.validateEvent) {
     dispatch("FormItem", "form.change", value);
@@ -682,7 +729,7 @@ const computedFormat = ({ props, utils }) => () => {
 };
 const computedTriggerClass = ({ props, state }) => () => props.suffixIcon || props.prefixIcon || (state.type.includes(DATEPICKER.Time) ? DATEPICKER.IconTime : DATEPICKER.IconDate);
 const computedHaveTrigger = ({ props }) => () => typeof props.showTrigger !== "undefined" ? props.showTrigger : DATEPICKER.TriggerTypes.includes(props.type);
-const intiPopper = ({ props, hooks, vnode }) => {
+const initPopper = ({ props, hooks, vnode }) => {
   const { reactive, watch, toRefs, onBeforeUnmount, onDeactivated } = hooks;
   const { emit, refs, slots, nextTick } = vnode;
   const placementMap = DATEPICKER.PlacementMap;
@@ -734,6 +781,27 @@ const initGlobalTimezone = ({ api, state, props }) => () => {
   }
   api.emitDbTime(props.value);
 };
+const handleEnterDisplayOnlyContent = ({ state, t }) => ($event) => {
+  const target = $event.target;
+  if (target && target.scrollWidth > target.offsetWidth) {
+    state.displayOnlyTooltip = state.displayValue.join(` ${t("ui.datepicker.to")} `);
+  }
+};
+const handleEnterPickerlabel = ({ state, props }) => ($event) => {
+  const target = $event.target;
+  if (target && target.scrollWidth > target.offsetWidth) {
+    state.labelTooltip = props.label;
+  }
+};
+const setInputPaddingLeft = ({ props, state, vm, nextTick }) => () => {
+  const ml = 12;
+  const mr = 8;
+  if (props.label && !state.ranged && vm.$refs.label && vm.$refs.reference) {
+    nextTick(() => {
+      vm.$refs.reference.querySelector("input").style.paddingLeft = vm.$refs.label.offsetWidth + ml + mr + "px";
+    });
+  }
+};
 export {
   blur,
   computedFormat,
@@ -762,6 +830,8 @@ export {
   handleClose,
   handleEndChange,
   handleEndInput,
+  handleEnterDisplayOnlyContent,
+  handleEnterPickerlabel,
   handleFocus,
   handleKeydown,
   handleMouseEnter,
@@ -771,7 +841,7 @@ export {
   handleStartInput,
   hidePicker,
   initGlobalTimezone,
-  intiPopper,
+  initPopper,
   isValidValue,
   mountPicker,
   parseAsFormatAndType,
@@ -781,6 +851,7 @@ export {
   rangeFormatter,
   rangeParser,
   secondInputId,
+  setInputPaddingLeft,
   showPicker,
   typeValueResolveMap,
   updateOptions,