element-plus 1.2.0-beta.3 → 1.2.0-beta.4

package/lib/components/color-picker/src/index.vue_vue_type_template_id_46a474d5_lang.js

@@ -0,0 +1,152 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+
+const _hoisted_1 = { class: "el-color-dropdown__main-wrapper" };
+const _hoisted_2 = { class: "el-color-dropdown__btns" };
+const _hoisted_3 = { class: "el-color-dropdown__value" };
+const _hoisted_4 = {
+  key: 0,
+  class: "el-color-picker__mask"
+};
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_hue_slider = vue.resolveComponent("hue-slider");
+  const _component_sv_panel = vue.resolveComponent("sv-panel");
+  const _component_alpha_slider = vue.resolveComponent("alpha-slider");
+  const _component_predefine = vue.resolveComponent("predefine");
+  const _component_el_input = vue.resolveComponent("el-input");
+  const _component_el_button = vue.resolveComponent("el-button");
+  const _component_close = vue.resolveComponent("close");
+  const _component_el_icon = vue.resolveComponent("el-icon");
+  const _component_arrow_down = vue.resolveComponent("arrow-down");
+  const _component_el_popper = vue.resolveComponent("el-popper");
+  const _directive_click_outside = vue.resolveDirective("click-outside");
+  return vue.openBlock(), vue.createBlock(_component_el_popper, {
+    ref: "popper",
+    visible: _ctx.showPicker,
+    "onUpdate:visible": _cache[2] || (_cache[2] = ($event) => _ctx.showPicker = $event),
+    effect: _ctx.Effect.LIGHT,
+    "manual-mode": "",
+    trigger: "click",
+    "show-arrow": false,
+    "fallback-placements": ["bottom", "top", "right", "left"],
+    offset: 0,
+    transition: "el-zoom-in-top",
+    "gpu-acceleration": false,
+    "popper-class": `el-color-picker__panel el-color-dropdown ${_ctx.popperClass}`,
+    "stop-popper-mouse-event": false
+  }, {
+    default: vue.withCtx(() => [
+      vue.withDirectives(vue.createElementVNode("div", null, [
+        vue.createElementVNode("div", _hoisted_1, [
+          vue.createVNode(_component_hue_slider, {
+            ref: "hue",
+            class: "hue-slider",
+            color: _ctx.color,
+            vertical: ""
+          }, null, 8, ["color"]),
+          vue.createVNode(_component_sv_panel, {
+            ref: "svPanel",
+            color: _ctx.color
+          }, null, 8, ["color"])
+        ]),
+        _ctx.showAlpha ? (vue.openBlock(), vue.createBlock(_component_alpha_slider, {
+          key: 0,
+          ref: "alpha",
+          color: _ctx.color
+        }, null, 8, ["color"])) : vue.createCommentVNode("v-if", true),
+        _ctx.predefine ? (vue.openBlock(), vue.createBlock(_component_predefine, {
+          key: 1,
+          ref: "predefine",
+          color: _ctx.color,
+          colors: _ctx.predefine
+        }, null, 8, ["color", "colors"])) : vue.createCommentVNode("v-if", true),
+        vue.createElementVNode("div", _hoisted_2, [
+          vue.createElementVNode("span", _hoisted_3, [
+            vue.createVNode(_component_el_input, {
+              modelValue: _ctx.customInput,
+              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.customInput = $event),
+              "validate-event": false,
+              size: "mini",
+              onKeyup: vue.withKeys(_ctx.handleConfirm, ["enter"]),
+              onBlur: _ctx.handleConfirm
+            }, null, 8, ["modelValue", "onKeyup", "onBlur"])
+          ]),
+          vue.createVNode(_component_el_button, {
+            size: "mini",
+            type: "text",
+            class: "el-color-dropdown__link-btn",
+            onClick: _ctx.clear
+          }, {
+            default: vue.withCtx(() => [
+              vue.createTextVNode(vue.toDisplayString(_ctx.t("el.colorpicker.clear")), 1)
+            ]),
+            _: 1
+          }, 8, ["onClick"]),
+          vue.createVNode(_component_el_button, {
+            plain: "",
+            size: "mini",
+            class: "el-color-dropdown__btn",
+            onClick: _ctx.confirmValue
+          }, {
+            default: vue.withCtx(() => [
+              vue.createTextVNode(vue.toDisplayString(_ctx.t("el.colorpicker.confirm")), 1)
+            ]),
+            _: 1
+          }, 8, ["onClick"])
+        ])
+      ], 512), [
+        [_directive_click_outside, _ctx.hide]
+      ])
+    ]),
+    trigger: vue.withCtx(() => [
+      vue.createElementVNode("div", {
+        class: vue.normalizeClass([
+          "el-color-picker",
+          _ctx.colorDisabled ? "is-disabled" : "",
+          _ctx.colorSize ? `el-color-picker--${_ctx.colorSize}` : ""
+        ])
+      }, [
+        _ctx.colorDisabled ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4)) : vue.createCommentVNode("v-if", true),
+        vue.createElementVNode("div", {
+          class: "el-color-picker__trigger",
+          onClick: _cache[1] || (_cache[1] = (...args) => _ctx.handleTrigger && _ctx.handleTrigger(...args))
+        }, [
+          vue.createElementVNode("span", {
+            class: vue.normalizeClass(["el-color-picker__color", { "is-alpha": _ctx.showAlpha }])
+          }, [
+            vue.createElementVNode("span", {
+              class: "el-color-picker__color-inner",
+              style: vue.normalizeStyle({
+                backgroundColor: _ctx.displayedColor
+              })
+            }, null, 4),
+            !_ctx.modelValue && !_ctx.showPanelColor ? (vue.openBlock(), vue.createBlock(_component_el_icon, {
+              key: 0,
+              class: "el-color-picker__empty is-icon-close"
+            }, {
+              default: vue.withCtx(() => [
+                vue.createVNode(_component_close)
+              ]),
+              _: 1
+            })) : vue.createCommentVNode("v-if", true)
+          ], 2),
+          vue.withDirectives(vue.createVNode(_component_el_icon, { class: "el-color-picker__icon is-icon-arrow-down" }, {
+            default: vue.withCtx(() => [
+              vue.createVNode(_component_arrow_down)
+            ]),
+            _: 1
+          }, 512), [
+            [vue.vShow, _ctx.modelValue || _ctx.showPanelColor]
+          ])
+        ])
+      ], 2)
+    ]),
+    _: 1
+  }, 8, ["visible", "effect", "popper-class"]);
+}
+
+exports.render = render;
+//# sourceMappingURL=index.vue_vue_type_template_id_46a474d5_lang.js.map

