@element-plus/nightly 0.0.20220526 → 0.0.20220529

package/lib/components/date-picker/src/date-picker-com/basic-month-table2.js

@@ -10,7 +10,8 @@ require('../../../../utils/index2.js');
 var basicMonthTable = require('../props/basic-month-table2.js');
 var pluginVue_exportHelper = require('../../../../_virtual/plugin-vue_export-helper.js');
 var dateUtils = require('../../../time-picker/src/common/date-utils2.js');
-var index = require('../../../../hooks/use-locale/index2.js');
+var index = require('../../../../hooks/use-namespace/index2.js');
+var index$1 = require('../../../../hooks/use-locale/index2.js');
 var arrays = require('../../../../utils/arrays2.js');
 var style = require('../../../../utils/dom/style2.js');
 
@@ -28,7 +29,8 @@ const _sfc_main = vue.defineComponent({
   emits: ["changerange", "pick", "select"],
   expose: ["focus"],
   setup(props, ctx) {
-    const { t, lang } = index.useLocale();
+    const ns = index.useNamespace("month-table");
+    const { t, lang } = index$1.useLocale();
     const tbodyRef = vue.ref();
     const currentCellRef = vue.ref();
     const months = vue.ref(props.date.locale("en").localeData().monthsShort().map((_) => _.toLowerCase()));
@@ -165,6 +167,7 @@ const _sfc_main = vue.defineComponent({
       }
     };
     return {
+      ns,
       tbodyRef,
       currentCellRef,
       handleMouseMove,
@@ -186,7 +189,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
   return vue.openBlock(), vue.createElementBlock("table", {
     role: "grid",
     "aria-label": _ctx.t("el.datepicker.monthTablePrompt"),
-    class: "el-month-table",
+    class: vue.normalizeClass(_ctx.ns.b()),
     onClick: _cache[2] || (_cache[2] = (...args) => _ctx.handleMonthTableClick && _ctx.handleMonthTableClick(...args)),
     onMousemove: _cache[3] || (_cache[3] = (...args) => _ctx.handleMouseMove && _ctx.handleMouseMove(...args))
   }, [
@@ -215,7 +218,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
         ]);
       }), 128))
     ], 512)
-  ], 40, _hoisted_1);
+  ], 42, _hoisted_1);
 }
 var MonthTable = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["render", _sfc_render], ["__file", "/home/runner/work/element-plus/element-plus/packages/components/date-picker/src/date-picker-com/basic-month-table.vue"]]);
 

package/lib/components/date-picker/src/date-picker-com/basic-month-table2.js.map

