8bed9669ea4cb865eeab5351613a205f1f3cf6bdaf23852e1435f8228ecd30bfa4b097174bd6cae032d5eb50c244707a1702caacbae5b9a71c64d5e501fa51 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. import { defineComponent, inject, computed, ref, onMounted, openBlock, createElementBlock, normalizeClass, normalizeStyle, renderSlot, createCommentVNode } from 'vue';
  2. import { useResizeObserver } from '@vueuse/core';
  3. import { selectKey } from './token.mjs';
  4. import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
  5. import { BORDER_HORIZONTAL_WIDTH } from '../../../constants/form.mjs';
  6. import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
  7. const _sfc_main = defineComponent({
  8. name: "ElSelectDropdown",
  9. componentName: "ElSelectDropdown",
  10. setup() {
  11. const select = inject(selectKey);
  12. const ns = useNamespace("select");
  13. const popperClass = computed(() => select.props.popperClass);
  14. const isMultiple = computed(() => select.props.multiple);
  15. const isFitInputWidth = computed(() => select.props.fitInputWidth);
  16. const minWidth = ref("");
  17. function updateMinWidth() {
  18. var _a;
  19. const offsetWidth = (_a = select.selectRef) == null ? void 0 : _a.offsetWidth;
  20. if (offsetWidth) {
  21. minWidth.value = `${offsetWidth - BORDER_HORIZONTAL_WIDTH}px`;
  22. } else {
  23. minWidth.value = "";
  24. }
  25. }
  26. onMounted(() => {
  27. updateMinWidth();
  28. useResizeObserver(select.selectRef, updateMinWidth);
  29. });
  30. return {
  31. ns,
  32. minWidth,
  33. popperClass,
  34. isMultiple,
  35. isFitInputWidth
  36. };
  37. }
  38. });
  39. function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
  40. return openBlock(), createElementBlock("div", {
  41. class: normalizeClass([_ctx.ns.b("dropdown"), _ctx.ns.is("multiple", _ctx.isMultiple), _ctx.popperClass]),
  42. style: normalizeStyle({ [_ctx.isFitInputWidth ? "width" : "minWidth"]: _ctx.minWidth })
  43. }, [
  44. _ctx.$slots.header ? (openBlock(), createElementBlock("div", {
  45. key: 0,
  46. class: normalizeClass(_ctx.ns.be("dropdown", "header"))
  47. }, [
  48. renderSlot(_ctx.$slots, "header")
  49. ], 2)) : createCommentVNode("v-if", true),
  50. renderSlot(_ctx.$slots, "default"),
  51. _ctx.$slots.footer ? (openBlock(), createElementBlock("div", {
  52. key: 1,
  53. class: normalizeClass(_ctx.ns.be("dropdown", "footer"))
  54. }, [
  55. renderSlot(_ctx.$slots, "footer")
  56. ], 2)) : createCommentVNode("v-if", true)
  57. ], 6);
  58. }
  59. var ElSelectMenu = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "select-dropdown.vue"]]);
  60. export { ElSelectMenu as default };
  61. //# sourceMappingURL=select-dropdown.mjs.map