package/lib/components/color-picker/src/index.vue_vue_type_template_id_46a474d5_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.vue_vue_type_template_id_46a474d5_lang.js","sources":["../../../../../../packages/components/color-picker/src/index.vue?vue&type=template&id=46a474d5&lang.js"],"sourcesContent":["<template>\n  <el-popper\n    ref=\"popper\"\n    v-model:visible=\"showPicker\"\n    :effect=\"Effect.LIGHT\"\n    manual-mode\n    trigger=\"click\"\n    :show-arrow=\"false\"\n    :fallback-placements=\"['bottom', 'top', 'right', 'left']\"\n    :offset=\"0\"\n    transition=\"el-zoom-in-top\"\n    :gpu-acceleration=\"false\"\n    :popper-class=\"`el-color-picker__panel el-color-dropdown ${popperClass}`\"\n    :stop-popper-mouse-event=\"false\"\n  >\n    <template #default>\n      <div v-click-outside=\"hide\">\n        <div class=\"el-color-dropdown__main-wrapper\">\n          <hue-slider ref=\"hue\" class=\"hue-slider\" :color=\"color\" vertical />\n          <sv-panel ref=\"svPanel\" :color=\"color\" />\n        </div>\n        <alpha-slider v-if=\"showAlpha\" ref=\"alpha\" :color=\"color\" />\n        <predefine\n          v-if=\"predefine\"\n          ref=\"predefine\"\n          :color=\"color\"\n          :colors=\"predefine\"\n        />\n        <div class=\"el-color-dropdown__btns\">\n          <span class=\"el-color-dropdown__value\">\n            <el-input\n              v-model=\"customInput\"\n              :validate-event=\"false\"\n              size=\"mini\"\n              @keyup.enter=\"handleConfirm\"\n              @blur=\"handleConfirm\"\n            />\n          </span>\n          <el-button\n            size=\"mini\"\n            type=\"text\"\n            class=\"el-color-dropdown__link-btn\"\n            @click=\"clear\"\n          >\n            {{ t('el.colorpicker.clear') }}\n          </el-button>\n          <el-button\n            plain\n            size=\"mini\"\n            class=\"el-color-dropdown__btn\"\n            @click=\"confirmValue\"\n          >\n            {{ t('el.colorpicker.confirm') }}\n          </el-button>\n        </div>\n      </div>\n    </template>\n    <template #trigger>\n      <div\n        :class=\"[\n          'el-color-picker',\n          colorDisabled ? 'is-disabled' : '',\n          colorSize ? `el-color-picker--${colorSize}` : '',\n        ]\"\n      >\n        <div v-if=\"colorDisabled\" class=\"el-color-picker__mask\"></div>\n        <div class=\"el-color-picker__trigger\" @click=\"handleTrigger\">\n          <span\n            class=\"el-color-picker__color\"\n            :class=\"{ 'is-alpha': showAlpha }\"\n          >\n            <span\n              class=\"el-color-picker__color-inner\"\n              :style=\"{\n                backgroundColor: displayedColor,\n              }\"\n            ></span>\n            <el-icon\n              v-if=\"!modelValue && !showPanelColor\"\n              class=\"el-color-picker__empty is-icon-close\"\n            >\n              <close />\n            </el-icon>\n          </span>\n          <el-icon\n            v-show=\"modelValue || showPanelColor\"\n            class=\"el-color-picker__icon is-icon-arrow-down\"\n          >\n            <arrow-down />\n          </el-icon>\n        </div>\n      </div>\n    </template>\n  </el-popper>\n</template>\n\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  inject,\n  nextTick,\n  onMounted,\n  provide,\n  reactive,\n  ref,\n  watch,\n} from 'vue'\nimport debounce from 'lodash/debounce'\nimport ElButton from '@element-plus/components/button'\nimport ElIcon from '@element-plus/components/icon'\nimport { ClickOutside } from '@element-plus/directives'\nimport { elFormItemKey, elFormKey } from '@element-plus/tokens'\nimport { useLocaleInject } from '@element-plus/hooks'\nimport ElPopper, { Effect } from '@element-plus/components/popper'\nimport ElInput from '@element-plus/components/input'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { useGlobalConfig } from '@element-plus/utils/util'\nimport { isValidComponentSize } from '@element-plus/utils/validators'\nimport { Close, ArrowDown } from '@element-plus/icons'\nimport AlphaSlider from './components/alpha-slider.vue'\nimport HueSlider from './components/hue-slider.vue'\nimport Predefine from './components/predefine.vue'\nimport SvPanel from './components/sv-panel.vue'\nimport Color from './color'\nimport { OPTIONS_KEY } from './useOption'\n\nimport type { PropType } from 'vue'\nimport type { ElFormContext, ElFormItemContext } from '@element-plus/tokens'\nimport type { ComponentSize } from '@element-plus/utils/types'\nimport type { IUseOptions } from './useOption'\n\nexport default defineComponent({\n  name: 'ElColorPicker',\n  components: {\n    ElButton,\n    ElPopper,\n    ElInput,\n    ElIcon,\n    Close,\n    ArrowDown,\n    SvPanel,\n    HueSlider,\n    AlphaSlider,\n    Predefine,\n  },\n  directives: {\n    ClickOutside,\n  },\n  props: {\n    modelValue: String,\n    showAlpha: Boolean,\n    colorFormat: String,\n    disabled: Boolean,\n    size: {\n      type: String as PropType<ComponentSize>,\n      validator: isValidComponentSize,\n    },\n    popperClass: String,\n    predefine: Array,\n  },\n  emits: ['change', 'active-change', UPDATE_MODEL_EVENT],\n  setup(props, { emit }) {\n    const ELEMENT = useGlobalConfig()\n    const { t } = useLocaleInject()\n    const elForm = inject(elFormKey, {} as ElFormContext)\n    const elFormItem = inject(elFormItemKey, {} as ElFormItemContext)\n\n    const hue = ref(null)\n    const svPanel = ref(null)\n    const alpha = ref(null)\n    const popper = ref(null)\n    // data\n    const color = reactive(\n      new Color({\n        enableAlpha: props.showAlpha,\n        format: props.colorFormat,\n      })\n    )\n    const showPicker = ref(false)\n    const showPanelColor = ref(false)\n    const customInput = ref('')\n    // computed\n    const displayedColor = computed(() => {\n      if (!props.modelValue && !showPanelColor.value) {\n        return 'transparent'\n      }\n      return displayedRgb(color, props.showAlpha)\n    })\n    const colorSize = computed(() => {\n      return props.size || elFormItem.size || ELEMENT.size\n    })\n    const colorDisabled = computed(() => {\n      return props.disabled || elForm.disabled\n    })\n\n    const currentColor = computed(() => {\n      return !props.modelValue && !showPanelColor.value ? '' : color.value\n    })\n    // watch\n    watch(\n      () => props.modelValue,\n      (newVal) => {\n        if (!newVal) {\n          showPanelColor.value = false\n        } else if (newVal && newVal !== color.value) {\n          color.fromString(newVal)\n        }\n      }\n    )\n    watch(\n      () => currentColor.value,\n      (val) => {\n        customInput.value = val\n        emit('active-change', val)\n        // showPanelColor.value = true\n      }\n    )\n\n    watch(\n      () => color.value,\n      () => {\n        if (!props.modelValue && !showPanelColor.value) {\n          showPanelColor.value = true\n        }\n      }\n    )\n\n    // methods\n    function displayedRgb(color, showAlpha) {\n      if (!(color instanceof Color)) {\n        throw Error('color should be instance of _color Class')\n      }\n\n      const { r, g, b } = color.toRgb()\n      return showAlpha\n        ? `rgba(${r}, ${g}, ${b}, ${color.get('alpha') / 100})`\n        : `rgb(${r}, ${g}, ${b})`\n    }\n\n    function setShowPicker(value) {\n      showPicker.value = value\n    }\n\n    const debounceSetShowPicker = debounce(setShowPicker, 100)\n\n    function hide() {\n      debounceSetShowPicker(false)\n      resetColor()\n    }\n\n    function resetColor() {\n      nextTick(() => {\n        if (props.modelValue) {\n          color.fromString(props.modelValue)\n        } else {\n          showPanelColor.value = false\n        }\n      })\n    }\n\n    function handleTrigger() {\n      if (colorDisabled.value) return\n      debounceSetShowPicker(!showPicker.value)\n    }\n\n    function handleConfirm() {\n      color.fromString(customInput.value)\n    }\n\n    function confirmValue() {\n      const value = color.value\n      emit(UPDATE_MODEL_EVENT, value)\n      emit('change', value)\n      elFormItem.validate?.('change')\n      debounceSetShowPicker(false)\n      // check if modelValue change, if not change, then reset color.\n      nextTick(() => {\n        const newColor = new Color({\n          enableAlpha: props.showAlpha,\n          format: props.colorFormat,\n        })\n        newColor.fromString(props.modelValue)\n        if (!color.compare(newColor)) {\n          resetColor()\n        }\n      })\n    }\n\n    function clear() {\n      debounceSetShowPicker(false)\n      emit(UPDATE_MODEL_EVENT, null)\n      emit('change', null)\n      if (props.modelValue !== null) {\n        elFormItem.validate?.('change')\n      }\n      resetColor()\n    }\n\n    onMounted(() => {\n      if (props.modelValue) {\n        color.fromString(props.modelValue)\n        customInput.value = currentColor.value\n      }\n    })\n    watch(\n      () => showPicker.value,\n      () => {\n        nextTick(() => {\n          hue.value?.update()\n          svPanel.value?.update()\n          alpha.value?.update()\n        })\n      }\n    )\n\n    provide<IUseOptions>(OPTIONS_KEY, {\n      currentColor,\n    })\n\n    return {\n      Effect,\n      color: color as Color,\n      colorDisabled,\n      colorSize,\n      displayedColor,\n      showPanelColor,\n      showPicker,\n      customInput,\n      handleConfirm,\n      hide,\n      handleTrigger,\n      clear,\n      confirmValue,\n      t,\n      hue,\n      svPanel,\n      alpha,\n      popper,\n    }\n  },\n})\n</script>\n"],"names":["_createBlock","_createElementVNode","_createVNode","_createElementBlock"],"mappings":";;;;;;qBAiBa,OAAM;qBAWN,OAAM;qBACH,OAAM;;;EAoCY,OAAM;AAAA;;;;;;;;;;;;;0BAhEtCA;IACE,KAAI;AAAA,IACI,SAAS;8DAAA;IAChB,QAAQ,YAAO;AAAA,IAChB,eAAA;AAAA,IACA,SAAQ;AAAA,IACP,cAAY;AAAA,IACZ,uBAAqB;IACrB,QAAQ;AAAA,IACT,YAAW;AAAA,IACV,oBAAkB;AAAA,IAClB,4DAA0D;IAC1D,2BAAyB;AAAA;IAEf,qBACT;yBAAAC;QACEA,8BAAA;UACEC;YAAY,KAAI;AAAA,YAAM,OAAM;AAAA,YAAc,OAAO;YAAO,UAAA;AAAA;UACxDA;YAAU,KAAI;AAAA,YAAW,OAAO;;;QAEd,mCAApBF;;UAA+B,KAAI;AAAA,UAAS,OAAO;;QAE3C,mCADRA;;UAEE,KAAI;AAAA,UACH,OAAO;UACP,QAAQ;;QAEXC,8BAAA;UACEA,+BAAA;YACEC;0BACW;2EAAA;cACR,kBAAgB;AAAA,cACjB,MAAK;AAAA,cACJ,sBAAa;cACb,QAAM;;;UAGXA;YACE,MAAK;AAAA,YACL,MAAK;AAAA,YACL,OAAM;AAAA,YACL,SAAO;;iCAER;sDAAG;;;;UAELA;YACE,OAAA;AAAA,YACA,MAAK;AAAA,YACL,OAAM;AAAA,YACL,SAAO;;iCAER;sDAAG;;;;;;mCApCa;;;IAyCb,qBACT;MAAAD;QACG;;;;;;QAMU,uCAAXE,8BAAA;QACAF;UAAK,OAAM;AAAA,UAA4B,gDAAO;;UAC5CA;YACE,2BAAM,wCACgB;;YAEtBA;cACE,OAAM;AAAA,cACL;;;;aAKM,oBAAe,wCADxBD;;cAEE,OAAM;AAAA;mCAEN;gBAAAE;;;;;6BAGJA,sCAEE,OAAM;iCAEN;cAAAA;;;;wBAHQ,mBAAc;;;;;;;;;;;"}

