@oruga-ui/oruga-next/dist/esm/breadcrumb.mjs.map

UI components for Vue.js and CSS framework agnostic

{"version":3,"file":"breadcrumb.mjs","sources":["../../src/components/breadcrumb/Breadcrumb.vue","../../src/components/breadcrumb/BreadcrumbItem.vue","../../src/components/breadcrumb/index.ts"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, useTemplateRef } from \"vue\";\n\nimport { getDefault } from \"@/utils/config\";\nimport {\n    defineClasses,\n    normalizeOptions,\n    useProviderParent,\n    useSequentialId,\n} from \"@/composables\";\n\nimport type { BreadcrumbProps } from \"./props\";\n\n/**\n * The classic breadcrumb, in different colors, sizes, and states\n * @displayName Breadcrumb\n * @requires ./BreadcrumbItem.vue\n * @style _breadcrumb.scss\n */\ndefineOptions({\n    isOruga: true,\n    name: \"OBreadcrumb\",\n    configField: \"breadcrumb\",\n});\n\nconst props = withDefaults(defineProps<BreadcrumbProps>(), {\n    override: undefined,\n    options: undefined,\n    size: () => getDefault(\"breadcrumb.size\"),\n    variant: () => getDefault(\"breadcrumb.variant\"),\n    position: () => getDefault(\"breadcrumb.position\"),\n    separator: () => getDefault(\"breadcrumb.separator\", \"/\"),\n    ariaLabel: () => getDefault(\"modal.ariaLabel\", \"Breadcrumb\"),\n});\n\nconst rootRef = useTemplateRef(\"rootElement\");\n\n/** provide functionalities and data to child item components */\nuseProviderParent({ rootRef });\n\n// create a unique id sequence\nconst { nextSequence } = useSequentialId();\n\n/** normalized programamtic options */\nconst normalizedOptions = computed(() =>\n    normalizeOptions(props.options, nextSequence),\n);\n\nconst customStyle = computed(() => ({ \"--seperator\": `'${props.separator}'` }));\n\n// #region --- Computed Component Classes ---\n\nconst rootClasses = defineClasses(\n    [\"rootClass\", \"o-breadcrumb\"],\n    [\n        \"sizeClass\",\n        \"o-breadcrumb--\",\n        computed(() => props.size),\n        computed(() => !!props.size),\n    ],\n    [\n        \"variantClass\",\n        \"o-breadcrumb--\",\n        computed(() => props.variant),\n        computed(() => !!props.variant),\n    ],\n    [\n        \"positionClass\",\n        \"o-breadcrumb--\",\n        computed(() => props.position),\n        computed(() => !!props.position),\n    ],\n);\n\nconst listClasses = defineClasses([\"listClass\", \"o-breadcrumb__list\"]);\n\n// #endregion --- Computed Component Classes ---\n</script>\n\n<template>\n    <nav\n        ref=\"rootElement\"\n        data-oruga=\"breadcrumb\"\n        :class=\"rootClasses\"\n        :style=\"customStyle\"\n        :aria-label=\"ariaLabel\">\n        <ol :class=\"listClasses\">\n            <!--\n                @slot Place breadcrumb items here \n            -->\n            <slot>\n                <OBreadcrumbItem\n                    v-for=\"option in normalizedOptions\"\n                    :key=\"option.key\"\n                    v-bind=\"option.attrs\"\n                    :value=\"option.value\"\n                    :label=\"option.label\"\n                    :hidden=\"option.hidden\" />\n            </slot>\n        </ol>\n    </nav>\n</template>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport OIcon from \"../icon/Icon.vue\";\n\nimport { getDefault } from \"@/utils/config\";\nimport { defineClasses, useProviderChild } from \"@/composables\";\n\nimport type { BreadcrumbItemProps } from \"./props\";\n\n/**\n * The classic breadrcumb item, in different colors, sizes, and states\n * @displayName Breadcrumb Item\n */\ndefineOptions({\n    isOruga: true,\n    name: \"OBreadcrumbItem\",\n    configField: \"breadcrumb\",\n    inheritAttrs: false,\n});\n\nconst props = withDefaults(defineProps<BreadcrumbItemProps>(), {\n    override: undefined,\n    label: undefined,\n    active: false,\n    disabled: false,\n    hidden: false,\n    iconLeft: undefined,\n    iconRight: undefined,\n    iconPack: () => getDefault(\"breadcrumb.iconPack\"),\n    iconSize: () => getDefault(\"breadcrumb.iconSize\"),\n    tag: () => getDefault(\"breadcrumb.tag\", \"a\"),\n});\n\n/** inject functionalities and data from the parent component */\nconst { item } = useProviderChild();\n\n// #region --- Computed Component Classes ---\n\nconst rootClasses = defineClasses(\n    [\"itemClass\", \"o-breadcrumb__item\"],\n    [\n        \"disabledClass\",\n        \"o-breadcrumb__item--disabled\",\n        null,\n        computed(() => props.disabled),\n    ],\n    [\n        \"activeClass\",\n        \"o-breadcrumb__item--active\",\n        null,\n        computed(() => props.active),\n    ],\n);\n\nconst linkClasses = defineClasses([\"linkClass\", \"o-breadcrumb__item__link\"]);\n\nconst iconLeftClasses = defineClasses(\n    [\"iconClass\", \"o-breadcrumb__item__icon\"],\n    [\"iconLeftClass\", \"o-breadcrumb__item__icon--left\"],\n);\n\nconst iconRightClasses = defineClasses(\n    [\"iconClass\", \"o-breadcrumb__item__icon\"],\n    [\"iconRightClass\", \"o-breadcrumb__item__icon--right\"],\n);\n\n// #endregion --- Computed Component Classes ---\n</script>\n\n<template>\n    <li\n        v-show=\"!hidden\"\n        data-oruga=\"breadcrumb-item\"\n        :data-id=\"`breadcrumb-${item.identifier}`\"\n        :class=\"rootClasses\"\n        :aria-current=\"active ? 'page' : undefined\">\n        <!-- \n            @slot Item seperator\n        -->\n        <slot name=\"seperator\"> </slot>\n\n        <component\n            :is=\"tag\"\n            v-bind=\"$attrs\"\n            :class=\"linkClasses\"\n            :disabled=\"disabled\"\n            :active=\"active\"\n            :aria-current=\"active ? 'page' : undefined\">\n            <o-icon\n                v-if=\"iconLeft\"\n                :icon=\"iconLeft\"\n                :pack=\"iconPack\"\n                :size=\"iconSize\"\n                :class=\"iconLeftClasses\" />\n\n            <!-- \n                @slot Override label\n            -->\n            <slot>\n                <span>{{ label }}</span>\n            </slot>\n\n            <o-icon\n                v-if=\"iconRight\"\n                :icon=\"iconRight\"\n                :pack=\"iconPack\"\n                :size=\"iconSize\"\n                :class=\"iconRightClasses\" />\n        </component>\n    </li>\n</template>\n","import type { App, Plugin } from \"vue\";\n\nimport Breadcrumb from \"./Breadcrumb.vue\";\nimport BreadcrumbItem from \"./BreadcrumbItem.vue\";\n\nimport { registerComponent } from \"@/utils/plugins\";\n\n/** export breadcrumb plugin */\nexport default {\n    install(app: App) {\n        registerComponent(app, Breadcrumb);\n        registerComponent(app, BreadcrumbItem);\n    },\n} as Plugin;\n\n/** export Breadcrumb components */\nexport { Breadcrumb as OBreadcrumb, BreadcrumbItem as OBreadcrumbItem };\n"],"names":["Breadcrumb","BreadcrumbItem"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyBA,UAAM,QAAQ;AAUR,UAAA,UAAU,eAAe,aAAa;AAG1B,sBAAA,EAAE,SAAS;AAGvB,UAAA,EAAE,aAAa,IAAI,gBAAgB;AAGzC,UAAM,oBAAoB;AAAA,MAAS,MAC/B,iBAAiB,MAAM,SAAS,YAAY;AAAA,IAChD;AAEM,UAAA,cAAc,SAAS,OAAO,EAAE,eAAe,IAAI,MAAM,SAAS,IAAA,EAAM;AAI9E,UAAM,cAAc;AAAA,MAChB,CAAC,aAAa,cAAc;AAAA,MAC5B;AAAA,QACI;AAAA,QACA;AAAA,QACA,SAAS,MAAM,MAAM,IAAI;AAAA,QACzB,SAAS,MAAM,CAAC,CAAC,MAAM,IAAI;AAAA,MAC/B;AAAA,MACA;AAAA,QACI;AAAA,QACA;AAAA,QACA,SAAS,MAAM,MAAM,OAAO;AAAA,QAC5B,SAAS,MAAM,CAAC,CAAC,MAAM,OAAO;AAAA,MAClC;AAAA,MACA;AAAA,QACI;AAAA,QACA;AAAA,QACA,SAAS,MAAM,MAAM,QAAQ;AAAA,QAC7B,SAAS,MAAM,CAAC,CAAC,MAAM,QAAQ;AAAA,MAAA;AAAA,IAEvC;AAEA,UAAM,cAAc,cAAc,CAAC,aAAa,oBAAoB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrDrE,UAAM,QAAQ;AAcR,UAAA,EAAE,KAAK,IAAI,iBAAiB;AAIlC,UAAM,cAAc;AAAA,MAChB,CAAC,aAAa,oBAAoB;AAAA,MAClC;AAAA,QACI;AAAA,QACA;AAAA,QACA;AAAA,QACA,SAAS,MAAM,MAAM,QAAQ;AAAA,MACjC;AAAA,MACA;AAAA,QACI;AAAA,QACA;AAAA,QACA;AAAA,QACA,SAAS,MAAM,MAAM,MAAM;AAAA,MAAA;AAAA,IAEnC;AAEA,UAAM,cAAc,cAAc,CAAC,aAAa,0BAA0B,CAAC;AAE3E,UAAM,kBAAkB;AAAA,MACpB,CAAC,aAAa,0BAA0B;AAAA,MACxC,CAAC,iBAAiB,gCAAgC;AAAA,IACtD;AAEA,UAAM,mBAAmB;AAAA,MACrB,CAAC,aAAa,0BAA0B;AAAA,MACxC,CAAC,kBAAkB,iCAAiC;AAAA,IACxD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzDA,MAAe,QAAA;AAAA,EACX,QAAQ,KAAU;AACd,sBAAkB,KAAKA,WAAU;AACjC,sBAAkB,KAAKC,SAAc;AAAA,EAAA;AAE7C;"}