@element-plus/nightly 0.0.20220113 → 0.0.20220117

package/es/components/time-picker/src/time-picker-com/basic-time-spinner.vue_vue_type_template_id_4fb3c576_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"basic-time-spinner.vue_vue_type_template_id_4fb3c576_lang.mjs","sources":["../../../../../../../packages/components/time-picker/src/time-picker-com/basic-time-spinner.vue?vue&type=template&id=4fb3c576&lang.js"],"sourcesContent":["<template>\n  <div class=\"el-time-spinner\" :class=\"{ 'has-seconds': showSeconds }\">\n    <template v-if=\"!arrowControl\">\n      <el-scrollbar\n        v-for=\"item in spinnerItems\"\n        :key=\"item\"\n        :ref=\"getRefId(item)\"\n        class=\"el-time-spinner__wrapper\"\n        wrap-style=\"max-height: inherit;\"\n        view-class=\"el-time-spinner__list\"\n        noresize\n        tag=\"ul\"\n        @mouseenter=\"emitSelectRange(item)\"\n        @mousemove=\"adjustCurrentSpinner(item)\"\n      >\n        <li\n          v-for=\"(disabled, key) in listMap[item].value\"\n          :key=\"key\"\n          class=\"el-time-spinner__item\"\n          :class=\"{ active: key === timePartsMap[item].value, disabled }\"\n          @click=\"handleClick(item, { value: key, disabled })\"\n        >\n          <template v-if=\"item === 'hours'\">\n            {{ ('0' + (amPmMode ? key % 12 || 12 : key)).slice(-2)\n            }}{{ getAmPmFlag(key) }}\n          </template>\n          <template v-else>\n            {{ ('0' + key).slice(-2) }}\n          </template>\n        </li>\n      </el-scrollbar>\n    </template>\n    <template v-if=\"arrowControl\">\n      <div\n        v-for=\"item in spinnerItems\"\n        :key=\"item\"\n        class=\"el-time-spinner__wrapper is-arrow\"\n        @mouseenter=\"emitSelectRange(item)\"\n      >\n        <el-icon\n          v-repeat-click=\"onDecreaseClick\"\n          class=\"el-time-spinner__arrow arrow-up\"\n        >\n          <arrow-up />\n        </el-icon>\n        <el-icon\n          v-repeat-click=\"onIncreaseClick\"\n          class=\"el-time-spinner__arrow arrow-down\"\n        >\n          <arrow-down />\n        </el-icon>\n        <ul class=\"el-time-spinner__list\">\n          <li\n            v-for=\"(time, key) in arrowListMap[item].value\"\n            :key=\"key\"\n            class=\"el-time-spinner__item\"\n            :class=\"{\n              active: time === timePartsMap[item].value,\n              disabled: listMap[item].value[time],\n            }\"\n          >\n            <template v-if=\"time\">\n              <template v-if=\"item === 'hours'\">\n                {{ ('0' + (amPmMode ? time % 12 || 12 : time)).slice(-2)\n                }}{{ getAmPmFlag(time) }}\n              </template>\n              <template v-else>\n                {{ ('0' + time).slice(-2) }}\n              </template>\n            </template>\n          </li>\n        </ul>\n      </div>\n    </template>\n  </div>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, ref, nextTick, computed, onMounted, watch } from 'vue'\nimport debounce from 'lodash/debounce'\nimport { RepeatClick } from '@element-plus/directives'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport ElIcon from '@element-plus/components/icon'\nimport { ArrowUp, ArrowDown } from '@element-plus/icons-vue'\nimport { getTimeLists } from './useTimePicker'\n\nimport type { PropType, Ref } from 'vue'\nimport type { Dayjs } from 'dayjs'\nimport type { Nullable } from '@element-plus/utils/types'\n\nexport default defineComponent({\n  directives: {\n    repeatClick: RepeatClick,\n  },\n\n  components: {\n    ElScrollbar,\n    ElIcon,\n    ArrowUp,\n    ArrowDown,\n  },\n\n  props: {\n    role: {\n      type: String,\n      required: true,\n    },\n    spinnerDate: {\n      type: Object as PropType<Dayjs>,\n      required: true,\n    },\n    showSeconds: {\n      type: Boolean,\n      default: true,\n    },\n    arrowControl: Boolean,\n    amPmMode: {\n      type: String,\n      default: '', // 'a': am/pm; 'A': AM/PM\n    },\n    disabledHours: {\n      type: Function,\n    },\n    disabledMinutes: {\n      type: Function,\n    },\n    disabledSeconds: {\n      type: Function,\n    },\n  },\n\n  emits: ['change', 'select-range', 'set-option'],\n\n  setup(props, ctx) {\n    // data\n    let isScrolling = false\n    const debouncedResetScroll = debounce((type) => {\n      isScrolling = false\n      adjustCurrentSpinner(type)\n    }, 200)\n    const currentScrollbar = ref(null)\n    const listHoursRef: Ref<Nullable<HTMLElement>> = ref(null)\n    const listMinutesRef: Ref<Nullable<HTMLElement>> = ref(null)\n    const listSecondsRef: Ref<Nullable<HTMLElement>> = ref(null)\n    const listRefsMap = {\n      hours: listHoursRef,\n      minutes: listMinutesRef,\n      seconds: listSecondsRef,\n    }\n\n    // computed\n    const spinnerItems = computed(() => {\n      const arr = ['hours', 'minutes', 'seconds']\n      return props.showSeconds ? arr : arr.slice(0, 2)\n    })\n    const hours = computed(() => {\n      return props.spinnerDate.hour()\n    })\n    const minutes = computed(() => {\n      return props.spinnerDate.minute()\n    })\n    const seconds = computed(() => {\n      return props.spinnerDate.second()\n    })\n    const timePartsMap = computed(() => ({\n      hours,\n      minutes,\n      seconds,\n    }))\n    const hoursList = computed(() => {\n      return getHoursList(props.role)\n    })\n    const minutesList = computed(() => {\n      return getMinutesList(hours.value, props.role)\n    })\n    const secondsList = computed(() => {\n      return getSecondsList(hours.value, minutes.value, props.role)\n    })\n    const listMap = computed(() => ({\n      hours: hoursList,\n      minutes: minutesList,\n      seconds: secondsList,\n    }))\n    const arrowHourList = computed(() => {\n      const hour = hours.value\n      return [\n        hour > 0 ? hour - 1 : undefined,\n        hour,\n        hour < 23 ? hour + 1 : undefined,\n      ]\n    })\n    const arrowMinuteList = computed(() => {\n      const minute = minutes.value\n      return [\n        minute > 0 ? minute - 1 : undefined,\n        minute,\n        minute < 59 ? minute + 1 : undefined,\n      ]\n    })\n    const arrowSecondList = computed(() => {\n      const second = seconds.value\n      return [\n        second > 0 ? second - 1 : undefined,\n        second,\n        second < 59 ? second + 1 : undefined,\n      ]\n    })\n    const arrowListMap = computed(() => ({\n      hours: arrowHourList,\n      minutes: arrowMinuteList,\n      seconds: arrowSecondList,\n    }))\n    const getAmPmFlag = (hour) => {\n      const shouldShowAmPm = !!props.amPmMode\n      if (!shouldShowAmPm) return ''\n      const isCapital = props.amPmMode === 'A'\n      // todo locale\n      let content = hour < 12 ? ' am' : ' pm'\n      if (isCapital) content = content.toUpperCase()\n      return content\n    }\n\n    const emitSelectRange = (type) => {\n      if (type === 'hours') {\n        ctx.emit('select-range', 0, 2)\n      } else if (type === 'minutes') {\n        ctx.emit('select-range', 3, 5)\n      } else if (type === 'seconds') {\n        ctx.emit('select-range', 6, 8)\n      }\n      currentScrollbar.value = type\n    }\n\n    const adjustCurrentSpinner = (type) => {\n      adjustSpinner(type, timePartsMap.value[type].value)\n    }\n\n    // NOTE: used by datetime / date-range panel\n    //       renamed from adjustScrollTop\n    //       should try to refactory it\n    const adjustSpinners = () => {\n      adjustCurrentSpinner('hours')\n      adjustCurrentSpinner('minutes')\n      adjustCurrentSpinner('seconds')\n    }\n\n    const adjustSpinner = (type, value) => {\n      if (props.arrowControl) return\n      const el = listRefsMap[type]\n      if (el.value) {\n        el.value.$el.querySelector('.el-scrollbar__wrap').scrollTop = Math.max(\n          0,\n          value * typeItemHeight(type)\n        )\n      }\n    }\n\n    const typeItemHeight = (type) => {\n      const el = listRefsMap[type]\n      return el.value.$el.querySelector('li').offsetHeight\n    }\n\n    const onIncreaseClick = () => {\n      scrollDown(1)\n    }\n\n    const onDecreaseClick = () => {\n      scrollDown(-1)\n    }\n\n    const scrollDown = (step) => {\n      if (!currentScrollbar.value) {\n        emitSelectRange('hours')\n      }\n\n      const label = currentScrollbar.value\n      let now = timePartsMap.value[label].value\n      const total = currentScrollbar.value === 'hours' ? 24 : 60\n      now = (now + step + total) % total\n\n      modifyDateField(label, now)\n      adjustSpinner(label, now)\n      nextTick(() => emitSelectRange(currentScrollbar.value))\n    }\n\n    const modifyDateField = (type, value) => {\n      const list = listMap.value[type].value\n      const isDisabled = list[value]\n      if (isDisabled) return\n      switch (type) {\n        case 'hours':\n          ctx.emit(\n            'change',\n            props.spinnerDate\n              .hour(value)\n              .minute(minutes.value)\n              .second(seconds.value)\n          )\n          break\n        case 'minutes':\n          ctx.emit(\n            'change',\n            props.spinnerDate\n              .hour(hours.value)\n              .minute(value)\n              .second(seconds.value)\n          )\n          break\n        case 'seconds':\n          ctx.emit(\n            'change',\n            props.spinnerDate\n              .hour(hours.value)\n              .minute(minutes.value)\n              .second(value)\n          )\n          break\n      }\n    }\n\n    const handleClick = (type, { value, disabled }) => {\n      if (!disabled) {\n        modifyDateField(type, value)\n        emitSelectRange(type)\n        adjustSpinner(type, value)\n      }\n    }\n\n    const handleScroll = (type) => {\n      isScrolling = true\n      debouncedResetScroll(type)\n      const value = Math.min(\n        Math.round(\n          (listRefsMap[type].value.$el.querySelector('.el-scrollbar__wrap')\n            .scrollTop -\n            (scrollBarHeight(type) * 0.5 - 10) / typeItemHeight(type) +\n            3) /\n            typeItemHeight(type)\n        ),\n        type === 'hours' ? 23 : 59\n      )\n      modifyDateField(type, value)\n    }\n\n    const scrollBarHeight = (type) => {\n      return listRefsMap[type].value.$el.offsetHeight\n    }\n\n    const bindScrollEvent = () => {\n      const bindFuntion = (type) => {\n        if (listRefsMap[type].value) {\n          listRefsMap[type].value.$el.querySelector(\n            '.el-scrollbar__wrap'\n          ).onscroll = () => {\n            // TODO: scroll is emitted when set scrollTop programatically\n            // should find better solutions in the future!\n            handleScroll(type)\n          }\n        }\n      }\n      bindFuntion('hours')\n      bindFuntion('minutes')\n      bindFuntion('seconds')\n    }\n\n    onMounted(() => {\n      nextTick(() => {\n        !props.arrowControl && bindScrollEvent()\n        adjustSpinners()\n        // set selection on the first hour part\n        if (props.role === 'start') emitSelectRange('hours')\n      })\n    })\n\n    const getRefId = (item) => {\n      return `list${item.charAt(0).toUpperCase() + item.slice(1)}Ref`\n    }\n\n    ctx.emit('set-option', [`${props.role}_scrollDown`, scrollDown])\n    ctx.emit('set-option', [`${props.role}_emitSelectRange`, emitSelectRange])\n\n    const { getHoursList, getMinutesList, getSecondsList } = getTimeLists(\n      props.disabledHours,\n      props.disabledMinutes,\n      props.disabledSeconds\n    )\n\n    watch(\n      () => props.spinnerDate,\n      () => {\n        if (isScrolling) return\n        adjustSpinners()\n      }\n    )\n\n    return {\n      getRefId,\n      spinnerItems,\n      currentScrollbar,\n      hours,\n      minutes,\n      seconds,\n      hoursList,\n      minutesList,\n      arrowHourList,\n      arrowMinuteList,\n      arrowSecondList,\n      getAmPmFlag,\n      emitSelectRange,\n      adjustCurrentSpinner,\n      typeItemHeight,\n      listHoursRef,\n      listMinutesRef,\n      listSecondsRef,\n      onIncreaseClick,\n      onDecreaseClick,\n      handleClick,\n      secondsList,\n      timePartsMap,\n      arrowListMap,\n      listMap,\n    }\n  },\n})\n</script>\n"],"names":["_withCtx","_createTextVNode"],"mappings":";;;;;4CAmDyC;;;;;;;;;;;;;2BAhDnC;;;;;iBAIO;;;;eAIF,EAACA;uDACyB;YAC5B;;;kFAG2B;;kBACzB,KAAK;2EAEY,yBAAoB,CAAC,IAAI;mEACR;;;;;;;;;;;;;;;;;;;;;yDAiBT;;;;;;;;wCAGV;;;;;;;;;;;;;kBAcbC;uBACI;;;;;kBAMW;;yBACE;;;;;;;"}
+{"version":3,"file":"basic-time-spinner.vue_vue_type_template_id_4fb3c576_lang.mjs","sources":["../../../../../../../packages/components/time-picker/src/time-picker-com/basic-time-spinner.vue?vue&type=template&id=4fb3c576&lang.js"],"sourcesContent":["<template>\n  <div class=\"el-time-spinner\" :class=\"{ 'has-seconds': showSeconds }\">\n    <template v-if=\"!arrowControl\">\n      <el-scrollbar\n        v-for=\"item in spinnerItems\"\n        :key=\"item\"\n        :ref=\"getRefId(item)\"\n        class=\"el-time-spinner__wrapper\"\n        wrap-style=\"max-height: inherit;\"\n        view-class=\"el-time-spinner__list\"\n        noresize\n        tag=\"ul\"\n        @mouseenter=\"emitSelectRange(item)\"\n        @mousemove=\"adjustCurrentSpinner(item)\"\n      >\n        <li\n          v-for=\"(disabled, key) in listMap[item].value\"\n          :key=\"key\"\n          class=\"el-time-spinner__item\"\n          :class=\"{ active: key === timePartsMap[item].value, disabled }\"\n          @click=\"handleClick(item, { value: key, disabled })\"\n        >\n          <template v-if=\"item === 'hours'\">\n            {{ ('0' + (amPmMode ? key % 12 || 12 : key)).slice(-2)\n            }}{{ getAmPmFlag(key) }}\n          </template>\n          <template v-else>\n            {{ ('0' + key).slice(-2) }}\n          </template>\n        </li>\n      </el-scrollbar>\n    </template>\n    <template v-if=\"arrowControl\">\n      <div\n        v-for=\"item in spinnerItems\"\n        :key=\"item\"\n        class=\"el-time-spinner__wrapper is-arrow\"\n        @mouseenter=\"emitSelectRange(item)\"\n      >\n        <el-icon\n          v-repeat-click=\"onDecreaseClick\"\n          class=\"el-time-spinner__arrow arrow-up\"\n        >\n          <arrow-up />\n        </el-icon>\n        <el-icon\n          v-repeat-click=\"onIncreaseClick\"\n          class=\"el-time-spinner__arrow arrow-down\"\n        >\n          <arrow-down />\n        </el-icon>\n        <ul class=\"el-time-spinner__list\">\n          <li\n            v-for=\"(time, key) in arrowListMap[item].value\"\n            :key=\"key\"\n            class=\"el-time-spinner__item\"\n            :class=\"{\n              active: time === timePartsMap[item].value,\n              disabled: listMap[item].value[time],\n            }\"\n          >\n            <template v-if=\"typeof time === 'number'\">\n              <template v-if=\"item === 'hours'\">\n                {{ ('0' + (amPmMode ? time % 12 || 12 : time)).slice(-2)\n                }}{{ getAmPmFlag(time) }}\n              </template>\n              <template v-else>\n                {{ ('0' + time).slice(-2) }}\n              </template>\n            </template>\n          </li>\n        </ul>\n      </div>\n    </template>\n  </div>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, ref, nextTick, computed, onMounted, watch } from 'vue'\nimport debounce from 'lodash/debounce'\nimport { RepeatClick } from '@element-plus/directives'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport ElIcon from '@element-plus/components/icon'\nimport { ArrowUp, ArrowDown } from '@element-plus/icons-vue'\nimport { getTimeLists } from './useTimePicker'\n\nimport type { PropType, Ref } from 'vue'\nimport type { Dayjs } from 'dayjs'\nimport type { Nullable } from '@element-plus/utils/types'\n\nexport default defineComponent({\n  directives: {\n    repeatClick: RepeatClick,\n  },\n\n  components: {\n    ElScrollbar,\n    ElIcon,\n    ArrowUp,\n    ArrowDown,\n  },\n\n  props: {\n    role: {\n      type: String,\n      required: true,\n    },\n    spinnerDate: {\n      type: Object as PropType<Dayjs>,\n      required: true,\n    },\n    showSeconds: {\n      type: Boolean,\n      default: true,\n    },\n    arrowControl: Boolean,\n    amPmMode: {\n      type: String,\n      default: '', // 'a': am/pm; 'A': AM/PM\n    },\n    disabledHours: {\n      type: Function,\n    },\n    disabledMinutes: {\n      type: Function,\n    },\n    disabledSeconds: {\n      type: Function,\n    },\n  },\n\n  emits: ['change', 'select-range', 'set-option'],\n\n  setup(props, ctx) {\n    // data\n    let isScrolling = false\n    const debouncedResetScroll = debounce((type) => {\n      isScrolling = false\n      adjustCurrentSpinner(type)\n    }, 200)\n    const currentScrollbar = ref(null)\n    const listHoursRef: Ref<Nullable<HTMLElement>> = ref(null)\n    const listMinutesRef: Ref<Nullable<HTMLElement>> = ref(null)\n    const listSecondsRef: Ref<Nullable<HTMLElement>> = ref(null)\n    const listRefsMap = {\n      hours: listHoursRef,\n      minutes: listMinutesRef,\n      seconds: listSecondsRef,\n    }\n\n    // computed\n    const spinnerItems = computed(() => {\n      const arr = ['hours', 'minutes', 'seconds']\n      return props.showSeconds ? arr : arr.slice(0, 2)\n    })\n    const hours = computed(() => {\n      return props.spinnerDate.hour()\n    })\n    const minutes = computed(() => {\n      return props.spinnerDate.minute()\n    })\n    const seconds = computed(() => {\n      return props.spinnerDate.second()\n    })\n    const timePartsMap = computed(() => ({\n      hours,\n      minutes,\n      seconds,\n    }))\n    const hoursList = computed(() => {\n      return getHoursList(props.role)\n    })\n    const minutesList = computed(() => {\n      return getMinutesList(hours.value, props.role)\n    })\n    const secondsList = computed(() => {\n      return getSecondsList(hours.value, minutes.value, props.role)\n    })\n    const listMap = computed(() => ({\n      hours: hoursList,\n      minutes: minutesList,\n      seconds: secondsList,\n    }))\n    const arrowHourList = computed(() => {\n      const hour = hours.value\n      return [\n        hour > 0 ? hour - 1 : undefined,\n        hour,\n        hour < 23 ? hour + 1 : undefined,\n      ]\n    })\n    const arrowMinuteList = computed(() => {\n      const minute = minutes.value\n      return [\n        minute > 0 ? minute - 1 : undefined,\n        minute,\n        minute < 59 ? minute + 1 : undefined,\n      ]\n    })\n    const arrowSecondList = computed(() => {\n      const second = seconds.value\n      return [\n        second > 0 ? second - 1 : undefined,\n        second,\n        second < 59 ? second + 1 : undefined,\n      ]\n    })\n    const arrowListMap = computed(() => ({\n      hours: arrowHourList,\n      minutes: arrowMinuteList,\n      seconds: arrowSecondList,\n    }))\n    const getAmPmFlag = (hour) => {\n      const shouldShowAmPm = !!props.amPmMode\n      if (!shouldShowAmPm) return ''\n      const isCapital = props.amPmMode === 'A'\n      // todo locale\n      let content = hour < 12 ? ' am' : ' pm'\n      if (isCapital) content = content.toUpperCase()\n      return content\n    }\n\n    const emitSelectRange = (type) => {\n      if (type === 'hours') {\n        ctx.emit('select-range', 0, 2)\n      } else if (type === 'minutes') {\n        ctx.emit('select-range', 3, 5)\n      } else if (type === 'seconds') {\n        ctx.emit('select-range', 6, 8)\n      }\n      currentScrollbar.value = type\n    }\n\n    const adjustCurrentSpinner = (type) => {\n      adjustSpinner(type, timePartsMap.value[type].value)\n    }\n\n    // NOTE: used by datetime / date-range panel\n    //       renamed from adjustScrollTop\n    //       should try to refactory it\n    const adjustSpinners = () => {\n      adjustCurrentSpinner('hours')\n      adjustCurrentSpinner('minutes')\n      adjustCurrentSpinner('seconds')\n    }\n\n    const adjustSpinner = (type, value) => {\n      if (props.arrowControl) return\n      const el = listRefsMap[type]\n      if (el.value) {\n        el.value.$el.querySelector('.el-scrollbar__wrap').scrollTop = Math.max(\n          0,\n          value * typeItemHeight(type)\n        )\n      }\n    }\n\n    const typeItemHeight = (type) => {\n      const el = listRefsMap[type]\n      return el.value.$el.querySelector('li').offsetHeight\n    }\n\n    const onIncreaseClick = () => {\n      scrollDown(1)\n    }\n\n    const onDecreaseClick = () => {\n      scrollDown(-1)\n    }\n\n    const scrollDown = (step) => {\n      if (!currentScrollbar.value) {\n        emitSelectRange('hours')\n      }\n\n      const label = currentScrollbar.value\n      let now = timePartsMap.value[label].value\n      const total = currentScrollbar.value === 'hours' ? 24 : 60\n      now = (now + step + total) % total\n\n      modifyDateField(label, now)\n      adjustSpinner(label, now)\n      nextTick(() => emitSelectRange(currentScrollbar.value))\n    }\n\n    const modifyDateField = (type, value) => {\n      const list = listMap.value[type].value\n      const isDisabled = list[value]\n      if (isDisabled) return\n      switch (type) {\n        case 'hours':\n          ctx.emit(\n            'change',\n            props.spinnerDate\n              .hour(value)\n              .minute(minutes.value)\n              .second(seconds.value)\n          )\n          break\n        case 'minutes':\n          ctx.emit(\n            'change',\n            props.spinnerDate\n              .hour(hours.value)\n              .minute(value)\n              .second(seconds.value)\n          )\n          break\n        case 'seconds':\n          ctx.emit(\n            'change',\n            props.spinnerDate\n              .hour(hours.value)\n              .minute(minutes.value)\n              .second(value)\n          )\n          break\n      }\n    }\n\n    const handleClick = (type, { value, disabled }) => {\n      if (!disabled) {\n        modifyDateField(type, value)\n        emitSelectRange(type)\n        adjustSpinner(type, value)\n      }\n    }\n\n    const handleScroll = (type) => {\n      isScrolling = true\n      debouncedResetScroll(type)\n      const value = Math.min(\n        Math.round(\n          (listRefsMap[type].value.$el.querySelector('.el-scrollbar__wrap')\n            .scrollTop -\n            (scrollBarHeight(type) * 0.5 - 10) / typeItemHeight(type) +\n            3) /\n            typeItemHeight(type)\n        ),\n        type === 'hours' ? 23 : 59\n      )\n      modifyDateField(type, value)\n    }\n\n    const scrollBarHeight = (type) => {\n      return listRefsMap[type].value.$el.offsetHeight\n    }\n\n    const bindScrollEvent = () => {\n      const bindFuntion = (type) => {\n        if (listRefsMap[type].value) {\n          listRefsMap[type].value.$el.querySelector(\n            '.el-scrollbar__wrap'\n          ).onscroll = () => {\n            // TODO: scroll is emitted when set scrollTop programatically\n            // should find better solutions in the future!\n            handleScroll(type)\n          }\n        }\n      }\n      bindFuntion('hours')\n      bindFuntion('minutes')\n      bindFuntion('seconds')\n    }\n\n    onMounted(() => {\n      nextTick(() => {\n        !props.arrowControl && bindScrollEvent()\n        adjustSpinners()\n        // set selection on the first hour part\n        if (props.role === 'start') emitSelectRange('hours')\n      })\n    })\n\n    const getRefId = (item) => {\n      return `list${item.charAt(0).toUpperCase() + item.slice(1)}Ref`\n    }\n\n    ctx.emit('set-option', [`${props.role}_scrollDown`, scrollDown])\n    ctx.emit('set-option', [`${props.role}_emitSelectRange`, emitSelectRange])\n\n    const { getHoursList, getMinutesList, getSecondsList } = getTimeLists(\n      props.disabledHours,\n      props.disabledMinutes,\n      props.disabledSeconds\n    )\n\n    watch(\n      () => props.spinnerDate,\n      () => {\n        if (isScrolling) return\n        adjustSpinners()\n      }\n    )\n\n    return {\n      getRefId,\n      spinnerItems,\n      currentScrollbar,\n      hours,\n      minutes,\n      seconds,\n      hoursList,\n      minutesList,\n      arrowHourList,\n      arrowMinuteList,\n      arrowSecondList,\n      getAmPmFlag,\n      emitSelectRange,\n      adjustCurrentSpinner,\n      typeItemHeight,\n      listHoursRef,\n      listMinutesRef,\n      listSecondsRef,\n      onIncreaseClick,\n      onDecreaseClick,\n      handleClick,\n      secondsList,\n      timePartsMap,\n      arrowListMap,\n      listMap,\n    }\n  },\n})\n</script>\n"],"names":["_withCtx","_createTextVNode"],"mappings":";;;;;4CAmDyC;;;;;;;;;;;;;2BAhDnC;;;;;iBAIO;;;;eAIF,EAACA;uDACyB;YAC5B;;;kFAG2B;;kBACzB,KAAK;2EAEY,yBAAoB,CAAC,IAAI;mEACR;;;;;;;;;;;;;;;;;;;;;yDAiBT;;;;;;;;wCAGV;;;;;;;;;;;gGAaoB;;kBACjCC;uBACI;;;;;;;yBAOa;;;;;;;"}