package/lib/components/container/index.js

@@ -8,11 +8,11 @@ require('./src/aside.js');
 require('./src/footer.js');
 require('./src/header.js');
 require('./src/main.js');
-var container_vue_vue_type_script_lang = require('./src/container.vue_vue&type=script&lang.js');
-var aside_vue_vue_type_script_lang = require('./src/aside.vue_vue&type=script&lang.js');
-var footer_vue_vue_type_script_lang = require('./src/footer.vue_vue&type=script&lang.js');
-var header_vue_vue_type_script_lang = require('./src/header.vue_vue&type=script&lang.js');
-var main_vue_vue_type_script_lang = require('./src/main.vue_vue&type=script&lang.js');
+var container_vue_vue_type_script_lang = require('./src/container.vue_vue_type_script_lang.js');
+var aside_vue_vue_type_script_lang = require('./src/aside.vue_vue_type_script_lang.js');
+var footer_vue_vue_type_script_lang = require('./src/footer.vue_vue_type_script_lang.js');
+var header_vue_vue_type_script_lang = require('./src/header.vue_vue_type_script_lang.js');
+var main_vue_vue_type_script_lang = require('./src/main.vue_vue_type_script_lang.js');
 
 const ElContainer = withInstall.withInstall(container_vue_vue_type_script_lang["default"], {
   Aside: aside_vue_vue_type_script_lang["default"],

package/lib/components/container/src/aside.js

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var aside_vue_vue_type_script_lang = require('./aside.vue_vue&type=script&lang.js');
-var aside_vue_vue_type_template_id_47e12f0a_lang = require('./aside.vue_vue&type=template&id=47e12f0a&lang.js');
+var aside_vue_vue_type_script_lang = require('./aside.vue_vue_type_script_lang.js');
+var aside_vue_vue_type_template_id_47e12f0a_lang = require('./aside.vue_vue_type_template_id_47e12f0a_lang.js');
 
 aside_vue_vue_type_script_lang["default"].render = aside_vue_vue_type_template_id_47e12f0a_lang.render;
 aside_vue_vue_type_script_lang["default"].__file = "packages/components/container/src/aside.vue";

package/lib/components/container/src/aside.vue_vue_type_script_lang.js

@@ -0,0 +1,25 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+
+var script = vue.defineComponent({
+  name: "ElAside",
+  props: {
+    width: {
+      type: String,
+      default: null
+    }
+  },
+  setup(props) {
+    return {
+      style: vue.computed(() => {
+        return props.width ? { "--el-aside-width": props.width } : {};
+      })
+    };
+  }
+});
+
+exports["default"] = script;
+//# sourceMappingURL=aside.vue_vue_type_script_lang.js.map

package/lib/components/container/src/aside.vue_vue_type_script_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"aside.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/container/src/aside.vue"],"sourcesContent":["<template>\n  <aside class=\"el-aside\" :style=\"style\">\n    <slot></slot>\n  </aside>\n</template>\n<script lang=\"ts\">\nimport { computed, defineComponent } from 'vue'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElAside',\n  props: {\n    width: {\n      type: String,\n      default: null,\n    },\n  },\n  setup(props) {\n    return {\n      style: computed(() => {\n        return props.width\n          ? ({ '--el-aside-width': props.width } as CSSProperties)\n          : {}\n      }),\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","computed"],"mappings":";;;;;;AAUA,aAAeA,oBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,OAAO;AAAA,IACL,OAAO;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA;AAAA;AAAA,EAGb,MAAM,OAAO;AACX,WAAO;AAAA,MACL,OAAOC,aAAS,MAAM;AACpB,eAAO,MAAM,QACR,EAAE,oBAAoB,MAAM,UAC7B;AAAA;AAAA;AAAA;AAAA;;;;"}

