@dao-style/core 0.0.1-beta.10 → 0.0.1-beta.11

package/dist/dao-style.es.js

@@ -17,7 +17,7 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-import { defineComponent, computed, openBlock, createElementBlock, normalizeClass, renderSlot, createCommentVNode, createElementVNode, createBlock, unref, resolveComponent, Fragment, createTextVNode, toDisplayString, ref, inject, watchEffect, mergeProps, provide, toRefs, createVNode, withCtx, watch, Transition, withModifiers, normalizeStyle, withDirectives, vShow, withKeys, getCurrentInstance, onMounted, onBeforeUnmount, Teleport, nextTick, renderList, reactive, vModelText, onUnmounted, h } from "vue";
+import { defineComponent, computed, openBlock, createElementBlock, normalizeClass, renderSlot, createCommentVNode, createElementVNode, unref, resolveComponent, Fragment, createBlock, createTextVNode, toDisplayString, ref, inject, watchEffect, mergeProps, provide, toRefs, createVNode, withCtx, watch, Transition, withModifiers, normalizeStyle, withDirectives, vShow, withKeys, getCurrentInstance, onMounted, onBeforeUnmount, Teleport, nextTick, reactive, renderList, vModelText, toRef, onUnmounted, h } from "vue";
 import { isArray, isSet, looseIndexOf, looseEqual, isFunction, NOOP } from "@vue/shared";
 var actionIcon_vue_vue_type_style_index_0_lang = "";
 var _export_sfc = (sfc, props) => {
@@ -26,7 +26,7 @@ var _export_sfc = (sfc, props) => {
   }
   return sfc;
 };
-const _sfc_main$H = defineComponent({
+const _sfc_main$I = defineComponent({
   name: "DaoActionIcon",
   props: {
     name: {
@@ -55,8 +55,8 @@ const _sfc_main$H = defineComponent({
     };
   }
 });
-const _hoisted_1$v = ["disabled"];
-function _sfc_render$D(_ctx, _cache, $props, $setup, $data, $options) {
+const _hoisted_1$x = ["disabled"];
+function _sfc_render$F(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("button", {
     class: normalizeClass(["dao-action-icon", `dao-action-icon--type-${_ctx.type}`]),
     disabled: _ctx.realDisabled,
@@ -68,9 +68,9 @@ function _sfc_render$D(_ctx, _cache, $props, $setup, $data, $options) {
         class: normalizeClass(["dao-action-icon__iconfont", _ctx.name])
       }, null, 2)) : createCommentVNode("", true)
     ])
-  ], 10, _hoisted_1$v);
+  ], 10, _hoisted_1$x);
 }
