element-plus/es/components/tabs/src/tabs.mjs.map

A Component Library for Vue 3

{"version":3,"file":"tabs.mjs","sources":["../../../../../../packages/components/tabs/src/tabs.tsx"],"sourcesContent":["import { defineComponent, provide, reactive, ref, renderSlot, watch } from 'vue'\nimport {\n  buildProps,\n  definePropType,\n  isNumber,\n  isString,\n} from '@element-plus/utils'\nimport { EVENT_CODE, UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport ElIcon from '@element-plus/components/icon'\nimport { Plus } from '@element-plus/icons-vue'\nimport { tabsRootContextKey } from '@element-plus/tokens'\nimport { useNamespace } from '@element-plus/hooks'\nimport TabNav from './tab-nav'\nimport type { TabNavInstance } from './tab-nav'\nimport type { TabsPaneContext } from '@element-plus/tokens'\n\nimport type { ExtractPropTypes } from 'vue'\nimport type { Awaitable } from '@element-plus/utils'\n\nexport type TabPanelName = string | number\n\nexport const tabsProps = buildProps({\n  type: {\n    type: String,\n    values: ['card', 'border-card', ''],\n    default: '',\n  },\n  activeName: {\n    type: [String, Number],\n    default: '',\n  },\n  closable: Boolean,\n  addable: Boolean,\n  modelValue: {\n    type: [String, Number],\n    default: '',\n  },\n  editable: Boolean,\n  tabPosition: {\n    type: String,\n    values: ['top', 'right', 'bottom', 'left'],\n    default: 'top',\n  },\n  beforeLeave: {\n    type: definePropType<\n      (\n        newName: TabPanelName,\n        oldName: TabPanelName\n      ) => Awaitable<void | boolean>\n    >(Function),\n    default: () => true,\n  },\n  stretch: Boolean,\n} as const)\nexport type TabsProps = ExtractPropTypes<typeof tabsProps>\n\nconst isPanelName = (value: unknown): value is string | number =>\n  isString(value) || isNumber(value)\n\nexport const tabsEmits = {\n  [UPDATE_MODEL_EVENT]: (name: TabPanelName) => isPanelName(name),\n  'tab-click': (pane: TabsPaneContext, ev: Event) => ev instanceof Event,\n  'tab-change': (name: TabPanelName) => isPanelName(name),\n  edit: (paneName: TabPanelName | undefined, action: 'remove' | 'add') =>\n    ['remove', 'add'].includes(action),\n  'tab-remove': (name: TabPanelName) => isPanelName(name),\n  'tab-add': () => true,\n}\nexport type TabsEmits = typeof tabsEmits\n\nexport default defineComponent({\n  name: 'ElTabs',\n\n  props: tabsProps,\n  emits: tabsEmits,\n\n  setup(props, { emit, slots, expose }) {\n    const ns = useNamespace('tabs')\n\n    const nav$ = ref<TabNavInstance>()\n    const panes = reactive<Record<number, TabsPaneContext>>({})\n    const currentName = ref(props.modelValue || props.activeName || '0')\n\n    const changeCurrentName = (value: TabPanelName) => {\n      currentName.value = value\n      emit(UPDATE_MODEL_EVENT, value)\n      emit('tab-change', value)\n    }\n\n    const setCurrentName = async (value: TabPanelName) => {\n      // should do nothing.\n      if (currentName.value === value) return\n\n      try {\n        const canLeave = await props.beforeLeave?.(value, currentName.value)\n        if (canLeave !== false) {\n          changeCurrentName(value)\n\n          // call exposed function, Vue doesn't support expose in typescript yet.\n          // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n          // @ts-expect-error\n          nav$.value?.removeFocus?.()\n        }\n      } catch {}\n    }\n\n    const handleTabClick = (\n      tab: TabsPaneContext,\n      tabName: TabPanelName,\n      event: Event\n    ) => {\n      if (tab.props.disabled) return\n      setCurrentName(tabName)\n      emit('tab-click', tab, event)\n    }\n\n    const handleTabRemove = (pane: TabsPaneContext, ev: Event) => {\n      if (pane.props.disabled) return\n      ev.stopPropagation()\n      emit('edit', pane.props.name, 'remove')\n      emit('tab-remove', pane.props.name)\n    }\n\n    const handleTabAdd = () => {\n      emit('edit', undefined, 'add')\n      emit('tab-add')\n    }\n\n    watch(\n      () => props.activeName,\n      (modelValue) => setCurrentName(modelValue)\n    )\n\n    watch(\n      () => props.modelValue,\n      (modelValue) => setCurrentName(modelValue)\n    )\n\n    watch(currentName, async () => {\n      // call exposed function, Vue doesn't support expose in typescript yet.\n      // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n      // @ts-expect-error\n      nav$.value?.scrollToActiveTab()\n    })\n\n    {\n      const registerPane = (pane: TabsPaneContext) => (panes[pane.uid] = pane)\n      const unregisterPane = (uid: number) => delete panes[uid]\n\n      provide(tabsRootContextKey, {\n        props,\n        currentName,\n        registerPane,\n        unregisterPane,\n      })\n    }\n\n    expose({\n      currentName,\n    })\n\n    return () => {\n      const newButton =\n        props.editable || props.addable ? (\n          <span\n            class={ns.e('new-tab')}\n            tabindex=\"0\"\n            onClick={handleTabAdd}\n            onKeydown={(ev: KeyboardEvent) => {\n              if (ev.code === EVENT_CODE.enter) handleTabAdd()\n            }}\n          >\n            <ElIcon class={ns.is('icon-plus')}>\n              <Plus />\n            </ElIcon>\n          </span>\n        ) : null\n\n      const header = (\n        <div class={[ns.e('header'), ns.is(props.tabPosition)]}>\n          {newButton}\n          <TabNav\n            ref={nav$}\n            currentName={currentName.value}\n            editable={props.editable}\n            type={props.type}\n            panes={Object.values(panes)}\n            stretch={props.stretch}\n            onTabClick={handleTabClick}\n            onTabRemove={handleTabRemove}\n          />\n        </div>\n      )\n\n      const panels = (\n        <div class={ns.e('content')}>{renderSlot(slots, 'default')}</div>\n      )\n\n      return (\n        <div\n          class={[\n            ns.b(),\n            ns.m(props.tabPosition),\n            {\n              [ns.m('card')]: props.type === 'card',\n              [ns.m('border-card')]: props.type === 'border-card',\n            },\n          ]}\n        >\n          {...props.tabPosition !== 'bottom'\n            ? [header, panels]\n            : [panels, header]}\n        </div>\n      )\n    }\n  },\n})\n"],"names":["tabsProps","buildProps","type","String","values","default","activeName","Number","closable","Boolean","addable","modelValue","editable","tabPosition","beforeLeave","definePropType","Function","stretch","tabsEmits","name","ev","edit","action","props","emits","slots","expose","ns","nav$","reactive","currentName","changeCurrentName","emit","UPDATE_MODEL_EVENT","value","removeFocus","handleTabClick","tab","setCurrentName","handleTabRemove","stopPropagation","handleTabAdd","watch","registerPane","unregisterPane","_createVNode","newButton","EVENT_CODE","is"],"mappings":"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"}