package/lib/components/container/src/aside.vue_vue_type_template_id_47e12f0a_lang.js

@@ -0,0 +1,17 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  return vue.openBlock(), vue.createElementBlock("aside", {
+    class: "el-aside",
+    style: vue.normalizeStyle(_ctx.style)
+  }, [
+    vue.renderSlot(_ctx.$slots, "default")
+  ], 4);
+}
+
+exports.render = render;
+//# sourceMappingURL=aside.vue_vue_type_template_id_47e12f0a_lang.js.map

package/lib/components/container/src/aside.vue_vue_type_template_id_47e12f0a_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"aside.vue_vue_type_template_id_47e12f0a_lang.js","sources":["../../../../../../packages/components/container/src/aside.vue?vue&type=template&id=47e12f0a&lang.js"],"sourcesContent":["<template>\n  <aside class=\"el-aside\" :style=\"style\">\n    <slot></slot>\n  </aside>\n</template>\n<script lang=\"ts\">\nimport { computed, defineComponent } from 'vue'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElAside',\n  props: {\n    width: {\n      type: String,\n      default: null,\n    },\n  },\n  setup(props) {\n    return {\n      style: computed(() => {\n        return props.width\n          ? ({ '--el-aside-width': props.width } as CSSProperties)\n          : {}\n      }),\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_renderSlot"],"mappings":";;;;;;;0BACEA;IAAO,OAAM;AAAA,IAAY,0BAAO;;IAC9BC;;;;;;"}