@@ -1 +1 @@
-{"version":3,"file":"basic-month-table2.js","sources":["../../../../../../../packages/components/date-picker/src/date-picker-com/basic-month-table.vue"],"sourcesContent":["<template>\n  <table\n    role=\"grid\"\n    :aria-label=\"t('el.datepicker.monthTablePrompt')\"\n    class=\"el-month-table\"\n    @click=\"handleMonthTableClick\"\n    @mousemove=\"handleMouseMove\"\n  >\n    <tbody ref=\"tbodyRef\">\n      <tr v-for=\"(row, key) in rows\" :key=\"key\">\n        <td\n          v-for=\"(cell, key_) in row\"\n          :key=\"key_\"\n          :ref=\"(el) => isSelectedCell(cell) && (currentCellRef = el)\"\n          :class=\"getCellStyle(cell)\"\n          :aria-selected=\"`${isSelectedCell(cell)}`\"\n          :aria-label=\"t(`el.datepicker.month${+cell.text + 1}`)\"\n          :tabindex=\"isSelectedCell(cell) ? 0 : -1\"\n          @keydown.space.prevent.stop=\"handleMonthTableClick\"\n          @keydown.enter.prevent.stop=\"handleMonthTableClick\"\n        >\n          <div>\n            <span class=\"cell\">\n              {{ t('el.datepicker.months.' + months[cell.text]) }}\n            </span>\n          </div>\n        </td>\n      </tr>\n    </tbody>\n  </table>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, nextTick, ref, watch } from 'vue'\nimport dayjs from 'dayjs'\nimport { useLocale } from '@element-plus/hooks'\nimport { rangeArr } from '@element-plus/components/time-picker'\nimport { castArray, hasClass } from '@element-plus/utils'\nimport { basicMonthTableProps } from '../props/basic-month-table'\n\nconst datesInMonth = (year: number, month: number, lang: string) => {\n  const firstDay = dayjs().locale(lang).startOf('month').month(month).year(year)\n  const numOfDays = firstDay.daysInMonth()\n  return rangeArr(numOfDays).map((n) => firstDay.add(n, 'day').toDate())\n}\n\nexport default defineComponent({\n  props: basicMonthTableProps,\n\n  emits: ['changerange', 'pick', 'select'],\n  expose: ['focus'],\n\n  setup(props, ctx) {\n    const { t, lang } = useLocale()\n    const tbodyRef = ref<HTMLElement>()\n    const currentCellRef = ref<HTMLElement>()\n    const months = ref(\n      props.date\n        .locale('en')\n        .localeData()\n        .monthsShort()\n        .map((_) => _.toLowerCase())\n    )\n    const tableRows = ref([[], [], []])\n    const lastRow = ref(null)\n    const lastColumn = ref(null)\n    const rows = computed(() => {\n      // TODO: refactory rows / getCellClasses\n      const rows = tableRows.value\n      const now = dayjs().locale(lang.value).startOf('month')\n\n      for (let i = 0; i < 3; i++) {\n        const row = rows[i]\n        for (let j = 0; j < 4; j++) {\n          let cell = row[j]\n          if (!cell) {\n            cell = {\n              row: i,\n              column: j,\n              type: 'normal',\n              inRange: false,\n              start: false,\n              end: false,\n            }\n          }\n\n          cell.type = 'normal'\n\n          const index = i * 4 + j\n          const calTime = props.date.startOf('year').month(index)\n\n          const calEndDate =\n            props.rangeState.endDate ||\n            props.maxDate ||\n            (props.rangeState.selecting && props.minDate)\n\n          cell.inRange =\n            (props.minDate &&\n              calTime.isSameOrAfter(props.minDate, 'month') &&\n              calEndDate &&\n              calTime.isSameOrBefore(calEndDate, 'month')) ||\n            (props.minDate &&\n              calTime.isSameOrBefore(props.minDate, 'month') &&\n              calEndDate &&\n              calTime.isSameOrAfter(calEndDate, 'month'))\n\n          if (props.minDate?.isSameOrAfter(calEndDate)) {\n            cell.start = calEndDate && calTime.isSame(calEndDate, 'month')\n            cell.end = props.minDate && calTime.isSame(props.minDate, 'month')\n          } else {\n            cell.start = props.minDate && calTime.isSame(props.minDate, 'month')\n            cell.end = calEndDate && calTime.isSame(calEndDate, 'month')\n          }\n\n          const isToday = now.isSame(calTime)\n          if (isToday) {\n            cell.type = 'today'\n          }\n\n          cell.text = index\n          const cellDate = calTime.toDate()\n          cell.disabled = props.disabledDate && props.disabledDate(cellDate)\n          row[j] = cell\n        }\n      }\n      return rows\n    })\n\n    watch(\n      () => props.date,\n      async () => {\n        if (tbodyRef.value?.contains(document.activeElement)) {\n          await nextTick()\n          currentCellRef.value?.focus()\n        }\n      }\n    )\n\n    const focus = () => {\n      currentCellRef.value?.focus()\n    }\n\n    const getCellStyle = (cell) => {\n      const style = {} as any\n      const year = props.date.year()\n      const today = new Date()\n      const month = cell.text\n\n      style.disabled = props.disabledDate\n        ? datesInMonth(year, month, lang.value).every(props.disabledDate)\n        : false\n      style.current =\n        castArray(props.parsedValue).findIndex(\n          (date) => date.year() === year && date.month() === month\n        ) >= 0\n      style.today = today.getFullYear() === year && today.getMonth() === month\n\n      if (cell.inRange) {\n        style['in-range'] = true\n\n        if (cell.start) {\n          style['start-date'] = true\n        }\n\n        if (cell.end) {\n          style['end-date'] = true\n        }\n      }\n      return style\n    }\n\n    const isSelectedCell = (cell) => {\n      const year = props.date.year()\n      const month = cell.text\n      return (\n        castArray(props.date).findIndex(\n          (date) => date.year() === year && date.month() === month\n        ) >= 0\n      )\n    }\n\n    const handleMouseMove = (event) => {\n      if (!props.rangeState.selecting) return\n\n      let target = event.target\n      if (target.tagName === 'A') {\n        target = target.parentNode.parentNode\n      }\n      if (target.tagName === 'DIV') {\n        target = target.parentNode\n      }\n      if (target.tagName !== 'TD') return\n\n      const row = target.parentNode.rowIndex\n      const column = target.cellIndex\n      // can not select disabled date\n      if (rows.value[row][column].disabled) return\n\n      // only update rangeState when mouse moves to a new cell\n      // this avoids frequent Date object creation and improves performance\n      if (row !== lastRow.value || column !== lastColumn.value) {\n        lastRow.value = row\n        lastColumn.value = column\n        ctx.emit('changerange', {\n          selecting: true,\n          endDate: props.date.startOf('year').month(row * 4 + column),\n        })\n      }\n    }\n    const handleMonthTableClick = (event) => {\n      let target = event.target\n      target = target?.closest('td')\n      if (target?.tagName !== 'TD') return\n      if (hasClass(target, 'disabled')) return\n      const column = target.cellIndex\n      const row = target.parentNode.rowIndex\n      const month = row * 4 + column\n      const newDate = props.date.startOf('year').month(month)\n      if (props.selectionMode === 'range') {\n        if (!props.rangeState.selecting) {\n          ctx.emit('pick', { minDate: newDate, maxDate: null })\n          ctx.emit('select', true)\n        } else {\n          if (newDate >= props.minDate) {\n            ctx.emit('pick', { minDate: props.minDate, maxDate: newDate })\n          } else {\n            ctx.emit('pick', { minDate: newDate, maxDate: props.minDate })\n          }\n          ctx.emit('select', false)\n        }\n      } else {\n        ctx.emit('pick', month)\n      }\n    }\n\n    return {\n      tbodyRef,\n      currentCellRef,\n      handleMouseMove,\n      handleMonthTableClick,\n      focus,\n      isSelectedCell,\n      rows,\n      getCellStyle,\n      t,\n      months,\n    }\n  },\n})\n</script>\n"],"names":["dayjs","rangeArr","defineComponent","basicMonthTableProps","useLocale","ref","computed","watch","nextTick","castArray","hasClass","_openBlock","_createElementBlock","_createElementVNode","_Fragment","_renderList","_normalizeClass","_withKeys","_withModifiers"],"mappings":";;;;;;;;;;;;;;;;;;;;AAwCA,MAAM,YAAe,GAAA,CAAC,IAAc,EAAA,KAAA,EAAe,IAAiB,KAAA;AAClE,EAAA,MAAM,QAAW,GAAAA,yBAAA,EAAQ,CAAA,MAAA,CAAO,IAAI,CAAA,CAAE,OAAQ,CAAA,OAAO,CAAE,CAAA,KAAA,CAAM,KAAK,CAAA,CAAE,KAAK,IAAI,CAAA,CAAA;AAC7E,EAAM,MAAA,SAAA,GAAY,SAAS,WAAY,EAAA,CAAA;AACvC,EAAA,OAAOC,kBAAS,CAAA,SAAS,CAAE,CAAA,GAAA,CAAI,CAAC,CAAA,KAAM,QAAS,CAAA,GAAA,CAAI,CAAG,EAAA,KAAK,CAAE,CAAA,MAAA,EAAQ,CAAA,CAAA;AACvE,CAAA,CAAA;AAEA,MAAK,YAAaC,mBAAa,CAAA;AAAA,EAC7B,KAAO,EAAAC,oCAAA;AAAA,EAEP,KAAO,EAAA,CAAC,aAAe,EAAA,MAAA,EAAQ,QAAQ,CAAA;AAAA,EACvC,MAAA,EAAQ,CAAC,OAAO,CAAA;AAAA,EAEhB,KAAA,CAAM,OAAO,GAAK,EAAA;AAChB,IAAM,MAAA,EAAE,CAAG,EAAA,IAAA,EAAA,GAASC,eAAU,EAAA,CAAA;AAC9B,IAAA,MAAM,WAAWC,OAAiB,EAAA,CAAA;AAClC,IAAA,MAAM,iBAAiBA,OAAiB,EAAA,CAAA;AACxC,IAAA,MAAM,SAASA,OACb,CAAA,KAAA,CAAM,IACH,CAAA,MAAA,CAAO,IAAI,CACX,CAAA,UAAA,EACA,CAAA,WAAA,GACA,GAAI,CAAA,CAAC,MAAM,CAAE,CAAA,WAAA,EAAa,CAC/B,CAAA,CAAA;AACA,IAAM,MAAA,SAAA,GAAYA,QAAI,CAAC,IAAI,EAAC,EAAG,EAAE,CAAC,CAAA,CAAA;AAClC,IAAM,MAAA,OAAA,GAAUA,QAAI,IAAI,CAAA,CAAA;AACxB,IAAM,MAAA,UAAA,GAAaA,QAAI,IAAI,CAAA,CAAA;AAC3B,IAAM,MAAA,IAAA,GAAOC,aAAS,MAAM;AAE1B,MAAA,IAAA,EAAM;AACN,MAAM,MAAA,KAAA,YAAc,CAAA;AAEpB,MAAA,MAAA,GAAS,GAAIN,yBAAO,EAAA,CAAA,MAAQ,CAAA,IAAA,CAAA,KAAA,CAAA,CAAA,OAAA,CAAA,OAAA,CAAA,CAAA;AAC1B,MAAA,KAAA,SAAY,EAAK,CAAA,GAAA,CAAA,EAAA,CAAA,EAAA,EAAA;AACjB,QAAA,MAAA,GAAS,GAAI,KAAO,CAAA,CAAA,CAAA,CAAA;AAClB,QAAA,KAAA,QAAW,CAAI,EAAA,CAAA,GAAA,CAAA,EAAA,CAAA,EAAA,EAAA;AACf,UAAA,IAAI,IAAO,GAAA,GAAA,CAAA,CAAA,CAAA,CAAA;AACT,UAAO,IAAA,CAAA,IAAA,EAAA;AAAA,YAAA,IACA,GAAA;AAAA,cACL,GAAQ,EAAA,CAAA;AAAA,cACR,MAAM,EAAA,CAAA;AAAA,cACN,IAAS,EAAA,QAAA;AAAA,cACT,OAAO,EAAA,KAAA;AAAA,cACP,KAAK,EAAA,KAAA;AAAA,cACP,GAAA,EAAA,KAAA;AAAA,aACF,CAAA;AAEA,WAAA;AAEA,UAAM,IAAA,CAAA,IAAA,GAAA,QAAgB,CAAA;AACtB,UAAA,MAAM,YAAgB,CAAA,GAAA,CAAA,CAAA;AAEtB,UAAM,MAAA,OAAA,GAAA,UACa,CAAA,OAAA,CAAA,MAAA,CAAA,CAAA,WAEhB,CAAA,CAAA;AAEH,UAAK,MAAA,UACI,GAAA,KAAA,CAAA,UACG,CAAA,OAAA,IAAA,KAAA,CAAA,OAAoB,IAAA,KAAS,CAAO,UAAA,CAC5C,SACA,IAAA,KAAA,CAAA,OAAuB,CAAA;AAM3B,UAAA,IAAI,CAAM,OAAA,GAAA,KAAuB,CAAA,OAAA,IAAA,OAAA,CAAA,aAAa,CAAA,KAAA,CAAA,OAAA,EAAA,OAAA,CAAA,IAAA,UAAA,IAAA,OAAA,CAAA,cAAA,CAAA,UAAA,EAAA,OAAA,CAAA,IAAA,KAAA,CAAA,OAAA,IAAA,OAAA,CAAA,cAAA,CAAA,KAAA,CAAA,OAAA,EAAA,OAAA,CAAA,IAAA,UAAA,IAAA,OAAA,CAAA,aAAA,CAAA,UAAA,EAAA,OAAA,CAAA,CAAA;AAC5C,UAAA,IAAA,CAAA,EAAK,GAAQ,KAAA,CAAA,OAAA,KAAA,IAAsB,GAAA,KAAA,CAAA,GAAO,gBAAmB,CAAA,UAAA,CAAA,EAAA;AAC7D,YAAA,IAAA,CAAK,QAAY,UAAA,IAAA,cAA0B,CAAA,mBAAsB,CAAA,CAAA;AAAA,YAC5D,IAAA,CAAA,GAAA,GAAA,KAAA,CAAA,OAAA,IAAA,OAAA,CAAA,MAAA,CAAA,KAAA,CAAA,OAAA,EAAA,OAAA,CAAA,CAAA;AACL,WAAA,MAAK;AACL,YAAA,IAAA,CAAK,KAAM,GAAA,KAAA,CAAA,OAAsB,IAAA,OAAA,CAAA,oBAA0B,EAAA,OAAA,CAAA,CAAA;AAAA,YAC7D,IAAA,CAAA,GAAA,GAAA,UAAA,IAAA,OAAA,CAAA,MAAA,CAAA,UAAA,EAAA,OAAA,CAAA,CAAA;AAEA,WAAM;AACN,UAAA,MAAa,OAAA,GAAA,GAAA,CAAA,MAAA,CAAA,OAAA,CAAA,CAAA;AACX,UAAA,IAAA,OAAY,EAAA;AAAA,YACd,IAAA,CAAA,IAAA,GAAA,OAAA,CAAA;AAEA,WAAA;AACA,UAAM,IAAA,CAAA,IAAA,GAAA,KAAW;AACjB,UAAA,MAAgB,QAAA,GAAA,OAAsB,CAAA,MAAA,EAAA,CAAA;AACtC,UAAA,IAAI,CAAK,QAAA,GAAA,KAAA,CAAA,YAAA,IAAA,KAAA,CAAA,YAAA,CAAA,QAAA,CAAA,CAAA;AAAA,UACX,GAAA,CAAA,CAAA,CAAA,GAAA,IAAA,CAAA;AAAA,SACF;AACA,OAAO;AAAA,MACR,OAAA,KAAA,CAAA;AAED,KACE,CAAA,CAAA;AAEE,IAAAO,SAAA,CAAI,MAAS,KAAA,CAAA,IAAO,EAAS,YAAA;AAC3B,MAAA,IAAA,EAAA,EAAM,EAAS,CAAA;AACf,MAAA,IAAA,CAAA,EAAA,GAAA,cAAsB,KAAM,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,QAAA,CAAA,QAAA,CAAA,aAAA,CAAA,EAAA;AAAA,QAC9B,MAAAC,YAAA,EAAA,CAAA;AAAA,QAEJ,CAAA,EAAA,GAAA,cAAA,CAAA,KAAA,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAEA,OAAA;AACE,KAAA,CAAA,CAAA;AAA4B,IAC9B,MAAA,KAAA,GAAA,MAAA;AAEA,MAAM,IAAA,EAAA,CAAA;AACJ,MAAA,CAAA,EAAA,GAAM,cAAS,CAAA,KAAA,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AACf,KAAM,CAAA;AACN,IAAM,MAAA,eAAiB,CAAA,IAAA,KAAA;AACvB,MAAA,MAAM,QAAQ,EAAK,CAAA;AAEnB,MAAA,MAAM,IAAW,GAAA,KAAA,CAAA,IAAM,CACnB,IAAA,EAAA,CAAA;AAEJ,MAAA,MAAM,YACM,IAAA,EAAA,CAAA;AAGZ,MAAA,MAAM,QAAQ,IAAM,CAAA,IAAA,CAAA;AAEpB,MAAA,cAAkB,GAAA,KAAA,CAAA,YAAA,GAAA,YAAA,CAAA,IAAA,EAAA,KAAA,EAAA,IAAA,CAAA,KAAA,CAAA,CAAA,KAAA,CAAA,KAAA,CAAA,YAAA,CAAA,GAAA,KAAA,CAAA;AAChB,MAAA,KAAA,CAAA,OAAoB,GAAAC,gBAAA,CAAA,KAAA,CAAA,WAAA,CAAA,CAAA,SAAA,CAAA,CAAA,IAAA,KAAA,IAAA,CAAA,IAAA,EAAA,KAAA,IAAA,IAAA,IAAA,CAAA,KAAA,EAAA,KAAA,KAAA,CAAA,IAAA,CAAA,CAAA;AAEpB,MAAA,KAAA,CAAI,KAAK,GAAO,KAAA,CAAA,WAAA,EAAA,KAAA,IAAA,IAAA,KAAA,CAAA,QAAA,EAAA,KAAA,KAAA,CAAA;AACd,MAAA,IAAA,IAAA,CAAA,OAAsB,EAAA;AAAA,QACxB,KAAA,CAAA,UAAA,CAAA,GAAA,IAAA,CAAA;AAEA,QAAA,IAAI,KAAK,KAAK,EAAA;AACZ,UAAA,KAAA,CAAM,YAAc,CAAA,GAAA,IAAA,CAAA;AAAA,SACtB;AAAA,QACF,IAAA,IAAA,CAAA,GAAA,EAAA;AACA,UAAO,KAAA,CAAA,UAAA,CAAA,GAAA,IAAA,CAAA;AAAA,SACT;AAEA,OAAM;AACJ,MAAM,OAAA,KAAA,CAAO;AACb,KAAA,CAAA;AACA,IAAA,MAAA,cACY,GAAA,CAAA,IAAU;AAEf,MAET,MAAA,IAAA,GAAA,KAAA,CAAA,IAAA,CAAA,IAAA,EAAA,CAAA;AAEA,MAAM,MAAA,KAAA,GAAA,IAAA,CAAA,IAAmB,CAAU;AACjC,MAAI,uBAAkB,CAAA,KAAA,CAAA,IAAA,CAAA,CAAA,SAAA,CAAA,CAAA,IAAA,KAAA,IAAA,CAAA,IAAA,EAAA,KAAA,IAAA,IAAA,IAAA,CAAA,KAAA,EAAA,KAAA,KAAA,CAAA,IAAA,CAAA,CAAA;AAAW,KAAA,CAAA;AAEjC,IAAA,MAAI,eAAe,GAAA,CAAA,KAAA,KAAA;AACnB,MAAI,IAAA,CAAA,KAAA,CAAO,oBAAiB;AAC1B,QAAA,OAAA;AAA2B,MAC7B,IAAA,MAAA,GAAA,KAAA,CAAA,MAAA,CAAA;AACA,MAAI,IAAA,MAAA,CAAO,YAAY,GAAO,EAAA;AAC5B,QAAA,MAAA,GAAS,MAAO,CAAA,UAAA,CAAA,UAAA,CAAA;AAAA,OAClB;AACA,MAAA,IAAI,OAAO,OAAY,KAAA,KAAA,EAAA;AAAM,QAAA,MAAA,GAAA,MAAA,CAAA,UAAA,CAAA;AAE7B,OAAM;AACN,MAAA,IAAA,cAAsB,KAAA,IAAA;AAEtB,QAAI,OAAK;AAA6B,MAAA,MAAA,GAAA,GAAA,MAAA,CAAA,UAAA,CAAA,QAAA,CAAA;AAItC,MAAA,MAAY,MAAA,GAAA,MAAiB,CAAA,SAAA,CAAA;AAC3B,MAAA,IAAA,IAAA,CAAA,KAAgB,CAAA,GAAA,CAAA,CAAA,MAAA,CAAA,CAAA,QAAA;AAChB,QAAA,OAAA;AACA,MAAA,IAAA,QAAwB,OAAA,CAAA,KAAA,IAAA,MAAA,KAAA,UAAA,CAAA,KAAA,EAAA;AAAA,QAAA,OACX,CAAA,KAAA,GAAA,GAAA,CAAA;AAAA,QACX,UAAA,CAAS,QAAW,MAAA,CAAA;AAAsC,QAC5D,GAAC,CAAA,IAAA,CAAA,aAAA,EAAA;AAAA,UACH,SAAA,EAAA,IAAA;AAAA,UACF,OAAA,EAAA,KAAA,CAAA,IAAA,CAAA,OAAA,CAAA,MAAA,CAAA,CAAA,KAAA,CAAA,GAAA,GAAA,CAAA,GAAA,MAAA,CAAA;AACA,SAAM,CAAA,CAAA;AACJ,OAAA;AACA,KAAS,CAAA;AACT,IAAA,MAAI,qBAAoB,GAAA,CAAA,KAAA,KAAA;AAAM,MAAA,IAAA,MAAA,GAAA,KAAA,CAAA,MAAA,CAAA;AAC9B,MAAI,MAAA,GAAA,cAA2B,GAAA,KAAA,CAAA,GAAA,MAAA,CAAA,OAAA,CAAA,IAAA,CAAA,CAAA;AAAG,MAAA,IAAA,CAAA,MAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,MAAA,CAAA,OAAA,MAAA,IAAA;AAClC,QAAA;AACA,MAAM,IAAAC,cAAM,OAAO,EAAW,UAAA,CAAA;AAC9B,QAAM,OAAA;AACN,MAAA,MAAM,eAAgB,CAAA;AACtB,MAAI,MAAA,GAAA,oBAAiC,CAAA,QAAA,CAAA;AACnC,MAAI,MAAA,KAAO,GAAA,GAAA,GAAA,CAAA,GAAW,MAAW,CAAA;AAC/B,MAAA,MAAA,OAAS,GAAQ,KAAA,CAAA,YAAoB,CAAA,MAAA,CAAA,CAAA,KAAA,CAAA,MAAc,CAAC;AACpD,MAAI,IAAA,KAAA,CAAA,aAAe,KAAI,OAAA,EAAA;AAAA,QACzB,IAAO,CAAA,KAAA,CAAA,UAAA,CAAA,SAAA,EAAA;AACL,UAAI,GAAA,CAAA,IAAA,CAAA,MAAW,WAAe,EAAA,OAAA,EAAA,OAAA,EAAA,IAAA,EAAA,CAAA,CAAA;AAC5B,UAAI,GAAA,CAAA,IAAA,CAAA,UAAa,IAAE,CAAA,CAAA;AAA0C,SAAA,MACxD;AACL,UAAI,IAAA,OAAK,SAAU,CAAA,OAAA,EAAS;AAAiC,YAC/D,GAAA,CAAA,IAAA,CAAA,MAAA,EAAA,EAAA,OAAA,EAAA,KAAA,CAAA,OAAA,EAAA,OAAA,EAAA,OAAA,EAAA,CAAA,CAAA;AACA,WAAI,MAAA;AAAoB,YAC1B,GAAA,CAAA,IAAA,CAAA,MAAA,EAAA,EAAA,OAAA,EAAA,OAAA,EAAA,OAAA,EAAA,KAAA,CAAA,OAAA,EAAA,CAAA,CAAA;AAAA,WACK;AACL,UAAI,GAAA,CAAA,aAAkB,EAAA,KAAA,CAAA,CAAA;AAAA,SACxB;AAAA,OACF,MAAA;AAEA,QAAO,GAAA,CAAA,IAAA,CAAA,MAAA,EAAA,KAAA,CAAA,CAAA;AAAA,OACL;AAAA,KACA,CAAA;AAAA,IACA,OAAA;AAAA,MACA,QAAA;AAAA,MACA,cAAA;AAAA,MACA,eAAA;AAAA,MACA,qBAAA;AAAA,MACA,KAAA;AAAA,MACA,cAAA;AAAA,MACA,IAAA;AAAA,MACF,YAAA;AAAA,MACF,CAAA;AACF,MAAC,MAAA;;;AAhPU,CAAA,CAAA,CAAA;AAcO,MAAA,UAAA,GAAA,CAAA,YAAY,CAAA,CAAA;;mCAOpB,EAAA,YAAA,EAAA,UAAA,CAAA,CAAA;AAAA,MA3BD,UAAA,GAAA,EAAA,KAAA,EAAA,MAAA,EAAA,CAAA;AAAA,oBACS,CAAA,IAAA,EAAA,MAAA,EAAA,MAAA,EAAA,MAAA,EAAA,KAAA,EAAA,QAAA,EAAA;AAAA,EAAA,OACRC,aAAA,EAAA,EAAAC,sBAAA,CAAA,OAAA,EAAA;AAAA,IACL,YAAO;AAAA,IACP,cAAW,IAAA,CAAA,CAAA,CAAA,gCAAA,CAAA;AAAA,IAAA,KAAA,EAAA,gBAAA;AAEZ,IAAA,OAAA,EAAA,MAAA,CAAA,CAAA,CAAA,WAAA,CAoBQ,CAAA,CAAA,GAAA,CAAA,GAAA,IAAA,KAAA,IAAA,CAAA,qBAAA,IAAA,IAAA,CAAA,qBAAA,CAAA,GAAA,IAAA,CAAA,CAAA;AAAA,IAAA,WAAA,EAAA,MAAA,CAAA,CAnBN,CAkBK,KAAA,MAAA,CAAA,CAAA,CAAA,GAAA,CAAA,GAAA,IAAA,KAAA,IAAA,CAAA,eAlBwB,IAAA,IAAA,CAAA,eAAT,CAAA,GAAA,IAAA,CAAA,CAAA;AAApB,GAAA,EAAA;AAAwC,IAAAC,sBAAA,CAAA,OAiBjC,EAAA,UAAA,EAAA;kDAAA,CAAAC,YAAA,EAAA,IAAA,EAAAC,cAAA,CAAA,IAAA,CAAA,IAAA,EAAA,CAAA,GAAA,EAAA,GAAA,KAAA;AAAA,QAAA,OAdGJ,aAAA,EAAA,EAAAC,sBAAA,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,EAAA;AAAA,WAAAD,aAAA,CAAA,IAAA,CAAA,EAAAC,sBAAA,CAAAE,YAAA,EAAA,IAAA,EAAAC,cAAA,CAAA,GAAA,EAAA,CAAA,IAAA,EAAA,IAAA,KAAA;AACL,YAAA,OAAGJ,aAAyB,EAAA,EAAAC,2BAA2B,EAAA;AAAA,cACvD,GAAA,EAAA,IAAO;AAAiB,cACxB,OAAA,EAAA,IAAA;AAAqC,cACrC,GAAY,EAAA,CAAA,EAAA,KAAA,IAAA,CAAA,cAAyB,CAAA,IAAA,CAAA,KAAA,IAAA,CAAA,cAAS,GAAA,EAAA,CAAA;AAAA,cAC9C,KAAA,EAAAI,oCAA6B,CAAA,IAAA,CAAA,CAAA;AAAA,cAC7B,eAAO,EAAA,CAAA,EAAA,IAAA,CAAA,cAAA,CAAA,IAAA,CAAA,CAAA,CAAA;AAAA,cAAA,YAAA,EAAA,IAAA,CAAA,CAAA,CAAA,CAAA,mBAAA,EAAA,CAAA,IAAA,CAAA,IAAA,GAAA,CAAA,CAAA,CAAA,CAAA;AAA0C,cAAA,QAAA,EAAA,IAAA,CAAA,cAAA,CAAA,IAAA,CAAA,GAAA,CAAA,GAAA,CAAA,CAAA;AACA,cAAA,SAAA,EAAA;;gBAM5C,MAAA,CAAA,CAAA,CAAA,KAAA,MAAA,CAAA,CAAA,CAAA,GAAAC,YAAA,CAAAC,iBAAA,CAAA,CAAA,GAAA,IAAA,KAAA,IAAA,CAAA,qBAAA,IAAA,IAAA,CAAA,qBAAA,CAAA,GAAA,IAAA,CAAA,EAAA,CAAA,SAAA,EAAA,MAAA,CAAA,CAAA,EAAA,CAAA,OAAA,CAAA,CAAA,CAAA;AAAA,eAHJ;AACiD,aAAA,EAAA;;;;;;;;;;;;;;;"}
+{"version":3,"file":"basic-month-table2.js","sources":["../../../../../../../packages/components/date-picker/src/date-picker-com/basic-month-table.vue"],"sourcesContent":["<template>\n  <table\n    role=\"grid\"\n    :aria-label=\"t('el.datepicker.monthTablePrompt')\"\n    :class=\"ns.b()\"\n    @click=\"handleMonthTableClick\"\n    @mousemove=\"handleMouseMove\"\n  >\n    <tbody ref=\"tbodyRef\">\n      <tr v-for=\"(row, key) in rows\" :key=\"key\">\n        <td\n          v-for=\"(cell, key_) in row\"\n          :key=\"key_\"\n          :ref=\"(el) => isSelectedCell(cell) && (currentCellRef = el)\"\n          :class=\"getCellStyle(cell)\"\n          :aria-selected=\"`${isSelectedCell(cell)}`\"\n          :aria-label=\"t(`el.datepicker.month${+cell.text + 1}`)\"\n          :tabindex=\"isSelectedCell(cell) ? 0 : -1\"\n          @keydown.space.prevent.stop=\"handleMonthTableClick\"\n          @keydown.enter.prevent.stop=\"handleMonthTableClick\"\n        >\n          <div>\n            <span class=\"cell\">\n              {{ t('el.datepicker.months.' + months[cell.text]) }}\n            </span>\n          </div>\n        </td>\n      </tr>\n    </tbody>\n  </table>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, nextTick, ref, watch } from 'vue'\nimport dayjs from 'dayjs'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { rangeArr } from '@element-plus/components/time-picker'\nimport { castArray, hasClass } from '@element-plus/utils'\nimport { basicMonthTableProps } from '../props/basic-month-table'\n\nconst datesInMonth = (year: number, month: number, lang: string) => {\n  const firstDay = dayjs().locale(lang).startOf('month').month(month).year(year)\n  const numOfDays = firstDay.daysInMonth()\n  return rangeArr(numOfDays).map((n) => firstDay.add(n, 'day').toDate())\n}\n\nexport default defineComponent({\n  props: basicMonthTableProps,\n\n  emits: ['changerange', 'pick', 'select'],\n  expose: ['focus'],\n\n  setup(props, ctx) {\n    const ns = useNamespace('month-table')\n\n    const { t, lang } = useLocale()\n    const tbodyRef = ref<HTMLElement>()\n    const currentCellRef = ref<HTMLElement>()\n    const months = ref(\n      props.date\n        .locale('en')\n        .localeData()\n        .monthsShort()\n        .map((_) => _.toLowerCase())\n    )\n    const tableRows = ref([[], [], []])\n    const lastRow = ref(null)\n    const lastColumn = ref(null)\n    const rows = computed(() => {\n      // TODO: refactory rows / getCellClasses\n      const rows = tableRows.value\n      const now = dayjs().locale(lang.value).startOf('month')\n\n      for (let i = 0; i < 3; i++) {\n        const row = rows[i]\n        for (let j = 0; j < 4; j++) {\n          let cell = row[j]\n          if (!cell) {\n            cell = {\n              row: i,\n              column: j,\n              type: 'normal',\n              inRange: false,\n              start: false,\n              end: false,\n            }\n          }\n\n          cell.type = 'normal'\n\n          const index = i * 4 + j\n          const calTime = props.date.startOf('year').month(index)\n\n          const calEndDate =\n            props.rangeState.endDate ||\n            props.maxDate ||\n            (props.rangeState.selecting && props.minDate)\n\n          cell.inRange =\n            (props.minDate &&\n              calTime.isSameOrAfter(props.minDate, 'month') &&\n              calEndDate &&\n              calTime.isSameOrBefore(calEndDate, 'month')) ||\n            (props.minDate &&\n              calTime.isSameOrBefore(props.minDate, 'month') &&\n              calEndDate &&\n              calTime.isSameOrAfter(calEndDate, 'month'))\n\n          if (props.minDate?.isSameOrAfter(calEndDate)) {\n            cell.start = calEndDate && calTime.isSame(calEndDate, 'month')\n            cell.end = props.minDate && calTime.isSame(props.minDate, 'month')\n          } else {\n            cell.start = props.minDate && calTime.isSame(props.minDate, 'month')\n            cell.end = calEndDate && calTime.isSame(calEndDate, 'month')\n          }\n\n          const isToday = now.isSame(calTime)\n          if (isToday) {\n            cell.type = 'today'\n          }\n\n          cell.text = index\n          const cellDate = calTime.toDate()\n          cell.disabled = props.disabledDate && props.disabledDate(cellDate)\n          row[j] = cell\n        }\n      }\n      return rows\n    })\n\n    watch(\n      () => props.date,\n      async () => {\n        if (tbodyRef.value?.contains(document.activeElement)) {\n          await nextTick()\n          currentCellRef.value?.focus()\n        }\n      }\n    )\n\n    const focus = () => {\n      currentCellRef.value?.focus()\n    }\n\n    const getCellStyle = (cell) => {\n      const style = {} as any\n      const year = props.date.year()\n      const today = new Date()\n      const month = cell.text\n\n      style.disabled = props.disabledDate\n        ? datesInMonth(year, month, lang.value).every(props.disabledDate)\n        : false\n      style.current =\n        castArray(props.parsedValue).findIndex(\n          (date) => date.year() === year && date.month() === month\n        ) >= 0\n      style.today = today.getFullYear() === year && today.getMonth() === month\n\n      if (cell.inRange) {\n        style['in-range'] = true\n\n        if (cell.start) {\n          style['start-date'] = true\n        }\n\n        if (cell.end) {\n          style['end-date'] = true\n        }\n      }\n      return style\n    }\n\n    const isSelectedCell = (cell) => {\n      const year = props.date.year()\n      const month = cell.text\n      return (\n        castArray(props.date).findIndex(\n          (date) => date.year() === year && date.month() === month\n        ) >= 0\n      )\n    }\n\n    const handleMouseMove = (event) => {\n      if (!props.rangeState.selecting) return\n\n      let target = event.target\n      if (target.tagName === 'A') {\n        target = target.parentNode.parentNode\n      }\n      if (target.tagName === 'DIV') {\n        target = target.parentNode\n      }\n      if (target.tagName !== 'TD') return\n\n      const row = target.parentNode.rowIndex\n      const column = target.cellIndex\n      // can not select disabled date\n      if (rows.value[row][column].disabled) return\n\n      // only update rangeState when mouse moves to a new cell\n      // this avoids frequent Date object creation and improves performance\n      if (row !== lastRow.value || column !== lastColumn.value) {\n        lastRow.value = row\n        lastColumn.value = column\n        ctx.emit('changerange', {\n          selecting: true,\n          endDate: props.date.startOf('year').month(row * 4 + column),\n        })\n      }\n    }\n    const handleMonthTableClick = (event) => {\n      let target = event.target\n      target = target?.closest('td')\n      if (target?.tagName !== 'TD') return\n      if (hasClass(target, 'disabled')) return\n      const column = target.cellIndex\n      const row = target.parentNode.rowIndex\n      const month = row * 4 + column\n      const newDate = props.date.startOf('year').month(month)\n      if (props.selectionMode === 'range') {\n        if (!props.rangeState.selecting) {\n          ctx.emit('pick', { minDate: newDate, maxDate: null })\n          ctx.emit('select', true)\n        } else {\n          if (newDate >= props.minDate) {\n            ctx.emit('pick', { minDate: props.minDate, maxDate: newDate })\n          } else {\n            ctx.emit('pick', { minDate: newDate, maxDate: props.minDate })\n          }\n          ctx.emit('select', false)\n        }\n      } else {\n        ctx.emit('pick', month)\n      }\n    }\n\n    return {\n      ns,\n      tbodyRef,\n      currentCellRef,\n      handleMouseMove,\n      handleMonthTableClick,\n      focus,\n      isSelectedCell,\n      rows,\n      getCellStyle,\n      t,\n      months,\n    }\n  },\n})\n</script>\n"],"names":["dayjs","rangeArr","defineComponent","basicMonthTableProps","useNamespace","useLocale","ref","computed","watch","nextTick","castArray","hasClass","_openBlock","_createElementBlock","_normalizeClass","_createElementVNode","_Fragment","_renderList","_withKeys","_withModifiers"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAwCA,MAAM,YAAe,GAAA,CAAC,IAAc,EAAA,KAAA,EAAe,IAAiB,KAAA;AAClE,EAAA,MAAM,QAAW,GAAAA,yBAAA,EAAQ,CAAA,MAAA,CAAO,IAAI,CAAA,CAAE,OAAQ,CAAA,OAAO,CAAE,CAAA,KAAA,CAAM,KAAK,CAAA,CAAE,KAAK,IAAI,CAAA,CAAA;AAC7E,EAAM,MAAA,SAAA,GAAY,SAAS,WAAY,EAAA,CAAA;AACvC,EAAA,OAAOC,kBAAS,CAAA,SAAS,CAAE,CAAA,GAAA,CAAI,CAAC,CAAA,KAAM,QAAS,CAAA,GAAA,CAAI,CAAG,EAAA,KAAK,CAAE,CAAA,MAAA,EAAQ,CAAA,CAAA;AACvE,CAAA,CAAA;AAEA,MAAK,YAAaC,mBAAa,CAAA;AAAA,EAC7B,KAAO,EAAAC,oCAAA;AAAA,EAEP,KAAO,EAAA,CAAC,aAAe,EAAA,MAAA,EAAQ,QAAQ,CAAA;AAAA,EACvC,MAAA,EAAQ,CAAC,OAAO,CAAA;AAAA,EAEhB,KAAA,CAAM,OAAO,GAAK,EAAA;AAChB,IAAM,MAAA,EAAA,GAAKC,mBAAa,aAAa,CAAA,CAAA;AAErC,IAAM,MAAA,EAAE,CAAG,EAAA,IAAA,EAAA,GAASC,iBAAU,EAAA,CAAA;AAC9B,IAAA,MAAM,WAAWC,OAAiB,EAAA,CAAA;AAClC,IAAA,MAAM,iBAAiBA,OAAiB,EAAA,CAAA;AACxC,IAAA,MAAM,SAASA,OACb,CAAA,KAAA,CAAM,IACH,CAAA,MAAA,CAAO,IAAI,CACX,CAAA,UAAA,EACA,CAAA,WAAA,GACA,GAAI,CAAA,CAAC,MAAM,CAAE,CAAA,WAAA,EAAa,CAC/B,CAAA,CAAA;AACA,IAAM,MAAA,SAAA,GAAYA,QAAI,CAAC,IAAI,EAAC,EAAG,EAAE,CAAC,CAAA,CAAA;AAClC,IAAM,MAAA,OAAA,GAAUA,QAAI,IAAI,CAAA,CAAA;AACxB,IAAM,MAAA,UAAA,GAAaA,QAAI,IAAI,CAAA,CAAA;AAC3B,IAAM,MAAA,IAAA,GAAOC,aAAS,MAAM;AAE1B,MAAA,IAAA,EAAM;AACN,MAAM,MAAA,KAAA,YAAc,CAAA;AAEpB,MAAA,MAAA,GAAS,GAAIP,yBAAO,EAAA,CAAA,MAAQ,CAAA,IAAA,CAAA,KAAA,CAAA,CAAA,OAAA,CAAA,OAAA,CAAA,CAAA;AAC1B,MAAA,KAAA,SAAY,EAAK,CAAA,GAAA,CAAA,EAAA,CAAA,EAAA,EAAA;AACjB,QAAA,MAAA,GAAS,GAAI,KAAO,CAAA,CAAA,CAAA,CAAA;AAClB,QAAA,KAAA,QAAW,CAAI,EAAA,CAAA,GAAA,CAAA,EAAA,CAAA,EAAA,EAAA;AACf,UAAA,IAAI,IAAO,GAAA,GAAA,CAAA,CAAA,CAAA,CAAA;AACT,UAAO,IAAA,CAAA,IAAA,EAAA;AAAA,YAAA,IACA,GAAA;AAAA,cACL,GAAQ,EAAA,CAAA;AAAA,cACR,MAAM,EAAA,CAAA;AAAA,cACN,IAAS,EAAA,QAAA;AAAA,cACT,OAAO,EAAA,KAAA;AAAA,cACP,KAAK,EAAA,KAAA;AAAA,cACP,GAAA,EAAA,KAAA;AAAA,aACF,CAAA;AAEA,WAAA;AAEA,UAAM,IAAA,CAAA,IAAA,GAAA,QAAgB,CAAA;AACtB,UAAA,MAAM,YAAgB,CAAA,GAAA,CAAA,CAAA;AAEtB,UAAM,MAAA,OAAA,GAAA,UACa,CAAA,OAAA,CAAA,MAAA,CAAA,CAAA,WAEhB,CAAA,CAAA;AAEH,UAAK,MAAA,UACI,GAAA,KAAA,CAAA,UACG,CAAA,OAAA,IAAA,KAAA,CAAA,OAAoB,IAAA,KAAS,CAAO,UAAA,CAC5C,SACA,IAAA,KAAA,CAAA,OAAuB,CAAA;AAM3B,UAAA,IAAI,CAAM,OAAA,GAAA,KAAuB,CAAA,OAAA,IAAA,OAAA,CAAA,aAAa,CAAA,KAAA,CAAA,OAAA,EAAA,OAAA,CAAA,IAAA,UAAA,IAAA,OAAA,CAAA,cAAA,CAAA,UAAA,EAAA,OAAA,CAAA,IAAA,KAAA,CAAA,OAAA,IAAA,OAAA,CAAA,cAAA,CAAA,KAAA,CAAA,OAAA,EAAA,OAAA,CAAA,IAAA,UAAA,IAAA,OAAA,CAAA,aAAA,CAAA,UAAA,EAAA,OAAA,CAAA,CAAA;AAC5C,UAAA,IAAA,CAAA,EAAK,GAAQ,KAAA,CAAA,OAAA,KAAA,IAAsB,GAAA,KAAA,CAAA,GAAO,gBAAmB,CAAA,UAAA,CAAA,EAAA;AAC7D,YAAA,IAAA,CAAK,QAAY,UAAA,IAAA,cAA0B,CAAA,mBAAsB,CAAA,CAAA;AAAA,YAC5D,IAAA,CAAA,GAAA,GAAA,KAAA,CAAA,OAAA,IAAA,OAAA,CAAA,MAAA,CAAA,KAAA,CAAA,OAAA,EAAA,OAAA,CAAA,CAAA;AACL,WAAA,MAAK;AACL,YAAA,IAAA,CAAK,KAAM,GAAA,KAAA,CAAA,OAAsB,IAAA,OAAA,CAAA,oBAA0B,EAAA,OAAA,CAAA,CAAA;AAAA,YAC7D,IAAA,CAAA,GAAA,GAAA,UAAA,IAAA,OAAA,CAAA,MAAA,CAAA,UAAA,EAAA,OAAA,CAAA,CAAA;AAEA,WAAM;AACN,UAAA,MAAa,OAAA,GAAA,GAAA,CAAA,MAAA,CAAA,OAAA,CAAA,CAAA;AACX,UAAA,IAAA,OAAY,EAAA;AAAA,YACd,IAAA,CAAA,IAAA,GAAA,OAAA,CAAA;AAEA,WAAA;AACA,UAAM,IAAA,CAAA,IAAA,GAAA,KAAW;AACjB,UAAA,MAAgB,QAAA,GAAA,OAAsB,CAAA,MAAA,EAAA,CAAA;AACtC,UAAA,IAAI,CAAK,QAAA,GAAA,KAAA,CAAA,YAAA,IAAA,KAAA,CAAA,YAAA,CAAA,QAAA,CAAA,CAAA;AAAA,UACX,GAAA,CAAA,CAAA,CAAA,GAAA,IAAA,CAAA;AAAA,SACF;AACA,OAAO;AAAA,MACR,OAAA,KAAA,CAAA;AAED,KACE,CAAA,CAAA;AAEE,IAAAQ,SAAA,CAAI,MAAS,KAAA,CAAA,IAAO,EAAS,YAAA;AAC3B,MAAA,IAAA,EAAA,EAAM,EAAS,CAAA;AACf,MAAA,IAAA,CAAA,EAAA,GAAA,cAAsB,KAAM,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,QAAA,CAAA,QAAA,CAAA,aAAA,CAAA,EAAA;AAAA,QAC9B,MAAAC,YAAA,EAAA,CAAA;AAAA,QAEJ,CAAA,EAAA,GAAA,cAAA,CAAA,KAAA,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAEA,OAAA;AACE,KAAA,CAAA,CAAA;AAA4B,IAC9B,MAAA,KAAA,GAAA,MAAA;AAEA,MAAM,IAAA,EAAA,CAAA;AACJ,MAAA,CAAA,EAAA,GAAM,cAAS,CAAA,KAAA,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AACf,KAAM,CAAA;AACN,IAAM,MAAA,eAAiB,CAAA,IAAA,KAAA;AACvB,MAAA,MAAM,QAAQ,EAAK,CAAA;AAEnB,MAAA,MAAM,IAAW,GAAA,KAAA,CAAA,IAAM,CACnB,IAAA,EAAA,CAAA;AAEJ,MAAA,MAAM,YACM,IAAA,EAAA,CAAA;AAGZ,MAAA,MAAM,QAAQ,IAAM,CAAA,IAAA,CAAA;AAEpB,MAAA,cAAkB,GAAA,KAAA,CAAA,YAAA,GAAA,YAAA,CAAA,IAAA,EAAA,KAAA,EAAA,IAAA,CAAA,KAAA,CAAA,CAAA,KAAA,CAAA,KAAA,CAAA,YAAA,CAAA,GAAA,KAAA,CAAA;AAChB,MAAA,KAAA,CAAA,OAAoB,GAAAC,gBAAA,CAAA,KAAA,CAAA,WAAA,CAAA,CAAA,SAAA,CAAA,CAAA,IAAA,KAAA,IAAA,CAAA,IAAA,EAAA,KAAA,IAAA,IAAA,IAAA,CAAA,KAAA,EAAA,KAAA,KAAA,CAAA,IAAA,CAAA,CAAA;AAEpB,MAAA,KAAA,CAAI,KAAK,GAAO,KAAA,CAAA,WAAA,EAAA,KAAA,IAAA,IAAA,KAAA,CAAA,QAAA,EAAA,KAAA,KAAA,CAAA;AACd,MAAA,IAAA,IAAA,CAAA,OAAsB,EAAA;AAAA,QACxB,KAAA,CAAA,UAAA,CAAA,GAAA,IAAA,CAAA;AAEA,QAAA,IAAI,KAAK,KAAK,EAAA;AACZ,UAAA,KAAA,CAAM,YAAc,CAAA,GAAA,IAAA,CAAA;AAAA,SACtB;AAAA,QACF,IAAA,IAAA,CAAA,GAAA,EAAA;AACA,UAAO,KAAA,CAAA,UAAA,CAAA,GAAA,IAAA,CAAA;AAAA,SACT;AAEA,OAAM;AACJ,MAAM,OAAA,KAAA,CAAO;AACb,KAAA,CAAA;AACA,IAAA,MAAA,cACY,GAAA,CAAA,IAAU;AAEf,MAET,MAAA,IAAA,GAAA,KAAA,CAAA,IAAA,CAAA,IAAA,EAAA,CAAA;AAEA,MAAM,MAAA,KAAA,GAAA,IAAA,CAAA,IAAmB,CAAU;AACjC,MAAI,uBAAkB,CAAA,KAAA,CAAA,IAAA,CAAA,CAAA,SAAA,CAAA,CAAA,IAAA,KAAA,IAAA,CAAA,IAAA,EAAA,KAAA,IAAA,IAAA,IAAA,CAAA,KAAA,EAAA,KAAA,KAAA,CAAA,IAAA,CAAA,CAAA;AAAW,KAAA,CAAA;AAEjC,IAAA,MAAI,eAAe,GAAA,CAAA,KAAA,KAAA;AACnB,MAAI,IAAA,CAAA,KAAA,CAAO,oBAAiB;AAC1B,QAAA,OAAA;AAA2B,MAC7B,IAAA,MAAA,GAAA,KAAA,CAAA,MAAA,CAAA;AACA,MAAI,IAAA,MAAA,CAAO,YAAY,GAAO,EAAA;AAC5B,QAAA,MAAA,GAAS,MAAO,CAAA,UAAA,CAAA,UAAA,CAAA;AAAA,OAClB;AACA,MAAA,IAAI,OAAO,OAAY,KAAA,KAAA,EAAA;AAAM,QAAA,MAAA,GAAA,MAAA,CAAA,UAAA,CAAA;AAE7B,OAAM;AACN,MAAA,IAAA,cAAsB,KAAA,IAAA;AAEtB,QAAI,OAAK;AAA6B,MAAA,MAAA,GAAA,GAAA,MAAA,CAAA,UAAA,CAAA,QAAA,CAAA;AAItC,MAAA,MAAY,MAAA,GAAA,MAAiB,CAAA,SAAA,CAAA;AAC3B,MAAA,IAAA,IAAA,CAAA,KAAgB,CAAA,GAAA,CAAA,CAAA,MAAA,CAAA,CAAA,QAAA;AAChB,QAAA,OAAA;AACA,MAAA,IAAA,QAAwB,OAAA,CAAA,KAAA,IAAA,MAAA,KAAA,UAAA,CAAA,KAAA,EAAA;AAAA,QAAA,OACX,CAAA,KAAA,GAAA,GAAA,CAAA;AAAA,QACX,UAAA,CAAS,QAAW,MAAA,CAAA;AAAsC,QAC5D,GAAC,CAAA,IAAA,CAAA,aAAA,EAAA;AAAA,UACH,SAAA,EAAA,IAAA;AAAA,UACF,OAAA,EAAA,KAAA,CAAA,IAAA,CAAA,OAAA,CAAA,MAAA,CAAA,CAAA,KAAA,CAAA,GAAA,GAAA,CAAA,GAAA,MAAA,CAAA;AACA,SAAM,CAAA,CAAA;AACJ,OAAA;AACA,KAAS,CAAA;AACT,IAAA,MAAI,qBAAoB,GAAA,CAAA,KAAA,KAAA;AAAM,MAAA,IAAA,MAAA,GAAA,KAAA,CAAA,MAAA,CAAA;AAC9B,MAAI,MAAA,GAAA,cAA2B,GAAA,KAAA,CAAA,GAAA,MAAA,CAAA,OAAA,CAAA,IAAA,CAAA,CAAA;AAAG,MAAA,IAAA,CAAA,MAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,MAAA,CAAA,OAAA,MAAA,IAAA;AAClC,QAAA;AACA,MAAM,IAAAC,cAAM,OAAO,EAAW,UAAA,CAAA;AAC9B,QAAM,OAAA;AACN,MAAA,MAAM,eAAgB,CAAA;AACtB,MAAI,MAAA,GAAA,oBAAiC,CAAA,QAAA,CAAA;AACnC,MAAI,MAAA,KAAO,GAAA,GAAA,GAAA,CAAA,GAAW,MAAW,CAAA;AAC/B,MAAA,MAAA,OAAS,GAAQ,KAAA,CAAA,YAAoB,CAAA,MAAA,CAAA,CAAA,KAAA,CAAA,MAAc,CAAC;AACpD,MAAI,IAAA,KAAA,CAAA,aAAe,KAAI,OAAA,EAAA;AAAA,QACzB,IAAO,CAAA,KAAA,CAAA,UAAA,CAAA,SAAA,EAAA;AACL,UAAI,GAAA,CAAA,IAAA,CAAA,MAAW,WAAe,EAAA,OAAA,EAAA,OAAA,EAAA,IAAA,EAAA,CAAA,CAAA;AAC5B,UAAI,GAAA,CAAA,IAAA,CAAA,UAAa,IAAE,CAAA,CAAA;AAA0C,SAAA,MACxD;AACL,UAAI,IAAA,OAAK,SAAU,CAAA,OAAA,EAAS;AAAiC,YAC/D,GAAA,CAAA,IAAA,CAAA,MAAA,EAAA,EAAA,OAAA,EAAA,KAAA,CAAA,OAAA,EAAA,OAAA,EAAA,OAAA,EAAA,CAAA,CAAA;AACA,WAAI,MAAA;AAAoB,YAC1B,GAAA,CAAA,IAAA,CAAA,MAAA,EAAA,EAAA,OAAA,EAAA,OAAA,EAAA,OAAA,EAAA,KAAA,CAAA,OAAA,EAAA,CAAA,CAAA;AAAA,WACK;AACL,UAAI,GAAA,CAAA,aAAkB,EAAA,KAAA,CAAA,CAAA;AAAA,SACxB;AAAA,OACF,MAAA;AAEA,QAAO,GAAA,CAAA,IAAA,CAAA,MAAA,EAAA,KAAA,CAAA,CAAA;AAAA,OACL;AAAA,KACA,CAAA;AAAA,IACA,OAAA;AAAA,MACA,EAAA;AAAA,MACA,QAAA;AAAA,MACA,cAAA;AAAA,MACA,eAAA;AAAA,MACA,qBAAA;AAAA,MACA,KAAA;AAAA,MACA,cAAA;AAAA,MACA,IAAA;AAAA,MACF,YAAA;AAAA,MACF,CAAA;AACF,MAAC,MAAA;;;AAnPU,CAAA,CAAA,CAAA;AAcO,MAAA,UAAA,GAAA,CAAA,YAAY,CAAA,CAAA;;mCAOpB,EAAA,YAAA,EAAA,UAAA,CAAA,CAAA;AAAA,MA3BD,UAAA,GAAA,EAAA,KAAA,EAAA,MAAA,EAAA,CAAA;AAAA,oBACS,CAAA,IAAA,EAAA,MAAA,EAAA,MAAA,EAAA,MAAA,EAAA,KAAA,EAAA,QAAA,EAAA;AAAA,EACb,OAAAC,aAAO,EAAA,EAAAC,sBAAI,CAAA,OAAA,EAAA;AAAA,IACX,YAAO;AAAA,IACP,cAAW,IAAA,CAAA,CAAA,CAAA,gCAAA,CAAA;AAAA,IAAA,KAAA,EAAAC,kBAAA,CAAA,IAAA,CAAA,EAAA,CAAA,CAAA,EAAA,CAAA;AAEZ,IAAA,OAAA,EAAA,MAAA,CAAA,CAAA,CAAA,WAAA,CAoBQ,CAAA,CAAA,GAAA,CAAA,GAAA,IAAA,KAAA,IAAA,CAAA,qBAAA,IAAA,IAAA,CAAA,qBAAA,CAAA,GAAA,IAAA,CAAA,CAAA;AAAA,IAAA,WAAA,EAAA,MAAA,CAAA,CAnBN,CAkBK,KAAA,MAAA,CAAA,CAAA,CAAA,GAAA,CAAA,GAAA,IAAA,KAAA,IAAA,CAAA,eAlBwB,IAAA,IAAA,CAAA,eAAT,CAAA,GAAA,IAAA,CAAA,CAAA;AAApB,GAAA,EAAA;AAAwC,IAAAC,sBAAA,CAAA,OAiBjC,EAAA,UAAA,EAAA;kDAAA,CAAAC,YAAA,EAAA,IAAA,EAAAC,cAAA,CAAA,IAAA,CAAA,IAAA,EAAA,CAAA,GAAA,EAAA,GAAA,KAAA;AAAA,QAAA,OAdGL,aAAA,EAAA,EAAAC,sBAAA,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,EAAA;AAAA,WAAAD,aAAA,CAAA,IAAA,CAAA,EAAAC,sBAAA,CAAAG,YAAA,EAAA,IAAA,EAAAC,cAAA,CAAA,GAAA,EAAA,CAAA,IAAA,EAAA,IAAA,KAAA;AACL,YAAA,OAAGL,aAAyB,EAAA,EAAAC,2BAA2B,EAAA;AAAA,cACvD,GAAA,EAAA,IAAO;AAAiB,cACxB,OAAA,EAAA,IAAA;AAAqC,cACrC,GAAY,EAAA,CAAA,EAAA,KAAA,IAAA,CAAA,cAAyB,CAAA,IAAA,CAAA,KAAA,IAAA,CAAA,cAAS,GAAA,EAAA,CAAA;AAAA,cAC9C,KAAA,EAAAC,oCAA6B,CAAA,IAAA,CAAA,CAAA;AAAA,cAC7B,eAAO,EAAA,CAAA,EAAA,IAAA,CAAA,cAAA,CAAA,IAAA,CAAA,CAAA,CAAA;AAAA,cAAA,YAAA,EAAA,IAAA,CAAA,CAAA,CAAA,CAAA,mBAAA,EAAA,CAAA,IAAA,CAAA,IAAA,GAAA,CAAA,CAAA,CAAA,CAAA;AAA0C,cAAA,QAAA,EAAA,IAAA,CAAA,cAAA,CAAA,IAAA,CAAA,GAAA,CAAA,GAAA,CAAA,CAAA;AACA,cAAA,SAAA,EAAA;;gBAM5C,MAAA,CAAA,CAAA,CAAA,KAAA,MAAA,CAAA,CAAA,CAAA,GAAAI,YAAA,CAAAC,iBAAA,CAAA,CAAA,GAAA,IAAA,KAAA,IAAA,CAAA,qBAAA,IAAA,IAAA,CAAA,qBAAA,CAAA,GAAA,IAAA,CAAA,EAAA,CAAA,SAAA,EAAA,MAAA,CAAA,CAAA,EAAA,CAAA,OAAA,CAAA,CAAA,CAAA;AAAA,eAHJ;AACiD,aAAA,EAAA;;;;;;;;;;;;;;;"}

package/lib/components/date-picker/src/date-picker-com/basic-year-table2.js

@@ -10,7 +10,8 @@ require('../../../../utils/index2.js');
 var basicYearTable = require('../props/basic-year-table2.js');
 var pluginVue_exportHelper = require('../../../../_virtual/plugin-vue_export-helper.js');
 var dateUtils = require('../../../time-picker/src/common/date-utils2.js');
-var index = require('../../../../hooks/use-locale/index2.js');
+var index = require('../../../../hooks/use-namespace/index2.js');
+var index$1 = require('../../../../hooks/use-locale/index2.js');
 var arrays = require('../../../../utils/arrays2.js');
 var style = require('../../../../utils/dom/style2.js');
 
@@ -29,7 +30,8 @@ const _sfc_main = vue.defineComponent({
   emits: ["pick"],
   expose: ["focus"],
   setup(props, ctx) {
-    const { t, lang } = index.useLocale();
+    const ns = index.useNamespace("year-table");
+    const { t, lang } = index$1.useLocale();
     const tbodyRef = vue.ref();
     const currentCellRef = vue.ref();
     const startYear = vue.computed(() => {
@@ -68,6 +70,7 @@ const _sfc_main = vue.defineComponent({
       }
     };
     return {
+      ns,
       t,
       tbodyRef,
       currentCellRef,
@@ -88,7 +91,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
   return vue.openBlock(), vue.createElementBlock("table", {
     role: "grid",
     "aria-label": _ctx.t("el.datepicker.yearTablePrompt"),
-    class: "el-year-table",
+    class: vue.normalizeClass(_ctx.ns.b()),
     onClick: _cache[2] || (_cache[2] = (...args) => _ctx.handleYearTableClick && _ctx.handleYearTableClick(...args))
   }, [
     vue.createElementVNode("tbody", _hoisted_2, [
@@ -117,7 +120,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
         ]);
       }), 64))
     ], 512)
-  ], 8, _hoisted_1);
+  ], 10, _hoisted_1);
 }
 var YearTable = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["render", _sfc_render], ["__file", "/home/runner/work/element-plus/element-plus/packages/components/date-picker/src/date-picker-com/basic-year-table.vue"]]);
 

