You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

0 lines
6.1 KiB

1 month ago
  1. {"ast":null,"code":"import { defineComponent, openBlock, createBlock, Transition, mergeProps, withCtx, renderSlot } from 'vue';\nimport _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';\nimport { useNamespace } from '../../../hooks/use-namespace/index.mjs';\nimport { addClass, removeClass, hasClass } from '../../../utils/dom/style.mjs';\nconst _sfc_main = defineComponent({\n name: \"ElMenuCollapseTransition\",\n setup() {\n const ns = useNamespace(\"menu\");\n const listeners = {\n onBeforeEnter: el => el.style.opacity = \"0.2\",\n onEnter(el, done) {\n addClass(el, `${ns.namespace.value}-opacity-transition`);\n el.style.opacity = \"1\";\n done();\n },\n onAfterEnter(el) {\n removeClass(el, `${ns.namespace.value}-opacity-transition`);\n el.style.opacity = \"\";\n },\n onBeforeLeave(el) {\n if (!el.dataset) {\n el.dataset = {};\n }\n if (hasClass(el, ns.m(\"collapse\"))) {\n removeClass(el, ns.m(\"collapse\"));\n el.dataset.oldOverflow = el.style.overflow;\n el.dataset.scrollWidth = el.clientWidth.toString();\n addClass(el, ns.m(\"collapse\"));\n } else {\n addClass(el, ns.m(\"collapse\"));\n el.dataset.oldOverflow = el.style.overflow;\n el.dataset.scrollWidth = el.clientWidth.toString();\n removeClass(el, ns.m(\"collapse\"));\n }\n el.style.width = `${el.scrollWidth}px`;\n el.style.overflow = \"hidden\";\n },\n onLeave(el) {\n addClass(el, \"horizontal-collapse-transition\");\n el.style.width = `${el.dataset.scrollWidth}px`;\n }\n };\n return {\n listeners\n };\n }\n});\nfunction _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {\n return openBlock(), createBlock(Transition, mergeProps({\n mode: \"out-in\"\n }, _ctx.listeners), {\n default: withCtx(() => [renderSlot(_ctx.$slots, \"default\")]),\n _: 3\n }, 16);\n}\nvar ElMenuCollapseTransition = /* @__PURE__ */_export_sfc(_sfc_main, [[\"render\", _sfc_render], [\"__file\", \"menu-collapse-transition.vue\"]]);\nexport { ElMenuCollapseTransition as default };","map":{"version":3,"names":["_sfc_main","defineComponent","name","setup","ns","useNamespace","listeners","onBeforeEnter","el","style","opacity","onEnter","done","addClass","namespace","value","onAfterEnter","removeClass","onBeforeLeave","dataset","hasClass","m","oldOverflow","overflow","scrollWidth","clientWidth","toString","width","onLeave","openBlock","createBlock","Transition","mergeProps","mode","_ctx","default","withCtx","renderSlot","$slots","_"],"sources":["../../../../../../packages/components/menu/src/menu-collapse-transition.vue"],"sourcesContent":["<template>\n <transition mode=\"out-in\" v-bind=\"listeners\">\n <slot />\n </transition>\n</template>\n<script lang=\"ts\">\nimport { defineComponent } from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { addClass, hasClass, removeClass } from '@element-plus/utils'\n\nimport type { BaseTransitionProps, TransitionProps } from 'vue'\n\nexport default defineComponent({\n name: 'ElMenuCollapseTransition',\n setup() {\n const ns = useNamespace('menu')\n const listeners = {\n onBeforeEnter: (el) => (el.style.opacity = '0.2'),\n onEnter(el, done) {\n addClass(el, `${ns.namespace.value}-opacity-transition`)\n el.style.opacity = '1'\n done()\n },\n\n onAfterEnter(el) {\n removeClass(el, `${ns.namespace.value}-opacity-transition`)\n el.style.opacity = ''\n },\n\n onBeforeLeave(el) {\n if (!el.dataset) {\n ;(el as any).dataset = {}\n }\n\n if (hasClass(el, ns.m('collapse'))) {\n removeClass(el, ns.m('collapse'))\n el.dataset.oldOverflow = el.style.overflow\n el.dataset.scrollWidth = el.clientWidth.toString()\n addClass(el, ns.m('collapse'))\n } else {\n addClass(el, ns.m('collapse'))\n el.dataset.oldOverf