package/lib/components/container/src/container.js

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var container_vue_vue_type_script_lang = require('./container.vue_vue&type=script&lang.js');
-var container_vue_vue_type_template_id_60a2865a_lang = require('./container.vue_vue&type=template&id=60a2865a&lang.js');
+var container_vue_vue_type_script_lang = require('./container.vue_vue_type_script_lang.js');
+var container_vue_vue_type_template_id_60a2865a_lang = require('./container.vue_vue_type_template_id_60a2865a_lang.js');
 
 container_vue_vue_type_script_lang["default"].render = container_vue_vue_type_template_id_60a2865a_lang.render;
 container_vue_vue_type_script_lang["default"].__file = "packages/components/container/src/container.vue";

package/lib/components/container/src/container.vue_vue_type_script_lang.js

@@ -0,0 +1,39 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+
+var script = vue.defineComponent({
+  name: "ElContainer",
+  props: {
+    direction: {
+      type: String,
+      default: ""
+    }
+  },
+  setup(props, { slots }) {
+    const isVertical = vue.computed(() => {
+      if (props.direction === "vertical") {
+        return true;
+      } else if (props.direction === "horizontal") {
+        return false;
+      }
+      if (slots && slots.default) {
+        const vNodes = slots.default();
+        return vNodes.some((vNode) => {
+          const tag = vNode.type.name;
+          return tag === "ElHeader" || tag === "ElFooter";
+        });
+      } else {
+        return false;
+      }
+    });
+    return {
+      isVertical
+    };
+  }
+});
+
+exports["default"] = script;
+//# sourceMappingURL=container.vue_vue_type_script_lang.js.map

package/lib/components/container/src/container.vue_vue_type_script_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"container.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/container/src/container.vue"],"sourcesContent":["<template>\n  <section class=\"el-container\" :class=\"{ 'is-vertical': isVertical }\">\n    <slot></slot>\n  </section>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, computed } from 'vue'\n\nimport type { Component, VNode } from 'vue'\n\nexport default defineComponent({\n  name: 'ElContainer',\n  props: {\n    direction: {\n      type: String,\n      default: '',\n    },\n  },\n  setup(props, { slots }) {\n    const isVertical = computed(() => {\n      if (props.direction === 'vertical') {\n        return true\n      } else if (props.direction === 'horizontal') {\n        return false\n      }\n      if (slots && slots.default) {\n        const vNodes: VNode[] = slots.default()\n        return vNodes.some((vNode) => {\n          const tag = (vNode.type as Component).name\n          return tag === 'ElHeader' || tag === 'ElFooter'\n        })\n      } else {\n        return false\n      }\n    })\n    return {\n      isVertical,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","computed"],"mappings":";;;;;;AAUA,aAAeA,oBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,OAAO;AAAA,IACL,WAAW;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA;AAAA;AAAA,EAGb,MAAM,OAAO,EAAE,SAAS;AACtB,UAAM,aAAaC,aAAS,MAAM;AAChC,UAAI,MAAM,cAAc,YAAY;AAClC,eAAO;AAAA,iBACE,MAAM,cAAc,cAAc;AAC3C,eAAO;AAAA;AAET,UAAI,SAAS,MAAM,SAAS;AAC1B,cAAM,SAAkB,MAAM;AAC9B,eAAO,OAAO,KAAK,CAAC,UAAU;AAC5B,gBAAM,MAAO,MAAM,KAAmB;AACtC,iBAAO,QAAQ,cAAc,QAAQ;AAAA;AAAA,aAElC;AACL,eAAO;AAAA;AAAA;AAGX,WAAO;AAAA,MACL;AAAA;AAAA;AAAA;;;;"}