package/lib/components/date-picker/src/date-picker-com/basic-year-table2.js.map

@@ -1 +1 @@
-{"version":3,"file":"basic-year-table2.js","sources":["../../../../../../../packages/components/date-picker/src/date-picker-com/basic-year-table.vue"],"sourcesContent":["<template>\n  <table\n    role=\"grid\"\n    :aria-label=\"t('el.datepicker.yearTablePrompt')\"\n    class=\"el-year-table\"\n    @click=\"handleYearTableClick\"\n  >\n    <tbody ref=\"tbodyRef\">\n      <tr v-for=\"(_, i) in 3\" :key=\"i\">\n        <template v-for=\"(__, j) in 4\" :key=\"i + '_' + j\">\n          <td\n            v-if=\"i * 4 + j < 10\"\n            :ref=\"\n              (el) =>\n                isSelectedCell(startYear + i * 4 + j) && (currentCellRef = el as HTMLElement)\n            \"\n            class=\"available\"\n            :class=\"getCellStyle(startYear + i * 4 + j)\"\n            :aria-selected=\"`${isSelectedCell(startYear + i * 4 + j)}`\"\n            :tabindex=\"isSelectedCell(startYear + i * 4 + j) ? 0 : -1\"\n            @keydown.space.prevent.stop=\"handleYearTableClick\"\n            @keydown.enter.prevent.stop=\"handleYearTableClick\"\n          >\n            <span class=\"cell\">{{ startYear + i * 4 + j }}</span>\n          </td>\n          <td v-else />\n        </template>\n      </tr>\n    </tbody>\n  </table>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, nextTick, ref, watch } from 'vue'\nimport dayjs from 'dayjs'\nimport { useLocale } from '@element-plus/hooks'\nimport { rangeArr } from '@element-plus/components/time-picker'\nimport { castArray, hasClass } from '@element-plus/utils'\nimport { basicYearTableProps } from '../props/basic-year-table'\n\nconst datesInYear = (year: number, lang: string) => {\n  const firstDay = dayjs(String(year)).locale(lang).startOf('year')\n  const lastDay = firstDay.endOf('year')\n  const numOfDays = lastDay.dayOfYear()\n  return rangeArr(numOfDays).map((n) => firstDay.add(n, 'day').toDate())\n}\n\nexport default defineComponent({\n  props: basicYearTableProps,\n\n  emits: ['pick'],\n  expose: ['focus'],\n\n  setup(props, ctx) {\n    const { t, lang } = useLocale()\n    const tbodyRef = ref<HTMLElement>()\n    const currentCellRef = ref<HTMLElement>()\n    const startYear = computed(() => {\n      return Math.floor(props.date.year() / 10) * 10\n    })\n\n    watch(\n      () => props.date,\n      async () => {\n        if (tbodyRef.value?.contains(document.activeElement)) {\n          await nextTick()\n          currentCellRef.value?.focus()\n        }\n      }\n    )\n\n    const focus = () => {\n      currentCellRef.value?.focus()\n    }\n\n    const getCellStyle = (year: number) => {\n      const style: Record<string, boolean> = {}\n      const today = dayjs().locale(lang.value)\n\n      style.disabled = props.disabledDate\n        ? datesInYear(year, lang.value).every(props.disabledDate)\n        : false\n\n      style.current =\n        castArray(props.parsedValue).findIndex((_) => _.year() === year) >= 0\n\n      style.today = today.year() === year\n\n      return style\n    }\n\n    const isSelectedCell = (year: number) => {\n      return (\n        (year === startYear.value &&\n          props.date.year() < startYear.value &&\n          props.date.year() > startYear.value + 9) ||\n        castArray(props.date).findIndex((date) => date.year() === year) >= 0\n      )\n    }\n\n    const handleYearTableClick = (event: MouseEvent | KeyboardEvent) => {\n      const clickTarget = event.target as HTMLDivElement\n      const target = clickTarget.closest('td')\n      if (target) {\n        if (hasClass((target as any).parentNode, 'disabled')) return\n        const year = target.textContent || target.innerText\n        ctx.emit('pick', Number(year))\n      }\n    }\n    return {\n      t,\n      tbodyRef,\n      currentCellRef,\n      startYear,\n      focus,\n      isSelectedCell,\n      getCellStyle,\n      handleYearTableClick,\n    }\n  },\n})\n</script>\n"],"names":["dayjs","rangeArr","defineComponent","basicYearTableProps","useLocale","ref","computed","watch","nextTick","castArray","hasClass","_createElementBlock","_openBlock","_Fragment","_renderList","_normalizeClass","_withKeys","_withModifiers","_createElementVNode","_toDisplayString"],"mappings":"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"}
+{"version":3,"file":"basic-year-table2.js","sources":["../../../../../../../packages/components/date-picker/src/date-picker-com/basic-year-table.vue"],"sourcesContent":["<template>\n  <table\n    role=\"grid\"\n    :aria-label=\"t('el.datepicker.yearTablePrompt')\"\n    :class=\"ns.b()\"\n    @click=\"handleYearTableClick\"\n  >\n    <tbody ref=\"tbodyRef\">\n      <tr v-for=\"(_, i) in 3\" :key=\"i\">\n        <template v-for=\"(__, j) in 4\" :key=\"i + '_' + j\">\n          <td\n            v-if=\"i * 4 + j < 10\"\n            :ref=\"\n              (el) =>\n                isSelectedCell(startYear + i * 4 + j) && (currentCellRef = el as HTMLElement)\n            \"\n            class=\"available\"\n            :class=\"getCellStyle(startYear + i * 4 + j)\"\n            :aria-selected=\"`${isSelectedCell(startYear + i * 4 + j)}`\"\n            :tabindex=\"isSelectedCell(startYear + i * 4 + j) ? 0 : -1\"\n            @keydown.space.prevent.stop=\"handleYearTableClick\"\n            @keydown.enter.prevent.stop=\"handleYearTableClick\"\n          >\n            <span class=\"cell\">{{ startYear + i * 4 + j }}</span>\n          </td>\n          <td v-else />\n        </template>\n      </tr>\n    </tbody>\n  </table>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, nextTick, ref, watch } from 'vue'\nimport dayjs from 'dayjs'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { rangeArr } from '@element-plus/components/time-picker'\nimport { castArray, hasClass } from '@element-plus/utils'\nimport { basicYearTableProps } from '../props/basic-year-table'\n\nconst datesInYear = (year: number, lang: string) => {\n  const firstDay = dayjs(String(year)).locale(lang).startOf('year')\n  const lastDay = firstDay.endOf('year')\n  const numOfDays = lastDay.dayOfYear()\n  return rangeArr(numOfDays).map((n) => firstDay.add(n, 'day').toDate())\n}\n\nexport default defineComponent({\n  props: basicYearTableProps,\n\n  emits: ['pick'],\n  expose: ['focus'],\n\n  setup(props, ctx) {\n    const ns = useNamespace('year-table')\n\n    const { t, lang } = useLocale()\n    const tbodyRef = ref<HTMLElement>()\n    const currentCellRef = ref<HTMLElement>()\n    const startYear = computed(() => {\n      return Math.floor(props.date.year() / 10) * 10\n    })\n\n    watch(\n      () => props.date,\n      async () => {\n        if (tbodyRef.value?.contains(document.activeElement)) {\n          await nextTick()\n          currentCellRef.value?.focus()\n        }\n      }\n    )\n\n    const focus = () => {\n      currentCellRef.value?.focus()\n    }\n\n    const getCellStyle = (year: number) => {\n      const style: Record<string, boolean> = {}\n      const today = dayjs().locale(lang.value)\n\n      style.disabled = props.disabledDate\n        ? datesInYear(year, lang.value).every(props.disabledDate)\n        : false\n\n      style.current =\n        castArray(props.parsedValue).findIndex((_) => _.year() === year) >= 0\n\n      style.today = today.year() === year\n\n      return style\n    }\n\n    const isSelectedCell = (year: number) => {\n      return (\n        (year === startYear.value &&\n          props.date.year() < startYear.value &&\n          props.date.year() > startYear.value + 9) ||\n        castArray(props.date).findIndex((date) => date.year() === year) >= 0\n      )\n    }\n\n    const handleYearTableClick = (event: MouseEvent | KeyboardEvent) => {\n      const clickTarget = event.target as HTMLDivElement\n      const target = clickTarget.closest('td')\n      if (target) {\n        if (hasClass((target as any).parentNode, 'disabled')) return\n        const year = target.textContent || target.innerText\n        ctx.emit('pick', Number(year))\n      }\n    }\n    return {\n      ns,\n      t,\n      tbodyRef,\n      currentCellRef,\n      startYear,\n      focus,\n      isSelectedCell,\n      getCellStyle,\n      handleYearTableClick,\n    }\n  },\n})\n</script>\n"],"names":["dayjs","rangeArr","defineComponent","basicYearTableProps","useNamespace","useLocale","ref","computed","watch","nextTick","castArray","hasClass","_createElementBlock","_normalizeClass","_openBlock","_Fragment","_renderList","_withKeys","_withModifiers","_createElementVNode","_toDisplayString"],"mappings":"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"}