-var actionIcon = /* @__PURE__ */ _export_sfc(_sfc_main$H, [["render", _sfc_render$D]]);
+var DaoActionIcon = /* @__PURE__ */ _export_sfc(_sfc_main$I, [["render", _sfc_render$F]]);
 const BUTTON_TYPES = ["primary", "secondary", "tertiary", "ghost", "danger"];
 var buttonProps = {
   type: {
@@ -109,7 +109,7 @@ var buttonProps = {
   }
 };
 var icon_scss_vue_type_style_index_0_src_lang = "";
-const _sfc_main$G = defineComponent({
+const _sfc_main$H = defineComponent({
   name: "DaoIcon",
   props: {
     name: {
@@ -122,55 +122,31 @@ const _sfc_main$G = defineComponent({
     }
   }
 });
-const _hoisted_1$u = {
+const _hoisted_1$w = {
   key: 1,
   class: "dao-icon dao-svg-icon"
 };
-const _hoisted_2$k = ["xlink:href"];
-function _sfc_render$C(_ctx, _cache, $props, $setup, $data, $options) {
+const _hoisted_2$l = ["xlink:href"];
+function _sfc_render$E(_ctx, _cache, $props, $setup, $data, $options) {
   return _ctx.useFont ? (openBlock(), createElementBlock("i", {
     key: 0,
     class: normalizeClass(["dao-icon dao-iconfont", _ctx.name])
-  }, null, 2)) : (openBlock(), createElementBlock("svg", _hoisted_1$u, [
+  }, null, 2)) : (openBlock(), createElementBlock("svg", _hoisted_1$w, [
     createElementVNode("use", {
       "xlink:href": `#${_ctx.name}`
-    }, null, 8, _hoisted_2$k)
+    }, null, 8, _hoisted_2$l)
   ]));
 }
-var DaoIcon = /* @__PURE__ */ _export_sfc(_sfc_main$G, [["render", _sfc_render$C]]);
-const _sfc_main$F = /* @__PURE__ */ defineComponent({
-  props: {
-    useFont: {
-      type: Boolean,
-      default: false
-    },
-    iconName: {
-      type: String,
-      default: ""
-    }
-  },
-  setup(__props) {
-    return (_ctx, _cache) => {
-      return !__props.useFont ? (openBlock(), createBlock(DaoIcon, {
-        key: 0,
-        class: "dao-btn__icon",
-        name: __props.iconName
-      }, null, 8, ["name"])) : (openBlock(), createElementBlock("i", {
-        key: 1,
-        class: normalizeClass(["dao-btn__iconfont", __props.iconName])
-      }, null, 2));
-    };
-  }
-});
+var DaoIcon = /* @__PURE__ */ _export_sfc(_sfc_main$H, [["render", _sfc_render$E]]);
 var button_vue_vue_type_style_index_0_lang = "";
 const NO_ICON = Symbol(0);
 const RIGHT_ICON = Symbol(1);
 const LEFT_ICON = Symbol(2);
 const BOTH_ICON = Symbol(3);
-const _sfc_main$E = defineComponent({
+const _sfc_main$G = defineComponent({
   name: "DaoButton",
   components: {
-    DaoButtonIcon: _sfc_main$F
+    DaoIcon
   },
   props: buttonProps,
   emits: ["click"],
@@ -220,6 +196,8 @@ const _sfc_main$E = defineComponent({
       }
       return props.iconRight;
     });
+    const leftIconClassName = computed(() => isIconLeftFont.value ? "dao-btn__iconfont" : "dao-btn__icon");
+    const rightIconClassName = computed(() => isIconRightFont.value ? "dao-btn__iconfont" : "dao-btn__icon");
     const classList = computed(() => {
       const unrefIconState = unref(iconState);
       const list = [
@@ -250,53 +228,57 @@ const _sfc_main$E = defineComponent({
       isIconLeftFont,
       realIconLeft,
       isIconRightFont,
-      realIconRight
+      realIconRight,
+      leftIconClassName,
+      rightIconClassName
     };
   }
 });
-const _hoisted_1$t = ["disabled"];
-const _hoisted_2$j = {
+const _hoisted_1$v = ["disabled"];
+const _hoisted_2$k = {
   key: 1,
   class: "dao-btn__text"
 };
-function _sfc_render$B(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_dao_button_icon = resolveComponent("dao-button-icon");
+function _sfc_render$D(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_dao_icon = resolveComponent("dao-icon");
   return openBlock(), createElementBlock("button", {
     class: normalizeClass(_ctx.classList),
     disabled: _ctx.realDisabled,
     onClick: _cache[0] || (_cache[0] = (...args) => _ctx.handleClick && _ctx.handleClick(...args))
   }, [
     _ctx.isSimpleButton ? renderSlot(_ctx.$slots, "default", { key: 0 }) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-      _ctx.realIconLeft ? (openBlock(), createBlock(_component_dao_button_icon, {
+      _ctx.realIconLeft ? (openBlock(), createBlock(_component_dao_icon, {
         key: 0,
+        class: normalizeClass(_ctx.leftIconClassName),
         "use-font": _ctx.isIconLeftFont,
-        "icon-name": _ctx.realIconLeft
-      }, null, 8, ["use-font", "icon-name"])) : createCommentVNode("", true),
-      _ctx.$slots.default ? (openBlock(), createElementBlock("span", _hoisted_2$j, [
+        name: _ctx.realIconLeft
+      }, null, 8, ["class", "use-font", "name"])) : createCommentVNode("", true),
+      _ctx.$slots.default ? (openBlock(), createElementBlock("span", _hoisted_2$k, [
         renderSlot(_ctx.$slots, "default")
       ])) : createCommentVNode("", true),
-      _ctx.realIconRight ? (openBlock(), createBlock(_component_dao_button_icon, {
+      _ctx.realIconRight ? (openBlock(), createBlock(_component_dao_icon, {
         key: 2,
+        class: normalizeClass(_ctx.rightIconClassName),
         "use-font": _ctx.isIconRightFont,
-        "icon-name": _ctx.realIconRight
-      }, null, 8, ["use-font", "icon-name"])) : createCommentVNode("", true)
+        name: _ctx.realIconRight
+      }, null, 8, ["class", "use-font", "name"])) : createCommentVNode("", true)
     ], 64))
-  ], 10, _hoisted_1$t);
+  ], 10, _hoisted_1$v);
 }
-var DaoButton = /* @__PURE__ */ _export_sfc(_sfc_main$E, [["render", _sfc_render$B]]);
+var DaoButton = /* @__PURE__ */ _export_sfc(_sfc_main$G, [["render", _sfc_render$D]]);
 var buttonGroup_vue_vue_type_style_index_0_lang = "";
-const _sfc_main$D = defineComponent({
+const _sfc_main$F = defineComponent({
   name: "DaoButtonGroup"
 });
-const _hoisted_1$s = { class: "dao-btn-group" };
-function _sfc_render$A(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("div", _hoisted_1$s, [
+const _hoisted_1$u = { class: "dao-btn-group" };
+function _sfc_render$C(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("div", _hoisted_1$u, [
     renderSlot(_ctx.$slots, "default")
   ]);
 }
-var buttonGroup = /* @__PURE__ */ _export_sfc(_sfc_main$D, [["render", _sfc_render$A]]);
+var buttonGroup = /* @__PURE__ */ _export_sfc(_sfc_main$F, [["render", _sfc_render$C]]);
 var card_scss_vue_type_style_index_0_src_lang = "";
-const _sfc_main$C = defineComponent({
+const _sfc_main$E = defineComponent({
   name: "DaoCard",
   components: {
     DaoIcon
@@ -324,25 +306,25 @@ const _sfc_main$C = defineComponent({
     }
   }
 });
-const _hoisted_1$r = {
+const _hoisted_1$t = {
   key: 0,
   class: "dao-card-header"
 };
-const _hoisted_2$i = {
+const _hoisted_2$j = {
   key: 0,
   class: "dao-card-header-item"
 };
-const _hoisted_3$c = { class: "dao-card-header-item dao-card-header-title" };
-const _hoisted_4$b = { class: "dao-card-header-item dao-card-header-action" };
-function _sfc_render$z(_ctx, _cache, $props, $setup, $data, $options) {
+const _hoisted_3$d = { class: "dao-card-header-item dao-card-header-title" };
+const _hoisted_4$c = { class: "dao-card-header-item dao-card-header-action" };
+function _sfc_render$B(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_dao_icon = resolveComponent("dao-icon");
   return openBlock(), createElementBlock("div", {
     class: normalizeClass(["dao-card", `dao-card--${_ctx.type}`])
   }, [
-    _ctx.type !== "headless" ? (openBlock(), createElementBlock("div", _hoisted_1$r, [
+    _ctx.type !== "headless" ? (openBlock(), createElementBlock("div", _hoisted_1$t, [
       renderSlot(_ctx.$slots, "header", {}, () => [
         renderSlot(_ctx.$slots, "header-prefix"),
-        _ctx.icon || _ctx.$slots.icon ? (openBlock(), createElementBlock("div", _hoisted_2$i, [
+        _ctx.icon || _ctx.$slots.icon ? (openBlock(), createElementBlock("div", _hoisted_2$j, [
           renderSlot(_ctx.$slots, "icon", {}, () => [
             _ctx.icon ? (openBlock(), createBlock(_component_dao_icon, {
               key: 0,
@@ -352,12 +334,12 @@ function _sfc_render$z(_ctx, _cache, $props, $setup, $data, $options) {
             }, null, 8, ["name", "use-font"])) : createCommentVNode("", true)
           ])
         ])) : createCommentVNode("", true),
-        createElementVNode("div", _hoisted_3$c, [
+        createElementVNode("div", _hoisted_3$d, [
           renderSlot(_ctx.$slots, "title", {}, () => [
             createTextVNode(toDisplayString(_ctx.title), 1)
           ])
         ]),
-        createElementVNode("div", _hoisted_4$b, [
+        createElementVNode("div", _hoisted_4$c, [
           renderSlot(_ctx.$slots, "action")
         ]),
         renderSlot(_ctx.$slots, "header-suffix")
@@ -379,18 +361,18 @@ function _sfc_render$z(_ctx, _cache, $props, $setup, $data, $options) {
     ], 2)
   ], 2);
 }
-var card = /* @__PURE__ */ _export_sfc(_sfc_main$C, [["render", _sfc_render$z]]);
+var card = /* @__PURE__ */ _export_sfc(_sfc_main$E, [["render", _sfc_render$B]]);
 var cardItem_scss_vue_type_style_index_0_src_lang = "";
-const _sfc_main$B = defineComponent({
+const _sfc_main$D = defineComponent({
   name: "DaoCardItem"
 });
-const _hoisted_1$q = { class: "dao-card-item" };
-function _sfc_render$y(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("div", _hoisted_1$q, [
+const _hoisted_1$s = { class: "dao-card-item" };
+function _sfc_render$A(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("div", _hoisted_1$s, [
     renderSlot(_ctx.$slots, "default")
   ]);
 }
-var cardItem = /* @__PURE__ */ _export_sfc(_sfc_main$B, [["render", _sfc_render$y]]);
+var cardItem = /* @__PURE__ */ _export_sfc(_sfc_main$D, [["render", _sfc_render$A]]);
 function isNullish(val) {
   return val === null || val === void 0;
 }
@@ -422,9 +404,11 @@ const formLabelWidthKey = Symbol("formLabelWidthKey");
 const navRootKey = Symbol("rootNav");
 const navSubKey = Symbol("subNav");
 const breadcrumbKey = Symbol("breadcrumbKey");
+const ToggleItemKey = Symbol("toggleItem");
+const ExpansionStateKey = Symbol("expansionProps");
 var checkbox_vue_vue_type_style_index_0_lang = "";
 const modelValueAny = [String, Number, Boolean, Symbol, Object, Set, Array];
-const _sfc_main$A = defineComponent({
+const _sfc_main$C = defineComponent({
   name: "DaoCheckbox",
   props: {
     modelValue: {
@@ -557,21 +541,21 @@ const _sfc_main$A = defineComponent({
     }
   }
 });
-const _hoisted_1$p = ["disabled", "indeterminate", "checked"];
-const _hoisted_2$h = /* @__PURE__ */ createElementVNode("span", { class: "dao-checkbox-inner" }, null, -1);
-const _hoisted_3$b = {
+const _hoisted_1$r = ["disabled", "indeterminate", "checked"];
+const _hoisted_2$i = /* @__PURE__ */ createElementVNode("span", { class: "dao-checkbox-inner" }, null, -1);
+const _hoisted_3$c = {
   key: 0,
   class: "dao-checkbox__label"
 };
-const _hoisted_4$a = {
+const _hoisted_4$b = {
   key: 0,
   class: "dao-checkbox__label-text"
 };
-const _hoisted_5$6 = {
+const _hoisted_5$7 = {
   key: 1,
   class: "dao-checkbox__label-helper"
 };
-function _sfc_render$x(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$z(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("label", {
     class: normalizeClass(_ctx.wrapClasses)
   }, [
@@ -586,14 +570,14 @@ function _sfc_render$x(_ctx, _cache, $props, $setup, $data, $options) {
       }, _ctx.$attrs, {
         checked: _ctx.currentChecked,
         onChange: _cache[0] || (_cache[0] = (...args) => _ctx.change && _ctx.change(...args))
-      }), null, 16, _hoisted_1$p),
-      _hoisted_2$h
+      }), null, 16, _hoisted_1$r),
+      _hoisted_2$i
     ], 2),
-    _ctx.hasLabel ? (openBlock(), createElementBlock("span", _hoisted_3$b, [
-      _ctx.$slots.default ? (openBlock(), createElementBlock("span", _hoisted_4$a, [
+    _ctx.hasLabel ? (openBlock(), createElementBlock("span", _hoisted_3$c, [
+      _ctx.$slots.default ? (openBlock(), createElementBlock("span", _hoisted_4$b, [
         renderSlot(_ctx.$slots, "default")
       ])) : createCommentVNode("", true),
-      _ctx.hasHelper ? (openBlock(), createElementBlock("span", _hoisted_5$6, [
+      _ctx.hasHelper ? (openBlock(), createElementBlock("span", _hoisted_5$7, [
         renderSlot(_ctx.$slots, "helper", {}, () => [
           createTextVNode(toDisplayString(_ctx.helper), 1)
         ])
@@ -601,9 +585,9 @@ function _sfc_render$x(_ctx, _cache, $props, $setup, $data, $options) {
     ])) : createCommentVNode("", true)
   ], 2);
 }
-var DaoCheckbox = /* @__PURE__ */ _export_sfc(_sfc_main$A, [["render", _sfc_render$x]]);
+var DaoCheckbox = /* @__PURE__ */ _export_sfc(_sfc_main$C, [["render", _sfc_render$z]]);
 var checkboxGroup_vue_vue_type_style_index_0_lang = "";
-const _sfc_main$z = defineComponent({
+const _sfc_main$B = defineComponent({
   name: "DaoCheckboxGroup",
   props: {
     modelValue: {
@@ -637,15 +621,15 @@ const _sfc_main$z = defineComponent({
     };
   }
 });
-function _sfc_render$w(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$y(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("div", {
     class: normalizeClass(_ctx.checkboxGroupClasses)
   }, [
     renderSlot(_ctx.$slots, "default")
   ], 2);
 }
-var checkboxGroup = /* @__PURE__ */ _export_sfc(_sfc_main$z, [["render", _sfc_render$w]]);
-const _sfc_main$y = defineComponent({
+var checkboxGroup = /* @__PURE__ */ _export_sfc(_sfc_main$B, [["render", _sfc_render$y]]);
+const _sfc_main$A = defineComponent({
   name: "DaoDialogHeader",
   components: {
     DaoButton
@@ -668,10 +652,10 @@ const _sfc_main$y = defineComponent({
     };
   }
 });
-const _hoisted_1$o = { class: "dao-dialog-header" };
-function _sfc_render$v(_ctx, _cache, $props, $setup, $data, $options) {
+const _hoisted_1$q = { class: "dao-dialog-header" };
+function _sfc_render$x(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_dao_button = resolveComponent("dao-button");
-  return openBlock(), createElementBlock("div", _hoisted_1$o, [
+  return openBlock(), createElementBlock("div", _hoisted_1$q, [
     renderSlot(_ctx.$slots, "default", {}, () => [
       createElementVNode("span", null, [
         renderSlot(_ctx.$slots, "title", {}, () => [
@@ -688,8 +672,8 @@ function _sfc_render$v(_ctx, _cache, $props, $setup, $data, $options) {
     ])
   ]);
 }
-var DialogHeader = /* @__PURE__ */ _export_sfc(_sfc_main$y, [["render", _sfc_render$v]]);
-const _sfc_main$x = defineComponent({
+var DialogHeader = /* @__PURE__ */ _export_sfc(_sfc_main$A, [["render", _sfc_render$x]]);
+const _sfc_main$z = defineComponent({
   name: "DaoDialogFooter",
   components: {
     DaoButton
@@ -725,10 +709,10 @@ const _sfc_main$x = defineComponent({
     };
   }
 });
-const _hoisted_1$n = { class: "dao-dialog-footer" };
-function _sfc_render$u(_ctx, _cache, $props, $setup, $data, $options) {
+const _hoisted_1$p = { class: "dao-dialog-footer" };
+function _sfc_render$w(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_dao_button = resolveComponent("dao-button");
-  return openBlock(), createElementBlock("div", _hoisted_1$n, [
+  return openBlock(), createElementBlock("div", _hoisted_1$p, [
     renderSlot(_ctx.$slots, "default", {}, () => [
       createVNode(_component_dao_button, {
         type: "ghost",
@@ -753,13 +737,13 @@ function _sfc_render$u(_ctx, _cache, $props, $setup, $data, $options) {
     ])
   ]);
 }
-var DialogFooter = /* @__PURE__ */ _export_sfc(_sfc_main$x, [["render", _sfc_render$u]]);
+var DialogFooter = /* @__PURE__ */ _export_sfc(_sfc_main$z, [["render", _sfc_render$w]]);
 var dialog_scss_vue_type_style_index_0_src_lang = "";
 const DIALOG_NUM_ATTR = "dao-dialog-num";
 const DIALOG_MINIMUM_PADDING = "20px";
 const DIALOG_DEFAULT_PADDING_TOP = "100px";
 const DIALOG_DEFAULT_PADDING_BOTTOM = "20px";
-const _sfc_main$w = defineComponent({
+const _sfc_main$y = defineComponent({
   name: "DaoDialog",
   components: {
     DialogHeader,
@@ -934,8 +918,8 @@ const _sfc_main$w = defineComponent({
     };
   }
 });
-const _hoisted_1$m = { class: "dao-dialog-body" };
-function _sfc_render$t(_ctx, _cache, $props, $setup, $data, $options) {
+const _hoisted_1$o = { class: "dao-dialog-body" };
+function _sfc_render$v(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_dialog_header = resolveComponent("dialog-header");
   const _component_dialog_footer = resolveComponent("dialog-footer");
   return openBlock(), createBlock(Transition, {
@@ -970,7 +954,7 @@ function _sfc_render$t(_ctx, _cache, $props, $setup, $data, $options) {
             ]),
             _: 3
           }, 8, ["title", "show-close", "onClose"])) : createCommentVNode("", true),
-          createElementVNode("div", _hoisted_1$m, [
+          createElementVNode("div", _hoisted_1$o, [
             renderSlot(_ctx.$slots, "default")
           ]),
           _ctx.footer ? (openBlock(), createBlock(_component_dialog_footer, {
@@ -992,7 +976,7 @@ function _sfc_render$t(_ctx, _cache, $props, $setup, $data, $options) {
     _: 3
   }, 8, ["onBeforeEnter", "onAfterEnter", "onBeforeLeave", "onAfterLeave"]);
 }
-var dialog = /* @__PURE__ */ _export_sfc(_sfc_main$w, [["render", _sfc_render$t]]);
+var dialog = /* @__PURE__ */ _export_sfc(_sfc_main$y, [["render", _sfc_render$v]]);
 const drawerProps = {
   modelValue: {
     type: Boolean,
@@ -1062,10 +1046,11 @@ const trapTabKey = (e, firstTab, lastTab) => {
   }
 };
 var drawer_vue_vue_type_style_index_0_lang = "";
-const _sfc_main$v = defineComponent({
+const _sfc_main$x = defineComponent({
   name: "DaoDrawer",
   components: {
-    DaoButton
+    DaoButton,
+    DaoActionIcon
   },
   props: drawerProps,
   emits: ["close", "confirm"],
@@ -1167,19 +1152,20 @@ const _sfc_main$v = defineComponent({
     };
   }
 });
-const _hoisted_1$l = { class: "dao-drawer__content" };
-const _hoisted_2$g = {
+const _hoisted_1$n = { class: "dao-drawer__content" };
+const _hoisted_2$h = {
   key: 0,
   class: "dao-drawer__header"
 };
-const _hoisted_3$a = { class: "dao-drawer__header-group" };
-const _hoisted_4$9 = { class: "dao-drawer__body" };
-const _hoisted_5$5 = {
+const _hoisted_3$b = { class: "dao-drawer__header-group" };
+const _hoisted_4$a = { class: "dao-drawer__body" };
+const _hoisted_5$6 = {
   key: 1,
   class: "dao-drawer__footer"
 };
-const _hoisted_6$3 = { class: "dao-drawer__footer-group" };
-function _sfc_render$s(_ctx, _cache, $props, $setup, $data, $options) {
+const _hoisted_6$4 = { class: "dao-drawer__footer-group" };
+function _sfc_render$u(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_dao_action_icon = resolveComponent("dao-action-icon");
   const _component_dao_button = resolveComponent("dao-button");
   return openBlock(), createElementBlock(Fragment, null, [
     createVNode(Transition, { name: "fade-in" }, {
@@ -1210,28 +1196,25 @@ function _sfc_render$s(_ctx, _cache, $props, $setup, $data, $options) {
           withDirectives(createElementVNode("div", {
             class: normalizeClass(_ctx.contentClassList)
           }, [
-            createElementVNode("div", _hoisted_1$l, [
-              !_ctx.hideHeader ? (openBlock(), createElementBlock("div", _hoisted_2$g, [
+            createElementVNode("div", _hoisted_1$n, [
+              !_ctx.hideHeader ? (openBlock(), createElementBlock("div", _hoisted_2$h, [
                 renderSlot(_ctx.$slots, "header", {}, () => [
-                  createElementVNode("div", _hoisted_3$a, [
+                  createElementVNode("div", _hoisted_3$b, [
                     createElementVNode("span", null, toDisplayString(_ctx.title), 1),
-                    !_ctx.hideCloseIcon ? (openBlock(), createBlock(_component_dao_button, {
+                    !_ctx.hideCloseIcon ? (openBlock(), createBlock(_component_dao_action_icon, {
                       key: 0,
-                      size: "sm",
-                      type: "ghost",
-                      "icon-left": "icon-close",
-                      "use-font": "",
+                      name: "icon-close",
                       onClick: _ctx.close
                     }, null, 8, ["onClick"])) : createCommentVNode("", true)
                   ])
                 ])
               ])) : createCommentVNode("", true),
-              createElementVNode("div", _hoisted_4$9, [
+              createElementVNode("div", _hoisted_4$a, [
                 renderSlot(_ctx.$slots, "default")
               ]),
-              !_ctx.hideFooter ? (openBlock(), createElementBlock("div", _hoisted_5$5, [
+              !_ctx.hideFooter ? (openBlock(), createElementBlock("div", _hoisted_5$6, [
                 renderSlot(_ctx.$slots, "footer", {}, () => [
-                  createElementVNode("div", _hoisted_6$3, [
+                  createElementVNode("div", _hoisted_6$4, [
                     createVNode(_component_dao_button, {
                       type: "ghost",
                       class: "footer-cancel-btn footer-btn",
@@ -1264,7 +1247,7 @@ function _sfc_render$s(_ctx, _cache, $props, $setup, $data, $options) {
     ], 34)
   ], 64);
 }
-var drawer = /* @__PURE__ */ _export_sfc(_sfc_main$v, [["render", _sfc_render$s]]);
+var drawer = /* @__PURE__ */ _export_sfc(_sfc_main$x, [["render", _sfc_render$u]]);
 var top = "top";
 var bottom = "bottom";
 var right = "right";
@@ -2463,7 +2446,7 @@ var defaultModifiers = [eventListeners, popperOffsets$1, computeStyles$1, applyS
 var createPopper = /* @__PURE__ */ popperGenerator({
   defaultModifiers
 });
-const _sfc_main$u = defineComponent({
+const _sfc_main$w = defineComponent({
   name: "PopperContent",
   props: {
     popperId: {
@@ -2511,12 +2494,12 @@ const _sfc_main$u = defineComponent({
     };
   }
 });
-const _hoisted_1$k = ["id", "aria-hidden", "tabindex"];
-const _hoisted_2$f = {
+const _hoisted_1$m = ["id", "aria-hidden", "tabindex"];
+const _hoisted_2$g = {
   ref: "arrow",
   class: "dao-popper-arrow"
 };
-const _hoisted_3$9 = /* @__PURE__ */ createElementVNode("svg", {
+const _hoisted_3$a = /* @__PURE__ */ createElementVNode("svg", {
   class: "dao-popper-arrow-viewbox",
   viewBox: "0 0 15 15"
 }, [
@@ -2530,10 +2513,10 @@ const _hoisted_3$9 = /* @__PURE__ */ createElementVNode("svg", {
     d: "M6 7.5L15 -1L15 16Z"
   })
 ], -1);
-const _hoisted_4$8 = [
-  _hoisted_3$9
+const _hoisted_4$9 = [
+  _hoisted_3$a
 ];
-function _sfc_render$r(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$t(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("div", {
     id: _ctx.popperId,
     ref: "popover",
@@ -2552,12 +2535,12 @@ function _sfc_render$r(_ctx, _cache, $props, $setup, $data, $options) {
     }, [
       renderSlot(_ctx.$slots, "default")
     ], 4),
-    withDirectives(createElementVNode("div", _hoisted_2$f, _hoisted_4$8, 512), [
+    withDirectives(createElementVNode("div", _hoisted_2$g, _hoisted_4$9, 512), [
       [vShow, _ctx.visibleArrow]
     ])
-  ], 42, _hoisted_1$k);
+  ], 42, _hoisted_1$m);
 }
-var PopperContent = /* @__PURE__ */ _export_sfc(_sfc_main$u, [["render", _sfc_render$r]]);
+var PopperContent = /* @__PURE__ */ _export_sfc(_sfc_main$w, [["render", _sfc_render$t]]);
 var PopperProps = {
   modelValue: {
     type: Boolean,
@@ -2647,7 +2630,7 @@ function updatePopperOptions(popperInstance, modifiers, popperOptions = {}) {
     });
   });
 }
-const _sfc_main$t = defineComponent({
+const _sfc_main$v = defineComponent({
   name: "DaoPopper",
   components: {
     PopperContent
@@ -3004,7 +2987,7 @@ const _sfc_main$t = defineComponent({
     };
   }
 });
-function _sfc_render$q(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$s(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_popper_content = resolveComponent("popper-content");
   return openBlock(), createElementBlock("div", {
     ref: "reference",
@@ -3046,8 +3029,8 @@ function _sfc_render$q(_ctx, _cache, $props, $setup, $data, $options) {
     ], 8, ["to", "disabled"]))
   ], 2);
 }
-var Popper = /* @__PURE__ */ _export_sfc(_sfc_main$t, [["render", _sfc_render$q]]);
-const _sfc_main$s = defineComponent({
+var Popper = /* @__PURE__ */ _export_sfc(_sfc_main$v, [["render", _sfc_render$s]]);
+const _sfc_main$u = defineComponent({
   name: "DaoDropdown",
   components: {
     DaoPopper: Popper
@@ -3103,8 +3086,8 @@ const _sfc_main$s = defineComponent({
     };
   }
 });
-const _hoisted_1$j = { tabindex: "0" };
-function _sfc_render$p(_ctx, _cache, $props, $setup, $data, $options) {
+const _hoisted_1$l = { tabindex: "0" };
+function _sfc_render$r(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_dao_popper = resolveComponent("dao-popper");
   return openBlock(), createBlock(_component_dao_popper, {
     ref: "popper",
@@ -3120,27 +3103,27 @@ function _sfc_render$p(_ctx, _cache, $props, $setup, $data, $options) {
       renderSlot(_ctx.$slots, "menu")
     ]),
     default: withCtx(() => [
-      createElementVNode("div", _hoisted_1$j, [
+      createElementVNode("div", _hoisted_1$l, [
         renderSlot(_ctx.$slots, "default")
       ])
     ]),
     _: 3
   }, 8, ["placement", "append-to", "trigger", "offset", "model-value"]);
 }
-var dropdown = /* @__PURE__ */ _export_sfc(_sfc_main$s, [["render", _sfc_render$p]]);
+var dropdown = /* @__PURE__ */ _export_sfc(_sfc_main$u, [["render", _sfc_render$r]]);
 var dropdownMenu_vue_vue_type_style_index_0_lang = "";
-const _sfc_main$r = defineComponent({
+const _sfc_main$t = defineComponent({
   name: "DaoDropdownMenu"
 });
-const _hoisted_1$i = { class: "dao-dropdown-menu" };
-function _sfc_render$o(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("ul", _hoisted_1$i, [
+const _hoisted_1$k = { class: "dao-dropdown-menu" };
+function _sfc_render$q(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("ul", _hoisted_1$k, [
     renderSlot(_ctx.$slots, "default")
   ]);
 }
-var dropdownMenu = /* @__PURE__ */ _export_sfc(_sfc_main$r, [["render", _sfc_render$o]]);
+var dropdownMenu = /* @__PURE__ */ _export_sfc(_sfc_main$t, [["render", _sfc_render$q]]);
 var dropdownItem_vue_vue_type_style_index_0_lang = "";
-const _sfc_main$q = defineComponent({
+const _sfc_main$s = defineComponent({
   name: "DaoDropdownItem",
   props: {
     type: {
@@ -3189,12 +3172,257 @@ const _sfc_main$q = defineComponent({
     };
   }
 });
-function _sfc_render$n(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$p(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("li", mergeProps({ class: _ctx.classList }, _ctx.itemAttrs), [
     _ctx.type !== "divider" ? renderSlot(_ctx.$slots, "default", { key: 0 }) : createCommentVNode("", true)
   ], 16);
 }
-var dropdownItem = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["render", _sfc_render$n]]);
+var dropdownItem = /* @__PURE__ */ _export_sfc(_sfc_main$s, [["render", _sfc_render$p]]);
+const expansionProps = {
+  modelValue: {
+    type: [String, Symbol, Array]
+  },
+  accordion: {
+    type: Boolean,
+    default: false
+  }
+};
+const expansionItemProps = {
+  name: {
+    type: [String, Symbol],
+    required: true
+  },
+  title: {
+    type: String,
+    default: ""
+  },
+  description: {
+    type: String,
+    default: ""
+  }
+};
+var expansion_vue_vue_type_style_index_0_lang = "";
+const _sfc_main$r = defineComponent({
+  name: "DaoExpansion",
+  props: expansionProps,
+  emits: ["update:modelValue", "change"],
+  setup(props, { emit }) {
+    const { accordion, modelValue } = toRefs(props);
+    const state = reactive({
+      expansionRecord: modelValue.value,
+      accordion: accordion.value
+    });
+    function toggleItem(itemName) {
+      if (props.accordion) {
+        let currentVal = itemName;
+        if (currentVal === state.expansionRecord) {
+          currentVal = void 0;
+        }
+        state.expansionRecord = currentVal;
+        emit("update:modelValue", currentVal);
+        emit("change", currentVal);
+      } else {
+        let rst = [];
+        if (Array.isArray(state.expansionRecord)) {
+          rst = [...state.expansionRecord];
+        }
+        const idx = rst.indexOf(itemName);
+        if (idx > -1) {
+          rst.splice(idx, 1);
+        } else {
+          rst.push(itemName);
+        }
+        state.expansionRecord = rst;
+        emit("update:modelValue", rst);
+        emit("change", rst);
+      }
+    }
+    watch([modelValue, accordion], ([newM, newA]) => {
+      state.expansionRecord = newM;
+      if (newA !== state.accordion) {
+        let nextRecordVal;
+        if (newA) {
+          if (Array.isArray(state.expansionRecord)) {
+            if (state.expansionRecord.length) {
+              [nextRecordVal] = state.expansionRecord;
+            }
+          } else {
+            nextRecordVal = state.expansionRecord;
+          }
+        } else {
+          nextRecordVal = [];
+          if (state.expansionRecord !== void 0) {
+            if (!Array.isArray(state.expansionRecord)) {
+              nextRecordVal[0] = state.expansionRecord;
+            }
+          }
+        }
+        state.expansionRecord = nextRecordVal;
+        debugger;
+        emit("update:modelValue", nextRecordVal);
+        emit("change", nextRecordVal);
+      }
+      state.accordion = newA;
+    });
+    provide(ToggleItemKey, toggleItem);
+    provide(ExpansionStateKey, state);
+    return {
+      toggleItem,
+      state
+    };
+  }
+});
+const _hoisted_1$j = { class: "dao-expansion" };
+function _sfc_render$o(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("div", _hoisted_1$j, [
+    renderSlot(_ctx.$slots, "default")
+  ]);
+}
+var expansion = /* @__PURE__ */ _export_sfc(_sfc_main$r, [["render", _sfc_render$o]]);
+var expansionItem_vue_vue_type_style_index_0_lang = "";
+const _sfc_main$q = defineComponent({
+  name: "DaoExpansionItem",
+  components: {
+    DaoIcon
+  },
+  props: expansionItemProps,
+  setup(props) {
+    const toggleItem = inject(ToggleItemKey, null);
+    const parentState = inject(ExpansionStateKey, null);
+    function onItemClick() {
+      if (props.name !== void 0) {
+        toggleItem == null ? void 0 : toggleItem(props.name);
+      }
+    }
+    const isExpanded = computed(() => {
+      if (parentState == null ? void 0 : parentState.expansionRecord) {
+        if (parentState == null ? void 0 : parentState.accordion) {
+          return parentState.expansionRecord === props.name;
+        }
+        if (Array.isArray(parentState == null ? void 0 : parentState.expansionRecord) && props.name !== void 0) {
+          return parentState.expansionRecord.includes(props.name);
+        }
+      }
+      return false;
+    });
+    function onBeforeEnter(el) {
+      if (el instanceof HTMLElement) {
+        const { style } = el;
+        style.maxHeight = "0px";
+      }
+    }
+    function onEnter(el) {
+      if (el instanceof HTMLElement) {
+        const { style } = el;
+        style.maxHeight = `${el.scrollHeight || style.maxHeight}px`;
+      }
+    }
+    function onAfterEnter(el) {
+      if (el instanceof HTMLElement) {
+        const { style } = el;
+        style.maxHeight = "";
+      }
+    }
+    function onBeforeLeave(el) {
+      if (el instanceof HTMLElement) {
+        const { style } = el;
+        if (el.scrollHeight !== 0) {
+          style.maxHeight = `${el.scrollHeight}px`;
+        }
+      }
+    }
+    function onLeave(el) {
+      if (el instanceof HTMLElement) {
+        const { style } = el;
+        style.maxHeight = "0px";
+      }
+    }
+    function onAfterLeave(el) {
+      if (el instanceof HTMLElement) {
+        const { style } = el;
+        style.maxHeight = "";
+      }
+    }
+    return {
+      onItemClick,
+      isExpanded,
+      onBeforeEnter,
+      onEnter,
+      onAfterEnter,
+      onBeforeLeave,
+      onLeave,
+      onAfterLeave
+    };
+  }
+});
+const _hoisted_1$i = { class: "dao-expansion-item-icon-container" };
+const _hoisted_2$f = { class: "dao-expansion-item-title-container" };
+const _hoisted_3$9 = { class: "dao-expansion-item-title dao-exp-ellipsis" };
+const _hoisted_4$8 = { class: "dao-expansion-item-description dao-exp-ellipsis" };
+const _hoisted_5$5 = { class: "dao-expansion-item-content-container" };
+const _hoisted_6$3 = { class: "dao-expansion-item-content" };
+function _sfc_render$n(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_dao_icon = resolveComponent("dao-icon");
+  return openBlock(), createElementBlock("div", {
+    class: normalizeClass(["dao-expansion-item", {
+      "dao-expansion-item--expanded": _ctx.isExpanded
+    }])
+  }, [
+    createElementVNode("div", {
+      class: "dao-expansion-item-header",
+      onClick: _cache[1] || (_cache[1] = (...args) => _ctx.onItemClick && _ctx.onItemClick(...args))
+    }, [
+      createElementVNode("div", _hoisted_1$i, [
+        createVNode(_component_dao_icon, {
+          name: "icon-dropdown-line",
+          class: "dao-expansion-item-icon",
+          "use-font": ""
+        })
+      ]),
+      createElementVNode("div", _hoisted_2$f, [
+        createElementVNode("div", _hoisted_3$9, [
+          renderSlot(_ctx.$slots, "title", {}, () => [
+            createTextVNode(toDisplayString(_ctx.title), 1)
+          ])
+        ]),
+        createElementVNode("div", _hoisted_4$8, [
+          renderSlot(_ctx.$slots, "description", {}, () => [
+            createTextVNode(toDisplayString(_ctx.description), 1)
+          ])
+        ])
+      ]),
+      _ctx.$slots.action ? (openBlock(), createElementBlock("div", {
+        key: 0,
+        class: "dao-expansion-item-action",
+        onClick: _cache[0] || (_cache[0] = withModifiers(() => {
+        }, ["stop"]))
+      }, [
+        renderSlot(_ctx.$slots, "action")
+      ])) : createCommentVNode("", true)
+    ]),
+    createVNode(Transition, {
+      name: "dao-expansion-item",
+      onBeforeEnter: _ctx.onBeforeEnter,
+      onEnter: _ctx.onEnter,
+      onAfterEnter: _ctx.onAfterEnter,
+      onBeforeLeave: _ctx.onBeforeLeave,
+      onLeave: _ctx.onLeave,
+      onAfterLeave: _ctx.onAfterLeave
+    }, {
+      default: withCtx(() => [
+        withDirectives(createElementVNode("div", _hoisted_5$5, [
+          createElementVNode("div", _hoisted_6$3, [
+            renderSlot(_ctx.$slots, "default")
+          ])
+        ], 512), [
+          [vShow, _ctx.isExpanded]
+        ])
+      ]),
+      _: 3
+    }, 8, ["onBeforeEnter", "onEnter", "onAfterEnter", "onBeforeLeave", "onLeave", "onAfterLeave"])
+  ], 2);
+}
+var expansionItem = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["render", _sfc_render$n]]);
 var form_vue_vue_type_style_index_0_lang = "";
 const _sfc_main$p = defineComponent({
   name: "DaoForm",
@@ -3814,19 +4042,20 @@ const _hoisted_2$c = {
 };
 const _hoisted_3$7 = ["type", "disabled", "value"];
 const _hoisted_4$6 = {
-  key: 4,
+  key: 3,
   class: "dao-input-suffix"
 };
 const _hoisted_5$4 = {
-  key: 1,
+  key: 0,
   class: "dao-input-append"
 };
 function _sfc_render$g(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("div", {
     class: normalizeClass(_ctx.wrapClasses)
   }, [
-    renderSlot(_ctx.$slots, "prepend"),
-    _ctx.prepend && !_ctx.slots.prepend ? (openBlock(), createElementBlock("div", _hoisted_1$f, toDisplayString(_ctx.prepend), 1)) : createCommentVNode("", true),
+    renderSlot(_ctx.$slots, "prepend", {}, () => [
+      _ctx.prepend ? (openBlock(), createElementBlock("div", _hoisted_1$f, toDisplayString(_ctx.prepend), 1)) : createCommentVNode("", true)
+    ]),
     createElementVNode("div", {
       class: normalizeClass(["dao-input-inner", { "dao-input__changing-number": _ctx.isChangingNumber }])
     }, [
@@ -3846,28 +4075,28 @@ function _sfc_render$g(_ctx, _cache, $props, $setup, $data, $options) {
         value: _ctx.currentValue,
         onKeyup: _cache[0] || (_cache[0] = withKeys((...args) => _ctx.resetCurrentVal && _ctx.resetCurrentVal(...args), ["esc"]))
       }), null, 16, _hoisted_3$7),
-      _ctx.type === "number" ? (openBlock(), createElementBlock("i", {
-        key: 2,
-        class: normalizeClass([
-          "dao-input-number-icon",
-          "icon-arrow-sharp",
-          "number-icon-up",
-          { "dao-input-number-icon__disabled": _ctx.isIncreaseDisabled }
-        ]),
-        onMousedown: _cache[1] || (_cache[1] = ($event) => _ctx.changeNumberValue("increase"))
-      }, null, 34)) : createCommentVNode("", true),
-      _ctx.type === "number" ? (openBlock(), createElementBlock("i", {
-        key: 3,
-        class: normalizeClass([
-          "dao-input-number-icon",
-          "icon-arrow-sharp",
-          "number-icon-down",
-          { "dao-input-number-icon__disabled": _ctx.isDecreaseDisabled }
-        ]),
-        onMousedown: _cache[2] || (_cache[2] = ($event) => _ctx.changeNumberValue("decrease"))
-      }, null, 34)) : createCommentVNode("", true),
+      _ctx.type === "number" ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [
+        createElementVNode("i", {
+          class: normalizeClass([
+            "dao-input-number-icon",
+            "icon-arrow-sharp",
+            "number-icon-up",
+            { "dao-input-number-icon__disabled": _ctx.isIncreaseDisabled }
+          ]),
+          onMousedown: _cache[1] || (_cache[1] = ($event) => _ctx.changeNumberValue("increase"))
+        }, null, 34),
+        createElementVNode("i", {
+          class: normalizeClass([
+            "dao-input-number-icon",
+            "icon-arrow-sharp",
+            "number-icon-down",
+            { "dao-input-number-icon__disabled": _ctx.isDecreaseDisabled }
+          ]),
+          onMousedown: _cache[2] || (_cache[2] = ($event) => _ctx.changeNumberValue("decrease"))
+        }, null, 34)
+      ], 64)) : createCommentVNode("", true),
       withDirectives(createElementVNode("i", {
-        class: normalizeClass(["dao-input-close-icon", "icon-close", { "dao-input__active": _ctx.isFocus }]),
+        class: normalizeClass(["dao-input-close-icon", "icon-sys-error", { "dao-input__active": _ctx.isFocus }]),
         onClick: _cache[3] || (_cache[3] = ($event) => _ctx.resetCurrentVal())
       }, null, 2), [
         [vShow, _ctx.clearable]
@@ -3881,8 +4110,9 @@ function _sfc_render$g(_ctx, _cache, $props, $setup, $data, $options) {
         renderSlot(_ctx.$slots, "suffix")
       ])) : createCommentVNode("", true)
     ], 2),
-    renderSlot(_ctx.$slots, "append"),
-    _ctx.append && !_ctx.slots.append ? (openBlock(), createElementBlock("div", _hoisted_5$4, toDisplayString(_ctx.append), 1)) : createCommentVNode("", true)
+    renderSlot(_ctx.$slots, "append", {}, () => [
+      _ctx.append ? (openBlock(), createElementBlock("div", _hoisted_5$4, toDisplayString(_ctx.append), 1)) : createCommentVNode("", true)
+    ])
   ], 2);
 }
 var input = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["render", _sfc_render$g]]);
@@ -4820,7 +5050,7 @@ function _sfc_render$a(_ctx, _cache, $props, $setup, $data, $options) {
           ]),
           _hoisted_7$1,
           withDirectives(createElementVNode("i", {
-            class: "icon-close dao-selection-search-clear-icon",
+            class: "icon-sys-error dao-selection-search-clear-icon",
             tabindex: "1",
             onKeydown: _cache[3] || (_cache[3] = withKeys((...args) => _ctx.onSearchClear && _ctx.onSearchClear(...args), ["enter"])),
             onClick: _cache[4] || (_cache[4] = (...args) => _ctx.onSearchClear && _ctx.onSearchClear(...args))
@@ -5592,7 +5822,8 @@ const _sfc_main$3 = defineComponent({
     "next",
     "prev",
     "pageChange",
-    "sizeChange"
+    "sizeChange",
+    "row-click"
   ],
   setup(props, { emit }) {
     const tableId = computed(() => `DAO_TABLE_${props.id}`);
@@ -5603,8 +5834,8 @@ const _sfc_main$3 = defineComponent({
     const expandedRows = reactive(new WeakSet());
     const columnRefs = reactive({});
     const columns = reactive([]);
-    const currentPage = ref(props.currentPage);
-    const pageSize = ref(props.pageSize);
+    const currentPage = toRef(props, "currentPage");
+    const pageSize = toRef(props, "pageSize");
     const tableScroll = ref();
     const global = reactive({
       checked: false,
@@ -5643,6 +5874,7 @@ const _sfc_main$3 = defineComponent({
       }, {});
     }
     const init = () => {
+      columns.length = 0;
       props.columns.forEach((column) => {
         columns.push(__spreadValues(__spreadValues({}, defaultColumnConfig), column));
       });
@@ -5669,7 +5901,6 @@ const _sfc_main$3 = defineComponent({
         });
       }
     };
-    init();
     const columnStyle = (id) => {
       const setting = tableSetting[id];
       const { width } = setting;
@@ -5761,6 +5992,10 @@ const _sfc_main$3 = defineComponent({
       clearExpansion();
       clearSelection();
     };
+    init();
+    watch(() => props.columns, () => {
+      init();
+    }, { deep: true });
     watch(currentPage, (val) => {
       emit("update:current-page", val);
     });
@@ -5815,6 +6050,9 @@ const _sfc_main$3 = defineComponent({
     onUnmounted(() => {
       window.removeEventListener("resize", windowResize);
     });
+    function onRowClick(row, rowIndex) {
+      emit("row-click", row, rowIndex);
+    }
     return {
       columns,
       filterColumns,
@@ -5837,7 +6075,8 @@ const _sfc_main$3 = defineComponent({
       clearState,
       global,
       tableScroll,
-      expandedRows
+      expandedRows,
+      onRowClick
     };
   }
 });
@@ -5859,20 +6098,21 @@ const _hoisted_6 = {
 const _hoisted_7 = ["onClick"];
 const _hoisted_8 = { class: "dao-table-th__content" };
 const _hoisted_9 = { class: "dao-table-tbody" };
-const _hoisted_10 = {
+const _hoisted_10 = ["onClick"];
+const _hoisted_11 = {
   key: 0,
   class: "dao-table-td"
 };
-const _hoisted_11 = {
+const _hoisted_12 = {
   key: 1,
   class: "dao-table-td"
 };
-const _hoisted_12 = ["onClick"];
-const _hoisted_13 = {
+const _hoisted_13 = ["onClick"];
+const _hoisted_14 = {
   key: 0,
   class: "dao-table-tr-expand"
 };
-const _hoisted_14 = { class: "dao-table-pagination" };
+const _hoisted_15 = { class: "dao-table-pagination" };
 function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_dao_checkbox = resolveComponent("dao-checkbox");
   const _component_dao_resizer = resolveComponent("dao-resizer");
@@ -5928,19 +6168,20 @@ function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
           (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.data, (row, index2) => {
             return openBlock(), createElementBlock(Fragment, { key: index2 }, [
               createElementVNode("tr", {
-                class: normalizeClass(["dao-table-tr", { "dao-table-tr--expandable-open": _ctx.expandable && _ctx.isRowExpanded(row) }])
+                class: normalizeClass(["dao-table-tr", { "dao-table-tr--expandable-open": _ctx.expandable && _ctx.isRowExpanded(row) }]),
+                onClick: ($event) => _ctx.onRowClick(row, index2)
               }, [
-                _ctx.selectable ? (openBlock(), createElementBlock("td", _hoisted_10, [
+                _ctx.selectable ? (openBlock(), createElementBlock("td", _hoisted_11, [
                   createVNode(_component_dao_checkbox, {
                     checked: _ctx.isRowSelected(row),
                     onChange: ($event) => _ctx.toggleSelected(row)
                   }, null, 8, ["checked", "onChange"])
                 ])) : createCommentVNode("", true),
-                _ctx.expandable ? (openBlock(), createElementBlock("td", _hoisted_11, [
+                _ctx.expandable ? (openBlock(), createElementBlock("td", _hoisted_12, [
                   createElementVNode("i", {
                     class: "dao-table-expand-toggle icon-arrow-sharp",
                     onClick: ($event) => _ctx.toggleExpand(row, index2)
-                  }, null, 8, _hoisted_12)
+                  }, null, 8, _hoisted_13)
                 ])) : createCommentVNode("", true),
                 (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.filterColumns, (column) => {
                   return openBlock(), createElementBlock("td", {
@@ -5957,8 +6198,8 @@ function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
                     ])
                   ], 4);
                 }), 128))
-              ], 2),
-              _ctx.expandable && _ctx.expandedRows.has(row) ? withDirectives((openBlock(), createElementBlock("tr", _hoisted_13, [
+              ], 10, _hoisted_10),
+              _ctx.expandable && _ctx.expandedRows.has(row) ? withDirectives((openBlock(), createElementBlock("tr", _hoisted_14, [
                 renderSlot(_ctx.$slots, "expand", {
                   row,
                   rowIndex: index2
@@ -5971,7 +6212,7 @@ function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
         ])
       ])
     ], 2),
-    createElementVNode("div", _hoisted_14, [
+    createElementVNode("div", _hoisted_15, [
       renderSlot(_ctx.$slots, "pagination", {}, () => [
         createVNode(_component_dao_pagination, {
           "current-page": _ctx.currentPage,
@@ -6137,7 +6378,7 @@ const _sfc_main$1 = defineComponent({
     type: {
       type: String,
       default: "card",
-      validator: (value) => ["card", "line"].includes(value)
+      validator: (value) => ["card", "line", "pill"].includes(value)
     },
     direction: {
       type: String,
@@ -6267,7 +6508,7 @@ var tabItem = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 var components = /* @__PURE__ */ Object.freeze({
   __proto__: null,
   [Symbol.toStringTag]: "Module",
-  ActionIcon: actionIcon,
+  ActionIcon: DaoActionIcon,
   Button: DaoButton,
   ButtonGroup: buttonGroup,
   Card: card,
@@ -6281,6 +6522,8 @@ var components = /* @__PURE__ */ Object.freeze({
   Dropdown: dropdown,
   DropdownMenu: dropdownMenu,
   DropdownItem: dropdownItem,
+  Expansion: expansion,
+  ExpansionItem: expansionItem,
   Form: form,
   FormItem: formItem,
   FormGroup: formGroup,
@@ -6322,4 +6565,4 @@ const install = (Vue) => {
 var index = {
   install
 };
-export { actionIcon as ActionIcon, breadcrumb as Breadcrumb, DaoBreadcrumbItem as BreadcrumbItem, DaoButton as Button, buttonGroup as ButtonGroup, card as Card, cardItem as CardItem, DaoCheckbox as Checkbox, checkboxGroup as CheckboxGroup, dialog as Dialog, DialogFooter, DialogHeader, drawer as Drawer, dropdown as Dropdown, dropdownItem as DropdownItem, dropdownMenu as DropdownMenu, form as Form, formGroup as FormGroup, formItem as FormItem, header as Header, DaoIcon as Icon, input as Input, message as Message, nav as Nav, navHead as NavHead, navItem as NavItem, navSub as NavSub, DaoOption as Option, DaoPagination as Pagination, _sfc_main$9 as Popover, Popper, progress as Progress, radio as Radio, radioGroup as RadioGroup, DaoSelect as Select, _switch as Switch, tabItem as TabItem, _sfc_main$2 as TabNav, table as Table, tabs as Tabs, _sfc_main$o as Tooltip, index as default };
+export { DaoActionIcon as ActionIcon, breadcrumb as Breadcrumb, DaoBreadcrumbItem as BreadcrumbItem, DaoButton as Button, buttonGroup as ButtonGroup, card as Card, cardItem as CardItem, DaoCheckbox as Checkbox, checkboxGroup as CheckboxGroup, dialog as Dialog, DialogFooter, DialogHeader, drawer as Drawer, dropdown as Dropdown, dropdownItem as DropdownItem, dropdownMenu as DropdownMenu, expansion as Expansion, expansionItem as ExpansionItem, form as Form, formGroup as FormGroup, formItem as FormItem, header as Header, DaoIcon as Icon, input as Input, message as Message, nav as Nav, navHead as NavHead, navItem as NavItem, navSub as NavSub, DaoOption as Option, DaoPagination as Pagination, _sfc_main$9 as Popover, Popper, progress as Progress, radio as Radio, radioGroup as RadioGroup, DaoSelect as Select, _switch as Switch, tabItem as TabItem, _sfc_main$2 as TabNav, table as Table, tabs as Tabs, _sfc_main$o as Tooltip, index as default };