package/lib/components/container/src/container.vue_vue_type_template_id_60a2865a_lang.js

@@ -0,0 +1,16 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  return vue.openBlock(), vue.createElementBlock("section", {
+    class: vue.normalizeClass(["el-container", { "is-vertical": _ctx.isVertical }])
+  }, [
+    vue.renderSlot(_ctx.$slots, "default")
+  ], 2);
+}
+
+exports.render = render;
+//# sourceMappingURL=container.vue_vue_type_template_id_60a2865a_lang.js.map

package/lib/components/container/src/container.vue_vue_type_template_id_60a2865a_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"container.vue_vue_type_template_id_60a2865a_lang.js","sources":["../../../../../../packages/components/container/src/container.vue?vue&type=template&id=60a2865a&lang.js"],"sourcesContent":["<template>\n  <section class=\"el-container\" :class=\"{ 'is-vertical': isVertical }\">\n    <slot></slot>\n  </section>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, computed } from 'vue'\n\nimport type { Component, VNode } from 'vue'\n\nexport default defineComponent({\n  name: 'ElContainer',\n  props: {\n    direction: {\n      type: String,\n      default: '',\n    },\n  },\n  setup(props, { slots }) {\n    const isVertical = computed(() => {\n      if (props.direction === 'vertical') {\n        return true\n      } else if (props.direction === 'horizontal') {\n        return false\n      }\n      if (slots && slots.default) {\n        const vNodes: VNode[] = slots.default()\n        return vNodes.some((vNode) => {\n          const tag = (vNode.type as Component).name\n          return tag === 'ElHeader' || tag === 'ElFooter'\n        })\n      } else {\n        return false\n      }\n    })\n    return {\n      isVertical,\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_renderSlot"],"mappings":";;;;;;;0BACEA;IAAS,2BAAM,iCAAwC;;IACrDC;;;;;;"}

package/lib/components/container/src/footer.js

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var footer_vue_vue_type_script_lang = require('./footer.vue_vue&type=script&lang.js');
-var footer_vue_vue_type_template_id_2c2b128e_lang = require('./footer.vue_vue&type=template&id=2c2b128e&lang.js');
+var footer_vue_vue_type_script_lang = require('./footer.vue_vue_type_script_lang.js');
+var footer_vue_vue_type_template_id_2c2b128e_lang = require('./footer.vue_vue_type_template_id_2c2b128e_lang.js');
 
 footer_vue_vue_type_script_lang["default"].render = footer_vue_vue_type_template_id_2c2b128e_lang.render;
 footer_vue_vue_type_script_lang["default"].__file = "packages/components/container/src/footer.vue";

package/lib/components/container/src/footer.vue_vue_type_script_lang.js

@@ -0,0 +1,25 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+
+var script = vue.defineComponent({
+  name: "ElFooter",
+  props: {
+    height: {
+      type: String,
+      default: null
+    }
+  },
+  setup(props) {
+    return {
+      style: vue.computed(() => props.height ? {
+        "--el-footer-height": props.height
+      } : {})
+    };
+  }
+});
+
+exports["default"] = script;
+//# sourceMappingURL=footer.vue_vue_type_script_lang.js.map

package/lib/components/container/src/footer.vue_vue_type_script_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"footer.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/container/src/footer.vue"],"sourcesContent":["<template>\n  <footer class=\"el-footer\" :style=\"style\">\n    <slot></slot>\n  </footer>\n</template>\n<script lang=\"ts\">\nimport { computed, defineComponent } from 'vue'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElFooter',\n  props: {\n    height: {\n      type: String,\n      default: null,\n    },\n  },\n  setup(props) {\n    return {\n      style: computed(\n        () =>\n          (props.height\n            ? {\n                '--el-footer-height': props.height,\n              }\n            : {}) as CSSProperties\n      ),\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","computed"],"mappings":";;;;;;AAUA,aAAeA,oBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,OAAO;AAAA,IACL,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,SAAS;AAAA;AAAA;AAAA,EAGb,MAAM,OAAO;AACX,WAAO;AAAA,MACL,OAAOC,aACL,MACG,MAAM,SACH;AAAA,QACE,sBAAsB,MAAM;AAAA,UAE9B;AAAA;AAAA;AAAA;;;;"}

package/lib/components/container/src/footer.vue_vue_type_template_id_2c2b128e_lang.js

@@ -0,0 +1,17 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  return vue.openBlock(), vue.createElementBlock("footer", {
+    class: "el-footer",
+    style: vue.normalizeStyle(_ctx.style)
+  }, [
+    vue.renderSlot(_ctx.$slots, "default")
+  ], 4);
+}
+
+exports.render = render;
+//# sourceMappingURL=footer.vue_vue_type_template_id_2c2b128e_lang.js.map