package/lib/components/date-picker/src/date-picker-com/panel-date-pick2.js

@@ -21,7 +21,8 @@ var basicYearTable = require('./basic-year-table2.js');
 var pluginVue_exportHelper = require('../../../../_virtual/plugin-vue_export-helper.js');
 var panelTimePick = require('../../../time-picker/src/time-picker-com/panel-time-pick2.js');
 var index$3 = require('../../../../directives/click-outside/index2.js');
-var index$4 = require('../../../../hooks/use-locale/index2.js');
+var index$4 = require('../../../../hooks/use-namespace/index2.js');
+var index$5 = require('../../../../hooks/use-locale/index2.js');
 var tokens = require('../../../tooltip/src/tokens2.js');
 var dateUtils = require('../../../time-picker/src/common/date-utils2.js');
 var aria = require('../../../../constants/aria2.js');
@@ -50,7 +51,9 @@ const _sfc_main = vue.defineComponent({
   props: panelDatePick.panelDatePickProps,
   emits: ["pick", "set-picker-option", "panel-change"],
   setup(props, ctx) {
-    const { t, lang } = index$4.useLocale();
+    const ppNs = index$4.useNamespace("picker-panel");
+    const dpNs = index$4.useNamespace("date-picker");
+    const { t, lang } = index$5.useLocale();
     const pickerBase = vue.inject("EP_PICKER_BASE");
     const popper = vue.inject(tokens.TOOLTIP_INJECTION_KEY);
     const {
@@ -425,6 +428,8 @@ const _sfc_main = vue.defineComponent({
       }
     }, { immediate: true });
     return {
+      ppNs,
+      dpNs,
       currentViewRef,
       handleTimePick,
       handleTimePickClose,
@@ -466,26 +471,11 @@ const _sfc_main = vue.defineComponent({
     };
   }
 });
-const _hoisted_1 = { class: "el-picker-panel__body-wrapper" };
-const _hoisted_2 = {
-  key: 0,
-  class: "el-picker-panel__sidebar"
-};
-const _hoisted_3 = ["onClick"];
-const _hoisted_4 = { class: "el-picker-panel__body" };
-const _hoisted_5 = {
-  key: 0,
-  class: "el-date-picker__time-header"
-};
-const _hoisted_6 = { class: "el-date-picker__editor-wrap" };
-const _hoisted_7 = { class: "el-date-picker__editor-wrap" };
-const _hoisted_8 = { class: "el-date-picker__prev-btn" };
-const _hoisted_9 = ["aria-label"];
-const _hoisted_10 = ["aria-label"];
-const _hoisted_11 = { class: "el-date-picker__next-btn" };
-const _hoisted_12 = ["aria-label"];
-const _hoisted_13 = ["aria-label"];
-const _hoisted_14 = { class: "el-picker-panel__footer" };
+const _hoisted_1 = ["onClick"];
+const _hoisted_2 = ["aria-label"];
+const _hoisted_3 = ["aria-label"];
+const _hoisted_4 = ["aria-label"];
+const _hoisted_5 = ["aria-label"];
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_input = vue.resolveComponent("el-input");
   const _component_time_pick_panel = vue.resolveComponent("time-pick-panel");
@@ -500,28 +490,44 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_button = vue.resolveComponent("el-button");
   const _directive_clickoutside = vue.resolveDirective("clickoutside");
   return vue.openBlock(), vue.createElementBlock("div", {
-    class: vue.normalizeClass(["el-picker-panel el-date-picker", [
+    class: vue.normalizeClass([
+      _ctx.ppNs.b(),
+      _ctx.dpNs.b(),
       {
         "has-sidebar": _ctx.$slots.sidebar || _ctx.hasShortcuts,
         "has-time": _ctx.showTime
       }
-    ]])
+    ])
   }, [
-    vue.createElementVNode("div", _hoisted_1, [
-      vue.renderSlot(_ctx.$slots, "sidebar", { class: "el-picker-panel__sidebar" }),
-      _ctx.hasShortcuts ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, [
+    vue.createElementVNode("div", {
+      class: vue.normalizeClass(_ctx.ppNs.e("body-wrapper"))
+    }, [
+      vue.renderSlot(_ctx.$slots, "sidebar", {
+        class: vue.normalizeClass(_ctx.ppNs.e("sidebar"))
+      }),
+      _ctx.hasShortcuts ? (vue.openBlock(), vue.createElementBlock("div", {
+        key: 0,
+        class: vue.normalizeClass(_ctx.ppNs.e("sidebar"))
+      }, [
         (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.shortcuts, (shortcut, key) => {
           return vue.openBlock(), vue.createElementBlock("button", {
             key,
             type: "button",
-            class: "el-picker-panel__shortcut",
+            class: vue.normalizeClass(_ctx.ppNs.e("shortcut")),
             onClick: ($event) => _ctx.handleShortcutClick(shortcut)
-          }, vue.toDisplayString(shortcut.text), 9, _hoisted_3);
+          }, vue.toDisplayString(shortcut.text), 11, _hoisted_1);
         }), 128))
-      ])) : vue.createCommentVNode("v-if", true),
-      vue.createElementVNode("div", _hoisted_4, [
-        _ctx.showTime ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5, [
-          vue.createElementVNode("span", _hoisted_6, [
+      ], 2)) : vue.createCommentVNode("v-if", true),
+      vue.createElementVNode("div", {
+        class: vue.normalizeClass(_ctx.ppNs.e("body"))
+      }, [
+        _ctx.showTime ? (vue.openBlock(), vue.createElementBlock("div", {
+          key: 0,
+          class: vue.normalizeClass(_ctx.dpNs.e("time-header"))
+        }, [
+          vue.createElementVNode("span", {
+            class: vue.normalizeClass(_ctx.dpNs.e("editor-wrap"))
+          }, [
             vue.createVNode(_component_el_input, {
               placeholder: _ctx.t("el.datepicker.selectDate"),
               "model-value": _ctx.visibleDate,
@@ -529,8 +535,10 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
               onInput: _cache[0] || (_cache[0] = (val) => _ctx.userInputDate = val),
               onChange: _ctx.handleVisibleDateChange
             }, null, 8, ["placeholder", "model-value", "onChange"])
-          ]),
-          vue.withDirectives((vue.openBlock(), vue.createElementBlock("span", _hoisted_7, [
+          ], 2),
+          vue.withDirectives((vue.openBlock(), vue.createElementBlock("span", {
+            class: vue.normalizeClass(_ctx.dpNs.e("editor-wrap"))
+          }, [
             vue.createVNode(_component_el_input, {
               placeholder: _ctx.t("el.datepicker.selectTime"),
               "model-value": _ctx.visibleTime,
@@ -546,20 +554,23 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
               "parsed-value": _ctx.innerDate,
               onPick: _ctx.handleTimePick
             }, null, 8, ["visible", "format", "time-arrow-control", "parsed-value", "onPick"])
-          ])), [
+          ], 2)), [
             [_directive_clickoutside, _ctx.handleTimePickClose]
           ])
-        ])) : vue.createCommentVNode("v-if", true),
+        ], 2)) : vue.createCommentVNode("v-if", true),
         vue.withDirectives(vue.createElementVNode("div", {
-          class: vue.normalizeClass(["el-date-picker__header", {
-            "el-date-picker__header--bordered": _ctx.currentView === "year" || _ctx.currentView === "month"
-          }])
+          class: vue.normalizeClass([
+            _ctx.dpNs.e("header"),
+            (_ctx.currentView === "year" || _ctx.currentView === "month") && _ctx.dpNs.e("header--bordered")
+          ])
         }, [
-          vue.createElementVNode("span", _hoisted_8, [
+          vue.createElementVNode("span", {
+            class: vue.normalizeClass(_ctx.dpNs.e("prev-btn"))
+          }, [
             vue.createElementVNode("button", {
               type: "button",
               "aria-label": _ctx.t(`el.datepicker.prevYear`),
-              class: "el-picker-panel__icon-btn d-arrow-left",
+              class: vue.normalizeClass(["d-arrow-left", _ctx.ppNs.e("icon-btn")]),
               onClick: _cache[2] || (_cache[2] = (...args) => _ctx.prevYear_ && _ctx.prevYear_(...args))
             }, [
               vue.createVNode(_component_el_icon, null, {
@@ -568,11 +579,11 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
                 ]),
                 _: 1
               })
-            ], 8, _hoisted_9),
+            ], 10, _hoisted_2),
             vue.withDirectives(vue.createElementVNode("button", {
               type: "button",
               "aria-label": _ctx.t(`el.datepicker.prevMonth`),
-              class: "el-picker-panel__icon-btn arrow-left",
+              class: vue.normalizeClass([_ctx.ppNs.e("icon-btn"), "arrow-left"]),
               onClick: _cache[3] || (_cache[3] = (...args) => _ctx.prevMonth_ && _ctx.prevMonth_(...args))
             }, [
               vue.createVNode(_component_el_icon, null, {
@@ -581,33 +592,38 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
                 ]),
                 _: 1
               })
-            ], 8, _hoisted_10), [
+            ], 10, _hoisted_3), [
               [vue.vShow, _ctx.currentView === "date"]
             ])
-          ]),
+          ], 2),
           vue.createElementVNode("span", {
             role: "button",
-            class: "el-date-picker__header-label",
+            class: vue.normalizeClass(_ctx.dpNs.e("header-label")),
             "aria-live": "polite",
             tabindex: "0",
             onKeydown: _cache[4] || (_cache[4] = vue.withKeys((...args) => _ctx.showYearPicker && _ctx.showYearPicker(...args), ["enter"])),
             onClick: _cache[5] || (_cache[5] = (...args) => _ctx.showYearPicker && _ctx.showYearPicker(...args))
-          }, vue.toDisplayString(_ctx.yearLabel), 33),
+          }, vue.toDisplayString(_ctx.yearLabel), 35),
           vue.withDirectives(vue.createElementVNode("span", {
             role: "button",
-            class: vue.normalizeClass(["el-date-picker__header-label", { active: _ctx.currentView === "month" }]),
             "aria-live": "polite",
             tabindex: "0",
+            class: vue.normalizeClass([
+              _ctx.dpNs.e("header-label"),
+              { active: _ctx.currentView === "month" }
+            ]),
             onKeydown: _cache[6] || (_cache[6] = vue.withKeys((...args) => _ctx.showMonthPicker && _ctx.showMonthPicker(...args), ["enter"])),
             onClick: _cache[7] || (_cache[7] = (...args) => _ctx.showMonthPicker && _ctx.showMonthPicker(...args))
           }, vue.toDisplayString(_ctx.t(`el.datepicker.month${_ctx.month + 1}`)), 35), [
             [vue.vShow, _ctx.currentView === "date"]
           ]),
