UNPKG

vexip-ui

Version:

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

1 lines 4.42 kB
{"version":3,"file":"breadcrumb-item.vue2.cjs","sources":["../../../components/breadcrumb/breadcrumb-item.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { Renderer } from '@/components/renderer'\n\nimport { inject, onBeforeUnmount, reactive, ref, watch } from 'vue'\n\nimport { emitEvent, useNameHelper } from '@vexip-ui/config'\nimport { isFunction } from '@vexip-ui/utils'\nimport { breadcrumbItemProps } from './props'\nimport { BREADCRUMB_STATE } from './symbol'\n\nimport type { BreadcrumbItemState, SelectEvent, SeparatorRenderFn } from './symbol'\n\ndefineOptions({ name: 'BreadcrumbItem' })\n\nconst props = defineProps(breadcrumbItemProps)\n\ndefineSlots<{\n default: () => any,\n separator: () => any\n}>()\n\nconst nh = useNameHelper('breadcrumb')\n\nconst breadcrumbState = inject(BREADCRUMB_STATE, null)\n\nconst currentLabel = ref(props.label)\nconst separator = ref('/')\nconst separatorRenderer = ref<SeparatorRenderFn | null>(null)\n\nwatch(\n () => props.label,\n value => {\n currentLabel.value = value\n breadcrumbState?.refreshLabels()\n },\n)\n\nif (breadcrumbState) {\n const state: BreadcrumbItemState = reactive({\n label: currentLabel,\n })\n\n watch(\n () => breadcrumbState.separator,\n value => {\n separator.value = value\n },\n { immediate: true },\n )\n watch(\n () => breadcrumbState.separatorRenderer,\n value => {\n separatorRenderer.value = value\n },\n { immediate: true },\n )\n\n breadcrumbState.increaseItem(state)\n\n onBeforeUnmount(() => {\n breadcrumbState.decreaseItem(state)\n })\n}\n\nfunction handleClick() {\n emitEvent(props.onSelect! as SelectEvent, currentLabel.value)\n breadcrumbState?.handleSelect(currentLabel.value)\n}\n\nfunction handleSeparatorClick() {\n emitEvent(props.onSeparatorClick! as SelectEvent, currentLabel.value)\n breadcrumbState?.handleSeparatorClick(currentLabel.value)\n}\n</script>\n\n<template>\n <li :class=\"nh.be('item')\">\n <a\n :class=\"nh.be('label')\"\n tabindex=\"0\"\n @click=\"handleClick\"\n @keydown.enter=\"handleClick\"\n >\n <slot>{{ label }}</slot>\n </a>\n <span :class=\"nh.be('separator')\" role=\"separator\" @click=\"handleSeparatorClick\">\n <slot name=\"separator\">\n <Renderer\n v-if=\"isFunction(separatorRenderer)\"\n :renderer=\"separatorRenderer\"\n :data=\"{ label: currentLabel }\"\n ></Renderer>\n <template v-else>\n {{ separator }}\n </template>\n </slot>\n </span>\n </li>\n</template>\n"],"names":["props","__props","nh","useNameHelper","breadcrumbState","inject","BREADCRUMB_STATE","currentLabel","ref","separator","separatorRenderer","watch","value","state","reactive","onBeforeUnmount","handleClick","emitEvent","handleSeparatorClick","_createElementBlock","_normalizeClass","_unref","_createElementVNode","_renderSlot","_ctx","label","isFunction","_createBlock","Renderer","_Fragment"],"mappings":"wUAcA,MAAMA,EAAQC,EAORC,EAAKC,gBAAc,YAAY,EAE/BC,EAAkBC,EAAAA,OAAOC,EAAA,iBAAkB,IAAI,EAE/CC,EAAeC,EAAAA,IAAIR,EAAM,KAAK,EAC9BS,EAAYD,MAAI,GAAG,EACnBE,EAAoBF,MAA8B,IAAI,EAU5D,GARAG,EAAA,MACE,IAAMX,EAAM,MACHY,GAAA,CACPL,EAAa,MAAQK,EACrBR,GAAA,MAAAA,EAAiB,eAAc,CAEnC,EAEIA,EAAiB,CACnB,MAAMS,EAA6BC,EAAAA,SAAS,CAC1C,MAAOP,CAAA,CACR,EAEDI,EAAA,MACE,IAAMP,EAAgB,UACbQ,GAAA,CACPH,EAAU,MAAQG,CACpB,EACA,CAAE,UAAW,EAAK,CACpB,EACAD,EAAA,MACE,IAAMP,EAAgB,kBACbQ,GAAA,CACPF,EAAkB,MAAQE,CAC5B,EACA,CAAE,UAAW,EAAK,CACpB,EAEAR,EAAgB,aAAaS,CAAK,EAElCE,EAAAA,gBAAgB,IAAM,CACpBX,EAAgB,aAAaS,CAAK,CAAA,CACnC,CAAA,CAGH,SAASG,GAAc,CACXC,EAAAA,UAAAjB,EAAM,SAA0BO,EAAa,KAAK,EAC3CH,GAAA,MAAAA,EAAA,aAAaG,EAAa,MAAK,CAGlD,SAASW,GAAuB,CACpBD,EAAAA,UAAAjB,EAAM,iBAAkCO,EAAa,KAAK,EACnDH,GAAA,MAAAA,EAAA,qBAAqBG,EAAa,MAAK,6BAKxDY,EAAA,mBAqBK,KAAA,CArBA,MAAKC,EAAE,eAAAC,EAAA,MAAEnB,CAAA,EAAC,GAAE,MAAA,CAAA,CAAA,GACfoB,EAAAA,mBAOI,IAAA,CAND,MAAKF,EAAE,eAAAC,EAAA,MAAEnB,CAAA,EAAC,GAAE,OAAA,CAAA,EACb,SAAS,IACR,QAAOc,EACP,qBAAeA,EAAW,CAAA,OAAA,CAAA,CAAA,GAE3BO,EAAAA,WAAwBC,sBAAxB,IAAwB,qCAAfC,EAAK,KAAA,EAAA,CAAA,SAEhBH,EAAAA,mBAWO,OAAA,CAXA,MAAKF,EAAE,eAAAC,EAAA,MAAEnB,CAAA,EAAC,GAAE,WAAA,CAAA,EAAe,KAAK,YAAa,QAAOgB,CAAA,GACzDK,EAAAA,WASOC,wBATP,IASO,CAPGH,QAAAK,EAAAA,UAAA,EAAWhB,EAAiB,KAAA,iBADpCiB,EAAA,YAIYN,QAAAO,CAAA,EAAA,OAFT,SAAUlB,EAAiB,MAC3B,YAAeH,EAAY,KAAA,+CAE9BY,EAEW,mBAAAU,EAAA,SAAA,CAAA,IAAA,GAAA,qCADNpB,EAAS,KAAA,EAAA,CAAA"}