package/lib/components/container/src/footer.vue_vue_type_template_id_2c2b128e_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"footer.vue_vue_type_template_id_2c2b128e_lang.js","sources":["../../../../../../packages/components/container/src/footer.vue?vue&type=template&id=2c2b128e&lang.js"],"sourcesContent":["<template>\n  <footer class=\"el-footer\" :style=\"style\">\n    <slot></slot>\n  </footer>\n</template>\n<script lang=\"ts\">\nimport { computed, defineComponent } from 'vue'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElFooter',\n  props: {\n    height: {\n      type: String,\n      default: null,\n    },\n  },\n  setup(props) {\n    return {\n      style: computed(\n        () =>\n          (props.height\n            ? {\n                '--el-footer-height': props.height,\n              }\n            : {}) as CSSProperties\n      ),\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_renderSlot"],"mappings":";;;;;;;0BACEA;IAAQ,OAAM;AAAA,IAAa,0BAAO;;IAChCC;;;;;;"}

package/lib/components/container/src/header.js

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var header_vue_vue_type_script_lang = require('./header.vue_vue&type=script&lang.js');
-var header_vue_vue_type_template_id_0b1cdaab_lang = require('./header.vue_vue&type=template&id=0b1cdaab&lang.js');
+var header_vue_vue_type_script_lang = require('./header.vue_vue_type_script_lang.js');
+var header_vue_vue_type_template_id_0b1cdaab_lang = require('./header.vue_vue_type_template_id_0b1cdaab_lang.js');
 
 header_vue_vue_type_script_lang["default"].render = header_vue_vue_type_template_id_0b1cdaab_lang.render;
 header_vue_vue_type_script_lang["default"].__file = "packages/components/container/src/header.vue";

package/lib/components/container/src/header.vue_vue_type_script_lang.js

@@ -0,0 +1,25 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+
+var script = vue.defineComponent({
+  name: "ElHeader",
+  props: {
+    height: {
+      type: String,
+      default: null
+    }
+  },
+  setup(props) {
+    return {
+      style: vue.computed(() => props.height ? {
+        "--el-header-height": props.height
+      } : {})
+    };
+  }
+});
+
+exports["default"] = script;
+//# sourceMappingURL=header.vue_vue_type_script_lang.js.map

package/lib/components/container/src/header.vue_vue_type_script_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"header.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/container/src/header.vue"],"sourcesContent":["<template>\n  <header class=\"el-header\" :style=\"style\">\n    <slot></slot>\n  </header>\n</template>\n<script lang=\"ts\">\nimport { computed, defineComponent } from 'vue'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElHeader',\n  props: {\n    height: {\n      type: String,\n      default: null,\n    },\n  },\n  setup(props) {\n    return {\n      style: computed(\n        () =>\n          (props.height\n            ? {\n                '--el-header-height': props.height,\n              }\n            : {}) as CSSProperties\n      ),\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","computed"],"mappings":";;;;;;AAUA,aAAeA,oBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,OAAO;AAAA,IACL,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,SAAS;AAAA;AAAA;AAAA,EAGb,MAAM,OAAO;AACX,WAAO;AAAA,MACL,OAAOC,aACL,MACG,MAAM,SACH;AAAA,QACE,sBAAsB,MAAM;AAAA,UAE9B;AAAA;AAAA;AAAA;;;;"}

package/lib/components/container/src/header.vue_vue_type_template_id_0b1cdaab_lang.js

@@ -0,0 +1,17 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  return vue.openBlock(), vue.createElementBlock("header", {
+    class: "el-header",
+    style: vue.normalizeStyle(_ctx.style)
+  }, [
+    vue.renderSlot(_ctx.$slots, "default")
+  ], 4);
+}
+
+exports.render = render;
+//# sourceMappingURL=header.vue_vue_type_template_id_0b1cdaab_lang.js.map

package/lib/components/container/src/header.vue_vue_type_template_id_0b1cdaab_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"header.vue_vue_type_template_id_0b1cdaab_lang.js","sources":["../../../../../../packages/components/container/src/header.vue?vue&type=template&id=0b1cdaab&lang.js"],"sourcesContent":["<template>\n  <header class=\"el-header\" :style=\"style\">\n    <slot></slot>\n  </header>\n</template>\n<script lang=\"ts\">\nimport { computed, defineComponent } from 'vue'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElHeader',\n  props: {\n    height: {\n      type: String,\n      default: null,\n    },\n  },\n  setup(props) {\n    return {\n      style: computed(\n        () =>\n          (props.height\n            ? {\n                '--el-header-height': props.height,\n              }\n            : {}) as CSSProperties\n      ),\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_renderSlot"],"mappings":";;;;;;;0BACEA;IAAQ,OAAM;AAAA,IAAa,0BAAO;;IAChCC;;;;;;"}

package/lib/components/container/src/main.js

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var main_vue_vue_type_script_lang = require('./main.vue_vue&type=script&lang.js');
-var main_vue_vue_type_template_id_526ed157_lang = require('./main.vue_vue&type=template&id=526ed157&lang.js');
+var main_vue_vue_type_script_lang = require('./main.vue_vue_type_script_lang.js');
+var main_vue_vue_type_template_id_526ed157_lang = require('./main.vue_vue_type_template_id_526ed157_lang.js');
 
 main_vue_vue_type_script_lang["default"].render = main_vue_vue_type_template_id_526ed157_lang.render;
 main_vue_vue_type_script_lang["default"].__file = "packages/components/container/src/main.vue";

package/lib/components/container/src/main.vue_vue_type_script_lang.js