-          vue.createElementVNode("span", _hoisted_11, [
+          vue.createElementVNode("span", {
+            class: vue.normalizeClass(_ctx.dpNs.e("next-btn"))
+          }, [
             vue.withDirectives(vue.createElementVNode("button", {
               type: "button",
               "aria-label": _ctx.t(`el.datepicker.nextMonth`),
-              class: "el-picker-panel__icon-btn arrow-right",
+              class: vue.normalizeClass([_ctx.ppNs.e("icon-btn"), "arrow-right"]),
               onClick: _cache[8] || (_cache[8] = (...args) => _ctx.nextMonth_ && _ctx.nextMonth_(...args))
             }, [
               vue.createVNode(_component_el_icon, null, {
@@ -616,13 +632,13 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
                 ]),
                 _: 1
               })
-            ], 8, _hoisted_12), [
+            ], 10, _hoisted_4), [
               [vue.vShow, _ctx.currentView === "date"]
             ]),
             vue.createElementVNode("button", {
               type: "button",
               "aria-label": _ctx.t(`el.datepicker.nextYear`),
-              class: "el-picker-panel__icon-btn d-arrow-right",
+              class: vue.normalizeClass([_ctx.ppNs.e("icon-btn"), "d-arrow-right"]),
               onClick: _cache[9] || (_cache[9] = (...args) => _ctx.nextYear_ && _ctx.nextYear_(...args))
             }, [
               vue.createVNode(_component_el_icon, null, {
@@ -631,13 +647,13 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
                 ]),
                 _: 1
               })
-            ], 8, _hoisted_13)
-          ])
+            ], 10, _hoisted_5)
+          ], 2)
         ], 2), [
           [vue.vShow, _ctx.currentView !== "time"]
         ]),
         vue.createElementVNode("div", {
-          class: "el-picker-panel__content",
+          class: vue.normalizeClass(_ctx.ppNs.e("content")),
           onKeydown: _cache[10] || (_cache[10] = (...args) => _ctx.handleKeydownTable && _ctx.handleKeydownTable(...args))
         }, [
           _ctx.currentView === "date" ? (vue.openBlock(), vue.createBlock(_component_date_table, {
@@ -666,35 +682,37 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
             "disabled-date": _ctx.disabledDate,
             onPick: _ctx.handleMonthPick
           }, null, 8, ["date", "parsed-value", "disabled-date", "onPick"])) : vue.createCommentVNode("v-if", true)
-        ], 32)
-      ])
-    ]),
-    vue.withDirectives(vue.createElementVNode("div", _hoisted_14, [
+        ], 34)
+      ], 2)
+    ], 2),
+    vue.withDirectives(vue.createElementVNode("div", {
+      class: vue.normalizeClass(_ctx.ppNs.e("footer"))
+    }, [
       vue.withDirectives(vue.createVNode(_component_el_button, {
         text: "",
         size: "small",
-        class: "el-picker-panel__link-btn",
+        class: vue.normalizeClass(_ctx.ppNs.e("link-btn")),
         onClick: _ctx.changeToNow
       }, {
         default: vue.withCtx(() => [
           vue.createTextVNode(vue.toDisplayString(_ctx.t("el.datepicker.now")), 1)
         ]),
         _: 1
-      }, 8, ["onClick"]), [
+      }, 8, ["class", "onClick"]), [
         [vue.vShow, _ctx.selectionMode !== "dates"]
       ]),
       vue.createVNode(_component_el_button, {
         plain: "",
         size: "small",
-        class: "el-picker-panel__link-btn",
+        class: vue.normalizeClass(_ctx.ppNs.e("link-btn")),
         onClick: _ctx.onConfirm
       }, {
         default: vue.withCtx(() => [
           vue.createTextVNode(vue.toDisplayString(_ctx.t("el.datepicker.confirm")), 1)
         ]),
         _: 1
-      }, 8, ["onClick"])
-    ], 512), [
+      }, 8, ["class", "onClick"])
+    ], 2), [
       [vue.vShow, _ctx.footerVisible && _ctx.currentView === "date"]
     ])
   ], 2);