package/es/components/tree/index.d.ts

@@ -213,10 +213,10 @@ declare const _Tree: SFCWithInstall<import("vue").DefineComponent<{
         defaultExpandAll: boolean;
         checkDescendants: boolean;
         props: {
-            children: string;
-            label: string;
-            disabled: string;
-            isLeaf?: boolean | undefined;
+            children?: string | undefined;
+            label?: string | ((data: import("./src/tree.type").TreeNodeData, node: import("./src/model/node").default) => string) | undefined;
+            disabled?: string | ((data: import("./src/tree.type").TreeNodeData, node: import("./src/model/node").default) => string) | undefined;
+            isLeaf?: boolean | ((data: import("./src/tree.type").TreeNodeData, node: import("./src/model/node").default) => string) | undefined;
             class?: ((data: import("./src/tree.type").TreeNodeData, node: import("./src/model/node").default) => string | {
                 [key: string]: boolean;
             }) | undefined;
@@ -673,10 +673,10 @@ export declare const ElTree: SFCWithInstall<import("vue").DefineComponent<{
         defaultExpandAll: boolean;
         checkDescendants: boolean;
         props: {
-            children: string;
-            label: string;
-            disabled: string;
-            isLeaf?: boolean | undefined;
+            children?: string | undefined;
+            label?: string | ((data: import("./src/tree.type").TreeNodeData, node: import("./src/model/node").default) => string) | undefined;
+            disabled?: string | ((data: import("./src/tree.type").TreeNodeData, node: import("./src/model/node").default) => string) | undefined;
+            isLeaf?: boolean | ((data: import("./src/tree.type").TreeNodeData, node: import("./src/model/node").default) => string) | undefined;
             class?: ((data: import("./src/tree.type").TreeNodeData, node: import("./src/model/node").default) => string | {
                 [key: string]: boolean;
             }) | undefined;

package/es/components/tree/src/tree.type.d.ts

@@ -51,10 +51,10 @@ export declare interface TreeStoreOptions {
     filterNodeMethod: FilterNodeMethodFunction;
 }
 export declare interface TreeOptionProps {
-    children: string;
-    label: string;
-    disabled: string;
-    isLeaf?: boolean;
+    children?: string;
+    label?: string | ((data: TreeNodeData, node: Node) => string);
+    disabled?: string | ((data: TreeNodeData, node: Node) => string);
+    isLeaf?: boolean | ((data: TreeNodeData, node: Node) => string);
     class?: (data: TreeNodeData, node: Node) => string | {
         [key: string]: boolean;
     } | string;

package/es/components/tree/src/tree.vue.d.ts

@@ -216,10 +216,10 @@ declare const _default: import("vue").DefineComponent<{
         defaultExpandAll: boolean;
         checkDescendants: boolean;
         props: {
-            children: string;
-            label: string;
-            disabled: string;
-            isLeaf?: boolean | undefined;
+            children?: string | undefined;
+            label?: string | ((data: TreeNodeData, node: Node) => string) | undefined;
+            disabled?: string | ((data: TreeNodeData, node: Node) => string) | undefined;
+            isLeaf?: boolean | ((data: TreeNodeData, node: Node) => string) | undefined;
             class?: ((data: TreeNodeData, node: Node) => string | {
                 [key: string]: boolean;
             }) | undefined;

package/es/defaults.d.ts

@@ -6,7 +6,10 @@ declare const _default: {
         readonly button?: unknown;
         readonly message?: unknown;
         readonly zIndex?: unknown;
-    } & {} & {
+        readonly namespace?: unknown;
+    } & {
+        namespace: string;
+    } & {
         button?: import("./components").ButtonConfigContext | undefined;
         size?: import("./utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", unknown> | undefined;
         locale?: import("./locale").Language | undefined;

package/es/hooks/index.d.ts

@@ -22,3 +22,4 @@ export * from './use-popper-container';
 export * from './use-intermediate-render';
 export * from './use-delayed-toggle';
 export * from './use-forward-ref';
+export * from './use-namespace';

package/es/hooks/index.mjs

@@ -21,4 +21,5 @@ export { POPPER_CONTAINER_ID, POPPER_CONTAINER_SELECTOR, usePopperContainer } fr
 export { useDelayedRender } from './use-intermediate-render/index.mjs';
 export { useDelayedToggle, useDelayedToggleProps } from './use-delayed-toggle/index.mjs';
 export { FORWARD_REF_INJECTION_KEY, useForwardRef, useForwardRefDirective } from './use-forward-ref/index.mjs';
+export { useNamespace } from './use-namespace/index.mjs';
 //# sourceMappingURL=index.mjs.map

package/es/hooks/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;"}

package/es/hooks/use-common-props/index.d.ts

@@ -1,5 +1,5 @@
 import type { ComponentSize } from 'element-plus/es/utils/types';
 import type { MaybeRef } from '@vueuse/core';
-export declare const useSizeProp: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, "", false, "" | "small" | "default" | "large", never>;
+export declare const useSizeProp: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, never, false, "small" | "default" | "large", never>;
 export declare const useSize: (fallback?: MaybeRef<ComponentSize | undefined>, ignore?: Partial<Record<'prop' | 'form' | 'formItem' | 'global', boolean>>) => import("vue").ComputedRef<ComponentSize>;
 export declare const useDisabled: (fallback?: MaybeRef<boolean | undefined>) => import("vue").ComputedRef<boolean>;

package/es/hooks/use-common-props/index.mjs

@@ -7,8 +7,8 @@ import { elFormKey, elFormItemKey } from '../../tokens/form.mjs';
 
 const useSizeProp = buildProp({
   type: String,
-  values: ["", ...componentSize],
-  default: ""
+  values: componentSize,
+  required: false
 });
 const useSize = (fallback, ignore = {}) => {
   const emptyRef = ref(void 0);

package/es/hooks/use-common-props/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../../../../packages/hooks/use-common-props/index.ts"],"sourcesContent":["import { ref, unref, inject, computed } from 'vue'\nimport { elFormItemKey, elFormKey } from '@element-plus/tokens'\nimport { buildProp, componentSize } from '@element-plus/utils/props'\nimport { useProp } from '../use-prop'\nimport { useGlobalConfig } from '../use-global-config'\nimport type { ComponentSize } from '@element-plus/utils/types'\nimport type { MaybeRef } from '@vueuse/core'\n\nexport const useSizeProp = buildProp({\n  type: String,\n  values: ['', ...componentSize],\n  default: '',\n} as const)\n\nexport const useSize = (\n  fallback?: MaybeRef<ComponentSize | undefined>,\n  ignore: Partial<Record<'prop' | 'form' | 'formItem' | 'global', boolean>> = {}\n) => {\n  const emptyRef = ref(undefined)\n\n  const size = ignore.prop ? emptyRef : useProp<ComponentSize>('size')\n  const globalConfig = ignore.global ? emptyRef : useGlobalConfig('size')\n  const form = ignore.form ? { size: undefined } : inject(elFormKey, undefined)\n  const formItem = ignore.formItem\n    ? { size: undefined }\n    : inject(elFormItemKey, undefined)\n\n  return computed(\n    (): ComponentSize =>\n      size.value ||\n      unref(fallback) ||\n      formItem?.size ||\n      form?.size ||\n      globalConfig.value ||\n      'default'\n  )\n}\n\nexport const useDisabled = (fallback?: MaybeRef<boolean | undefined>) => {\n  const disabled = useProp<boolean>('disabled')\n  const form = inject(elFormKey, undefined)\n  return computed(\n    () => disabled.value || unref(fallback) || form?.disabled || false\n  )\n}\n"],"names":[],"mappings":";;;;;;;AAKY,MAAC,WAAW,GAAG,SAAS,CAAC;AACrC,EAAE,IAAI,EAAE,MAAM;AACd,EAAE,MAAM,EAAE,CAAC,EAAE,EAAE,GAAG,aAAa,CAAC;AAChC,EAAE,OAAO,EAAE,EAAE;AACb,CAAC,EAAE;AACS,MAAC,OAAO,GAAG,CAAC,QAAQ,EAAE,MAAM,GAAG,EAAE,KAAK;AAClD,EAAE,MAAM,QAAQ,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC;AAC/B,EAAE,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,GAAG,QAAQ,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC;AACxD,EAAE,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,GAAG,QAAQ,GAAG,eAAe,CAAC,MAAM,CAAC,CAAC;AAC1E,EAAE,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,GAAG,EAAE,IAAI,EAAE,KAAK,CAAC,EAAE,GAAG,MAAM,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC,CAAC;AAC1E,EAAE,MAAM,QAAQ,GAAG,MAAM,CAAC,QAAQ,GAAG,EAAE,IAAI,EAAE,KAAK,CAAC,EAAE,GAAG,MAAM,CAAC,aAAa,EAAE,KAAK,CAAC,CAAC,CAAC;AACtF,EAAE,OAAO,QAAQ,CAAC,MAAM,IAAI,CAAC,KAAK,IAAI,KAAK,CAAC,QAAQ,CAAC,KAAK,QAAQ,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,YAAY,CAAC,KAAK,IAAI,SAAS,CAAC,CAAC;AAChL,EAAE;AACU,MAAC,WAAW,GAAG,CAAC,QAAQ,KAAK;AACzC,EAAE,MAAM,QAAQ,GAAG,OAAO,CAAC,UAAU,CAAC,CAAC;AACvC,EAAE,MAAM,IAAI,GAAG,MAAM,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC,CAAC;AACzC,EAAE,OAAO,QAAQ,CAAC,MAAM,QAAQ,CAAC,KAAK,IAAI,KAAK,CAAC,QAAQ,CAAC,KAAK,IAAI,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,KAAK,CAAC,CAAC;AAC/G;;;;"}
+{"version":3,"file":"index.mjs","sources":["../../../../../packages/hooks/use-common-props/index.ts"],"sourcesContent":["import { ref, unref, inject, computed } from 'vue'\nimport { elFormItemKey, elFormKey } from '@element-plus/tokens'\nimport { buildProp, componentSize } from '@element-plus/utils/props'\nimport { useProp } from '../use-prop'\nimport { useGlobalConfig } from '../use-global-config'\nimport type { ComponentSize } from '@element-plus/utils/types'\nimport type { MaybeRef } from '@vueuse/core'\n\nexport const useSizeProp = buildProp({\n  type: String,\n  values: componentSize,\n  required: false,\n} as const)\n\nexport const useSize = (\n  fallback?: MaybeRef<ComponentSize | undefined>,\n  ignore: Partial<Record<'prop' | 'form' | 'formItem' | 'global', boolean>> = {}\n) => {\n  const emptyRef = ref(undefined)\n\n  const size = ignore.prop ? emptyRef : useProp<ComponentSize>('size')\n  const globalConfig = ignore.global ? emptyRef : useGlobalConfig('size')\n  const form = ignore.form ? { size: undefined } : inject(elFormKey, undefined)\n  const formItem = ignore.formItem\n    ? { size: undefined }\n    : inject(elFormItemKey, undefined)\n\n  return computed(\n    (): ComponentSize =>\n      size.value ||\n      unref(fallback) ||\n      formItem?.size ||\n      form?.size ||\n      globalConfig.value ||\n      'default'\n  )\n}\n\nexport const useDisabled = (fallback?: MaybeRef<boolean | undefined>) => {\n  const disabled = useProp<boolean>('disabled')\n  const form = inject(elFormKey, undefined)\n  return computed(\n    () => disabled.value || unref(fallback) || form?.disabled || false\n  )\n}\n"],"names":[],"mappings":";;;;;;;AAKY,MAAC,WAAW,GAAG,SAAS,CAAC;AACrC,EAAE,IAAI,EAAE,MAAM;AACd,EAAE,MAAM,EAAE,aAAa;AACvB,EAAE,QAAQ,EAAE,KAAK;AACjB,CAAC,EAAE;AACS,MAAC,OAAO,GAAG,CAAC,QAAQ,EAAE,MAAM,GAAG,EAAE,KAAK;AAClD,EAAE,MAAM,QAAQ,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC;AAC/B,EAAE,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,GAAG,QAAQ,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC;AACxD,EAAE,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,GAAG,QAAQ,GAAG,eAAe,CAAC,MAAM,CAAC,CAAC;AAC1E,EAAE,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,GAAG,EAAE,IAAI,EAAE,KAAK,CAAC,EAAE,GAAG,MAAM,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC,CAAC;AAC1E,EAAE,MAAM,QAAQ,GAAG,MAAM,CAAC,QAAQ,GAAG,EAAE,IAAI,EAAE,KAAK,CAAC,EAAE,GAAG,MAAM,CAAC,aAAa,EAAE,KAAK,CAAC,CAAC,CAAC;AACtF,EAAE,OAAO,QAAQ,CAAC,MAAM,IAAI,CAAC,KAAK,IAAI,KAAK,CAAC,QAAQ,CAAC,KAAK,QAAQ,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,YAAY,CAAC,KAAK,IAAI,SAAS,CAAC,CAAC;AAChL,EAAE;AACU,MAAC,WAAW,GAAG,CAAC,QAAQ,KAAK;AACzC,EAAE,MAAM,QAAQ,GAAG,OAAO,CAAC,UAAU,CAAC,CAAC;AACvC,EAAE,MAAM,IAAI,GAAG,MAAM,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC,CAAC;AACzC,EAAE,OAAO,QAAQ,CAAC,MAAM,QAAQ,CAAC,KAAK,IAAI,KAAK,CAAC,QAAQ,CAAC,KAAK,IAAI,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,KAAK,CAAC,CAAC;AAC/G;;;;"}

package/es/hooks/use-global-config/index.d.ts

@@ -9,7 +9,10 @@ export declare const provideGlobalConfig: (config: MaybeRef<ConfigProviderContex
     readonly button?: unknown;
     readonly message?: unknown;
     readonly zIndex?: unknown;
-} & {} & {
+    readonly namespace?: unknown;
+} & {
+    namespace: string;
+} & {
     button?: import("../..").ButtonConfigContext | undefined;
     size?: import("../../utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", unknown> | undefined;
     locale?: import("../../locale").Language | undefined;

package/es/hooks/use-namespace/index.d.ts

@@ -0,0 +1,9 @@
+export declare const useNamespace: (block: string) => {
+    namespace: import("vue").ComputedRef<string>;
+    b: (blockSuffix?: string) => string;
+    e: (element?: string | undefined) => string;
+    m: (modifier?: string | undefined) => string;
+    be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
+    em: (element?: string | undefined, modifier?: string | undefined) => string;
+    bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+};

package/es/hooks/use-namespace/index.mjs

@@ -0,0 +1,38 @@
+import { computed, unref } from 'vue';
+import curry from 'lodash/curry';
+import { useGlobalConfig } from '../use-global-config/index.mjs';
+
+const curryBem = curry((namespace, block, blockSuffix, element, modifier) => {
+  let cls = `${namespace}-${block}`;
+  if (blockSuffix) {
+    cls += `-${blockSuffix}`;
+  }
+  if (element) {
+    cls += `__${element}`;
+  }
+  if (modifier) {
+    cls += `--${modifier}`;
+  }
+  return cls;
+});
+const useNamespace = (block) => {
+  const namespace = computed(() => useGlobalConfig("namespace").value || "el");
+  const b = (blockSuffix = "") => curryBem(unref(namespace), block, blockSuffix, "", "");
+  const e = (element) => element ? curryBem(unref(namespace), block, "", element, "") : "";
+  const m = (modifier) => modifier ? curryBem(unref(namespace), block, "", "")(modifier) : "";
+  const be = (blockSuffix, element) => blockSuffix && element ? curryBem(unref(namespace), block, blockSuffix, element, "") : "";
+  const em = (element, modifier) => element && modifier ? curryBem(unref(namespace), block, "")(element, modifier) : "";
+  const bem = (blockSuffix, element, modifier) => blockSuffix && element && modifier ? curryBem(unref(namespace), block)(blockSuffix, element, modifier) : "";
+  return {
+    namespace,
+    b,
+    e,
+    m,
+    be,
+    em,
+    bem
+  };
+};
+
+export { useNamespace };
+//# sourceMappingURL=index.mjs.map

package/es/hooks/use-namespace/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../../../../packages/hooks/use-namespace/index.ts"],"sourcesContent":["import { unref, computed } from 'vue'\nimport curry from 'lodash/curry'\nimport { useGlobalConfig } from '../use-global-config'\n\nconst curryBem = curry(\n  (\n    namespace: string,\n    block: string,\n    blockSuffix: string,\n    element: string,\n    modifier: string\n  ) => {\n    let cls = `${namespace}-${block}`\n    if (blockSuffix) {\n      cls += `-${blockSuffix}`\n    }\n    if (element) {\n      cls += `__${element}`\n    }\n    if (modifier) {\n      cls += `--${modifier}`\n    }\n    return cls\n  }\n)\n\nexport const useNamespace = (block: string) => {\n  const namespace = computed(() => useGlobalConfig('namespace').value || 'el')\n  const b = (blockSuffix = '') =>\n    curryBem(unref(namespace), block, blockSuffix, '', '')\n  const e = (element?: string) =>\n    element ? curryBem(unref(namespace), block, '', element, '') : ''\n  const m = (modifier?: string) =>\n    modifier ? curryBem(unref(namespace), block, '', '')(modifier) : ''\n  const be = (blockSuffix?: string, element?: string) =>\n    blockSuffix && element\n      ? curryBem(unref(namespace), block, blockSuffix, element, '')\n      : ''\n  const em = (element?: string, modifier?: string) =>\n    element && modifier\n      ? curryBem(unref(namespace), block, '')(element, modifier)\n      : ''\n  const bem = (blockSuffix?: string, element?: string, modifier?: string) =>\n    blockSuffix && element && modifier\n      ? curryBem(unref(namespace), block)(blockSuffix, element, modifier)\n      : ''\n  return {\n    namespace,\n    b,\n    e,\n    m,\n    be,\n    em,\n    bem,\n  }\n}\n"],"names":[],"mappings":";;;;AAGA,MAAM,QAAQ,GAAG,KAAK,CAAC,CAAC,SAAS,EAAE,KAAK,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,KAAK;AAC7E,EAAE,IAAI,GAAG,GAAG,CAAC,EAAE,SAAS,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC;AACpC,EAAE,IAAI,WAAW,EAAE;AACnB,IAAI,GAAG,IAAI,CAAC,CAAC,EAAE,WAAW,CAAC,CAAC,CAAC;AAC7B,GAAG;AACH,EAAE,IAAI,OAAO,EAAE;AACf,IAAI,GAAG,IAAI,CAAC,EAAE,EAAE,OAAO,CAAC,CAAC,CAAC;AAC1B,GAAG;AACH,EAAE,IAAI,QAAQ,EAAE;AAChB,IAAI,GAAG,IAAI,CAAC,EAAE,EAAE,QAAQ,CAAC,CAAC,CAAC;AAC3B,GAAG;AACH,EAAE,OAAO,GAAG,CAAC;AACb,CAAC,CAAC,CAAC;AACS,MAAC,YAAY,GAAG,CAAC,KAAK,KAAK;AACvC,EAAE,MAAM,SAAS,GAAG,QAAQ,CAAC,MAAM,eAAe,CAAC,WAAW,CAAC,CAAC,KAAK,IAAI,IAAI,CAAC,CAAC;AAC/E,EAAE,MAAM,CAAC,GAAG,CAAC,WAAW,GAAG,EAAE,KAAK,QAAQ,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;AACzF,EAAE,MAAM,CAAC,GAAG,CAAC,OAAO,KAAK,OAAO,GAAG,QAAQ,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,OAAO,EAAE,EAAE,CAAC,GAAG,EAAE,CAAC;AAC3F,EAAE,MAAM,CAAC,GAAG,CAAC,QAAQ,KAAK,QAAQ,GAAG,QAAQ,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,QAAQ,CAAC,GAAG,EAAE,CAAC;AAC9F,EAAE,MAAM,EAAE,GAAG,CAAC,WAAW,EAAE,OAAO,KAAK,WAAW,IAAI,OAAO,GAAG,QAAQ,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,OAAO,EAAE,EAAE,CAAC,GAAG,EAAE,CAAC;AACjI,EAAE,MAAM,EAAE,GAAG,CAAC,OAAO,EAAE,QAAQ,KAAK,OAAO,IAAI,QAAQ,GAAG,QAAQ,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC,OAAO,EAAE,QAAQ,CAAC,GAAG,EAAE,CAAC;AACxH,EAAE,MAAM,GAAG,GAAG,CAAC,WAAW,EAAE,OAAO,EAAE,QAAQ,KAAK,WAAW,IAAI,OAAO,IAAI,QAAQ,GAAG,QAAQ,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,KAAK,CAAC,CAAC,WAAW,EAAE,OAAO,EAAE,QAAQ,CAAC,GAAG,EAAE,CAAC;AAC9J,EAAE,OAAO;AACT,IAAI,SAAS;AACb,IAAI,CAAC;AACL,IAAI,CAAC;AACL,IAAI,CAAC;AACL,IAAI,EAAE;AACN,IAAI,EAAE;AACN,IAAI,GAAG;AACP,GAAG,CAAC;AACJ;;;;"}

package/es/index.d.ts

@@ -11,7 +11,10 @@ export declare const install: (app: import("vue").App<any>, options?: {
     readonly button?: unknown;
     readonly message?: unknown;
     readonly zIndex?: unknown;
-} & {} & {
+    readonly namespace?: unknown;
+} & {
+    namespace: string;
+} & {
     button?: import("element-plus/es/components").ButtonConfigContext | undefined;
     size?: import("./utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", unknown> | undefined;
     locale?: import("./locale").Language | undefined;

package/es/index.mjs

@@ -20,7 +20,7 @@ export { ElBadge } from './components/badge/index.mjs';
 export { breadcrumbProps } from './components/breadcrumb/src/breadcrumb.mjs';
 export { breadcrumbItemProps } from './components/breadcrumb/src/breadcrumb-item.mjs';
 export { ElBreadcrumb, ElBreadcrumbItem } from './components/breadcrumb/index.mjs';
-export { buttonEmits, buttonNativeType, buttonProps, buttonSize, buttonType } from './components/button/src/button.mjs';
+export { buttonEmits, buttonNativeType, buttonProps, buttonType } from './components/button/src/button.mjs';
 export { ElButton, ElButtonGroup } from './components/button/index.mjs';
 export { calendarEmits, calendarProps } from './components/calendar/src/calendar.mjs';
 export { ElCalendar } from './components/calendar/index.mjs';
@@ -180,6 +180,7 @@ export { POPPER_CONTAINER_ID, POPPER_CONTAINER_SELECTOR, usePopperContainer } fr
 export { useDelayedRender } from './hooks/use-intermediate-render/index.mjs';
 export { useDelayedToggle, useDelayedToggleProps } from './hooks/use-delayed-toggle/index.mjs';
 export { FORWARD_REF_INJECTION_KEY, useForwardRef, useForwardRefDirective } from './hooks/use-forward-ref/index.mjs';
+export { useNamespace } from './hooks/use-namespace/index.mjs';
 export { elFormItemKey, elFormKey } from './tokens/form.mjs';
 export { buttonGroupContextKey } from './tokens/button.mjs';
 export { elBreadcrumbKey } from './tokens/breadcrumb.mjs';

package/es/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../../packages/element-plus/index.ts"],"sourcesContent":["import installer from './defaults'\nexport * from '@element-plus/components'\nexport * from '@element-plus/directives'\nexport * from '@element-plus/hooks'\nexport * from '@element-plus/tokens'\nexport * from '@element-plus/utils/popup-manager'\nexport { makeInstaller } from './make-installer'\n\nexport const install = installer.install\nexport const version = installer.version\nexport default installer\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOY,MAAC,OAAO,GAAG,SAAS,CAAC,QAAQ;AAC7B,MAAC,OAAO,GAAG,SAAS,CAAC;;;;"}
+{"version":3,"file":"index.mjs","sources":["../../../packages/element-plus/index.ts"],"sourcesContent":["import installer from './defaults'\nexport * from '@element-plus/components'\nexport * from '@element-plus/directives'\nexport * from '@element-plus/hooks'\nexport * from '@element-plus/tokens'\nexport * from '@element-plus/utils/popup-manager'\nexport { makeInstaller } from './make-installer'\n\nexport const install = installer.install\nexport const version = installer.version\nexport default installer\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOY,MAAC,OAAO,GAAG,SAAS,CAAC,QAAQ;AAC7B,MAAC,OAAO,GAAG,SAAS,CAAC;;;;"}

package/es/version.d.ts

@@ -1 +1 @@
-export declare const version = "0.0.20220113";
+export declare const version = "0.0.20220117";

package/es/version.mjs

@@ -1,4 +1,4 @@
-const version = "0.0.20220113";
+const version = "0.0.20220117";
 
 export { version };
 //# sourceMappingURL=version.mjs.map

package/es/version.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"version.mjs","sources":["../../../packages/element-plus/version.ts"],"sourcesContent":["export const version = '0.0.20220113'\n"],"names":[],"mappings":"AAAY,MAAC,OAAO,GAAG;;;;"}
+{"version":3,"file":"version.mjs","sources":["../../../packages/element-plus/version.ts"],"sourcesContent":["export const version = '0.0.20220117'\n"],"names":[],"mappings":"AAAY,MAAC,OAAO,GAAG;;;;"}

package/lib/components/button/index.d.ts

@@ -1,5 +1,5 @@
 export declare const ElButton: import("../../utils/types").SFCWithInstall<import("vue").DefineComponent<{
-    readonly size: import("../../utils/props").BuildPropReturn<StringConstructor, "", false, "" | "small" | "default" | "large", never>;
+    readonly size: import("../../utils/props").BuildPropReturn<StringConstructor, never, false, "small" | "default" | "large", never>;
     readonly disabled: BooleanConstructor;
     readonly type: import("../../utils/props").BuildPropReturn<StringConstructor, "", unknown, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
     readonly icon: import("../../utils/props").BuildPropReturn<import("../../utils/props").PropWrapper<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, "", unknown, unknown, unknown>;
@@ -19,6 +19,15 @@ export declare const ElButton: import("../../utils/types").SFCWithInstall<import
     buttonDisabled: import("vue").ComputedRef<boolean>;
     shouldAddSpace: import("vue").ComputedRef<boolean>;
     handleClick: (evt: MouseEvent) => void;
+    ns: {
+        namespace: import("vue").ComputedRef<string>;
+        b: (blockSuffix?: string) => string;
+        e: (element?: string | undefined) => string;
+        m: (modifier?: string | undefined) => string;
+        be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
+        em: (element?: string | undefined, modifier?: string | undefined) => string;
+        bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+    };
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     click: (evt: MouseEvent) => boolean;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
@@ -38,7 +47,6 @@ export declare const ElButton: import("../../utils/types").SFCWithInstall<import
     type: import("../../utils/props").BuildPropType<StringConstructor, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
     icon: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, unknown, unknown>;
     nativeType: import("../../utils/props").BuildPropType<StringConstructor, "button" | "submit" | "reset", unknown>;
-    size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
     disabled: boolean;
     loading: boolean;
     plain: boolean;
@@ -47,6 +55,7 @@ export declare const ElButton: import("../../utils/types").SFCWithInstall<import
     circle: boolean;
 } & {
     autoInsertSpace?: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown> | undefined;
+    size?: import("../../utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", never> | undefined;
     color?: string | undefined;
 }> & {
     onClick?: ((evt: MouseEvent) => any) | undefined;
@@ -55,7 +64,7 @@ export declare const ElButton: import("../../utils/types").SFCWithInstall<import
     icon: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, unknown, unknown>;
     nativeType: import("../../utils/props").BuildPropType<StringConstructor, "button" | "submit" | "reset", unknown>;
     autoInsertSpace: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
-    size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
+    size: import("../../utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", never>;
     disabled: boolean;
     loading: boolean;
     plain: boolean;
@@ -64,31 +73,53 @@ export declare const ElButton: import("../../utils/types").SFCWithInstall<import
     circle: boolean;
 }>> & {
     ButtonGroup: import("vue").DefineComponent<{
-        readonly size: import("../../utils/props").BuildPropReturn<StringConstructor, "", false, "" | "small" | "default" | "large", never>;
+        readonly size: import("../../utils/props").BuildPropReturn<StringConstructor, never, false, "small" | "default" | "large", never>;
         readonly type: import("../../utils/props").BuildPropReturn<StringConstructor, "", unknown, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
-    }, void, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+    }, {
+        ns: {
+            namespace: import("vue").ComputedRef<string>;
+            b: (blockSuffix?: string) => string;
+            e: (element?: string | undefined) => string;
+            m: (modifier?: string | undefined) => string;
+            be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
+            em: (element?: string | undefined, modifier?: string | undefined) => string;
+            bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+        };
+    }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
         readonly size?: unknown;
         readonly type?: unknown;
     } & {
         type: import("../../utils/props").BuildPropType<StringConstructor, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
-        size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
-    } & {}>, {
+    } & {
+        size?: import("../../utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", never> | undefined;
+    }>, {
         type: import("../../utils/props").BuildPropType<StringConstructor, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
-        size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
+        size: import("../../utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", never>;
     }>;
 };
 export declare const ElButtonGroup: import("../../utils/types").SFCWithInstall<import("vue").DefineComponent<{
-    readonly size: import("../../utils/props").BuildPropReturn<StringConstructor, "", false, "" | "small" | "default" | "large", never>;
+    readonly size: import("../../utils/props").BuildPropReturn<StringConstructor, never, false, "small" | "default" | "large", never>;
     readonly type: import("../../utils/props").BuildPropReturn<StringConstructor, "", unknown, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
-}, void, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+}, {
+    ns: {
+        namespace: import("vue").ComputedRef<string>;
+        b: (blockSuffix?: string) => string;
+        e: (element?: string | undefined) => string;
+        m: (modifier?: string | undefined) => string;
+        be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
+        em: (element?: string | undefined, modifier?: string | undefined) => string;
+        bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+    };
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     readonly size?: unknown;
     readonly type?: unknown;
 } & {
     type: import("../../utils/props").BuildPropType<StringConstructor, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
-    size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
-} & {}>, {
+} & {
+    size?: import("../../utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", never> | undefined;
+}>, {
     type: import("../../utils/props").BuildPropType<StringConstructor, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
-    size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
+    size: import("../../utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", never>;
 }>>;
 export default ElButton;
 export * from './src/button';

package/lib/components/button/index.js

@@ -17,7 +17,6 @@ const ElButtonGroup = withInstall.withNoopInstall(buttonGroup_vue_vue_type_scrip
 exports.buttonEmits = button.buttonEmits;
 exports.buttonNativeType = button.buttonNativeType;
 exports.buttonProps = button.buttonProps;
-exports.buttonSize = button.buttonSize;
 exports.buttonType = button.buttonType;
 exports.ElButton = ElButton;
 exports.ElButtonGroup = ElButtonGroup;

package/lib/components/button/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../packages/components/button/index.ts"],"sourcesContent":["import { withInstall, withNoopInstall } from '@element-plus/utils/with-install'\nimport Button from './src/button.vue'\nimport ButtonGroup from './src/button-group.vue'\n\nexport const ElButton = withInstall(Button, {\n  ButtonGroup,\n})\nexport const ElButtonGroup = withNoopInstall(ButtonGroup)\nexport default ElButton\n\nexport * from './src/button'\n"],"names":["withInstall","Button","ButtonGroup","withNoopInstall"],"mappings":";;;;;;;;;;;AAGY,MAAC,QAAQ,GAAGA,uBAAW,CAACC,0CAAM,EAAE;AAC5C,eAAEC,+CAAW;AACb,CAAC,EAAE;AACS,MAAC,aAAa,GAAGC,2BAAe,CAACD,+CAAW;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../packages/components/button/index.ts"],"sourcesContent":["import { withInstall, withNoopInstall } from '@element-plus/utils/with-install'\nimport Button from './src/button.vue'\nimport ButtonGroup from './src/button-group.vue'\n\nexport const ElButton = withInstall(Button, {\n  ButtonGroup,\n})\nexport const ElButtonGroup = withNoopInstall(ButtonGroup)\nexport default ElButton\n\nexport * from './src/button'\n"],"names":["withInstall","Button","ButtonGroup","withNoopInstall"],"mappings":";;;;;;;;;;;AAGY,MAAC,QAAQ,GAAGA,uBAAW,CAACC,0CAAM,EAAE;AAC5C,eAAEC,+CAAW;AACb,CAAC,EAAE;AACS,MAAC,aAAa,GAAGC,2BAAe,CAACD,+CAAW;;;;;;;;;;"}

package/lib/components/button/src/button-group.d.ts

@@ -1,7 +1,7 @@
 import type { ExtractPropTypes } from 'vue';
 import type buttonGroup from './button-group.vue';
 export declare const buttonGroupProps: {
-    readonly size: import("../../../utils/props").BuildPropReturn<StringConstructor, "", false, "" | "small" | "default" | "large", never>;
+    readonly size: import("../../../utils/props").BuildPropReturn<StringConstructor, never, false, "small" | "default" | "large", never>;
     readonly type: import("../../../utils/props").BuildPropReturn<StringConstructor, "", unknown, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
 };
 export declare type ButtonGroupProps = ExtractPropTypes<typeof buttonGroupProps>;

package/lib/components/button/src/button-group.vue.d.ts

@@ -1,14 +1,25 @@
 declare const _default: import("vue").DefineComponent<{
-    readonly size: import("../../../utils/props").BuildPropReturn<StringConstructor, "", false, "" | "small" | "default" | "large", never>;
+    readonly size: import("../../../utils/props").BuildPropReturn<StringConstructor, never, false, "small" | "default" | "large", never>;
     readonly type: import("../../../utils/props").BuildPropReturn<StringConstructor, "", unknown, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
-}, void, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+}, {
+    ns: {
+        namespace: import("vue").ComputedRef<string>;
+        b: (blockSuffix?: string) => string;
+        e: (element?: string | undefined) => string;
+        m: (modifier?: string | undefined) => string;
+        be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
+        em: (element?: string | undefined, modifier?: string | undefined) => string;
+        bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+    };
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     readonly size?: unknown;
     readonly type?: unknown;
 } & {
     type: import("../../../utils/props").BuildPropType<StringConstructor, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
-    size: import("../../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
-} & {}>, {
+} & {
+    size?: import("../../../utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", never> | undefined;
+}>, {
     type: import("../../../utils/props").BuildPropType<StringConstructor, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
-    size: import("../../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
+    size: import("../../../utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", never>;
 }>;
 export default _default;

package/lib/components/button/src/button-group.vue_vue_type_script_lang.js

@@ -4,8 +4,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
 require('../../../tokens/index.js');
+require('../../../hooks/index.js');
 var buttonGroup = require('./button-group.js');
 var button = require('../../../tokens/button.js');
+var index = require('../../../hooks/use-namespace/index.js');
 
 var script = vue.defineComponent({
   name: "ElButtonGroup",
@@ -15,6 +17,10 @@ var script = vue.defineComponent({
       size: vue.toRef(props, "size"),
       type: vue.toRef(props, "type")
     }));
+    const ns = index.useNamespace("button");
+    return {
+      ns
+    };
   }
 });
 

package/lib/components/button/src/button-group.vue_vue_type_script_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"button-group.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/button/src/button-group.vue"],"sourcesContent":["<template>\n  <div class=\"el-button-group\">\n    <slot></slot>\n  </div>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, provide, reactive, toRef } from 'vue'\nimport { buttonGroupContextKey } from '@element-plus/tokens'\nimport { buttonGroupProps } from './button-group'\n\nexport default defineComponent({\n  name: 'ElButtonGroup',\n  props: buttonGroupProps,\n\n  setup(props) {\n    provide(\n      buttonGroupContextKey,\n      reactive({\n        size: toRef(props, 'size'),\n        type: toRef(props, 'type'),\n      })\n    )\n  },\n})\n</script>\n"],"names":["defineComponent","buttonGroupProps","provide","buttonGroupContextKey","toRef"],"mappings":";;;;;;;;;AAQA,aAAeA,mBAAe,CAAC;;AAE/B,EAAE,KAAK,EAAEC,4BAAgB;EACvB,MAAM,KAAK,EAAE;IACXC,WAAO,CAACC;;MAEN,IAAI,EAAEC;KACP,CAAC,CAAC,CAAC;;;;;;"}
+{"version":3,"file":"button-group.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/button/src/button-group.vue"],"sourcesContent":["<template>\n  <div :class=\"`${ns.b('group')}`\">\n    <slot></slot>\n  </div>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, provide, reactive, toRef } from 'vue'\nimport { buttonGroupContextKey } from '@element-plus/tokens'\nimport { useNamespace } from '@element-plus/hooks'\nimport { buttonGroupProps } from './button-group'\n\nexport default defineComponent({\n  name: 'ElButtonGroup',\n  props: buttonGroupProps,\n\n  setup(props) {\n    provide(\n      buttonGroupContextKey,\n      reactive({\n        size: toRef(props, 'size'),\n        type: toRef(props, 'type'),\n      })\n    )\n    const ns = useNamespace('button')\n    return {\n      ns,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","buttonGroupProps","provide","buttonGroupContextKey","toRef","useNamespace"],"mappings":";;;;;;;;;;;AASA,aAAeA,mBAAe,CAAC;;AAE/B,EAAE,KAAK,EAAEC,4BAAgB;EACvB,MAAM,KAAK,EAAE;IACXC,WAAO,CAACC;;MAEN,IAAI,EAAEC;KACP,CAAC,CAAC,CAAC;UACE,EAAE,GAAGC,kBAAY;WAChB;QACH;;;;;;;"}

package/lib/components/button/src/button-group.vue_vue_type_template_id_1bab7d77_lang.js

@@ -4,11 +4,12 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
 
-const _hoisted_1 = { class: "el-button-group" };
 function render(_ctx, _cache, $props, $setup, $data, $options) {
-  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+  return vue.openBlock(), vue.createElementBlock("div", {
+    class: vue.normalizeClass(`${_ctx.ns.b("group")}`)
+  }, [
     vue.renderSlot(_ctx.$slots, "default")
-  ]);
+  ], 2);
 }
 
 exports.render = render;

package/lib/components/button/src/button-group.vue_vue_type_template_id_1bab7d77_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"button-group.vue_vue_type_template_id_1bab7d77_lang.js","sources":["../../../../../../packages/components/button/src/button-group.vue?vue&type=template&id=1bab7d77&lang.js"],"sourcesContent":["<template>\n  <div class=\"el-button-group\">\n    <slot></slot>\n  </div>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, provide, reactive, toRef } from 'vue'\nimport { buttonGroupContextKey } from '@element-plus/tokens'\nimport { buttonGroupProps } from './button-group'\n\nexport default defineComponent({\n  name: 'ElButtonGroup',\n  props: buttonGroupProps,\n\n  setup(props) {\n    provide(\n      buttonGroupContextKey,\n      reactive({\n        size: toRef(props, 'size'),\n        type: toRef(props, 'type'),\n      })\n    )\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;sCAC8B;;;;;;;;"}
+{"version":3,"file":"button-group.vue_vue_type_template_id_1bab7d77_lang.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;"}

package/lib/components/button/src/button.d.ts

@@ -1,10 +1,9 @@
 import type { ExtractPropTypes, Component } from 'vue';
 import type button from './button.vue';
 export declare const buttonType: readonly ["default", "primary", "success", "warning", "info", "danger", "text", ""];
-export declare const buttonSize: readonly ["", "large", "default", "small"];
 export declare const buttonNativeType: readonly ["button", "submit", "reset"];
 export declare const buttonProps: {
-    readonly size: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, "", false, "" | "small" | "default" | "large", never>;
+    readonly size: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, never, false, "small" | "default" | "large", never>;
     readonly disabled: BooleanConstructor;
     readonly type: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, "", unknown, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
     readonly icon: import("element-plus/es/utils/props").BuildPropReturn<import("element-plus/es/utils/props").PropWrapper<string | Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, "", unknown, unknown, unknown>;

package/lib/components/button/src/button.js

@@ -16,7 +16,6 @@ const buttonType = [
   "text",
   ""
 ];
-const buttonSize = ["", "large", "default", "small"];
 const buttonNativeType = ["button", "submit", "reset"];
 const buttonProps = props.buildProps({
   size: index.useSizeProp,
@@ -53,6 +52,5 @@ const buttonEmits = {
 exports.buttonEmits = buttonEmits;
 exports.buttonNativeType = buttonNativeType;
 exports.buttonProps = buttonProps;
-exports.buttonSize = buttonSize;
 exports.buttonType = buttonType;
 //# sourceMappingURL=button.js.map