vexip-ui/lib/components/collapse/collapse-panel.vue2.cjs.map

A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good

{"version":3,"file":"collapse-panel.vue2.cjs","sources":["../../../components/collapse/collapse-panel.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { CollapseTransition } from '@/components/collapse-transition'\nimport { Icon } from '@/components/icon'\n\nimport { computed, inject, onBeforeUnmount, reactive, ref, watch } from 'vue'\n\nimport { createIconProp, emitEvent, useIcons, useNameHelper, useProps } from '@vexip-ui/config'\nimport { collapsePanelProps } from './props'\nimport { COLLAPSE_STATE, getIndexId } from './symbol'\n\nimport type { CollapseArrowType, PanelState } from './symbol'\n\ndefineOptions({ name: 'CollapsePanel' })\n\nconst _props = defineProps(collapsePanelProps)\nconst props = useProps('collapsePanel', _props, {\n  label: {\n    default: null,\n    static: true,\n  },\n  title: '',\n  disabled: false,\n  contentStyle: null,\n  expanded: false,\n  card: false,\n  arrowType: {\n    default: 'right' as CollapseArrowType,\n    validator: (value: CollapseArrowType) => ['right', 'left', 'none'].includes(value),\n  },\n  icon: createIconProp(),\n  ghost: false,\n})\n\nconst emit = defineEmits(['update:expanded'])\n\nconst collapseState = inject(COLLAPSE_STATE, null)\n\nconst nh = useNameHelper('collapse')\nconst icons = useIcons()\nconst currentExpanded = ref(props.expanded)\nconst currentLabel = ref(props.label)\n\nconst tab = ref<HTMLElement>()\n\nconst id = getIndexId()\n\nconst tabId = computed(() => `${nh.be('tab')}-${id}`)\nconst bodyId = computed(() => `${nh.be('body')}-${id}`)\nconst useCard = computed(() => {\n  if (!collapseState) {\n    return props.card\n  }\n\n  return false\n})\nconst useGhost = computed(() => {\n  if (!collapseState) {\n    return props.ghost\n  }\n\n  return false\n})\nconst useArrowType = computed(() => {\n  if (collapseState) {\n    return collapseState.arrowType\n  }\n\n  return props.arrowType\n})\nconst className = computed(() => {\n  return [\n    nh.be('panel'),\n    nh.bs('vars'),\n    nh.bem('panel', `arrow-${useArrowType.value}`),\n    {\n      [nh.bem('panel', 'inherit')]: collapseState || props.inherit,\n      [nh.bem('panel', 'card')]: useCard.value,\n      [nh.bem('panel', 'ghost')]: !useCard.value && useGhost.value,\n      [nh.bem('panel', 'expanded')]: currentExpanded.value,\n      [nh.bem('panel', 'disabled')]: props.disabled,\n    },\n  ]\n})\n\nif (collapseState) {\n  const state: PanelState = reactive({\n    tab,\n    label: currentLabel,\n    expanded: currentExpanded,\n    setExpanded,\n  })\n\n  watch(\n    () => props.label,\n    value => {\n      const prevValue = currentLabel.value\n      currentLabel.value = value || value === 0 ? value : prevValue\n    },\n  )\n\n  collapseState.registerPanel(state)\n\n  onBeforeUnmount(() => {\n    collapseState.unregisterPanel(state)\n  })\n} else {\n  watch(\n    () => props.expanded,\n    value => {\n      currentExpanded.value = value\n    },\n  )\n}\n\nfunction setExpanded(expanded: boolean) {\n  currentExpanded.value = expanded\n\n  emit('update:expanded', expanded)\n  emitEvent(props.onToggle, expanded)\n}\n\nfunction handleToggle(expanded = !currentExpanded.value) {\n  if (props.disabled) return\n\n  if (collapseState) {\n    // 由父级进行管理\n    collapseState.expandPanel(currentLabel.value, expanded)\n  } else {\n    setExpanded(expanded)\n  }\n}\n\ndefineExpose({\n  currentExpanded,\n  tab,\n  tabId,\n  bodyId,\n  handleToggle,\n})\n</script>\n\n<template>\n  <section :class=\"className\">\n    <button\n      :id=\"tabId\"\n      ref=\"tab\"\n      :class=\"nh.be('header')\"\n      type=\"button\"\n      role=\"tab\"\n      :aria-expanded=\"currentExpanded\"\n      :aria-controls=\"bodyId\"\n      :aria-describedby=\"bodyId\"\n      @click=\"handleToggle()\"\n    >\n      <div :class=\"nh.be('arrow')\">\n        <Icon v-bind=\"icons.angleRight\"></Icon>\n      </div>\n      <slot name=\"title\">\n        <div v-if=\"props.icon\" :class=\"nh.be('icon')\">\n          <Icon :icon=\"props.icon\"></Icon>\n        </div>\n        {{ props.title }}\n      </slot>\n    </button>\n    <CollapseTransition>\n      <div\n        v-if=\"currentExpanded\"\n        :id=\"bodyId\"\n        :class=\"nh.be('body')\"\n        role=\"tabpanel\"\n        tabindex=\"0\"\n        :aria-labelledby=\"tabId\"\n      >\n        <div :class=\"nh.be('content')\" :style=\"props.contentStyle\">\n          <slot></slot>\n        </div>\n      </div>\n    </CollapseTransition>\n  </section>\n</template>\n"],"names":["_props","__props","props","useProps","value","createIconProp","emit","__emit","collapseState","inject","COLLAPSE_STATE","nh","useNameHelper","icons","useIcons","currentExpanded","ref","currentLabel","tab","id","getIndexId","tabId","computed","bodyId","useCard","useGhost","useArrowType","className","state","reactive","setExpanded","watch","prevValue","onBeforeUnmount","expanded","emitEvent","handleToggle","__expose","_createElementBlock","_createElementVNode","_normalizeClass","_unref","_createVNode","Icon","_normalizeProps","_guardReactiveProps","_renderSlot","_ctx","_toDisplayString","CollapseTransition","_normalizeStyle"],"mappings":"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"}