@opentiny/vue-dropdown-item 3.6.7 → 3.8.2

package/lib/index.js

@@ -15,16 +15,34 @@ function _extends() {
 import { defineComponent, $prefix, $props, $setup } from "@opentiny/vue-common";
 import PcTemplate from "./pc.js";
 import MobileTemplate from "./mobile.js";
+import MobileFirstTemplate from "./mobile-first.js";
 var template = function template2(mode) {
-  if ("mobile" === (process.env.TINY_MODE || mode))
-    return MobileTemplate;
-  else
+  if ("pc" === (process.env.TINY_MODE || mode)) {
     return PcTemplate;
+  }
+  if ("mobile" === (process.env.TINY_MODE || mode)) {
+    return MobileTemplate;
+  }
+  if ("mobile-first" === (process.env.TINY_MODE || mode)) {
+    return MobileFirstTemplate;
+  }
+  return PcTemplate;
+};
+var $constants = {
+  ICON_MAP: {
+    leftWardArrow: "icon-delta-left"
+  }
 };
 var DropdownItem = defineComponent({
   name: $prefix + "DropdownItem",
   componentName: "TinyDropdownItem",
   props: _extends({}, $props, {
+    _constants: {
+      type: Object,
+      default: function _default() {
+        return $constants;
+      }
+    },
     icon: [String, Object],
     disabled: Boolean,
     divided: Boolean,
@@ -33,7 +51,7 @@ var DropdownItem = defineComponent({
     titleClass: String,
     options: {
       type: Array,
-      default: function _default() {
+      default: function _default2() {
         return [];
       }
     },
@@ -47,7 +65,7 @@ var DropdownItem = defineComponent({
     },
     itemData: {
       type: Object,
-      default: function _default2() {
+      default: function _default3() {
         return {};
       }
     },
@@ -58,6 +76,24 @@ var DropdownItem = defineComponent({
     textField: {
       type: String,
       default: "label"
+    },
+    selected: {
+      type: Boolean,
+      default: false
+    },
+    selectedField: {
+      type: String,
+      default: "selected"
+    },
+    multiStage: {
+      type: Boolean,
+      default: false
+    },
+    currentIndex: {
+      type: Number,
+      default: function _default4() {
+        return -1;
+      }
     }
   }),
   setup: function setup(props, context) {

package/lib/mobile-first.js

@@ -0,0 +1,100 @@
+import { defineComponent, props, setup as _setup } from "@opentiny/vue-common";
+import { renderless, api } from "@opentiny/vue-renderless/dropdown-item/mf";
+import { openBlock, createElementBlock, normalizeClass, withModifiers, createElementVNode, createBlock, resolveDynamicComponent, createCommentVNode, renderSlot } from "vue";
+function _createForOfIteratorHelperLoose(o, allowArrayLike) {
+  var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"];
+  if (it)
+    return (it = it.call(o)).next.bind(it);
+  if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") {
+    if (it)
+      o = it;
+    var i = 0;
+    return function() {
+      if (i >= o.length)
+        return { done: true };
+      return { done: false, value: o[i++] };
+    };
+  }
+  throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+function _unsupportedIterableToArray(o, minLen) {
+  if (!o)
+    return;
+  if (typeof o === "string")
+    return _arrayLikeToArray(o, minLen);
+  var n = Object.prototype.toString.call(o).slice(8, -1);
+  if (n === "Object" && o.constructor)
+    n = o.constructor.name;
+  if (n === "Map" || n === "Set")
+    return Array.from(o);
+  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))
+    return _arrayLikeToArray(o, minLen);
+}
+function _arrayLikeToArray(arr, len) {
+  if (len == null || len > arr.length)
+    len = arr.length;
+  for (var i = 0, arr2 = new Array(len); i < len; i++)
+    arr2[i] = arr[i];
+  return arr2;
+}
+var _export_sfc = function _export_sfc2(sfc, props) {
+  var target = sfc.__vccOpts || sfc;
+  for (var _iterator = _createForOfIteratorHelperLoose(props), _step; !(_step = _iterator()).done; ) {
+    var _step$value = _step.value, key = _step$value[0], val = _step$value[1];
+    target[key] = val;
+  }
+  return target;
+};
+
+var _sfc_main = defineComponent({
+  props: [].concat(props, ["disabled", "icon", "itemData", "selected", "label", "level", "currentIndex"]),
+  setup: function setup(props2, context) {
+    return _setup({
+      props: props2,
+      context,
+      renderless,
+      api
+    });
+  }
+});
+var _hoisted_1 = ["aria-disabled", "tabindex"];
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("li", {
+    onMouseenter: _cache[0] || (_cache[0] = function() {
+      return _ctx.mouseEnter && _ctx.mouseEnter.apply(_ctx, arguments);
+    }),
+    onMouseleave: _cache[1] || (_cache[1] = function() {
+      return _ctx.mouseLeave && _ctx.mouseLeave.apply(_ctx, arguments);
+    }),
+    class: normalizeClass(["list-none leading-10 sm:leading-8 m-0 cursor-pointer outline-0 min-w-[4.5rem] max-w-[13.5rem] w-full [&_svg]:sm:w-3.5 [&_svg]:sm:h-3.5 [&_svg]:sm:mr-1.5 [&_svg]:mr-2 [&_svg]:align-text-bottom", {
+      "text-color-text-primary active:bg-color-bg-4 visited:text-color-brand hover:bg-color-bg-4 focus:bg-color-bg-4": !_ctx.disabled
+    }, {
+      "cursor-not-allowed text-color-text-disabled [&_svg]:fill-color-text-disabled": _ctx.disabled
+    }, {
+      "text-color-brand-focus": _ctx.dataStore.checkedStatus && _ctx.selected
+    }, {
+      "!px-0 sm:!px-0": _ctx.dataStore.multiStage
+    }]),
+    onClick: _cache[2] || (_cache[2] = withModifiers(function() {
+      return _ctx.handleClick && _ctx.handleClick.apply(_ctx, arguments);
+    }, ["stop"])),
+    "aria-disabled": _ctx.disabled,
+    tabindex: _ctx.disabled ? null : -1
+  }, [createElementVNode(
+    "div",
+    {
+      ref: "level",
+      class: normalizeClass(["sm:text-xs text-sm", _ctx.level === "2" ? "mx-6 overflow-hidden text-ellipsis whitespace-nowrap" : "mx-4 sm:mx-3 overflow-hidden text-ellipsis whitespace-nowrap"])
+    },
+    [_ctx.icon ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.icon), {
+      key: 0,
+      class: "sm:w-3.5 sm:h-3.5 sm:mr-1.5 mr-2 align-text-bottom"
+    })) : createCommentVNode("v-if", true), renderSlot(_ctx.$slots, "default")],
+    2
+    /* CLASS */
+  )], 42, _hoisted_1);
+}
+var mobileFirst = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+export {
+  mobileFirst as default
+};

package/lib/mobile.js

@@ -51,7 +51,7 @@ var _export_sfc = function _export_sfc2(sfc, props) {
   return target;
 };
 
-var _sfc_main = /* @__PURE__ */ defineComponent({
+var _sfc_main = defineComponent({
   directives: {
     Clickoutside
   },

package/lib/pc.js

@@ -2,7 +2,7 @@ import { defineComponent, $prefix, props, setup as _setup } from "@opentiny/vue-
 import { renderless, api } from "@opentiny/vue-renderless/dropdown-item/vue";
 import { iconDeltaLeft } from "@opentiny/vue-icon";
 import "@opentiny/vue-theme/dropdown-item/index.css";
-import { resolveComponent, openBlock, createElementBlock, normalizeClass, withModifiers, createVNode, createCommentVNode, createElementVNode, createBlock, resolveDynamicComponent, renderSlot, toDisplayString, Fragment, renderList, withCtx } from "vue";
+import { resolveComponent, openBlock, createElementBlock, Fragment, createCommentVNode, createElementVNode, normalizeClass, withModifiers, createBlock, resolveDynamicComponent, renderSlot, toDisplayString, renderList, withCtx } from "vue";
 function _createForOfIteratorHelperLoose(o, allowArrayLike) {
   var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"];
   if (it)
@@ -48,7 +48,7 @@ var _export_sfc = function _export_sfc2(sfc, props) {
   return target;
 };
 
-var _sfc_main = /* @__PURE__ */ defineComponent({
+var _sfc_main = defineComponent({
   name: $prefix + "DropdownItem",
   componentName: $prefix + "DropdownItem",
   emits: ["item-click"],
@@ -67,74 +67,83 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
 });
 var _hoisted_1 = ["aria-disabled", "tabindex"];
 var _hoisted_2 = {
-  key: 0,
-  class: "tiny-dropdown-menu__item-expand"
+  class: "tiny-dropdown-item__wrap"
 };
 var _hoisted_3 = {
-  class: "tiny-dropdown-menu__item-content"
+  key: 0,
+  class: "tiny-dropdown-item__expand tiny-dropdown-menu__item-expand"
+};
+var _hoisted_4 = {
+  class: "tiny-dropdown-item__content tiny-dropdown-menu__item-content"
 };
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  var _component_icon_delta_left = resolveComponent("icon-delta-left");
   var _component_tiny_dropdown_item = resolveComponent("tiny-dropdown-item");
-  return openBlock(), createElementBlock("li", {
-    class: normalizeClass(["tiny-dropdown-menu__item", {
-      "is-disabled": _ctx.disabled,
-      "tiny-dropdown-menu__item--divided": _ctx.divided
-    }]),
-    ref: "dropdownItem",
-    onClick: _cache[0] || (_cache[0] = function() {
-      return _ctx.handleClick && _ctx.handleClick.apply(_ctx, arguments);
-    }),
-    onMousedown: _cache[1] || (_cache[1] = withModifiers(function() {
-    }, ["stop"])),
-    "aria-disabled": _ctx.disabled,
-    tabindex: _ctx.disabled ? null : -1
-  }, [_ctx.itemData.children && _ctx.itemData.children.length ? (openBlock(), createElementBlock("span", _hoisted_2, [createVNode(_component_icon_delta_left)])) : createCommentVNode("v-if", true), createElementVNode("div", _hoisted_3, [_ctx.icon ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.icon), {
-    key: 0,
-    class: "tiny-svg-size"
-  })) : createCommentVNode("v-if", true), renderSlot(_ctx.$slots, "default", {
-    itemData: _ctx.itemData
-  }, function() {
-    return [createElementVNode(
-      "span",
-      null,
-      toDisplayString(_ctx.label),
-      1
-      /* TEXT */
-    )];
-  })]), _ctx.itemData.children && _ctx.itemData.children.length ? (openBlock(), createElementBlock(
-    "ul",
-    {
-      key: 1,
-      class: normalizeClass(["tiny-dropdown-menu", "tiny-dropdown-menu__item--child", _ctx.state.popperClass])
-    },
-    [(openBlock(true), createElementBlock(
-      Fragment,
-      null,
-      renderList(_ctx.itemData.children, function(item, index) {
-        return openBlock(), createBlock(_component_tiny_dropdown_item, {
-          key: index,
-          label: item[_ctx.state.textField],
-          itemData: item,
-          icon: item.icon,
-          disabled: item.disabled,
-          divided: item.divided
-        }, {
-          default: withCtx(function() {
-            return [renderSlot(_ctx.$slots, "default", {
-              itemData: item
-            })];
-          }),
-          _: 2
-          /* DYNAMIC */
-        }, 1032, ["label", "itemData", "icon", "disabled", "divided"]);
+  return openBlock(), createElementBlock(
+    Fragment,
+    null,
+    [createCommentVNode(" TINY-TODO:  tiny-dropdown-menu__item命名不规范，后续统一有个迭代去掉 "), createElementVNode("li", {
+      class: normalizeClass(["tiny-dropdown-item tiny-dropdown-menu__item", {
+        "is-disabled": _ctx.disabled,
+        "tiny-dropdown-item--divided tiny-dropdown-menu__item--divided": _ctx.divided,
+        "has-children": _ctx.itemData.children && _ctx.itemData.children.length
+      }]),
+      ref: "dropdownItem",
+      onClick: _cache[0] || (_cache[0] = function() {
+        return _ctx.handleClick && _ctx.handleClick.apply(_ctx, arguments);
       }),
-      128
-      /* KEYED_FRAGMENT */
-    ))],
-    2
-    /* CLASS */
-  )) : createCommentVNode("v-if", true)], 42, _hoisted_1);
+      onMousedown: _cache[1] || (_cache[1] = withModifiers(function() {
+      }, ["stop"])),
+      "aria-disabled": _ctx.disabled,
+      tabindex: _ctx.disabled ? null : -1
+    }, [createElementVNode("div", _hoisted_2, [_ctx.itemData.children && _ctx.itemData.children.length ? (openBlock(), createElementBlock("span", _hoisted_3, [(openBlock(), createBlock(resolveDynamicComponent(_ctx.state.getIcon)))])) : createCommentVNode("v-if", true), createElementVNode("div", _hoisted_4, [_ctx.icon ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.icon), {
+      key: 0,
+      class: "tiny-svg-size"
+    })) : createCommentVNode("v-if", true), renderSlot(_ctx.$slots, "default", {
+      itemData: _ctx.itemData
+    }, function() {
+      return [createElementVNode(
+        "span",
+        null,
+        toDisplayString(_ctx.label),
+        1
+        /* TEXT */
+      )];
+    })]), _ctx.itemData.children && _ctx.itemData.children.length ? (openBlock(), createElementBlock(
+      "ul",
+      {
+        key: 1,
+        class: normalizeClass(["tiny-dropdown-menu", "tiny-dropdown-item--child tiny-dropdown-menu__item--child", _ctx.state.popperClass])
+      },
+      [(openBlock(true), createElementBlock(
+        Fragment,
+        null,
+        renderList(_ctx.itemData.children, function(item, index) {
+          return openBlock(), createBlock(_component_tiny_dropdown_item, {
+            key: index,
+            label: item[_ctx.state.textField],
+            "item-data": item,
+            icon: item.icon,
+            disabled: item.disabled,
+            divided: item.divided
+          }, {
+            default: withCtx(function() {
+              return [renderSlot(_ctx.$slots, "default", {
+                itemData: item
+              })];
+            }),
+            _: 2
+            /* DYNAMIC */
+          }, 1032, ["label", "item-data", "icon", "disabled", "divided"]);
+        }),
+        128
+        /* KEYED_FRAGMENT */
+      ))],
+      2
+      /* CLASS */
+    )) : createCommentVNode("v-if", true)])], 42, _hoisted_1)],
+    2112
+    /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
+  );
 }
 var pc = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export {

package/package.json

@@ -1,14 +1,15 @@
 {
   "name": "@opentiny/vue-dropdown-item",
-  "version": "3.6.7",
+  "version": "3.8.2",
   "description": "",
   "main": "./lib/index.js",
+  "module": "./lib/index.js",
   "dependencies": {
-    "@opentiny/vue-common": "~3.6.7",
-    "@opentiny/vue-icon": "~3.6.7",
-    "@opentiny/vue-renderless": "~3.6.6",
-    "@opentiny/vue-popup": "~3.6.7",
-    "@opentiny/vue-button": "~3.6.7"
+    "@opentiny/vue-common": "~3.8.2",
+    "@opentiny/vue-icon": "~3.8.2",
+    "@opentiny/vue-renderless": "~3.8.2",
+    "@opentiny/vue-popup": "~3.8.2",
+    "@opentiny/vue-button": "~3.8.2"
   },
   "license": "MIT",
   "types": "index.d.ts",

package/src/index.d.ts

@@ -1,75 +1,2 @@
-declare const _default: import("@vue/runtime-core").DefineComponent<{
-    icon: (StringConstructor | ObjectConstructor)[];
-    disabled: BooleanConstructor;
-    divided: BooleanConstructor;
-    command: {};
-    title: StringConstructor;
-    titleClass: StringConstructor;
-    options: {
-        type: ArrayConstructor;
-        default: () => never[];
-    };
-    type: {
-        type: StringConstructor;
-        default: string;
-    };
-    label: {
-        type: StringConstructor;
-        default: string;
-    };
-    itemData: {
-        type: ObjectConstructor;
-        default: () => {};
-    };
-    appendToBody: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    textField: {
-        type: StringConstructor;
-        default: string;
-    };
-}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-    [key: string]: any;
-}>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<{
-    icon: (StringConstructor | ObjectConstructor)[];
-    disabled: BooleanConstructor;
-    divided: BooleanConstructor;
-    command: {};
-    title: StringConstructor;
-    titleClass: StringConstructor;
-    options: {
-        type: ArrayConstructor;
-        default: () => never[];
-    };
-    type: {
-        type: StringConstructor;
-        default: string;
-    };
-    label: {
-        type: StringConstructor;
-        default: string;
-    };
-    itemData: {
-        type: ObjectConstructor;
-        default: () => {};
-    };
-    appendToBody: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    textField: {
-        type: StringConstructor;
-        default: string;
-    };
-}>>, {
-    type: string;
-    disabled: boolean;
-    textField: string;
-    label: string;
-    options: unknown[];
-    divided: boolean;
-    itemData: Record<string, any>;
-    appendToBody: boolean;
-}>;
+declare const _default: any;
 export default _default;

package/src/mobile-first.vue.d.ts

@@ -0,0 +1,2 @@
+declare const _sfc_main: any;
+export default _sfc_main;

package/src/mobile.vue.d.ts

@@ -1,2 +1,2 @@
-declare const _sfc_main: import("@vue/runtime-core").DefineComponent<unknown, object, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<unknown>, {}>;
+declare const _sfc_main: any;
 export default _sfc_main;

package/src/pc.vue.d.ts

@@ -1,17 +1,2 @@
-declare const _sfc_main: import("@vue/runtime-core").DefineComponent<Readonly<{
-    [x: string]: any;
-}>, {
-    t: (this: any, path: any, options?: any) => any;
-    vm: any;
-    f: (props: any, attrs?: {}) => {};
-    a: (attrs: any, filters: any, include: any) => {};
-    d: (props: any) => void;
-    dp: (props: any) => void;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "item-click"[], "item-click", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<Readonly<{
-    [x: string]: any;
-}>>> & {
-    "onItem-click"?: ((...args: any[]) => any) | undefined;
-}, {
-    [x: string]: any;
-}>;
+declare const _sfc_main: any;
 export default _sfc_main;