@@ -0,0 +1,12 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+
+var script = vue.defineComponent({
+  name: "ElMain"
+});
+
+exports["default"] = script;
+//# sourceMappingURL=main.vue_vue_type_script_lang.js.map

package/lib/components/container/src/main.vue_vue_type_script_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"main.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/container/src/main.vue"],"sourcesContent":["<template>\n  <main class=\"el-main\">\n    <slot></slot>\n  </main>\n</template>\n<script lang=\"ts\">\nimport { defineComponent } from 'vue'\n\nexport default defineComponent({\n  name: 'ElMain',\n})\n</script>\n"],"names":["defineComponent"],"mappings":";;;;;;AAQA,aAAeA,oBAAgB;AAAA,EAC7B,MAAM;AAAA;;;;"}

package/lib/components/container/src/main.vue_vue_type_template_id_526ed157_lang.js

@@ -0,0 +1,15 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+
+const _hoisted_1 = { class: "el-main" };
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  return vue.openBlock(), vue.createElementBlock("main", _hoisted_1, [
+    vue.renderSlot(_ctx.$slots, "default")
+  ]);
+}
+
+exports.render = render;
+//# sourceMappingURL=main.vue_vue_type_template_id_526ed157_lang.js.map

package/lib/components/container/src/main.vue_vue_type_template_id_526ed157_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"main.vue_vue_type_template_id_526ed157_lang.js","sources":["../../../../../../packages/components/container/src/main.vue?vue&type=template&id=526ed157&lang.js"],"sourcesContent":["<template>\n  <main class=\"el-main\">\n    <slot></slot>\n  </main>\n</template>\n<script lang=\"ts\">\nimport { defineComponent } from 'vue'\n\nexport default defineComponent({\n  name: 'ElMain',\n})\n</script>\n"],"names":["_createElementBlock","_renderSlot"],"mappings":";;;;;;qBACQ,OAAM;;0BAAZA,+BAAA;IACEC;;;;;;"}

package/lib/components/date-picker/index.d.ts

@@ -141,6 +141,7 @@ declare const _DatePicker: SFCWithInstall<import("vue").DefineComponent<{
     disabled: boolean;
     modelValue: string | Date | Date[];
     name: string | unknown[];
+    editable: boolean;
     popperClass: string;
     popperOptions: Partial<import("@popperjs/core").Options>;
     readonly: boolean;
@@ -148,7 +149,6 @@ declare const _DatePicker: SFCWithInstall<import("vue").DefineComponent<{
     prefixIcon: string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>;
     validateEvent: boolean;
     clearIcon: string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>;
-    editable: boolean;
     rangeSeparator: string;
     isRange: boolean;
     shortcuts: unknown[];
@@ -175,6 +175,7 @@ declare const _DatePicker: SFCWithInstall<import("vue").DefineComponent<{
     disabled: boolean;
     modelValue: string | Date | Date[];
     name: string | unknown[];
+    editable: boolean;
     popperClass: string;
     popperOptions: Partial<import("@popperjs/core").Options>;
     readonly: boolean;
@@ -182,7 +183,6 @@ declare const _DatePicker: SFCWithInstall<import("vue").DefineComponent<{
     prefixIcon: string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>;
     validateEvent: boolean;
     clearIcon: string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>;
-    editable: boolean;
     rangeSeparator: string;
     isRange: boolean;
     shortcuts: unknown[];
@@ -332,6 +332,7 @@ export declare const ElDatePicker: SFCWithInstall<import("vue").DefineComponent<
     disabled: boolean;
     modelValue: string | Date | Date[];
     name: string | unknown[];
+    editable: boolean;
     popperClass: string;
     popperOptions: Partial<import("@popperjs/core").Options>;
     readonly: boolean;
@@ -339,7 +340,6 @@ export declare const ElDatePicker: SFCWithInstall<import("vue").DefineComponent<
     prefixIcon: string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>;
     validateEvent: boolean;
     clearIcon: string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>;
-    editable: boolean;
     rangeSeparator: string;
     isRange: boolean;
     shortcuts: unknown[];
@@ -366,6 +366,7 @@ export declare const ElDatePicker: SFCWithInstall<import("vue").DefineComponent<
     disabled: boolean;
     modelValue: string | Date | Date[];
     name: string | unknown[];
+    editable: boolean;
     popperClass: string;
     popperOptions: Partial<import("@popperjs/core").Options>;
     readonly: boolean;
@@ -373,7 +374,6 @@ export declare const ElDatePicker: SFCWithInstall<import("vue").DefineComponent<
     prefixIcon: string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>;
     validateEvent: boolean;
     clearIcon: string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>;
-    editable: boolean;
     rangeSeparator: string;
     isRange: boolean;
     shortcuts: unknown[];

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

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var basicDateTable_vue_vue_type_script_lang = require('./basic-date-table.vue_vue&type=script&lang.js');
-var basicDateTable_vue_vue_type_template_id_0572814e_lang = require('./basic-date-table.vue_vue&type=template&id=0572814e&lang.js');
+var basicDateTable_vue_vue_type_script_lang = require('./basic-date-table.vue_vue_type_script_lang.js');
+var basicDateTable_vue_vue_type_template_id_0572814e_lang = require('./basic-date-table.vue_vue_type_template_id_0572814e_lang.js');
 
 basicDateTable_vue_vue_type_script_lang["default"].render = basicDateTable_vue_vue_type_template_id_0572814e_lang.render;
 basicDateTable_vue_vue_type_script_lang["default"].__file = "packages/components/date-picker/src/date-picker-com/basic-date-table.vue";