@nextcloud/vue 9.0.0-alpha.7 → 9.0.0-alpha.8

package/dist/chunks/NcAppNavigationNew-BO-Llutk.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NcAppNavigationNew-BO-Llutk.mjs","sources":["../../src/components/NcAppNavigationNew/NcAppNavigationNew.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2018 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n <docs>\n### Usage\n\n ```\n <template>\n\t<NcAppNavigationNew text=\"New Element\">\n\t\t<template #icon>\n\t\t\t<Plus :size=\"20\" />\n\t\t</template>\n\t</NcAppNavigationNew>\n </template>\n <script>\n import Plus from 'vue-material-design-icons/Plus'\n\n export default {\n\tcomponents: {\n\t\tPlus,\n\t},\n }\n </script>\n ```\n </docs>\n\n<template>\n\t<div class=\"app-navigation-new\">\n\t\t<NcButton :id=\"buttonId\"\n\t\t\t:disabled=\"disabled\"\n\t\t\t:type=\"type\"\n\t\t\t@click=\"$emit('click')\">\n\t\t\t<template #icon>\n\t\t\t\t<slot name=\"icon\" />\n\t\t\t</template>\n\t\t\t{{ text }}\n\t\t</NcButton>\n\t</div>\n</template>\n\n<script>\nimport NcButton from '../NcButton/index.ts'\n\nexport default {\n\tcomponents: {\n\t\tNcButton,\n\t},\n\tprops: {\n\t\tbuttonId: {\n\t\t\ttype: String,\n\t\t\trequired: false,\n\t\t\tdefault: '',\n\t\t},\n\t\tdisabled: {\n\t\t\ttype: Boolean,\n\t\t\trequired: false,\n\t\t\tdefault: false,\n\t\t},\n\t\ttext: {\n\t\t\ttype: String,\n\t\t\trequired: true,\n\t\t},\n\t\ttype: {\n\t\t\ttype: String,\n\t\t\tdefault: 'primary',\n\t\t\tvalidator(value) {\n\t\t\t\treturn ['primary', 'secondary', 'tertiary'].indexOf(value) !== -1\n\t\t\t},\n\t\t},\n\t},\n\n\temits: ['click'],\n}\n</script>\n\n<style lang=\"scss\" scoped>\n/* 'New' button */\n.app-navigation-new {\n\tdisplay: block;\n\tpadding: calc(var(--default-grid-baseline, 4px) * 2);\n\tbutton {\n\t\twidth: 100%;\n\t}\n}\n</style>\n"],"names":["_openBlock","_createElementBlock","_createVNode","_renderSlot","_withCtx","_createTextVNode"],"mappings":";;;AA6CA,MAAK,YAAU;AAAA,EACd,YAAY;AAAA,IACX;AAAA,EACA;AAAA,EACD,OAAO;AAAA,IACN,UAAU;AAAA,MACT,MAAM;AAAA,MACN,UAAU;AAAA,MACV,SAAS;AAAA,IACT;AAAA,IACD,UAAU;AAAA,MACT,MAAM;AAAA,MACN,UAAU;AAAA,MACV,SAAS;AAAA,IACT;AAAA,IACD,MAAM;AAAA,MACL,MAAM;AAAA,MACN,UAAU;AAAA,IACV;AAAA,IACD,MAAM;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,MACT,UAAU,OAAO;AAChB,eAAO,CAAC,WAAW,aAAa,UAAU,EAAE,QAAQ,KAAK,MAAM;AAAA,MAC/D;AAAA,IACD;AAAA,EACD;AAAA,EAED,OAAO,CAAC,OAAO;AAChB;AA7CM,MAAA,aAAA,EAAA,OAAM,qBAAoB;;;AAA/B,SAAAA,UAAA,GAAAC,mBAUM,OAVN,YAUM;AAAA,IATLC,YAQW,qBAAA;AAAA,MARA,IAAI,OAAQ;AAAA,MACrB,UAAU,OAAQ;AAAA,MAClB,MAAM,OAAI;AAAA,MACV,+CAAO,KAAK,MAAA,OAAA;AAAA;MACF,cACV,MAAoB;AAAA,QAApBC,WAAoB,KAAA,QAAA,QAAA,CAAA,GAAA,QAAA,IAAA;AAAA;MAnCxB,SAAAC,QAoCc,MACX;AAAA,QArCHC,gBAoCc,sBACR,OAAI,IAAA,GAAA,CAAA;AAAA;MArCV,GAAA;AAAA;;;;"}

package/dist/chunks/NcAppNavigationSearch-DLbzvkkq.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NcAppNavigationSearch-DLbzvkkq.mjs","sources":["../../src/components/NcAppNavigationSearch/NcAppNavigationSearch.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2024 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n### Usage\n\n```vue\n<template>\n\t<div class=\"styleguide-wrapper\">\n\t\t<NcContent app-name=\"styleguide-app-navigation\" class=\"content-styleguidist\">\n\t\t\t<NcAppNavigation>\n\t\t\t\t<template #search>\n\t\t\t\t\t<NcAppNavigationSearch v-model=\"searchQuery\">\n\t\t\t\t\t\t<template #actions>\n\t\t\t\t\t\t\t<NcActions aria-label=\"Filters\">\n\t\t\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t\t\t<IconFilter :size=\"20\" />\n\t\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t\t\t<NcActionButton>\n\t\t\t\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t\t\t\t<IconAccount :size=\"20\" />\n\t\t\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t\t\t\tFilter by name\n\t\t\t\t\t\t\t\t</NcActionButton>\n\t\t\t\t\t\t\t\t<NcActionButton>\n\t\t\t\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t\t\t\t<IconCalendarAccount :size=\"20\" />\n\t\t\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t\t\t\tFilter by year\n\t\t\t\t\t\t\t\t</NcActionButton>\n\t\t\t\t\t\t\t</NcActions>\n\t\t\t\t\t\t\t<NcButton aria-label=\"Search globally\" type=\"tertiary\">\n\t\t\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t\t\t<IconSearchGlobal :size=\"20\" />\n\t\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t\t</NcButton>\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</NcAppNavigationSearch>\n\t\t\t\t</template>\n\t\t\t\t<template #list>\n\t\t\t\t\t<NcAppNavigationItem name=\"First navigation entry\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<IconStar :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</NcAppNavigationItem>\n\t\t\t\t\t<NcAppNavigationItem name=\"Second navigation entry\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<IconStar :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</NcAppNavigationItem>\n\t\t\t\t</template>\n\t\t\t</NcAppNavigation>\n\t\t\t<NcAppContent>\n\t\t\t\t<ul class=\"fake-content\">\n\t\t\t\t\t<li>Search query: {{ searchQuery }}</li>\n\t\t\t\t\t<li v-for=\"(item, index) in items\" :key=\"index\">\n\t\t\t\t\t\t{{ item }}\n\t\t\t\t\t</li>\n\t\t\t\t</ul>\n\t\t\t</NcAppContent>\n\t\t</NcContent>\n\t</div>\n</template>\n<script>\nimport IconAccount from 'vue-material-design-icons/Account.vue'\nimport IconCalendarAccount from 'vue-material-design-icons/CalendarAccount.vue'\nimport IconFilter from 'vue-material-design-icons/Filter.vue'\nimport IconSearchGlobal from 'vue-material-design-icons/CloudSearch.vue'\nimport IconStar from 'vue-material-design-icons/Star.vue'\n\nconst exampleItem = ['Mary', 'Patricia', 'James', 'Michael']\n\nexport default {\n\tcomponents: {\n\t\tIconAccount,\n\t\tIconCalendarAccount,\n\t\tIconFilter,\n\t\tIconSearchGlobal,\n\t\tIconStar,\n\t},\n\n\tdata() {\n\t\treturn {\n\t\t\tsearchQuery: '',\n\t\t}\n\t},\n\n\tcomputed: {\n\t\titems() {\n\t\t\treturn exampleItem.filter((item) => item.toLocaleLowerCase().includes(this.searchQuery.toLocaleLowerCase()))\n\t\t},\n\t},\n}\n</script>\n<style scoped>\n/* This styles just mock NcContent and NcAppContent */\n.content-styleguidist {\n\tposition: relative !important;\n\tmargin: 0 !important;\n\t/* prevent jumping */\n\tmin-height: 200px;\n}\n\n.content-styleguidist > * {\n\theight: auto;\n}\n\n.fake-content {\n\tpadding: var(--app-navigation-padding);\n\tpadding-top: calc(2 * var(--app-navigation-padding) + var(--default-clickable-area));\n}\n\n.styleguide-wrapper {\n\tbackground-color: var(--color-background-plain);\n\tpadding: var(--body-container-margin);\n}\n</style>\n```\n</docs>\n<template>\n\t<div class=\"app-navigation-search\"\n\t\t:class=\"{\n\t\t\t'app-navigation-search--has-actions': hasActions(),\n\t\t}\">\n\t\t<NcInputField ref=\"inputElement\"\n\t\t\tv-model=\"model\"\n\t\t\t:aria-label=\"label\"\n\t\t\tclass=\"app-navigation-search__input\"\n\t\t\tlabel-outside\n\t\t\t:placeholder=\"placeholder ?? label\"\n\t\t\tshow-trailing-button\n\t\t\t:trailing-button-label=\"t('Clear search')\"\n\t\t\ttype=\"search\"\n\t\t\t@trailing-button-click=\"onCloseSearch\">\n\t\t\t<template #trailing-button-icon>\n\t\t\t\t<IconClose :size=\"20\" />\n\t\t\t</template>\n\t\t</NcInputField>\n\t\t<div v-if=\"hasActions()\"\n\t\t\tref=\"actionsContainer\"\n\t\t\tclass=\"app-navigation-search__actions\"\n\t\t\t:class=\"{\n\t\t\t\t'app-navigation-search__actions--hidden': !showActions,\n\t\t\t\t'hidden-visually': hideActions,\n\t\t\t}\">\n\t\t\t<slot name=\"actions\" />\n\t\t</div>\n\t</div>\n</template>\n\n<script setup lang=\"ts\">\nimport { useFocusWithin } from '@vueuse/core'\nimport { ref, nextTick, useSlots, watch, useTemplateRef } from 'vue'\nimport { t } from '../../l10n.js'\n\nimport IconClose from 'vue-material-design-icons/Close.vue'\nimport NcInputField from '../NcInputField/NcInputField.vue'\n\ndefineProps({\n\t/**\n\t * Text used to label the search input\n\t */\n\tlabel: {\n\t\ttype: String,\n\t\tdefault: t('Search…'),\n\t},\n\n\t/**\n\t * Placeholder of the search input\n\t * By default the value of `label` is used.\n\t */\n\tplaceholder: {\n\t\ttype: String,\n\t\tdefault: null,\n\t},\n})\n\n/**\n * Current search input\n */\nconst model = defineModel<string>({ default: '' })\nconst slots = useSlots()\n\nconst inputElement = ref()\nconst { focused: inputHasFocus } = useFocusWithin(inputElement)\n\n/** Timeout used to define when the search input is fully expanded */\nconst transitionTimeout = Number.parseInt(window.getComputedStyle(window.document.body).getPropertyValue('--animation-quick')) || 100\n\nconst actionsContainer = useTemplateRef('actionsContainer')\nconst hasActions = () => !!slots.actions?.({})\nconst showActions = ref(true)\nconst timeoutId = ref()\n/** This is used to hide the actions after the transition is done */\nconst hideActions = ref(false)\nwatch(inputHasFocus, () => {\n\tshowActions.value = !inputHasFocus.value\n\twindow.clearTimeout(timeoutId.value)\n\tif (showActions.value) {\n\t\thideActions.value = false\n\t} else {\n\t\t// If the transition is done, we fully hide the actions visually\n\t\twindow.setTimeout(() => {\n\t\t\thideActions.value = !showActions.value\n\t\t}, transitionTimeout)\n\t}\n})\n\n/**\n * Handle close the search\n */\nfunction onCloseSearch() {\n\tmodel.value = ''\n\tif (hasActions()) {\n\t\tshowActions.value = true\n\t\tnextTick(() => actionsContainer.value?.querySelector('button')?.focus())\n\t}\n}\n</script>\n\n<style scoped lang=\"scss\">\n.app-navigation-search {\n\tdisplay: flex;\n\tgap: var(--app-navigation-padding);\n\tpadding: var(--app-navigation-padding);\n\n\t&--has-actions &__input {\n\t\tflex-grow: 1;\n\t\tz-index: 3;\n\t}\n\n\t&__actions {\n\t\tdisplay: flex;\n\t\tgap: var(--default-grid-baseline);\n\n\t\tmargin-inline-start: 0;\n\t\tmax-width: calc(2 * var(--default-clickable-area) + var(--default-grid-baseline));\n\t\tmax-height: var(--default-clickable-area);\n\n\t\ttransition: margin-inline-start var(--animation-quick);\n\n\t\t&--hidden {\n\t\t\tmargin-inline-start: calc(-1 * var(--default-clickable-area));\n\t\t}\n\t}\n\n\t&__input {\n\t\t// This is a fallback for legacy version (Nextcloud 29 and older) so that we keep the pill like design there\n\t\t--input-border-radius: var(--border-radius-element, var(--border-radius-pill)) !important;\n\t}\n}\n</style>\n"],"names":["_useModel"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsLM,UAAA,QAAQA,SAAmC,SAAA,YAAA;AACjD,UAAM,QAAQ,SAAS;AAEvB,UAAM,eAAe,IAAI;AACzB,UAAM,EAAE,SAAS,kBAAkB,eAAe,YAAY;AAG9D,UAAM,oBAAoB,OAAO,SAAS,OAAO,iBAAiB,OAAO,SAAS,IAAI,EAAE,iBAAiB,mBAAmB,CAAC,KAAK;AAE5H,UAAA,mBAAmB,eAAe,kBAAkB;AAC1D,UAAM,aAAa,MAAM,CAAC,CAAC,MAAM,UAAU,CAAA,CAAE;AACvC,UAAA,cAAc,IAAI,IAAI;AAC5B,UAAM,YAAY,IAAI;AAEhB,UAAA,cAAc,IAAI,KAAK;AAC7B,UAAM,eAAe,MAAM;AACd,kBAAA,QAAQ,CAAC,cAAc;AAC5B,aAAA,aAAa,UAAU,KAAK;AACnC,UAAI,YAAY,OAAO;AACtB,oBAAY,QAAQ;AAAA,MAAA,OACd;AAEN,eAAO,WAAW,MAAM;AACX,sBAAA,QAAQ,CAAC,YAAY;AAAA,WAC/B,iBAAiB;AAAA,MAAA;AAAA,IACrB,CACA;AAKD,aAAS,gBAAgB;AACxB,YAAM,QAAQ;AACd,UAAI,cAAc;AACjB,oBAAY,QAAQ;AACpB,iBAAS,MAAM,iBAAiB,OAAO,cAAc,QAAQ,GAAG,OAAO;AAAA,MAAA;AAAA,IACxE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/chunks/NcAppNavigationSettings-vM8ajNNK.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NcAppNavigationSettings-vM8ajNNK.mjs","sources":["../../node_modules/vue-material-design-icons/Cog.vue","../../src/components/NcAppNavigationSettings/NcAppNavigationSettings.vue"],"sourcesContent":["<template>\n  <span v-bind=\"$attrs\"\n        :aria-hidden=\"title ? null : 'true'\"\n        :aria-label=\"title\"\n        class=\"material-design-icon cog-icon\"\n        role=\"img\"\n        @click=\"$emit('click', $event)\">\n    <svg :fill=\"fillColor\"\n         class=\"material-design-icon__svg\"\n         :width=\"size\"\n         :height=\"size\"\n         viewBox=\"0 0 24 24\">\n      <path d=\"M12,15.5A3.5,3.5 0 0,1 8.5,12A3.5,3.5 0 0,1 12,8.5A3.5,3.5 0 0,1 15.5,12A3.5,3.5 0 0,1 12,15.5M19.43,12.97C19.47,12.65 19.5,12.33 19.5,12C19.5,11.67 19.47,11.34 19.43,11L21.54,9.37C21.73,9.22 21.78,8.95 21.66,8.73L19.66,5.27C19.54,5.05 19.27,4.96 19.05,5.05L16.56,6.05C16.04,5.66 15.5,5.32 14.87,5.07L14.5,2.42C14.46,2.18 14.25,2 14,2H10C9.75,2 9.54,2.18 9.5,2.42L9.13,5.07C8.5,5.32 7.96,5.66 7.44,6.05L4.95,5.05C4.73,4.96 4.46,5.05 4.34,5.27L2.34,8.73C2.21,8.95 2.27,9.22 2.46,9.37L4.57,11C4.53,11.34 4.5,11.67 4.5,12C4.5,12.33 4.53,12.65 4.57,12.97L2.46,14.63C2.27,14.78 2.21,15.05 2.34,15.27L4.34,18.73C4.46,18.95 4.73,19.03 4.95,18.95L7.44,17.94C7.96,18.34 8.5,18.68 9.13,18.93L9.5,21.58C9.54,21.82 9.75,22 10,22H14C14.25,22 14.46,21.82 14.5,21.58L14.87,18.93C15.5,18.67 16.04,18.34 16.56,17.94L19.05,18.95C19.27,19.03 19.54,18.95 19.66,18.73L21.66,15.27C21.78,15.05 21.73,14.78 21.54,14.63L19.43,12.97Z\">\n        <title v-if=\"title\">{{ title }}</title>\n      </path>\n    </svg>\n  </span>\n</template>\n\n<script>\nexport default {\n  name: \"CogIcon\",\n  emits: ['click'],\n  props: {\n    title: {\n      type: String,\n    },\n    fillColor: {\n      type: String,\n      default: \"currentColor\"\n    },\n    size: {\n      type: Number,\n      default: 24\n    }\n  }\n}\n</script>","<!--\n  - SPDX-FileCopyrightText: 2018 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<script setup lang=\"ts\">\nimport type { Slot } from 'vue'\nimport { onClickOutside } from '@vueuse/core'\nimport { computed, ref, useTemplateRef } from 'vue'\nimport { t } from '../../l10n.js'\nimport GenRandomId from '../../utils/GenRandomId.js'\n\nimport IconCog from 'vue-material-design-icons/Cog.vue'\nimport NcButton from '../NcButton/NcButton.vue'\n\nconst {\n\texcludeClickOutsideSelectors = [],\n\tname = t('Settings'),\n} = defineProps<{\n\t/**\n\t * A query-selector or an array of query-selectors\n\t * to be ignored when clicking outside an element\n\t */\n\texcludeClickOutsideSelectors?: string | string[]\n\n\t/**\n\t * Text of the button\n\t * @default 'Settings'\n\t */\n\tname?: string\n}>()\n\ndefineSlots<{\n\t/**\n\t * Content of the accordion button (the settings).\n\t */\n\tdefault: Slot\n}>()\n\nconst contentId = GenRandomId()\n/**\n * Are the settings open\n */\nconst open = ref(false)\n\n// Close the menu when the user clicks outside of the container\nconst container = useTemplateRef('wrapperElement')\nconst ignore = computed(() => Array.isArray(excludeClickOutsideSelectors)\n\t? excludeClickOutsideSelectors\n\t: excludeClickOutsideSelectors.split(' '),\n)\nonClickOutside(container, () => { open.value = false }, { ignore })\n</script>\n\n<template>\n\t<div ref=\"wrapperElement\" :class=\"$style.container\">\n\t\t<div :class=\"$style.header\">\n\t\t\t<NcButton :aria-controls=\"contentId\"\n\t\t\t\t:aria-expanded=\"open ? 'true' : 'false'\"\n\t\t\t\t@click=\"open = !open\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconCog :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\t{{ name }}\n\t\t\t</NcButton>\n\t\t</div>\n\t\t<Transition :enter-active-class=\"$style.animationActive\"\n\t\t\t:leave-active-class=\"$style.animationActive\"\n\t\t\t:enter-from-class=\"$style.animationStop\"\n\t\t\t:leave-to-class=\"$style.animationStop\">\n\t\t\t<div v-show=\"open\"\n\t\t\t\t:id=\"contentId\"\n\t\t\t\t:class=\"$style.content\">\n\t\t\t\t<slot />\n\t\t\t</div>\n\t\t</Transition>\n\t</div>\n</template>\n\n<style module>\n.container {\n\tmargin-top: auto;\n\tpadding: var(--default-grid-baseline);\n}\n\n.header {\n\tmargin-block: 0 var(--default-grid-baseline);\n\tmargin-inline: var(--default-grid-baseline);\n}\n\n.content {\n\tdisplay: block;\n\tpadding: 10px;\n\n\t/* prevent scrolled contents from stopping too early */\n\tmargin-bottom: calc(-1 * var(--default-grid-baseline));\n\n\t/* restrict height of settings and make scrollable */\n\tmax-height: 300px;\n\toverflow-y: auto;\n}\n\n.animationActive {\n\ttransition-duration: var(--animation-slow);\n\ttransition-property: max-height, padding;\n\toverflow-y: hidden !important;\n}\n\n.animationStop {\n\tmax-height: 0 !important;\n\tpadding: 0 10px !important;\n}\n</style>\n"],"names":["_sfc_main","_hoisted_1","_createElementBlock","_mergeProps","_createElementVNode","_createCommentVNode","container"],"mappings":";;;;;;;AAoBA,MAAKA,cAAU;AAAA,EACb,MAAM;AAAA,EACN,OAAO,CAAC,OAAO;AAAA,EACf,OAAO;AAAA,IACL,OAAO;AAAA,MACL,MAAM;AAAA,IACP;AAAA,IACD,WAAW;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA,IACD,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,EACF;AACF;AApCA,MAAAC,eAAA,CAAA,eAAA,YAAA;AAAA,MAAA,aAAA,CAAA,QAAA,SAAA,QAAA;AAYY,MAAA,aAAA,EAAA,GAAE,84BAA64B;qBAZ35B,KAAA,EAAA;;sBACEC,mBAeO,QAfPC,WAAc,KAAM,QAAA;AAAA,IACb,eAAa,OAAK,QAAA,OAAA;AAAA,IAClB,cAAY,OAAK;AAAA,IAClB,OAAM;AAAA,IACN,MAAK;AAAA,IACJ,SAAK,OAAA,CAAA,MAAA,OAAA,CAAA,IAAA,YAAE,KAAK,MAAA,SAAU,MAAM;AAAA;kBACjCD,mBAQM,OAAA;AAAA,MARA,MAAM,OAAS;AAAA,MAChB,OAAM;AAAA,MACL,OAAO,OAAI;AAAA,MACX,QAAQ,OAAI;AAAA,MACb,SAAQ;AAAA;MACXE,mBAEO,QAFP,YAEO;AAAA,QADQ,OAAK,sBAAlBF,mBAAuC,SAb/C,4BAa+B,OAAK,KAAA,GAAA,CAAA,KAbpCG,mBAAA,IAAA,IAAA;AAAA;IAAA,GAAA,GAAA,UAAA;AAAA,EAAA,GAAA,IAAAJ,YAAA;;;;;;;;;;;ACuCA,UAAM,YAAY,YAAY;AAIxB,UAAA,OAAO,IAAI,KAAK;AAGhB,UAAAK,aAAY,eAAe,gBAAgB;AACjD,UAAM,SAAS;AAAA,MAAS,MAAM,MAAM,QAAQ,QAA4B,4BAAA,IACrE,QAAA,+BACA,QAA4B,6BAAC,MAAM,GAAG;AAAA,IACzC;AACA,mBAAeA,YAAW,MAAM;AAAE,WAAK,QAAQ;AAAA,IAAA,GAAS,EAAE,OAAA,CAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","x_google_ignoreList":[0]}

package/dist/chunks/NcAppNavigationToggle-DBtf139E.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NcAppNavigationToggle-DBtf139E.mjs","sources":["../../node_modules/vue-material-design-icons/Menu.vue","../../node_modules/vue-material-design-icons/MenuOpen.vue","../../src/components/NcAppNavigationToggle/NcAppNavigationToggle.vue"],"sourcesContent":["<template>\n  <span v-bind=\"$attrs\"\n        :aria-hidden=\"title ? null : 'true'\"\n        :aria-label=\"title\"\n        class=\"material-design-icon menu-icon\"\n        role=\"img\"\n        @click=\"$emit('click', $event)\">\n    <svg :fill=\"fillColor\"\n         class=\"material-design-icon__svg\"\n         :width=\"size\"\n         :height=\"size\"\n         viewBox=\"0 0 24 24\">\n      <path d=\"M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z\">\n        <title v-if=\"title\">{{ title }}</title>\n      </path>\n    </svg>\n  </span>\n</template>\n\n<script>\nexport default {\n  name: \"MenuIcon\",\n  emits: ['click'],\n  props: {\n    title: {\n      type: String,\n    },\n    fillColor: {\n      type: String,\n      default: \"currentColor\"\n    },\n    size: {\n      type: Number,\n      default: 24\n    }\n  }\n}\n</script>","<template>\n  <span v-bind=\"$attrs\"\n        :aria-hidden=\"title ? null : 'true'\"\n        :aria-label=\"title\"\n        class=\"material-design-icon menu-open-icon\"\n        role=\"img\"\n        @click=\"$emit('click', $event)\">\n    <svg :fill=\"fillColor\"\n         class=\"material-design-icon__svg\"\n         :width=\"size\"\n         :height=\"size\"\n         viewBox=\"0 0 24 24\">\n      <path d=\"M21,15.61L19.59,17L14.58,12L19.59,7L21,8.39L17.44,12L21,15.61M3,6H16V8H3V6M3,13V11H13V13H3M3,18V16H16V18H3Z\">\n        <title v-if=\"title\">{{ title }}</title>\n      </path>\n    </svg>\n  </span>\n</template>\n\n<script>\nexport default {\n  name: \"MenuOpenIcon\",\n  emits: ['click'],\n  props: {\n    title: {\n      type: String,\n    },\n    fillColor: {\n      type: String,\n      default: \"currentColor\"\n    },\n    size: {\n      type: Number,\n      default: 24\n    }\n  }\n}\n</script>","<!--\n  - SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<template>\n\t<div class=\"app-navigation-toggle-wrapper\">\n\t\t<NcButton class=\"app-navigation-toggle\"\n\t\t\ttype=\"tertiary\"\n\t\t\t:aria-expanded=\"open ? 'true' : 'false'\"\n\t\t\t:aria-label=\"label\"\n\t\t\t:title=\"label\"\n\t\t\taria-controls=\"app-navigation-vue\"\n\t\t\t@click=\"toggleNavigation\">\n\t\t\t<template #icon>\n\t\t\t\t<MenuOpenIcon v-if=\"open\" :size=\"20\" />\n\t\t\t\t<MenuIcon v-else :size=\"20\" />\n\t\t\t</template>\n\t\t</NcButton>\n\t</div>\n</template>\n\n<script>\nimport NcButton from '../NcButton/index.ts'\nimport { t } from '../../l10n.js'\n\nimport MenuIcon from 'vue-material-design-icons/Menu.vue'\nimport MenuOpenIcon from 'vue-material-design-icons/MenuOpen.vue'\n\nexport default {\n\tname: 'NcAppNavigationToggle',\n\n\tcomponents: {\n\t\tNcButton,\n\t\tMenuIcon,\n\t\tMenuOpenIcon,\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * Tracks whether the toggle has been clicked or not.\n\t\t * If it has been clicked, switches between the different MenuIcons\n\t\t * and emits a boolean indicating its opened status\n\t\t */\n\t\topen: {\n\t\t\ttype: Boolean,\n\t\t\trequired: true,\n\t\t},\n\t},\n\n\temits: ['update:open'],\n\n\tcomputed: {\n\t\tlabel() {\n\t\t\treturn this.open ? t('Close navigation') : t('Open navigation')\n\t\t},\n\t},\n\tmethods: {\n\t\t/**\n\t\t * Once the toggle has been clicked, emits the toggle status\n\t\t * so parent components can gauge the status of the navigation button\n\t\t */\n\t\ttoggleNavigation() {\n\t\t\tthis.$emit('update:open', !this.open)\n\t\t},\n\t},\n}\n</script>\n\n<style scoped lang=\"scss\">\n.app-navigation-toggle-wrapper {\n\tposition: absolute;\n\ttop: var(--app-navigation-padding);\n\tinset-inline-end: calc(0px - var(--app-navigation-padding));\n\tmargin-inline-end: calc(-1 * var(--default-clickable-area));\n}\n\nbutton.app-navigation-toggle {\n\tbackground-color: var(--color-main-background);\n}\n</style>\n"],"names":["_sfc_main","_hoisted_1","_hoisted_2","_hoisted_3","_createElementBlock","_mergeProps","_createElementVNode","_hoisted_4","_createCommentVNode","_openBlock","_createVNode","_createBlock"],"mappings":"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","x_google_ignoreList":[0,1]}

package/dist/chunks/NcAppSidebar-Dav-iGv2.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NcAppSidebar-Dav-iGv2.mjs","sources":["../../src/components/NcAppSidebar/NcAppSidebarTabs.vue","../../node_modules/vue-material-design-icons/DockRight.vue","../../node_modules/vue-material-design-icons/Star.vue","../../node_modules/vue-material-design-icons/StarOutline.vue","../../src/components/NcAppSidebar/NcAppSidebar.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<!-- Follows the tab aria guidelines\n\thttps://www.w3.org/TR/wai-aria-practices/examples/tabs/tabs-1/tabs.html -->\n<template>\n\t<div class=\"app-sidebar-tabs\">\n\t\t<!-- tabs navigation -->\n\t\t<!-- 33 and 34 code is for page up and page down -->\n\t\t<div v-if=\"hasMultipleTabs || showForSingleTab\"\n\t\t\trole=\"tablist\"\n\t\t\tclass=\"app-sidebar-tabs__nav\"\n\t\t\t@keydown.left.exact.prevent.stop=\"focusPreviousTab\"\n\t\t\t@keydown.right.exact.prevent.stop=\"focusNextTab\"\n\t\t\t@keydown.tab.exact.prevent.stop=\"focusActiveTabContent\"\n\t\t\t@keydown.home.exact.prevent.stop=\"focusFirstTab\"\n\t\t\t@keydown.end.exact.prevent.stop=\"focusLastTab\"\n\t\t\t@keydown.page-up.exact.prevent.stop=\"focusFirstTab\"\n\t\t\t@keydown.page-down.exact.prevent.stop=\"focusLastTab\">\n\t\t\t<NcCheckboxRadioSwitch v-for=\"tab in tabs\"\n\t\t\t\t:key=\"tab.id\"\n\t\t\t\t:aria-controls=\"`tab-${tab.id}`\"\n\t\t\t\t:aria-selected=\"String(activeTab === tab.id)\"\n\t\t\t\t:button-variant=\"true\"\n\t\t\t\t:model-value=\"activeTab === tab.id\"\n\t\t\t\t:wrapper-id=\"`tab-button-${tab.id}`\"\n\t\t\t\t:tabindex=\"activeTab === tab.id ? 0 : -1\"\n\t\t\t\tbutton-variant-grouped=\"horizontal\"\n\t\t\t\tclass=\"app-sidebar-tabs__tab\"\n\t\t\t\t:class=\"{ active: tab.id === activeTab }\"\n\t\t\t\trole=\"tab\"\n\t\t\t\ttype=\"button\"\n\t\t\t\t@update:model-value=\"setActive(tab.id)\">\n\t\t\t\t<span class=\"app-sidebar-tabs__tab-caption\">\n\t\t\t\t\t{{ tab.name }}\n\t\t\t\t</span>\n\t\t\t\t<template #icon>\n\t\t\t\t\t<NcVNodes :vnodes=\"tab.renderIcon()\">\n\t\t\t\t\t\t<span class=\"app-sidebar-tabs__tab-icon\" :class=\"tab.icon\" />\n\t\t\t\t\t</NcVNodes>\n\t\t\t\t</template>\n\t\t\t</NcCheckboxRadioSwitch>\n\t\t</div>\n\n\t\t<!-- tabs content -->\n\t\t<div :class=\"{'app-sidebar-tabs__content--multiple': hasMultipleTabs}\"\n\t\t\tclass=\"app-sidebar-tabs__content\">\n\t\t\t<!-- @slot Tabs content - NcAppSidebarTab components or any content if there is no tabs -->\n\t\t\t<slot />\n\t\t</div>\n\t</div>\n</template>\n\n<script>\nimport NcVNodes from '../NcVNodes/index.js'\nimport NcCheckboxRadioSwitch from '../NcCheckboxRadioSwitch/index.js'\n\nexport default {\n\tname: 'NcAppSidebarTabs',\n\n\tcomponents: {\n\t\tNcCheckboxRadioSwitch,\n\t\tNcVNodes,\n\t},\n\n\tprovide() {\n\t\treturn {\n\t\t\tregisterTab: this.registerTab,\n\t\t\tunregisterTab: this.unregisterTab,\n\t\t\t// Getter as an alternative to Vue 2.7 computed(() => this.activeTab)\n\t\t\tgetActiveTab: () => this.activeTab,\n\t\t\t// Used to check whether the tab header is shown so the tabs can reference the tab header for `aria-labelledby` or not\n\t\t\tisTablistShown: () => this.hasMultipleTabs,\n\t\t}\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * Id of the tab to activate\n\t\t */\n\t\tactive: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\t\t/**\n\t\t * Force the tab navigation to display even if there is only one tab\n\t\t */\n\t\tforceTabs: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t},\n\n\temits: ['update:active'],\n\n\tdata() {\n\t\treturn {\n\t\t\t/**\n\t\t\t * Tab descriptions from the passed NcSidebarTab components' props to build the tab navbar from.\n\t\t\t */\n\t\t\ttabs: [],\n\t\t\t/**\n\t\t\t * Local active (open) tab's ID. It allows to use component without v-model:active\n\t\t\t */\n\t\t\tactiveTab: '',\n\t\t}\n\t},\n\n\tcomputed: {\n\t\t/**\n\t\t * Has multiple tabs. If only one tab - its content is shown without navigation\n\t\t *\n\t\t * @return {boolean}\n\t\t */\n\t\thasMultipleTabs() {\n\t\t\treturn this.tabs.length > 1\n\t\t},\n\n\t\tshowForSingleTab() {\n\t\t\treturn this.forceTabs && this.tabs.length === 1\n\t\t},\n\n\t\tcurrentTabIndex() {\n\t\t\treturn this.tabs.findIndex((tab) => tab.id === this.activeTab)\n\t\t},\n\t},\n\n\twatch: {\n\t\tactive(active) {\n\t\t\t// Prevent running it twice\n\t\t\tif (active !== this.activeTab) {\n\t\t\t\tthis.updateActive()\n\t\t\t}\n\t\t},\n\t},\n\n\tmethods: {\n\n\t\t/**\n\t\t * Set the current active tab\n\t\t *\n\t\t * @param {string} id the id of the tab\n\t\t */\n\t\tsetActive(id) {\n\t\t\tthis.activeTab = id\n\t\t\t/**\n\t\t\t * @property {string} active - active tab's id\n\t\t\t */\n\t\t\tthis.$emit('update:active', this.activeTab)\n\t\t},\n\n\t\t/**\n\t\t * Focus the previous tab\n\t\t * and emit to the parent component\n\t\t */\n\t\tfocusPreviousTab() {\n\t\t\tif (this.currentTabIndex > 0) {\n\t\t\t\tthis.setActive(this.tabs[this.currentTabIndex - 1].id)\n\t\t\t}\n\t\t\tthis.focusActiveTab()\n\t\t},\n\n\t\t/**\n\t\t * Focus the next tab\n\t\t * and emit to the parent component\n\t\t */\n\t\tfocusNextTab() {\n\t\t\tif (this.currentTabIndex < this.tabs.length - 1) {\n\t\t\t\tthis.setActive(this.tabs[this.currentTabIndex + 1].id)\n\t\t\t}\n\t\t\tthis.focusActiveTab()\n\t\t},\n\n\t\t/**\n\t\t * Focus the first tab\n\t\t * and emit to the parent component\n\t\t */\n\t\tfocusFirstTab() {\n\t\t\tthis.setActive(this.tabs[0].id)\n\t\t\tthis.focusActiveTab()\n\t\t},\n\n\t\t/**\n\t\t * Focus the last tab\n\t\t * and emit to the parent component\n\t\t */\n\t\tfocusLastTab() {\n\t\t\tthis.setActive(this.tabs[this.tabs.length - 1].id)\n\t\t\tthis.focusActiveTab()\n\t\t},\n\n\t\t/**\n\t\t * Focus the current active tab\n\t\t */\n\t\tfocusActiveTab() {\n\t\t\tthis.$el.querySelector(`#tab-button-${this.activeTab}`).focus()\n\t\t},\n\n\t\t/**\n\t\t * Focus the content on tab\n\t\t * see aria accessibility guidelines\n\t\t */\n\t\tfocusActiveTabContent() {\n\t\t\tthis.$el.querySelector('#tab-' + this.activeTab).focus()\n\t\t},\n\n\t\t/**\n\t\t * Update the current active tab\n\t\t */\n\t\tupdateActive() {\n\t\t\tthis.activeTab = this.active\n\t\t\t&& this.tabs.some(tab => tab.id === this.active)\n\t\t\t\t? this.active\n\t\t\t\t: this.tabs.length > 0\n\t\t\t\t\t? this.tabs[0].id\n\t\t\t\t\t: ''\n\t\t},\n\n\t\t/**\n\t\t * Register child tab in the tabs\n\t\t *\n\t\t * @param {object} tab child tab passed to slot\n\t\t */\n\t\tregisterTab(tab) {\n\t\t\tthis.tabs.push(tab)\n\t\t\tthis.tabs.sort((a, b) => {\n\t\t\t\tif (a.order === b.order) {\n\t\t\t\t\treturn OC.Util.naturalSortCompare(a.name, b.name)\n\t\t\t\t}\n\t\t\t\treturn a.order - b.order\n\t\t\t})\n\t\t\tthis.updateActive()\n\t\t},\n\n\t\t/**\n\t\t * Unregister child tab from the tabs\n\t\t *\n\t\t * @param {string} id tab's id\n\t\t */\n\t\tunregisterTab(id) {\n\t\t\tconst tabIndex = this.tabs.findIndex((tab) => tab.id === id)\n\t\t\tif (tabIndex !== -1) {\n\t\t\t\tthis.tabs.splice(tabIndex, 1)\n\t\t\t}\n\t\t\tif (this.activeTab === id) {\n\t\t\t\tthis.updateActive()\n\t\t\t}\n\t\t},\n\t},\n}\n</script>\n<style lang=\"scss\" scoped>\n.app-sidebar-tabs {\n\tdisplay: flex;\n\tflex-direction: column;\n\tmin-height: 0;\n\tflex: 1 1 100%;\n\n\t&__nav {\n\t\tdisplay: flex;\n\t\tjustify-content: stretch;\n\t\tmargin: 10px 8px 0 8px;\n\t\tborder-bottom: 1px solid var(--color-border);\n\n\t\t// Override checkbox-radio-switch styles so that it looks like tabs\n\t\t& :deep(.checkbox-radio-switch--button-variant) {\n\t\t\tborder: unset !important;\n\t\t\tborder-radius: 0 !important;\n\t\t\t.checkbox-content {\n\t\t\t\tpadding: var(--default-grid-baseline);\n\t\t\t\tborder-radius: var(--default-grid-baseline) var(--default-grid-baseline) 0 0 !important;\n\t\t\t\tmargin: 0 !important;\n\t\t\t\tborder-bottom: var(--default-grid-baseline) solid transparent !important;\n\t\t\t\t.checkbox-content__icon > * {\n\t\t\t\t\tcolor: var(--color-main-text) !important;\n\t\t\t\t}\n\t\t\t}\n\t\t\t&.checkbox-radio-switch--checked .checkbox-radio-switch__content{\n\t\t\t\tbackground: transparent !important;\n\t\t\t\tcolor: var(--color-main-text) !important;\n\t\t\t\tborder-bottom: var(--default-grid-baseline) solid var(--color-primary-element) !important;\n\t\t\t}\n\t\t}\n\t}\n\n\t&__tab {\n\t\tflex: 1 1;\n\t\t&.active {\n\t\t\tcolor: var(--color-primary-element);\n\t\t}\n\n\t\t&-caption {\n\t\t\tflex: 0 1 100%;\n\t\t\twidth: 100%;\n\t\t\toverflow: hidden;\n\t\t\twhite-space: nowrap;\n\t\t\ttext-overflow: ellipsis;\n\t\t\ttext-align: center;\n\t\t}\n\n\t\t&-icon {\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t\tjustify-content: center;\n\t\t\tbackground-size: 20px;\n\t\t}\n\n\t\t// Override max-width to use all available space\n\t\t:deep(.checkbox-radio-switch__content) {\n\t\t\tmax-width: unset;\n\t\t}\n\t}\n\n\t&__content {\n\t\tposition: relative;\n\t\tmin-height: 256px;\n\t\theight: 100%;\n\t\t// force the use of the tab component if more than one tab\n\t\t// you can just put raw content if you don't use tabs\n\t\t&--multiple > :not(section) {\n\t\t\tdisplay: none;\n\t\t}\n\t}\n}\n</style>\n","<template>\n  <span v-bind=\"$attrs\"\n        :aria-hidden=\"title ? null : 'true'\"\n        :aria-label=\"title\"\n        class=\"material-design-icon dock-right-icon\"\n        role=\"img\"\n        @click=\"$emit('click', $event)\">\n    <svg :fill=\"fillColor\"\n         class=\"material-design-icon__svg\"\n         :width=\"size\"\n         :height=\"size\"\n         viewBox=\"0 0 24 24\">\n      <path d=\"M20 4H4A2 2 0 0 0 2 6V18A2 2 0 0 0 4 20H20A2 2 0 0 0 22 18V6A2 2 0 0 0 20 4M15 18H4V6H15Z\">\n        <title v-if=\"title\">{{ title }}</title>\n      </path>\n    </svg>\n  </span>\n</template>\n\n<script>\nexport default {\n  name: \"DockRightIcon\",\n  emits: ['click'],\n  props: {\n    title: {\n      type: String,\n    },\n    fillColor: {\n      type: String,\n      default: \"currentColor\"\n    },\n    size: {\n      type: Number,\n      default: 24\n    }\n  }\n}\n</script>","<template>\n  <span v-bind=\"$attrs\"\n        :aria-hidden=\"title ? null : 'true'\"\n        :aria-label=\"title\"\n        class=\"material-design-icon star-icon\"\n        role=\"img\"\n        @click=\"$emit('click', $event)\">\n    <svg :fill=\"fillColor\"\n         class=\"material-design-icon__svg\"\n         :width=\"size\"\n         :height=\"size\"\n         viewBox=\"0 0 24 24\">\n      <path d=\"M12,17.27L18.18,21L16.54,13.97L22,9.24L14.81,8.62L12,2L9.19,8.62L2,9.24L7.45,13.97L5.82,21L12,17.27Z\">\n        <title v-if=\"title\">{{ title }}</title>\n      </path>\n    </svg>\n  </span>\n</template>\n\n<script>\nexport default {\n  name: \"StarIcon\",\n  emits: ['click'],\n  props: {\n    title: {\n      type: String,\n    },\n    fillColor: {\n      type: String,\n      default: \"currentColor\"\n    },\n    size: {\n      type: Number,\n      default: 24\n    }\n  }\n}\n</script>","<template>\n  <span v-bind=\"$attrs\"\n        :aria-hidden=\"title ? null : 'true'\"\n        :aria-label=\"title\"\n        class=\"material-design-icon star-outline-icon\"\n        role=\"img\"\n        @click=\"$emit('click', $event)\">\n    <svg :fill=\"fillColor\"\n         class=\"material-design-icon__svg\"\n         :width=\"size\"\n         :height=\"size\"\n         viewBox=\"0 0 24 24\">\n      <path d=\"M12,15.39L8.24,17.66L9.23,13.38L5.91,10.5L10.29,10.13L12,6.09L13.71,10.13L18.09,10.5L14.77,13.38L15.76,17.66M22,9.24L14.81,8.63L12,2L9.19,8.63L2,9.24L7.45,13.97L5.82,21L12,17.27L18.18,21L16.54,13.97L22,9.24Z\">\n        <title v-if=\"title\">{{ title }}</title>\n      </path>\n    </svg>\n  </span>\n</template>\n\n<script>\nexport default {\n  name: \"StarOutlineIcon\",\n  emits: ['click'],\n  props: {\n    title: {\n      type: String,\n    },\n    fillColor: {\n      type: String,\n      default: \"currentColor\"\n    },\n    size: {\n      type: Number,\n      default: 24\n    }\n  }\n}\n</script>","<!--\n  - SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n### General description\n\nThis component provides a way to include the standardised sidebar.\nThe standard properties like name, subname, starred, etc. allow to automatically\ninclude a standard-header like it's used by the files app.\n\nTo conditionally show the sidebar either use `v-if` on the sidebar component,\nor use the `open` property of the component to controll the state.\nUsing `v-show` directly will result in usability issues due to internal focus trap handling.\n\n### Standard usage\n\n```vue\n<template>\n\t<NcAppSidebar\n\t\t:starred=\"starred\"\n\t\tname=\"cat-picture.jpg\"\n\t\tsubname=\"last edited 3 weeks ago\"\n\t\tbackground=\"https://nextcloud.com/wp-content/uploads/2022/08/nextcloud-logo-icon.svg\"\n\t\t@figure-click=\"figureClick\">\n\t\t<NcAppSidebarTab name=\"Search\" id=\"search-tab\">\n\t\t\t<template #icon>\n\t\t\t\t<Magnify :size=\"20\" />\n\t\t\t</template>\n\t\t\tSearch tab content\n\t\t</NcAppSidebarTab>\n\t\t<NcAppSidebarTab name=\"Settings\" id=\"settings-tab\">\n\t\t\t<template #icon>\n\t\t\t\t<Cog :size=\"20\" />\n\t\t\t</template>\n\t\t\tSettings tab content\n\t\t</NcAppSidebarTab>\n\t\t<NcAppSidebarTab name=\"Sharing\" id=\"share-tab\">\n\t\t\t<template #icon>\n\t\t\t\t<ShareVariant :size=\"20\" />\n\t\t\t</template>\n\t\t\tSharing tab content\n\t\t</NcAppSidebarTab>\n\t</NcAppSidebar>\n</template>\n<script>\n\timport Magnify from 'vue-material-design-icons/Magnify.vue'\n\timport Cog from 'vue-material-design-icons/Cog.vue'\n\timport ShareVariant from 'vue-material-design-icons/ShareVariant.vue'\n\n\texport default {\n\t\tcomponents: {\n\t\t\tMagnify,\n\t\t\tCog,\n\t\t\tShareVariant,\n\t\t},\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tstarred: false,\n\t\t\t}\n\t\t},\n\t\tmethods: {\n\t\t\tfigureClick() {\n\t\t\t\talert('figure clicked')\n\t\t\t},\n\t\t},\n\t}\n</script>\n```\n\n### One tab\n\nSingle tab is rendered without navigation.\n\n```vue\n<template>\n\t<div>\n\t\t<NcCheckboxRadioSwitch v-model=\"forceTabs\">Force tab navigation</NcCheckboxRadioSwitch>\n\t\t<NcAppSidebar\n\t\t\tname=\"cat-picture.jpg\"\n\t\t\t:force-tabs=\"forceTabs\"\n\t\t\tsubname=\"last edited 3 weeks ago\">\n\t\t\t<NcAppSidebarTab name=\"Settings\" id=\"settings-tab\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Cog :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tSingle tab content\n\t\t\t</NcAppSidebarTab>\n\t\t</NcAppSidebar>\n\t</div>\n</template>\n<script>\nimport Cog from 'vue-material-design-icons/Cog.vue'\n\nexport default {\n\tcomponents: {\n\t\tCog,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tforceTabs: false,\n\t\t}\n\t},\n}\n</script>\n```\n\n### Dynamic tabs\n\n```vue\n<template>\n\t<div>\n\t\t<NcCheckboxRadioSwitch v-model=\"showTabs[0]\">Show search tab</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"showTabs[1]\">Show settings tab</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"showTabs[2]\">Show sharing tab</NcCheckboxRadioSwitch>\n\t\t<NcAppSidebar\n\t\t\tname=\"cat-picture.jpg\"\n\t\t\tsubname=\"last edited 3 weeks ago\">\n\t\t\t<NcAppSidebarTab v-if=\"showTabs[0]\" name=\"Search\" id=\"search-tab\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Magnify :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tSearch tab content\n\t\t\t</NcAppSidebarTab>\n\t\t\t<NcAppSidebarTab v-if=\"showTabs[1]\" name=\"Settings\" id=\"settings-tab\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Cog :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tSettings\n\t\t\t</NcAppSidebarTab>\n\t\t\t<NcAppSidebarTab v-if=\"showTabs[2]\" name=\"Sharing\" id=\"share-tab\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<ShareVariant :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tSharing tab content\n\t\t\t</NcAppSidebarTab>\n\t\t</NcAppSidebar>\n\t</div>\n</template>\n<script>\nimport Magnify from 'vue-material-design-icons/Magnify.vue'\nimport Cog from 'vue-material-design-icons/Cog.vue'\nimport ShareVariant from 'vue-material-design-icons/ShareVariant.vue'\n\nexport default {\n\tcomponents: {\n\t\tMagnify,\n\t\tCog,\n\t\tShareVariant,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tshowTabs: [true, true, false],\n\t\t}\n\t},\n}\n</script>\n```\n\n### Custom order\n\n```vue\n<template>\n\t<NcAppSidebar\n\t\tname=\"cat-picture.jpg\"\n\t\tsubname=\"last edited 3 weeks ago\">\n\t\t<NcAppSidebarTab name=\"Search\" id=\"search-tab\" :order=\"3\">\n\t\t\t<template #icon>\n\t\t\t\t<Magnify :size=\"20\" />\n\t\t\t</template>\n\t\t\tSearch tab content\n\t\t</NcAppSidebarTab>\n\t\t<NcAppSidebarTab name=\"Settings\" id=\"settings-tab\" :order=\"2\">\n\t\t\t<template #icon>\n\t\t\t\t<Cog :size=\"20\" />\n\t\t\t</template>\n\t\t\tSettings tab content\n\t\t</NcAppSidebarTab>\n\t\t<NcAppSidebarTab name=\"Sharing\" id=\"share-tab\" :order=\"1\">\n\t\t\t<template #icon>\n\t\t\t\t<ShareVariant :size=\"20\" />\n\t\t\t</template>\n\t\t\tSharing tab content\n\t\t</NcAppSidebarTab>\n\t</NcAppSidebar>\n</template>\n<script>\nimport Magnify from 'vue-material-design-icons/Magnify.vue'\nimport Cog from 'vue-material-design-icons/Cog.vue'\nimport ShareVariant from 'vue-material-design-icons/ShareVariant.vue'\n\nexport default {\n\tcomponents: {\n\t\tMagnify,\n\t\tCog,\n\t\tShareVariant,\n\t},\n}\n</script>\n```\n\n### Activating tab programmatically\n\n```vue\n<template>\n\t<div>\n\t\t<NcSelect v-model=\"active\" :options=\"['search-tab', 'settings-tab', 'share-tab']\" />\n\t\t<NcAppSidebar\n\t\t\tname=\"cat-picture.jpg\"\n\t\t\tsubname=\"last edited 3 weeks ago\"\n\t\t\tv-model:active=\"active\">\n\t\t\t<NcAppSidebarTab name=\"Search\" id=\"search-tab\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Magnify :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tSearch tab content\n\t\t\t</NcAppSidebarTab>\n\t\t\t<NcAppSidebarTab name=\"Settings\" id=\"settings-tab\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Cog :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tSettings\n\t\t\t</NcAppSidebarTab>\n\t\t\t<NcAppSidebarTab name=\"Sharing\" id=\"share-tab\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<ShareVariant :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tSharing tab content\n\t\t\t</NcAppSidebarTab>\n\t\t</NcAppSidebar>\n\t</div>\n</template>\n<script>\nimport Magnify from 'vue-material-design-icons/Magnify.vue'\nimport Cog from 'vue-material-design-icons/Cog.vue'\nimport ShareVariant from 'vue-material-design-icons/ShareVariant.vue'\n\nexport default {\n\tcomponents: {\n\t\tMagnify,\n\t\tCog,\n\t\tShareVariant,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tactive: 'search-tab',\n\t\t}\n\t},\n}\n</script>\n```\n\n### Editable name\n\n```vue\n<template>\n\t<NcAppSidebar\n\t\tv-model:name=\"name\"\n\t\t:name-editable=\"true\"\n\t\tname-placeholder=\"Filename\"\n\t\tsubname=\"last edited 3 weeks ago\">\n\t\t<!-- Insert your slots and tabs here -->\n\t</NcAppSidebar>\n</template>\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tname: 'cat-picture.jpg',\n\t\t\t}\n\t\t},\n\t}\n</script>\n```\n\n### Editable name after click with custom tertiary action\n\n```vue\n<template>\n\t<NcAppSidebar\n\t\t:name=\"name\"\n\t\tv-model:name-editable=\"nameEditable\"\n\t\t:name-placeholder=\"namePlaceholder\"\n\t\t:subname=\"subname\"\n\t\t@update:name=\"nameUpdate\">\n\t\t<template #tertiary-actions>\n\t\t\t<form>\n\t\t\t\t<input type=\"checkbox\" @click=\"toggledCheckbox\"/>\n\t\t\t</form>\n\t\t</template>\n\t</NcAppSidebar>\n</template>\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tname: 'cat-picture.jpg',\n\t\t\t\tnamePlaceholder: 'Filename',\n\t\t\t\tsubname: 'last edited 3 weeks ago',\n\t\t\t\tnameEditable: false\n\t\t\t}\n\t\t},\n\t\tmethods: {\n\t\t\tnameUpdate(e) {\n\t\t\t\tthis.name = e\n\t\t\t},\n\t\t\ttoggledCheckbox() {\n\t\t\t\talert('toggle')\n\t\t\t}\n\t\t}\n\t}\n</script>\n```\n\n### Custom subname\n\nInstead of using the `subname` prop you can use the same called slot. This is handy if you need to add accessible information.\nLike in the following example where the goal is to show a star icon to mark the file a favorite.\nSimplying adding `★` would not work as screen readers might not or wrongly announce the icon meaning this information is lost.\n\nA working alternative would be using an icon together with an `aria-label`:\n\n```vue\n\t<template>\n\t\t<NcAppSidebar name=\"cat-picture.jpg\">\n\t\t\t<template #subname>\n\t\t\t\t<NcIconSvgWrapper inline :path=\"mdiStar\" name=\"Favorite\" />\n\t\t\t\t123 KiB, a month ago\n\t\t\t</template>\n\t\t</NcAppSidebar>\n\t</template>\n\t<script>\n\timport { mdiStar } from '@mdi/js'\n\n\texport default {\n\t\tsetup() {\n\t\t\treturn {\n\t\t\t\tmdiStar,\n\t\t\t}\n\t\t}\n\t}\n\t</script>\n```\n\n### Empty sidebar for e.g. empty content component.\n\n```vue\n\t<template>\n\t\t<NcAppSidebar\n\t\t\tname=\"cat-picture.jpg\"\n\t\t\t:empty=\"true\">\n\t\t\t<NcEmptyContent name=\"Content not found.\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Magnify :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t</NcEmptyContent>\n\t\t</NcAppSidebar>\n\t</template>\n\t<script>\n\timport Magnify from 'vue-material-design-icons/Magnify.vue'\n\n\texport default {\n\t\tcomponents: {\n\t\t\tMagnify,\n\t\t},\n\t}\n\t</script>\n```\n\n### Conditionally show the sidebar with `open`\n\nIf the sidebar should be shown conditionally, you can use `open` prop to define sidebar visibility.\nIt automatically shows a toggle button to open the sidebar if it is closed.\n\nYou can also use `--app-sidebar-offset` CSS variable to preserve space\nfor the toggle button, for example, in top bar of `NcAppContent`.\n\nThe built-in toggle button can be removed with `no-toggle` prop.\n\nNote: the built-in toggle button is only available then NcAppSidebar is used in NcContent.\n\n```vue\n<template>\n\t<!-- This is in most cases NcContent -->\n\t<NcContent app-name=\"styleguidist\" class=\"content-styleguidist\">\n\t\t<NcAppContent>\n\t\t\t<div class=\"top-bar\">\n\t\t\t\t<NcButton type=\"primary\">Start a call</NcButton>\n\t\t\t</div>\n\t\t</NcAppContent>\n\t\t<!-- The sidebar -->\n\t\t<NcAppSidebar\n\t\t\tv-model:open=\"showSidebar\"\n\t\t\tname=\"cat-picture.jpg\"\n\t\t\tsubname=\"last edited 3 weeks ago\">\n\t\t\t<NcAppSidebarTab name=\"Settings\" id=\"settings-tab\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Cog :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tSingle tab content\n\t\t\t</NcAppSidebarTab>\n\t\t</NcAppSidebar>\n\t</NcContent>\n</template>\n\n<script>\nimport Cog from 'vue-material-design-icons/Cog'\n\nexport default {\n\tcomponents: {\n\t\tCog,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tshowSidebar: true,\n\t\t}\n\t},\n}\n</script>\n<style scoped>\n/* This styles just mock NcContent and NcAppContent */\n.content-styleguidist {\n\tposition: relative !important;\n\t/* Just to prevent jumping when the sidebar is hidden */\n\tmin-height: 360px;\n}\n\n.main-content {\n\tposition: absolute;\n\theight: 100%;\n\twidth: 100%;\n}\n\n/* Fix styles on this style guide page */\n@media only screen and (max-width: 512px) {\n\t:deep(aside) {\n\t\twidth: calc(100vw - 64px) !important;\n\t}\n}\n\n.top-bar {\n\tdisplay: flex;\n\tjustify-content: flex-end;\n\t/* preserve space for toggle button */\n\tpadding-inline-end: var(--app-sidebar-offset);\n\t/* same as on toggle button, but doesn't have to be the same */\n\tmargin: var(--app-sidebar-padding);\n}\n</style>\n```\n\n### Conditionally show the sidebar programmatically with `v-if`\n\nIf the sidebar should be shown conditionally without any explicit toggle button, you can use `v-if`.\n\n**Note about performance**: using `v-if` might result in bad performance and loosing sidebar content state.\n\n**Note about `v-show`**: using `v-show` to hide sidebar will result in usability issues due to active focus trap on mobile.\n\n```vue\n<template>\n\t<!-- This is in most cases NcContent -->\n\t<NcContent app-name=\"styleguidist\" class=\"content-styleguidist\">\n\t\t<NcAppContent>\n\t\t\t<div class=\"top-bar\">\n\t\t\t\t<NcButton @click.prevent=\"showSidebar = true\">\n\t\t\t\t\tToggle sidebar\n\t\t\t\t</NcButton>\n\t\t\t</div>\n\t\t</NcAppContent>\n\t\t<!-- The sidebar -->\n\t\t<NcAppSidebar\n\t\t\tv-if=\"showSidebar\"\n\t\t\tname=\"cat-picture.jpg\"\n\t\t\tsubname=\"last edited 3 weeks ago\"\n\t\t\t@close=\"showSidebar = false\">\n\t\t\t<NcAppSidebarTab name=\"Settings\" id=\"settings-tab\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Cog :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tSingle tab content\n\t\t\t</NcAppSidebarTab>\n\t\t</NcAppSidebar>\n\t</NcContent>\n</template>\n\n<script>\nimport Cog from 'vue-material-design-icons/Cog'\n\nexport default {\n\tcomponents: {\n\t\tCog,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tshowSidebar: true,\n\t\t}\n\t},\n}\n</script>\n<style scoped>\n/* This styles just mock NcContent and NcAppContent */\n.content-styleguidist {\n\tposition: relative !important;\n\t/* Just to prevent jumping when the sidebar is hidden */\n\tmin-height: 360px;\n}\n\n.main-content {\n\tposition: absolute;\n\theight: 100%;\n\twidth: 100%;\n}\n\n/* Fix styles on this style guide page */\n@media only screen and (max-width: 512px) {\n\t:deep(aside) {\n\t\twidth: calc(100vw - 64px) !important;\n\t}\n}\n\n.top-bar {\n\tdisplay: flex;\n\tjustify-content: flex-end;\n\t/* preserve space for toggle button */\n\tpadding-inline-end: var(--app-sidebar-offset);\n\t/* same as on toggle button, but doesn't have to be the same */\n\tmargin: var(--app-sidebar-padding);\n}\n</style>\n```\n</docs>\n\n<template>\n\t<transition appear\n\t\tname=\"slide-right\"\n\t\t@after-enter=\"onAfterEnter\"\n\t\t@after-leave=\"onAfterLeave\">\n\t\t<aside v-show=\"open\"\n\t\t\tid=\"app-sidebar-vue\"\n\t\t\tref=\"sidebar\"\n\t\t\tclass=\"app-sidebar\"\n\t\t\t:aria-labelledby=\"`app-sidebar-vue-${uid}__header`\"\n\t\t\t@keydown.esc=\"onKeydownEsc\">\n\t\t\t<!--\n\t\t\t\tWe cannot render toggle button inside sidebar (aside#app-sidebar-vue), because it is hidden then the toggle is needed.\n\t\t\t\tBut we also need transition with the sidebar to be the root of this component to use it as a single UI element, allowing to use `v-show`.\n\t\t\t\tSo we cannot render the toggle button directly in this component.\n\t\t\t\tAs a simple solution - render it in the content to keep correct position.\n\t\t\t-->\n\t\t\t<Teleport v-if=\"ncContentSelector && !open && !noToggle\" :to=\"ncContentSelector\">\n\t\t\t\t<NcButton :aria-label=\"t('Open sidebar')\"\n\t\t\t\t\tclass=\"app-sidebar__toggle\"\n\t\t\t\t\t:class=\"toggleClasses\"\n\t\t\t\t\ttype=\"tertiary\"\n\t\t\t\t\tv-bind=\"toggleAttrs\"\n\t\t\t\t\t@click=\"$emit('update:open', true)\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<!-- @slot Custom icon for the toggle button, defaults to the dock-right icon from MDI -->\n\t\t\t\t\t\t<slot name=\"toggle-icon\">\n\t\t\t\t\t\t\t<IconDockRight :size=\"20\" />\n\t\t\t\t\t\t</slot>\n\t\t\t\t\t</template>\n\t\t\t\t</NcButton>\n\t\t\t</Teleport>\n\n\t\t\t<header :class=\"{\n\t\t\t\t\t'app-sidebar-header--with-figure': isSlotPopulated($slots.header?.()) || background,\n\t\t\t\t\t'app-sidebar-header--compact': compact,\n\t\t\t\t}\"\n\t\t\t\tclass=\"app-sidebar-header\">\n\t\t\t\t<!-- container for figure and description, allows easy switching to compact mode -->\n\t\t\t\t<div class=\"app-sidebar-header__info\">\n\t\t\t\t\t<!-- sidebar header illustration/figure -->\n\t\t\t\t\t<div v-if=\"(isSlotPopulated($slots.header?.()) || background) && !empty\"\n\t\t\t\t\t\t:class=\"{\n\t\t\t\t\t\t\t'app-sidebar-header__figure--with-action': hasFigureClickListener\n\t\t\t\t\t\t}\"\n\t\t\t\t\t\tclass=\"app-sidebar-header__figure\"\n\t\t\t\t\t\t:style=\"{\n\t\t\t\t\t\t\tbackgroundImage: `url(${background})`\n\t\t\t\t\t\t}\"\n\t\t\t\t\t\ttabindex=\"0\"\n\t\t\t\t\t\t@click=\"onFigureClick\"\n\t\t\t\t\t\t@keydown.enter=\"onFigureClick\">\n\t\t\t\t\t\t<slot class=\"app-sidebar-header__background\" name=\"header\" />\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<!-- sidebar details -->\n\t\t\t\t\t<div v-if=\"!empty\"\n\t\t\t\t\t\t:class=\"{\n\t\t\t\t\t\t\t'app-sidebar-header__desc--with-tertiary-action': canStar || isSlotPopulated($slots['tertiary-actions']?.()),\n\t\t\t\t\t\t\t'app-sidebar-header__desc--editable': nameEditable && !subname,\n\t\t\t\t\t\t\t'app-sidebar-header__desc--with-subname--editable': nameEditable && subname,\n\t\t\t\t\t\t\t'app-sidebar-header__desc--without-actions': !isSlotPopulated($slots['secondary-actions']?.()),\n\t\t\t\t\t\t}\"\n\t\t\t\t\t\tclass=\"app-sidebar-header__desc\">\n\t\t\t\t\t\t<!-- favourite icon -->\n\t\t\t\t\t\t<div v-if=\"canStar || isSlotPopulated($slots['tertiary-actions']?.())\" class=\"app-sidebar-header__tertiary-actions\">\n\t\t\t\t\t\t\t<slot name=\"tertiary-actions\">\n\t\t\t\t\t\t\t\t<NcButton v-if=\"canStar\"\n\t\t\t\t\t\t\t\t\t:aria-label=\"favoriteTranslated\"\n\t\t\t\t\t\t\t\t\t:pressed=\"isStarred\"\n\t\t\t\t\t\t\t\t\tclass=\"app-sidebar-header__star\"\n\t\t\t\t\t\t\t\t\ttype=\"secondary\"\n\t\t\t\t\t\t\t\t\t@click.prevent=\"toggleStarred\">\n\t\t\t\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t\t\t\t<NcLoadingIcon v-if=\"starLoading\" />\n\t\t\t\t\t\t\t\t\t\t<IconStar v-else-if=\"isStarred\" :size=\"20\" />\n\t\t\t\t\t\t\t\t\t\t<IconStarOutline v-else :size=\"20\" />\n\t\t\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t\t\t</NcButton>\n\t\t\t\t\t\t\t</slot>\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t<!-- name -->\n\t\t\t\t\t\t<div class=\"app-sidebar-header__name-container\">\n\t\t\t\t\t\t\t<div class=\"app-sidebar-header__mainname-container\">\n\t\t\t\t\t\t\t\t<!-- main name -->\n\t\t\t\t\t\t\t\t<h2 v-show=\"!nameEditable\"\n\t\t\t\t\t\t\t\t\t:id=\"`app-sidebar-vue-${uid}__header`\"\n\t\t\t\t\t\t\t\t\tref=\"header\"\n\t\t\t\t\t\t\t\t\tv-linkify=\"{text: name, linkify: linkifyName}\"\n\t\t\t\t\t\t\t\t\t:aria-label=\"title\"\n\t\t\t\t\t\t\t\t\t:title=\"title\"\n\t\t\t\t\t\t\t\t\tclass=\"app-sidebar-header__mainname\"\n\t\t\t\t\t\t\t\t\t:tabindex=\"nameEditable ? 0 : -1\"\n\t\t\t\t\t\t\t\t\t@click.self=\"editName\">\n\t\t\t\t\t\t\t\t\t{{ name }}\n\t\t\t\t\t\t\t\t</h2>\n\t\t\t\t\t\t\t\t<template v-if=\"nameEditable\">\n\t\t\t\t\t\t\t\t\t<form v-click-outside=\"() => onSubmitName()\"\n\t\t\t\t\t\t\t\t\t\tclass=\"app-sidebar-header__mainname-form\"\n\t\t\t\t\t\t\t\t\t\t@submit.prevent=\"onSubmitName\">\n\t\t\t\t\t\t\t\t\t\t<input ref=\"nameInput\"\n\t\t\t\t\t\t\t\t\t\t\tv-focus\n\t\t\t\t\t\t\t\t\t\t\tclass=\"app-sidebar-header__mainname-input\"\n\t\t\t\t\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\t\t\t\t\t:placeholder=\"namePlaceholder\"\n\t\t\t\t\t\t\t\t\t\t\t:value=\"name\"\n\t\t\t\t\t\t\t\t\t\t\t@keydown.esc.stop=\"onDismissEditing\"\n\t\t\t\t\t\t\t\t\t\t\t@input=\"onNameInput\">\n\t\t\t\t\t\t\t\t\t\t<NcButton type=\"tertiary-no-background\"\n\t\t\t\t\t\t\t\t\t\t\t:aria-label=\"changeNameTranslated\"\n\t\t\t\t\t\t\t\t\t\t\tnative-type=\"submit\">\n\t\t\t\t\t\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t\t\t\t\t\t<IconArrowRight :size=\"20\" />\n\t\t\t\t\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t\t\t\t\t</NcButton>\n\t\t\t\t\t\t\t\t\t</form>\n\t\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t\t\t<!-- header main menu -->\n\t\t\t\t\t\t\t\t<NcActions v-if=\"isSlotPopulated($slots['secondary-actions']?.())\"\n\t\t\t\t\t\t\t\t\tclass=\"app-sidebar-header__menu\"\n\t\t\t\t\t\t\t\t\t:force-menu=\"forceMenu\">\n\t\t\t\t\t\t\t\t\t<slot name=\"secondary-actions\" />\n\t\t\t\t\t\t\t\t</NcActions>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<!-- secondary name -->\n\t\t\t\t\t\t\t<p v-if=\"subname.trim() !== '' || $slots['subname']\"\n\t\t\t\t\t\t\t\t:title=\"subtitle || undefined\"\n\t\t\t\t\t\t\t\tclass=\"app-sidebar-header__subname\">\n\t\t\t\t\t\t\t\t<!-- @slot Alternative to the `subname` prop can be used for more complex conent. It will be rendered within a `p` tag. -->\n\t\t\t\t\t\t\t\t<slot name=\"subname\">\n\t\t\t\t\t\t\t\t\t{{ subname }}\n\t\t\t\t\t\t\t\t</slot>\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\n\t\t\t\t<NcButton ref=\"closeButton\"\n\t\t\t\t\t:title=\"closeTranslated\"\n\t\t\t\t\t:aria-label=\"closeTranslated\"\n\t\t\t\t\ttype=\"tertiary\"\n\t\t\t\t\tclass=\"app-sidebar__close\"\n\t\t\t\t\t@click.prevent=\"closeSidebar\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<IconClose :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t</NcButton>\n\n\t\t\t\t<div v-if=\"isSlotPopulated($slots.description?.()) && !empty\" class=\"app-sidebar-header__description\">\n\t\t\t\t\t<slot name=\"description\" />\n\t\t\t\t</div>\n\t\t\t</header>\n\n\t\t\t<NcAppSidebarTabs v-show=\"!loading\"\n\t\t\t\tref=\"tabs\"\n\t\t\t\t:active=\"active\"\n\t\t\t\t:force-tabs=\"forceTabs\"\n\t\t\t\t@update:active=\"onUpdateActive\">\n\t\t\t\t<slot />\n\t\t\t</NcAppSidebarTabs>\n\n\t\t\t<NcEmptyContent v-if=\"loading\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<NcLoadingIcon :size=\"64\" />\n\t\t\t\t</template>\n\t\t\t</NcEmptyContent>\n\t\t</aside>\n\t</transition>\n</template>\n\n<script>\nimport NcAppSidebarTabs from './NcAppSidebarTabs.vue'\nimport NcActions from '../NcActions/index.js'\nimport NcLoadingIcon from '../NcLoadingIcon/index.js'\nimport NcButton from '../NcButton/index.ts'\nimport NcEmptyContent from '../NcEmptyContent/index.js'\nimport Focus from '../../directives/Focus/index.js'\nimport Linkify from '../../directives/Linkify/index.js'\nimport { useIsSmallMobile } from '../../composables/useIsMobile/index.js'\nimport GenRandomId from '../../utils/GenRandomId.js'\nimport { getTrapStack } from '../../utils/focusTrap.ts'\nimport { t } from '../../l10n.js'\nimport isSlotPopulated from '../../utils/isSlotPopulated.ts'\n\nimport IconArrowRight from 'vue-material-design-icons/ArrowRight.vue'\nimport IconClose from 'vue-material-design-icons/Close.vue'\nimport IconDockRight from 'vue-material-design-icons/DockRight.vue'\nimport IconStar from 'vue-material-design-icons/Star.vue'\nimport IconStarOutline from 'vue-material-design-icons/StarOutline.vue'\n\nimport { vOnClickOutside as ClickOutside } from '@vueuse/components'\nimport { createFocusTrap } from 'focus-trap'\n\nexport default {\n\tname: 'NcAppSidebar',\n\n\tcomponents: {\n\t\tNcActions,\n\t\tNcAppSidebarTabs,\n\t\tNcButton,\n\t\tNcLoadingIcon,\n\t\tNcEmptyContent,\n\t\tIconArrowRight,\n\t\tIconClose,\n\t\tIconDockRight,\n\t\tIconStar,\n\t\tIconStarOutline,\n\t},\n\n\tdirectives: {\n\t\tfocus: Focus,\n\t\tlinkify: Linkify,\n\t\tClickOutside,\n\t},\n\n\tinject: {\n\t\tncContentSelector: {\n\t\t\tfrom: 'NcContent:selector',\n\t\t\tdefault: undefined,\n\t\t},\n\t},\n\n\tprops: {\n\t\tactive: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\t\tname: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t\trequired: true,\n\t\t},\n\n\t\t/**\n\t\t * Allow to edit the sidebar name.\n\t\t */\n\t\tnameEditable: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\tnamePlaceholder: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\t\tsubname: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\t\t/**\n\t\t * Title to display for the subname.\n\t\t */\n\t\tsubtitle: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * Url to the top header background image\n\t\t * Applied with css\n\t\t */\n\t\tbackground: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * Enable the favourite icon if not null\n\t\t * See fired events\n\t\t */\n\t\tstarred: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: null,\n\t\t},\n\t\t/**\n\t\t * Show loading spinner instead of the star icon\n\t\t */\n\t\tstarLoading: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * Show loading spinner instead of tabs\n\t\t */\n\t\tloading: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Display the sidebar in compact mode\n\t\t */\n\t\tcompact: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Only display close button and default slot content.\n\t\t * Don't display other header content and primary and secondary actions.\n\t\t * Useful when showing the EmptyContent component as content.\n\t\t */\n\t\tempty: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Force the actions to display in a three dot menu\n\t\t */\n\t\tforceMenu: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * Force the tab navigation to display even if there is only one tab\n\t\t */\n\t\tforceTabs: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * Linkify the name\n\t\t */\n\t\tlinkifyName: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * Title to display for the name.\n\t\t * Can be set to the same text in case it's too long.\n\t\t */\n\t\ttitle: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * Allow to conditionally show the sidebar\n\t\t * You can also use `v-if` on the sidebar, but using the open prop allow to keep\n\t\t * the sidebar inside the DOM for performance if it is opened and closed multiple times.\n\t\t *\n\t\t * When using the `open` property to close the sidebar a built-in toggle button will be shown to reopen it,\n\t\t * similar to the app navigation. You can remove this button with the `no-toggle` prop.\n\t\t */\n\t\topen: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: true,\n\t\t},\n\n\t\t/**\n\t\t * Custom classes to assign to the sidebar toggle button.\n\t\t * If needed this can be used to assign styles to the button using `:deep()` selector.\n\t\t */\n\t\ttoggleClasses: {\n\t\t\ttype: [String, Array, Object],\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * Custom attrs to assign to the sidebar toggle button.\n\t\t */\n\t\ttoggleAttrs: {\n\t\t\ttype: Object,\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * Do not add the built-in toggle button with `open` prop.\n\t\t */\n\t\tnoToggle: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t},\n\n\temits: [\n\t\t'close',\n\t\t'closed',\n\t\t'opened',\n\t\t// 'figure-click', not emitted on purpose to make \"hasFigureClickListener\" work\n\t\t'update:active',\n\t\t'update:name',\n\t\t'update:nameEditable',\n\t\t'update:open',\n\t\t'update:starred',\n\t\t'submit-name',\n\t\t'dismiss-editing',\n\t],\n\n\tsetup() {\n\t\treturn {\n\t\t\tuid: GenRandomId(),\n\t\t\tisMobile: useIsSmallMobile(),\n\t\t}\n\t},\n\n\tdata() {\n\t\treturn {\n\t\t\tchangeNameTranslated: t('Change name'),\n\t\t\tcloseTranslated: t('Close sidebar'),\n\t\t\tfavoriteTranslated: t('Favorite'),\n\t\t\tisStarred: this.starred,\n\t\t\tfocusTrap: null,\n\t\t\telementToReturnFocus: null,\n\t\t}\n\t},\n\n\tcomputed: {\n\t\tcanStar() {\n\t\t\treturn this.isStarred !== null\n\t\t},\n\t\thasFigureClickListener() {\n\t\t\treturn !!this.$attrs.onFigureClick\n\t\t},\n\t},\n\n\twatch: {\n\t\tstarred() {\n\t\t\tthis.isStarred = this.starred\n\t\t},\n\n\t\tisMobile() {\n\t\t\tthis.toggleFocusTrap()\n\t\t},\n\n\t\topen() {\n\t\t\tthis.checkToggleButtonContainerAvailability()\n\t\t},\n\t},\n\n\tcreated() {\n\t\tthis.preserveElementToReturnFocus()\n\n\t\tthis.checkToggleButtonContainerAvailability()\n\t},\n\n\tbeforeUnmount() {\n\t\t// Make sure that the 'closed' event is dispatched even if this element is destroyed before the 'after-leave' event is received.\n\t\tthis.$emit('closed')\n\t\tthis.focusTrap?.deactivate()\n\t},\n\n\tmethods: {\n\t\tisSlotPopulated,\n\n\t\tt,\n\n\t\tpreserveElementToReturnFocus() {\n\t\t\t// Save the element that had focus before the sidebar was opened to return back on close\n\t\t\tif (document.activeElement && document.activeElement !== document.body) {\n\t\t\t\tthis.elementToReturnFocus = document.activeElement\n\n\t\t\t\t// Special case for menus (NcActions)\n\t\t\t\t// If a sidebar was opened from a menu item, we want to return focus to the menu trigger instead of the item\n\t\t\t\tif (this.elementToReturnFocus.getAttribute('role') === 'menuitem') {\n\t\t\t\t\tconst menu = this.elementToReturnFocus.closest('[role=\"menu\"]')\n\t\t\t\t\tif (menu) {\n\t\t\t\t\t\tconst menuTrigger = document.querySelector(`[aria-controls=\"${menu.id}\"]`)\n\t\t\t\t\t\tthis.elementToReturnFocus = menuTrigger\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\tinitFocusTrap() {\n\t\t\tif (this.focusTrap) {\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\tthis.focusTrap = createFocusTrap([\n\t\t\t\t// The sidebar itself\n\t\t\t\tthis.$refs.sidebar,\n\t\t\t\t// Nextcloud Server header navigarion\n\t\t\t\tdocument.querySelector('#header'),\n\t\t\t], {\n\t\t\t\tallowOutsideClick: true,\n\t\t\t\tfallbackFocus: this.$refs.closeButton,\n\t\t\t\ttrapStack: getTrapStack(),\n\t\t\t\tescapeDeactivates: false,\n\t\t\t})\n\t\t},\n\n\t\t/**\n\t\t * Activate focus trap if it is currently needed, otherwise deactivate\n\t\t */\n\t\ttoggleFocusTrap() {\n\t\t\tif (this.open && this.isMobile) {\n\t\t\t\tthis.initFocusTrap()\n\t\t\t\tthis.focusTrap.activate()\n\t\t\t} else {\n\t\t\t\tthis.focusTrap?.deactivate()\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Close the sidebar on pressing the escape key on mobile\n\t\t *\n\t\t * @param {KeyboardEvent} event key down event\n\t\t */\n\t\tonKeydownEsc(event) {\n\t\t\tif (this.isMobile) {\n\t\t\t\tevent.stopPropagation()\n\t\t\t\tthis.closeSidebar()\n\t\t\t}\n\t\t},\n\n\t\tonAfterEnter(element) {\n\t\t\t// Focus sidebar on open only if it was opened by a user interaction\n\t\t\tif (this.elementToReturnFocus) {\n\t\t\t\tthis.focus()\n\t\t\t}\n\n\t\t\tthis.toggleFocusTrap()\n\n\t\t\t/**\n\t\t\t * The sidebar is opened and the transition is complete\n\t\t\t *\n\t\t\t * @type {HTMLElement}\n\t\t\t */\n\t\t\tthis.$emit('opened', element)\n\t\t},\n\t\tonAfterLeave(element) {\n\t\t\t/**\n\t\t\t * The sidebar is closed and the transition is complete\n\t\t\t *\n\t\t\t * @type {HTMLElement}\n\t\t\t */\n\t\t\tthis.$emit('closed', element)\n\n\t\t\tthis.toggleFocusTrap()\n\n\t\t\t// Return focus to the element that had focus before the sidebar was opened\n\t\t\tthis.elementToReturnFocus?.focus({ focusVisible: true })\n\t\t\tthis.elementToReturnFocus = null\n\t\t},\n\n\t\t/**\n\t\t * Used to tell parent component the user asked to close the sidebar\n\t\t *\n\t\t * @param {Event} e close icon click event\n\t\t */\n\t\tcloseSidebar(e) {\n\t\t\t/**\n\t\t\t * The user clicked to closed the sidebar\n\t\t\t *\n\t\t\t * @type {Event}\n\t\t\t */\n\t\t\tthis.$emit('close', e)\n\t\t\t/**\n\t\t\t * Current open state emitted after the transitions are finished\n\t\t\t * @type {boolean}\n\t\t\t */\n\t\t\tthis.$emit('update:open', false)\n\t\t},\n\n\t\t/**\n\t\t * Emit figure click event to parent component\n\t\t *\n\t\t * @param {Event} e click event\n\t\t */\n\t\tonFigureClick(e) {\n\t\t\t/**\n\t\t\t * The figure/background header has been clicked\n\t\t\t *\n\t\t\t * @type {Event}\n\t\t\t */\n\t\t\t// eslint-disable-next-line vue/require-explicit-emits\n\t\t\tthis.$emit('figure-click', e)\n\t\t},\n\n\t\t/**\n\t\t * Toggle the favourite state\n\t\t * and emit to the parent component\n\t\t */\n\t\ttoggleStarred() {\n\t\t\tthis.isStarred = !this.isStarred\n\t\t\t/**\n\t\t\t * Emitted when the starred value changes\n\t\t\t *\n\t\t\t * @type {boolean}\n\t\t\t */\n\t\t\tthis.$emit('update:starred', this.isStarred)\n\t\t},\n\n\t\tasync editName() {\n\t\t\t/**\n\t\t\t * Emitted when the nameEditable value changes\n\t\t\t *\n\t\t\t * @type {boolean}\n\t\t\t */\n\t\t\tthis.$emit('update:nameEditable', true)\n\t\t\t// Focus the name input\n\t\t\tif (this.nameEditable) {\n\t\t\t\tawait this.$nextTick()\n\t\t\t\tthis.$refs.nameInput.focus()\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Focus the sidebar\n\t\t * @public\n\t\t */\n\t\tfocus() {\n\t\t\t(this.$refs.header ?? this.$refs.toggle)?.focus()\n\t\t},\n\n\t\t/**\n\t\t * Focus the active tab\n\t\t * @public\n\t\t */\n\t\tfocusActiveTabContent() {\n\t\t\t// If a tab is focused then probably a new trigger element moved the focus to the sidebar\n\t\t\tthis.preserveElementToReturnFocus()\n\n\t\t\tthis.$refs.tabs.focusActiveTabContent()\n\t\t},\n\n\t\t/**\n\t\t * Check if the toggle button container is available\n\t\t */\n\t\tcheckToggleButtonContainerAvailability() {\n\t\t\t// Toggle button must be rendered, but there is no element to teleport it to\n\t\t\tif (this.open === false && !this.noToggle && !this.ncContentSelector) {\n\t\t\t\tconsole.warn(\n\t\t\t\t\t'[NcAppSidebar] It looks like you want to use NcAppSidebar with the built-in toggle button. '\n\t\t\t\t\t+ 'This feature is only available when NcAppSidebar is used in NcContent.',\n\t\t\t\t)\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Emit name change event to parent component\n\t\t *\n\t\t * @param {Event} event input event\n\t\t */\n\t\tonNameInput(event) {\n\t\t\t/**\n\t\t\t * Emitted when the name value changes\n\t\t\t *\n\t\t\t * @type {string|Date}\n\t\t\t */\n\t\t\tthis.$emit('update:name', event.target.value)\n\t\t},\n\n\t\t/**\n\t\t * Emit when the name form edit confirm button is pressed in order\n\t\t * to change the name.\n\t\t *\n\t\t * @param {Event} event submit event\n\t\t */\n\t\tonSubmitName(event) {\n\t\t\t// Disable editing\n\t\t\tthis.$emit('update:nameEditable', false)\n\t\t\t/**\n\t\t\t * Emitted when the name edit input has been submitted\n\t\t\t *\n\t\t\t * @type {Event}\n\t\t\t */\n\t\t\tthis.$emit('submit-name', event)\n\t\t},\n\t\tonDismissEditing() {\n\t\t\t// Disable editing\n\t\t\tthis.$emit('update:nameEditable', false)\n\t\t\t/**\n\t\t\t * Emitted when the name edit has been cancelled\n\t\t\t *\n\t\t\t * @type {Event}\n\t\t\t */\n\t\t\tthis.$emit('dismiss-editing')\n\t\t},\n\t\tonUpdateActive(activeTab) {\n\t\t\t/**\n\t\t\t * The active tab changed\n\t\t\t *\n\t\t\t * @type {string}\n\t\t\t */\n\t\t\tthis.$emit('update:active', activeTab)\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\">\n// Allows to use transition over a custom CSS property (CSS Variable)\n// Ignored on old browsers resulting in slightly noticeable jump\n@property --app-sidebar-offset {\n  syntax: '<length>';\n  initial-value: 0;\n  inherits: true;\n}\n\n.content {\n\t// A padding between the toggle button and the page border\n\t--app-sidebar-padding: #{$app-navigation-padding};\n\t// A padding between the toggle button and the page border\n\t--app-sidebar-offset: 0;\n\t// Explicitly disable transition by default to enable it only when sidebar animation is active\n\t// !important to override styles from an older version, because it's global non-scoped styles\n\ttransition: --app-sidebar-offset 0ms !important;\n}\n\n// When AppSidebar is animation is active - also apply transition for the toggle button offset\n.content:has(.app-sidebar.slide-right-enter-active),\n.content:has(.app-sidebar.slide-right-leave-active) {\n\ttransition: --app-sidebar-offset var(--animation-quick);\n}\n\n.content:has(.app-sidebar__toggle) {\n\t--app-sidebar-offset: calc(var(--app-sidebar-padding) + var(--default-clickable-area));\n}\n</style>\n\n<style lang=\"scss\" scoped>\n$desc-vertical-padding: 18px;\n$desc-vertical-padding-compact: 10px;\n$desc-input-padding: 7px;\n\n// name and subname\n$desc-name-height: 30px;\n$desc-subname-height: 22px;\n$desc-height: $desc-name-height + $desc-subname-height;\n\n$top-buttons-spacing: 6px;\n\n/*\n\tSidebar: to be used within #content\n\tapp-content will be shrinked properly\n*/\n.app-sidebar {\n\t--app-sidebar-width: clamp(300px, 27vw, 500px);\n\twidth: var(--app-sidebar-width);\n\n\tz-index: 1500;\n\ttop: 0;\n\tright: 0;\n\tdisplay: flex;\n\toverflow-x: hidden;\n\toverflow-y: auto;\n\tflex-direction: column;\n\tflex-shrink: 0;\n\theight: 100%;\n\tborder-left: 1px solid var(--color-border);\n\tbackground: var(--color-main-background);\n\t// Make close button positioned relative to the header\n\tposition: relative;\n\n\t&__toggle {\n\t\tposition: absolute !important;\n\t\tinset-block-start: var(--app-sidebar-padding);\n\t\tinset-inline-end: var(--app-sidebar-padding);\n\t\t// app-content has z-index 1000 so we need 1001\n\t\tz-index: 1001;\n\t}\n\n\t.app-sidebar-header {\n\t\t> .app-sidebar__close {\n\t\t\tposition: absolute;\n\t\t\tz-index: 100;\n\t\t\ttop: $top-buttons-spacing;\n\t\t\tright: $top-buttons-spacing;\n\t\t\twidth: var(--default-clickable-area);\n\t\t\theight: var(--default-clickable-area);\n\t\t\topacity: $opacity_normal;\n\t\t\tborder-radius: calc(var(--default-clickable-area) / 2);\n\t\t\t&:hover,\n\t\t\t&:active,\n\t\t\t&:focus {\n\t\t\t\topacity: $opacity_full;\n\t\t\t\tbackground-color: $action-background-hover;\n\t\t\t}\n\t\t}\n\n\t\t// Compact mode only affects a sidebar with a figure\n\t\t&--compact.app-sidebar-header--with-figure {\n\t\t\t.app-sidebar-header__info {\n\t\t\t\tflex-direction: row;\n\n\t\t\t\t.app-sidebar-header__figure {\n\t\t\t\t\tz-index: 2;\n\t\t\t\t\twidth: $desc-height + $desc-vertical-padding;\n\t\t\t\t\theight: $desc-height + $desc-vertical-padding;\n\t\t\t\t\tmargin: math.div($desc-vertical-padding, 2);\n\t\t\t\t\tborder-radius: 3px;\n\t\t\t\t\tflex: 0 0 auto;\n\t\t\t\t}\n\t\t\t\t.app-sidebar-header__desc {\n\t\t\t\t\tpadding-left: 0;\n\t\t\t\t\tflex: 1 1 auto;\n\t\t\t\t\tmin-width: 0;\n\t\t\t\t\tpadding-right: calc(2 * var(--default-clickable-area) + $top-buttons-spacing);\n\t\t\t\t\tpadding-top: $desc-vertical-padding-compact;\n\n\t\t\t\t\t&.app-sidebar-header__desc--without-actions {\n\t\t\t\t\t\tpadding-right: calc(var(--default-clickable-area) + $top-buttons-spacing);\n\t\t\t\t\t}\n\n\t\t\t\t\t.app-sidebar-header__tertiary-actions {\n\t\t\t\t\t\tz-index: 3; // above star\n\t\t\t\t\t\tposition: absolute;\n\t\t\t\t\t\ttop: math.div($desc-vertical-padding, 2);\n\t\t\t\t\t\tleft: calc(-1 * var(--default-clickable-area));\n\t\t\t\t\t\tgap: 0; // override gap\n\t\t\t\t\t}\n\t\t\t\t\t.app-sidebar-header__menu {\n\t\t\t\t\t\ttop: $top-buttons-spacing;\n\t\t\t\t\t\tright: calc(var(--default-clickable-area) + $top-buttons-spacing); // left of the close button\n\t\t\t\t\t\tposition: absolute;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t// sidebar without figure\n\t\t&:not(.app-sidebar-header--with-figure) {\n\t\t\t// align the menu with the close button\n\t\t\t.app-sidebar-header__menu {\n\t\t\t\tposition: absolute;\n\t\t\t\ttop: $top-buttons-spacing;\n\t\t\t\tright: calc(var(--default-clickable-area) + $top-buttons-spacing);\n\t\t\t}\n\t\t\t// increase the padding to not overlap the menu\n\t\t\t.app-sidebar-header__desc {\n\t\t\t\tpadding-right: calc(2 * var(--default-clickable-area) + $top-buttons-spacing);\n\n\t\t\t\t&.app-sidebar-header__desc--without-actions {\n\t\t\t\t\tpadding-right: calc(var(--default-clickable-area) + $top-buttons-spacing);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t// the container with the figure and the description\n\t\t.app-sidebar-header__info {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: column;\n\t\t}\n\n\t\t// header background\n\t\t&__figure {\n\t\t\twidth: 100%;\n\t\t\theight: 250px;\n\t\t\tmax-height: 250px;\n\t\t\tbackground-repeat: no-repeat;\n\t\t\tbackground-position: center;\n\t\t\tbackground-size: contain;\n\t\t\t&--with-action {\n\t\t\t\tcursor: pointer;\n\t\t\t}\n\t\t}\n\n\t\t// description\n\t\t&__desc {\n\t\t\tposition: relative;\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: row;\n\t\t\tjustify-content: center;\n\t\t\talign-items: center;\n\t\t\tpadding: #{$desc-vertical-padding} #{$top-buttons-spacing} #{$desc-vertical-padding} #{math.div($desc-vertical-padding, 2)};\n\t\t\tgap: 0 4px;\n\n\t\t\t// custom overrides\n\t\t\t&--with-tertiary-action {\n\t\t\t\tpadding-left: 6px;\n\t\t\t}\n\n\t\t\t&--editable .app-sidebar-header__mainname-form,\n\t\t\t&--with-subname--editable .app-sidebar-header__mainname-form {\n\t\t\t\tmargin-top: -2px;\n\t\t\t\tmargin-bottom: -2px;\n\t\t\t}\n\n\t\t\t&--with-subname--editable .app-sidebar-header__subname {\n\t\t\t\tmargin-top: -2px;\n\t\t\t}\n\n\t\t\t.app-sidebar-header__tertiary-actions {\n\t\t\t\tdisplay: flex;\n\t\t\t\theight: var(--default-clickable-area);\n\t\t\t\twidth: var(--default-clickable-area);\n\t\t\t\tjustify-content: center;\n\t\t\t\tflex: 0 0 auto;\n\n\t\t\t\t.app-sidebar-header__star {\n\t\t\t\t\t// Override default Button component styles\n\t\t\t\t\tbox-shadow: none;\n\t\t\t\t\t&:not([aria-pressed='true']):hover {\n\t\t\t\t\t\tbox-shadow: none;\n\t\t\t\t\t\tbackground-color: var(--color-background-hover);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// names\n\t\t\t.app-sidebar-header__name-container {\n\t\t\t\tflex: 1 1 auto;\n\t\t\t\tdisplay: flex;\n\t\t\t\tflex-direction: column;\n\t\t\t\tjustify-content: center;\n\t\t\t\tmin-width: 0;\n\n\t\t\t\t.app-sidebar-header__mainname-container {\n\t\t\t\t\tdisplay: flex;\n\t\t\t\t\talign-items: center;\n\t\t\t\t\tmin-height: var(--default-clickable-area);\n\n\t\t\t\t\t// main name\n\t\t\t\t\t.app-sidebar-header__mainname {\n\t\t\t\t\t\tpadding: 0;\n\t\t\t\t\t\tmin-height: 30px;\n\t\t\t\t\t\tfont-size: 20px;\n\t\t\t\t\t\tline-height: $desc-name-height;\n\n\t\t\t\t\t\t// Needs 'deep' as the link is generated by the linkify directive\n\t\t\t\t\t\t&:deep(.linkified) {\n\t\t\t\t\t\t\tcursor: pointer;\n\t\t\t\t\t\t\ttext-decoration: underline;\n\t\t\t\t\t\t\tmargin: 0;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\t.app-sidebar-header__mainname-form {\n\t\t\t\t\t\tdisplay: flex;\n\t\t\t\t\t\tflex: 1 1 auto;\n\t\t\t\t\t\talign-items: center;\n\n\t\t\t\t\t\tinput.app-sidebar-header__mainname-input {\n\t\t\t\t\t\t\tflex: 1 1 auto;\n\t\t\t\t\t\t\tmargin: 0;\n\t\t\t\t\t\t\tpadding: $desc-input-padding;\n\t\t\t\t\t\t\tfont-size: 20px;\n\t\t\t\t\t\t\tfont-weight: bold;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\t// main menu\n\t\t\t\t\t.app-sidebar-header__menu {\n\t\t\t\t\t\tmargin-left: 5px;\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t// shared between main and subname\n\t\t\t\t.app-sidebar-header__mainname,\n\t\t\t\t.app-sidebar-header__subname {\n\t\t\t\t\toverflow: hidden;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\tmargin: 0;\n\t\t\t\t\twhite-space: nowrap;\n\t\t\t\t\ttext-overflow: ellipsis;\n\t\t\t\t}\n\n\t\t\t\t// subname\n\t\t\t\t.app-sidebar-header__subname {\n\t\t\t\t\tcolor: var(--color-text-maxcontrast);\n\t\t\t\t\tfont-size: var(--default-font-size);\n\t\t\t\t\tpadding: 0;\n\n\t\t\t\t\t* {\n\t\t\t\t\t\tvertical-align: text-bottom;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t// sidebar description slot\n\t\t&__description {\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t\tmargin: 0 10px;\n\t\t}\n\t}\n}\n\n// Make the sidebar full-width on small screens\n@media only screen and (max-width: $breakpoint-small-mobile) {\n\t.app-sidebar {\n\t\tposition: absolute;\n\t\t--app-sidebar-width: 100vw;\n\t}\n}\n\n.slide-right-leave-active,\n.slide-right-enter-active {\n\ttransition-duration: var(--animation-quick);\n\ttransition-property: margin-right;\n}\n\n.slide-right-enter-to,\n.slide-right-leave-from {\n\tmargin-right: 0;\n}\n\n.slide-right-enter-from,\n.slide-right-leave-to {\n\tmargin-right: calc(-1 * var(--app-sidebar-width));\n}\n</style>\n\n<style lang=\"scss\">\n// ! slots specific designs, cannot be scoped\n// if any button inside the description slot, increase visual padding\n.app-sidebar-header__description {\n\tbutton, .button,\n\tinput[type='button'],\n\tinput[type='submit'],\n\tinput[type='reset'] {\n\t\tpadding: 6px 22px;\n\t}\n}\n\n</style>\n"],"names":["_sfc_main","NcVNodes","_hoisted_1","_hoisted_2","_openBlock","_createElementBlock","_withKeys","_withModifiers","_Fragment","_renderList","_createBlock","_normalizeClass","_createVNode","_withCtx","_createElementVNode","_toDisplayString","_createCommentVNode","_renderSlot","_hoisted_3","_mergeProps","_hoisted_4","IconArrowRight","IconClose","Focus","Linkify","ClickOutside","_Transition","_Teleport","_normalizeStyle","_createTextVNode"],"mappings":"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","x_google_ignoreList":[1,2,3]}

package/dist/chunks/NcAvatar-A1YnlIoN.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NcAvatar-A1YnlIoN.mjs","sources":["../../src/mixins/userStatus.js","../../src/components/NcAvatar/NcAvatar.vue"],"sourcesContent":["/**\n * SPDX-FileCopyrightText: 2020 Nextcloud GmbH and Nextcloud contributors\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\n\nimport { getCurrentUser } from '@nextcloud/auth'\nimport axios from '@nextcloud/axios'\nimport { getCapabilities } from '@nextcloud/capabilities'\nimport { generateOcsUrl } from '@nextcloud/router'\n\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\thasStatus: false,\n\t\t\tuserStatus: {\n\t\t\t\tstatus: null,\n\t\t\t\tmessage: null,\n\t\t\t\ticon: null,\n\t\t\t},\n\t\t}\n\t},\n\tmethods: {\n\t\t/**\n\t\t * Fetches the user-status from the server\n\t\t *\n\t\t * @param {string} userId UserId of the user to fetch the status for\n\t\t *\n\t\t * @return {Promise<void>}\n\t\t */\n\t\tasync fetchUserStatus(userId) {\n\t\t\tif (!userId) {\n\t\t\t\treturn\n\t\t\t}\n\t\t\tconst capabilities = getCapabilities()\n\t\t\tif (!Object.prototype.hasOwnProperty.call(capabilities, 'user_status') || !capabilities.user_status.enabled) {\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\t// User status endpoint is not available for guests.\n\t\t\tif (!getCurrentUser()) {\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\ttry {\n\t\t\t\tconst { data } = await axios.get(generateOcsUrl('apps/user_status/api/v1/statuses/{userId}', { userId }))\n\t\t\t\tconst {\n\t\t\t\t\tstatus,\n\t\t\t\t\tmessage,\n\t\t\t\t\ticon,\n\t\t\t\t} = data.ocs.data\n\t\t\t\tthis.userStatus.status = status\n\t\t\t\tthis.userStatus.message = message || ''\n\t\t\t\tthis.userStatus.icon = icon || ''\n\t\t\t\tthis.hasStatus = true\n\t\t\t} catch (e) {\n\t\t\t\tif (e.response.status === 404 && e.response.data.ocs?.data?.length === 0) {\n\t\t\t\t\t// User just has no status set, so don't log it\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t\tconsole.error(e)\n\t\t\t}\n\t\t},\n\t},\n}\n","<!--\n  - SPDX-FileCopyrightText: 2018 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n\n### Basic user avatar\n\n```vue\n\t<NcAvatar user=\"willywonka\" display-name=\"Willy Wonka\" />\n```\n\n### Avatar with image\n\n```vue\n\t<NcAvatar url=\"favicon-touch.png\" />\n```\n\n### Avatar with material design icon\n\n```\n<template>\n\t<NcAvatar>\n\t\t<template #icon>\n\t\t\t<AccountMultiple :size=\"20\" />\n\t\t</template>\n\t</NcAvatar>\n</template>\n<script>\nimport AccountMultiple from 'vue-material-design-icons/AccountMultiple.vue'\n\nexport default {\n\tcomponents: {\n\t\tAccountMultiple,\n\t},\n}\n</script>\n```\n\n### Avatar with preloaded status\n```\n<template>\n<div class=\"grid\">\n\t<NcAvatar user=\"janedoe\"\n\t\tdisplay-name=\"Jane Doe\"\n\t\t:size=\"44\"\n\t\t:preloaded-user-status=\"status.online\">\n\t</NcAvatar>\n\t<NcAvatar user=\"janedoe\"\n\t\tdisplay-name=\"Jane Doe\"\n\t\t:size=\"44\"\n\t\t:preloaded-user-status=\"status.away\">\n\t</NcAvatar>\n\t<NcAvatar user=\"janedoe\"\n\t\tdisplay-name=\"Jane Doe\"\n\t\t:size=\"44\"\n\t\t:preloaded-user-status=\"status.dnd\">\n\t</NcAvatar>\n\t<NcAvatar user=\"janedoe\"\n\t\tdisplay-name=\"Jane Doe\"\n\t\t:size=\"44\"\n\t\t:preloaded-user-status=\"status.custom\">\n\t</NcAvatar>\n\t<NcAvatar user=\"janedoe\"\n\t\tdisplay-name=\"Jane Doe\"\n\t\t:preloaded-user-status=\"status.online\">\n\t</NcAvatar>\n\t<NcAvatar user=\"janedoe\"\n\t\tdisplay-name=\"Jane Doe\"\n\t\t:preloaded-user-status=\"status.away\">\n\t</NcAvatar>\n\t<NcAvatar user=\"janedoe\"\n\t\tdisplay-name=\"Jane Doe\"\n\t\t:preloaded-user-status=\"status.dnd\">\n\t</NcAvatar>\n\t<NcAvatar user=\"janedoe\"\n\t\tdisplay-name=\"Jane Doe\"\n\t\t:preloaded-user-status=\"status.custom\">\n\t</NcAvatar>\n</div>\n</template>\n\n<script>\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\tstatus: {\n\t\t\t\tonline: {\n\t\t\t\t\ticon: '',\n\t\t\t\t\tstatus: 'online',\n\t\t\t\t\tmessage: 'Available',\n\t\t\t\t},\n\t\t\t\taway: {\n\t\t\t\t\ticon: '',\n\t\t\t\t\tstatus: 'away',\n\t\t\t\t\tmessage: 'Away',\n\t\t\t\t},\n\t\t\t\tdnd: {\n\t\t\t\t\ticon: '',\n\t\t\t\t\tstatus: 'dnd',\n\t\t\t\t\tmessage: 'Busy',\n\t\t\t\t},\n\t\t\t\tcustom: {\n\t\t\t\t\ticon: '📆',\n\t\t\t\t\tstatus: 'online',\n\t\t\t\t\tmessage: 'In a meeting',\n\t\t\t\t}\n\t\t\t},\n\t\t}\n\t},\n}\n</script>\n<style>\n\t.grid {\n\t\twidth: fit-content;\n\t\tdisplay: grid;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\tgap: 8px;\n\t\tgrid-template-columns: repeat(4, 1fr);\n\t}\n</style>\n```\n\n### Avatar for non-users\n\n```vue\n\t<NcAvatar display-name=\"Robbie Hyeon-Jeong\" :is-no-user=\"true\" />\n```\n\n### Avatar on complex background\n\n```\n<template>\n\t<div class=\"avatar-background\">\n\t\t<NcAvatar class=\"avatar\" :is-no-user=\"true\" display-name=\"Cecilia Rohese\" />\n\t</div>\n</template>\n<style scoped>\n.avatar-background {\n\twidth: 80px;\n\theight: 60px;\n\tbackground: linear-gradient(to bottom, #0057b8 0%, #0057b8 49.99%, #ffd700 50%, #ffd700 100%);\n}\n\n.avatar {\n\tmargin: 15px 25px;\n}\n</style>\n```\n\n</docs>\n<template>\n\t<span ref=\"main\"\n\t\tv-click-outside=\"closeMenu\"\n\t\t:title=\"tooltip\"\n\t\t:class=\"{\n\t\t\t'avatardiv--unknown': userDoesNotExist,\n\t\t\t'avatardiv--with-menu': hasMenu,\n\t\t\t'avatardiv--with-menu-loading': contactsMenuLoading\n\t\t}\"\n\t\t:style=\"avatarStyle\"\n\t\tclass=\"avatardiv popovermenu-wrapper\"\n\t\t:tabindex=\"hasMenu ? '0' : undefined\"\n\t\t:aria-label=\"avatarAriaLabel\"\n\t\t:role=\"hasMenu ? 'button' : undefined\"\n\t\tv-on=\"hasMenu ? {\n\t\t\tclick: toggleMenu,\n\t\t\tkeydown: toggleMenu,\n\t\t} : {}\">\n\t\t<!-- @slot Icon slot -->\n\t\t<slot name=\"icon\">\n\t\t\t<!-- Avatar icon or image -->\n\t\t\t<span v-if=\"iconClass\" :class=\"iconClass\" class=\"avatar-class-icon\" />\n\t\t\t<img v-else-if=\"isAvatarLoaded && !userDoesNotExist\"\n\t\t\t\t:src=\"avatarUrlLoaded\"\n\t\t\t\t:srcset=\"avatarSrcSetLoaded\"\n\t\t\t\talt=\"\">\n\t\t</slot>\n\n\t\t<!-- Contact menu -->\n\t\t<!-- We show a button if the menu is not loaded yet. -->\n\t\t<NcButton v-if=\"hasMenu && menu.length === 0\"\n\t\t\ttype=\"tertiary-no-background\"\n\t\t\tclass=\"action-item action-item__menutoggle\"\n\t\t\t:aria-label=\"avatarAriaLabel\"\n\t\t\t@click=\"toggleMenu\">\n\t\t\t<template #icon>\n\t\t\t\t<NcLoadingIcon v-if=\"contactsMenuLoading\" />\n\t\t\t\t<DotsHorizontal v-else :size=\"20\" />\n\t\t\t</template>\n\t\t</NcButton>\n\t\t<NcActions v-else-if=\"hasMenu\"\n\t\t\tv-model:open=\"contactsMenuOpenState\"\n\t\t\tforce-menu\n\t\t\tmanual-open\n\t\t\ttype=\"tertiary-no-background\"\n\t\t\t:container=\"menuContainer\"\n\t\t\t:aria-label=\"avatarAriaLabel\"\n\t\t\t@click=\"toggleMenu\">\n\t\t\t<component :is=\"item.ncActionComponent\"\n\t\t\t\tv-for=\"(item, key) in menu\"\n\t\t\t\t:key=\"key\"\n\t\t\t\tv-bind=\"item.ncActionComponentProps\">\n\t\t\t\t<template v-if=\"item.iconSvg\" #icon>\n\t\t\t\t\t<NcIconSvgWrapper :svg=\"item.iconSvg\" />\n\t\t\t\t</template>\n\t\t\t\t{{ item.text }}\n\t\t\t</component>\n\t\t\t<template v-if=\"contactsMenuLoading\" #icon>\n\t\t\t\t<NcLoadingIcon />\n\t\t\t</template>\n\t\t</NcActions>\n\n\t\t<!-- Avatar status -->\n\t\t<span v-if=\"showUserStatusIconOnAvatar\" class=\"avatardiv__user-status avatardiv__user-status--icon\">\n\t\t\t{{ userStatus.icon }}\n\t\t</span>\n\t\t<NcUserStatusIcon v-else-if=\"canDisplayUserStatus\"\n\t\t\tclass=\"avatardiv__user-status\"\n\t\t\t:status=\"userStatus.status\"\n\t\t\t:aria-hidden=\"String(hasMenu)\" />\n\n\t\t<!-- Show the letter if no avatar nor icon class -->\n\t\t<span v-if=\"showInitials\"\n\t\t\t:style=\"initialsWrapperStyle\"\n\t\t\tclass=\"avatardiv__initials-wrapper\">\n\t\t\t<span :style=\"initialsStyle\" class=\"avatardiv__initials\">\n\t\t\t\t{{ initials }}\n\t\t\t</span>\n\t\t</span>\n\t</span>\n</template>\n\n<script>\nimport NcActions from '../NcActions/index.js'\nimport NcActionLink from '../NcActionLink/index.js'\nimport NcActionRouter from '../NcActionRouter/index.js'\nimport NcActionText from '../NcActionText/index.js'\nimport NcButton from '../NcButton/index.ts'\nimport NcIconSvgWrapper from '../NcIconSvgWrapper/index.js'\nimport NcLoadingIcon from '../NcLoadingIcon/index.js'\nimport NcUserStatusIcon from '../NcUserStatusIcon/index.js'\nimport usernameToColor from '../../functions/usernameToColor/index.js'\nimport { getAvatarUrl } from '../../utils/getAvatarUrl.ts'\nimport { getUserStatusText } from '../../utils/UserStatus.ts'\nimport { userStatus } from '../../mixins/index.js'\nimport { t } from '../../l10n.js'\nimport { getRoute } from '../../components/NcRichText/autolink.ts'\n\nimport axios from '@nextcloud/axios'\nimport DotsHorizontal from 'vue-material-design-icons/DotsHorizontal.vue'\n\nimport { getCurrentUser } from '@nextcloud/auth'\nimport { subscribe, unsubscribe } from '@nextcloud/event-bus'\nimport { getBuilder } from '@nextcloud/browser-storage'\nimport { generateUrl } from '@nextcloud/router'\nimport { vOnClickOutside as ClickOutside } from '@vueuse/components'\n\nconst browserStorage = getBuilder('nextcloud').persist().build()\n\n/**\n * @param {string} userId The id of the user\n */\nfunction getUserHasAvatar(userId) {\n\tconst flag = browserStorage.getItem('user-has-avatar.' + userId)\n\tif (typeof flag === 'string') {\n\t\treturn Boolean(flag)\n\t}\n\treturn null\n}\n\n/**\n * @param {string} userId The id of the user\n * @param {boolean} flag Has the user an avatar\n */\nfunction setUserHasAvatar(userId, flag) {\n\tif (userId) {\n\t\tbrowserStorage.setItem('user-has-avatar.' + userId, flag)\n\t}\n}\n\nexport default {\n\tname: 'NcAvatar',\n\n\tdirectives: {\n\t\tClickOutside,\n\t},\n\tcomponents: {\n\t\tDotsHorizontal,\n\t\tNcActions,\n\t\tNcButton,\n\t\tNcIconSvgWrapper,\n\t\tNcLoadingIcon,\n\t\tNcUserStatusIcon,\n\t},\n\tmixins: [userStatus],\n\tprops: {\n\t\t/**\n\t\t * Set a custom url to the avatar image\n\t\t * either the url, user or displayName property must be defined\n\t\t */\n\t\turl: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\t\t/**\n\t\t * Set a css icon-class for an icon to be used instead of the avatar.\n\t\t */\n\t\ticonClass: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\t\t/**\n\t\t * Set the user id to fetch the avatar\n\t\t * either the url, user or displayName property must be defined\n\t\t */\n\t\tuser: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\t\t/**\n\t\t * Whether or not to display the user-status\n\t\t */\n\t\tshowUserStatus: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: true,\n\t\t},\n\t\t/**\n\t\t * Whether or not to the status-icon should be used instead of online/away\n\t\t */\n\t\tshowUserStatusCompact: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: true,\n\t\t},\n\t\t/**\n\t\t * When the user status was preloaded via another source it can be handed in with this property to save the request.\n\t\t * If this property is not set the status will be fetched automatically.\n\t\t * If a preloaded no-status is available provide this object with properties \"status\", \"icon\" and \"message\" set to null.\n\t\t */\n\t\tpreloadedUserStatus: {\n\t\t\ttype: Object,\n\t\t\tdefault: undefined,\n\t\t},\n\t\t/**\n\t\t * Is the user a guest user (then we have to user a different endpoint)\n\t\t */\n\t\tisGuest: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * Set a display name that will be rendered as a tooltip\n\t\t * either the url, user or displayName property must be defined\n\t\t * specify just the displayname to generate a placeholder avatar without\n\t\t * trying to fetch the avatar based on the user id\n\t\t */\n\t\tdisplayName: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\t\t/**\n\t\t * Set a size in px for the rendered avatar\n\t\t */\n\t\tsize: {\n\t\t\ttype: Number,\n\t\t\tdefault: 32,\n\t\t},\n\t\t/**\n\t\t * Placeholder avatars will be automatically generated when this is set to true\n\t\t */\n\t\tallowPlaceholder: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: true,\n\t\t},\n\t\t/**\n\t\t * Disable the tooltip\n\t\t */\n\t\tdisableTooltip: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * Disable the menu\n\t\t */\n\t\tdisableMenu: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * Declares a custom tooltip when not null\n\t\t * Fallback will be the displayName\n\t\t *\n\t\t * requires disableTooltip not to be set to true\n\t\t */\n\t\ttooltipMessage: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * Declares username is not a user's name, when true.\n\t\t * Prevents loading user's avatar from server and forces generating colored initials,\n\t\t * i.e. if the user is a group\n\t\t */\n\t\tisNoUser: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Selector for the popover menu container\n\t\t */\n\t\tmenuContainer: {\n\t\t\ttype: [String, Object, Element, Boolean],\n\t\t\tdefault: 'body',\n\t\t},\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tavatarUrlLoaded: null,\n\t\t\tavatarSrcSetLoaded: null,\n\t\t\tuserDoesNotExist: false,\n\t\t\tisAvatarLoaded: false,\n\t\t\tisMenuLoaded: false,\n\t\t\tcontactsMenuLoading: false,\n\t\t\tcontactsMenuActions: [],\n\t\t\tcontactsMenuOpenState: false,\n\t\t}\n\t},\n\tcomputed: {\n\t\tavatarAriaLabel() {\n\t\t\t// aria-label is only allowed on interactive elements\n\t\t\tif (!this.hasMenu) {\n\t\t\t\treturn\n\t\t\t}\n\t\t\tif (this.canDisplayUserStatus || this.showUserStatusIconOnAvatar) {\n\t\t\t\treturn t('Avatar of {displayName}, {status}', { displayName: this.displayName ?? this.user, status: getUserStatusText(this.userStatus.status) })\n\t\t\t}\n\t\t\treturn t('Avatar of {displayName}', { displayName: this.displayName ?? this.user })\n\t\t},\n\t\tcanDisplayUserStatus() {\n\t\t\treturn this.showUserStatus\n\t\t\t\t&& this.hasStatus\n\t\t\t\t&& ['online', 'away', 'busy', 'dnd'].includes(this.userStatus.status)\n\t\t},\n\t\tshowUserStatusIconOnAvatar() {\n\t\t\treturn this.showUserStatus\n\t\t\t\t&& this.showUserStatusCompact\n\t\t\t\t&& this.hasStatus\n\t\t\t\t&& this.userStatus.status !== 'dnd'\n\t\t\t\t&& this.userStatus.icon\n\t\t},\n\t\t/**\n\t\t * The user identifier, either the display name if set or the user property\n\t\t * If both properties are not set an empty string is returned\n\t\t */\n\t\tuserIdentifier() {\n\t\t\tif (this.isDisplayNameDefined) {\n\t\t\t\treturn this.displayName\n\t\t\t}\n\t\t\tif (this.isUserDefined) {\n\t\t\t\treturn this.user\n\t\t\t}\n\t\t\treturn ''\n\t\t},\n\t\tisUserDefined() {\n\t\t\treturn typeof this.user !== 'undefined'\n\t\t},\n\t\tisDisplayNameDefined() {\n\t\t\treturn typeof this.displayName !== 'undefined'\n\t\t},\n\t\tisUrlDefined() {\n\t\t\treturn typeof this.url !== 'undefined'\n\t\t},\n\t\thasMenu() {\n\t\t\tif (this.disableMenu) {\n\t\t\t\treturn false\n\t\t\t}\n\t\t\tif (this.isMenuLoaded) {\n\t\t\t\treturn this.menu.length > 0\n\t\t\t}\n\t\t\treturn !(this.user === getCurrentUser()?.uid || this.userDoesNotExist || this.url)\n\t\t},\n\n\t\t/**\n\t\t * True if initials should be shown as the user icon fallback\n\t\t */\n\t\tshowInitials() {\n\t\t\treturn this.allowPlaceholder && this.userDoesNotExist && !(this.iconClass || this.$slots.icon?.())\n\t\t},\n\n\t\tavatarStyle() {\n\t\t\tconst style = {\n\t\t\t\t'--size': this.size + 'px',\n\t\t\t\tlineHeight: this.size + 'px',\n\t\t\t\tfontSize: Math.round(this.size * 0.45) + 'px',\n\t\t\t}\n\t\t\treturn style\n\t\t},\n\t\tinitialsWrapperStyle() {\n\t\t\tconst { r, g, b } = usernameToColor(this.userIdentifier)\n\t\t\treturn {\n\t\t\t\tbackgroundColor: `rgba(${r}, ${g}, ${b}, 0.1)`,\n\t\t\t}\n\t\t},\n\t\tinitialsStyle() {\n\t\t\tconst { r, g, b } = usernameToColor(this.userIdentifier)\n\t\t\treturn {\n\t\t\t\tcolor: `rgb(${r}, ${g}, ${b})`,\n\t\t\t}\n\t\t},\n\t\ttooltip() {\n\t\t\tif (this.disableTooltip) {\n\t\t\t\treturn null\n\t\t\t}\n\t\t\tif (this.tooltipMessage) {\n\t\t\t\treturn this.tooltipMessage\n\t\t\t}\n\n\t\t\treturn this.displayName\n\t\t},\n\n\t\t/**\n\t\t * Get the (max. two) initials of the user as uppcase string\n\t\t */\n\t\tinitials() {\n\t\t\tlet initials = '?'\n\t\t\tif (this.showInitials) {\n\t\t\t\tconst user = this.userIdentifier.trim()\n\t\t\t\tif (user === '') {\n\t\t\t\t\treturn initials\n\t\t\t\t}\n\n\t\t\t\t/**\n\t\t\t\t * Filtered user name, without special characters so only letters and numbers are allowed (prevent e.g. '(' as an initial)\n\t\t\t\t * \\p{L}: Letters of all languages\n\t\t\t\t * \\p{N}: Numbers of all languages\n\t\t\t\t * \\s: White space for breaking the string\n\t\t\t\t * @type {string}\n\t\t\t\t */\n\t\t\t\tconst filteredChars = user.match(/[\\p{L}\\p{N}\\s]/gu)\n\t\t\t\tif (filteredChars == null) {\n\t\t\t\t\treturn initials\n\t\t\t\t}\n\n\t\t\t\tconst filtered = filteredChars.join('')\n\t\t\t\tconst idx = filtered.lastIndexOf(' ')\n\t\t\t\tinitials = String.fromCodePoint(filtered.codePointAt(0))\n\t\t\t\tif (idx !== -1) {\n\t\t\t\t\tinitials = initials.concat(String.fromCodePoint(filtered.codePointAt(idx + 1)))\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn initials.toLocaleUpperCase()\n\t\t},\n\t\tmenu() {\n\t\t\tconst actions = this.contactsMenuActions.map((item) => {\n\t\t\t\tconst route = getRoute(this.$router, item.hyperlink)\n\t\t\t\treturn {\n\t\t\t\t\tncActionComponent: route ? NcActionRouter : NcActionLink,\n\t\t\t\t\tncActionComponentProps: route\n\t\t\t\t\t\t? {\n\t\t\t\t\t\t\tto: route,\n\t\t\t\t\t\t\ticon: item.icon,\n\t\t\t\t\t\t}\n\t\t\t\t\t\t: {\n\t\t\t\t\t\t\thref: item.hyperlink,\n\t\t\t\t\t\t\ticon: item.icon,\n\t\t\t\t\t\t},\n\t\t\t\t\ttext: item.title,\n\t\t\t\t}\n\t\t\t})\n\n\t\t\t/**\n\t\t\t * @param {string} html The HTML to escape\n\t\t\t */\n\t\t\tfunction escape(html) {\n\t\t\t\tconst text = document.createTextNode(html)\n\t\t\t\tconst p = document.createElement('p')\n\t\t\t\tp.appendChild(text)\n\t\t\t\treturn p.innerHTML\n\t\t\t}\n\n\t\t\tif (this.showUserStatus && (this.userStatus.icon || this.userStatus.message)) {\n\t\t\t\t// NcAction's URL icons are inverted in dark mode, so we need to pass SVG image in the icon slot\n\t\t\t\tconst emojiIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 16\">\n\t\t\t\t\t<text x=\"50%\" y=\"50%\" text-anchor=\"middle\" style=\"dominant-baseline: central; font-size: 85%\">${escape(this.userStatus.icon)}</text>\n\t\t\t\t</svg>`\n\t\t\t\treturn [{\n\t\t\t\t\tncActionComponent: NcActionText,\n\t\t\t\t\tncActionComponentProps: {},\n\t\t\t\t\ticonSvg: this.userStatus.icon ? emojiIcon : undefined,\n\t\t\t\t\ttext: `${this.userStatus.message}`,\n\t\t\t\t}].concat(actions)\n\t\t\t}\n\n\t\t\treturn actions\n\t\t},\n\t},\n\n\twatch: {\n\t\turl() {\n\t\t\tthis.userDoesNotExist = false\n\t\t\tthis.loadAvatarUrl()\n\t\t},\n\t\tuser() {\n\t\t\tthis.userDoesNotExist = false\n\t\t\tthis.isMenuLoaded = false\n\t\t\tthis.loadAvatarUrl()\n\t\t},\n\t},\n\n\tmounted() {\n\t\tthis.loadAvatarUrl()\n\t\tsubscribe('settings:avatar:updated', this.loadAvatarUrl)\n\t\tsubscribe('settings:display-name:updated', this.loadAvatarUrl)\n\t\tif (this.showUserStatus && this.user && !this.isNoUser) {\n\t\t\tif (!this.preloadedUserStatus) {\n\t\t\t\tthis.fetchUserStatus(this.user)\n\t\t\t} else {\n\t\t\t\tthis.userStatus.status = this.preloadedUserStatus.status || ''\n\t\t\t\tthis.userStatus.message = this.preloadedUserStatus.message || ''\n\t\t\t\tthis.userStatus.icon = this.preloadedUserStatus.icon || ''\n\t\t\t\tthis.hasStatus = this.preloadedUserStatus.status !== null\n\t\t\t}\n\t\t\tsubscribe('user_status:status.updated', this.handleUserStatusUpdated)\n\t\t}\n\t},\n\n\tbeforeUnmount() {\n\t\tunsubscribe('settings:avatar:updated', this.loadAvatarUrl)\n\t\tunsubscribe('settings:display-name:updated', this.loadAvatarUrl)\n\t\tif (this.showUserStatus && this.user && !this.isNoUser) {\n\t\t\tunsubscribe('user_status:status.updated', this.handleUserStatusUpdated)\n\t\t}\n\t},\n\n\tmethods: {\n\t\tt,\n\t\thandleUserStatusUpdated(state) {\n\t\t\tif (this.user === state.userId) {\n\t\t\t\tthis.userStatus = {\n\t\t\t\t\tstatus: state.status,\n\t\t\t\t\ticon: state.icon,\n\t\t\t\t\tmessage: state.message,\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Toggle the popover menu on click or enter\n\t\t * @param {KeyboardEvent|MouseEvent} event the UI event\n\t\t */\n\t\tasync toggleMenu(event) {\n\t\t\tif (event.type === 'keydown' && event.key !== 'Enter') {\n\t\t\t\treturn\n\t\t\t}\n\t\t\tif (!this.contactsMenuOpenState) {\n\t\t\t\tawait this.fetchContactsMenu()\n\t\t\t}\n\t\t\tthis.contactsMenuOpenState = !this.contactsMenuOpenState\n\t\t},\n\t\tcloseMenu() {\n\t\t\tthis.contactsMenuOpenState = false\n\t\t},\n\t\tasync fetchContactsMenu() {\n\t\t\tthis.contactsMenuLoading = true\n\t\t\ttry {\n\t\t\t\tconst user = encodeURIComponent(this.user)\n\t\t\t\tconst { data } = await axios.post(generateUrl('contactsmenu/findOne'), `shareType=0&shareWith=${user}`)\n\t\t\t\tthis.contactsMenuActions = data.topAction ? [data.topAction].concat(data.actions) : data.actions\n\t\t\t} catch (e) {\n\t\t\t\tthis.contactsMenuOpenState = false\n\t\t\t}\n\t\t\tthis.contactsMenuLoading = false\n\t\t\tthis.isMenuLoaded = true\n\t\t},\n\n\t\t/**\n\t\t * Handle avatar loading if user or url defined\n\t\t */\n\t\tloadAvatarUrl() {\n\t\t\tthis.isAvatarLoaded = false\n\n\t\t\t/** Only run avatar image loading if either user or url property is defined */\n\t\t\tif (!this.isUrlDefined && (!this.isUserDefined || this.isNoUser)) {\n\t\t\t\tthis.isAvatarLoaded = true\n\t\t\t\tthis.userDoesNotExist = true\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\t// Directly use the url if defined\n\t\t\tif (this.isUrlDefined) {\n\t\t\t\tthis.updateImageIfValid(this.url)\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\tif (this.size <= 64) {\n\t\t\t\tconst avatarUrl = this.avatarUrlGenerator(this.user, 64)\n\t\t\t\tconst srcset = [\n\t\t\t\t\tavatarUrl + ' 1x',\n\t\t\t\t\tthis.avatarUrlGenerator(this.user, 512) + ' 8x',\n\t\t\t\t].join(', ')\n\n\t\t\t\tthis.updateImageIfValid(avatarUrl, srcset)\n\t\t\t} else {\n\t\t\t\tconst avatarUrl = this.avatarUrlGenerator(this.user, 512)\n\t\t\t\tthis.updateImageIfValid(avatarUrl)\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Generate an avatar url from the server's avatar endpoint\n\t\t *\n\t\t * @param {string} user the user id\n\t\t * @param {number} size the desired size\n\t\t * @return {string}\n\t\t */\n\t\tavatarUrlGenerator(user, size) {\n\t\t\tlet avatarUrl = getAvatarUrl(user, size, this.isGuest)\n\n\t\t\t// eslint-disable-next-line camelcase\n\t\t\tif (user === getCurrentUser()?.uid && typeof oc_userconfig !== 'undefined') {\n\t\t\t\tavatarUrl += '?v=' + oc_userconfig.avatar.version\n\t\t\t}\n\n\t\t\treturn avatarUrl\n\t\t},\n\n\t\t/**\n\t\t * Check if the provided url is valid and update Avatar if so\n\t\t *\n\t\t * @param {string} url the avatar url\n\t\t * @param {Array} srcset the avatar srcset\n\t\t */\n\t\tupdateImageIfValid(url, srcset = null) {\n\t\t\t// skip loading\n\t\t\tconst userHasAvatar = getUserHasAvatar(this.user)\n\t\t\tif (this.isUserDefined && typeof userHasAvatar === 'boolean') {\n\t\t\t\tthis.isAvatarLoaded = true\n\t\t\t\tthis.avatarUrlLoaded = url\n\t\t\t\tif (srcset) {\n\t\t\t\t\tthis.avatarSrcSetLoaded = srcset\n\t\t\t\t}\n\t\t\t\tif (userHasAvatar === false) {\n\t\t\t\t\tthis.userDoesNotExist = true\n\t\t\t\t}\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\tconst img = new Image()\n\t\t\timg.onload = () => {\n\t\t\t\tthis.avatarUrlLoaded = url\n\t\t\t\tif (srcset) {\n\t\t\t\t\tthis.avatarSrcSetLoaded = srcset\n\t\t\t\t}\n\t\t\t\tthis.isAvatarLoaded = true\n\t\t\t\t// re-get to avoid concurrent access\n\t\t\t\tsetUserHasAvatar(this.user, true)\n\t\t\t}\n\t\t\timg.onerror = () => {\n\t\t\t\tconsole.debug('Invalid avatar url', url)\n\t\t\t\t// Avatar is invalid, reset\n\t\t\t\tthis.avatarUrlLoaded = null\n\t\t\t\tthis.avatarSrcSetLoaded = null\n\n\t\t\t\tthis.userDoesNotExist = true\n\t\t\t\tthis.isAvatarLoaded = false\n\t\t\t\tsetUserHasAvatar(this.user, false)\n\t\t\t}\n\n\t\t\tif (srcset) {\n\t\t\t\timg.srcset = srcset\n\t\t\t}\n\t\t\timg.src = url\n\t\t},\n\t},\n}\n</script>\n\n<style scoped lang=\"scss\">\n.avatardiv {\n\tposition: relative;\n\tdisplay: inline-block;\n\twidth: var(--size);\n\theight: var(--size);\n\n\t&--unknown {\n\t\tposition: relative;\n\t\tbackground-color: var(--color-main-background);\n\t\twhite-space: normal;\n\t}\n\n\t&:not(&--unknown) {\n\t\t// White/black background for avatars with transparency\n\t\tbackground-color: var(--color-main-background) !important;\n\t\tbox-shadow: 0 0 5px rgba(0, 0, 0, 0.05) inset;\n\t}\n\n\t&--with-menu {\n\t\tcursor: pointer;\n\t\t.action-item {\n\t\t\tposition: absolute;\n\t\t\ttop: 0;\n\t\t\tleft: 0;\n\t\t}\n\t\t:deep(.action-item__menutoggle) {\n\t\t\tcursor: pointer;\n\t\t\topacity: 0;\n\t\t}\n\t\t&:focus-within,\n\t\t&:hover,\n\t\t&#{&}-loading {\n\t\t\t:deep(.action-item__menutoggle) {\n\t\t\t\topacity: 1;\n\t\t\t}\n\t\t\timg {\n\t\t\t\topacity: 0.3;\n\t\t\t}\n\t\t}\n\t\t:deep(.action-item__menutoggle),\n\t\timg {\n\t\t\ttransition: opacity var(--animation-quick);\n\t\t}\n\t\t:deep() {\n\t\t\t.button-vue,\n\t\t\t.button-vue__icon {\n\t\t\t\theight: var(--size);\n\t\t\t\tmin-height: var(--size);\n\t\t\t\twidth: var(--size) !important;\n\t\t\t\tmin-width: var(--size);\n\t\t\t}\n\t\t}\n\t\t& > :deep(.button-vue),\n\t\t& > :deep(.action-item .button-vue) {\n\t\t\t--button-radius: calc(var(--size) / 2);\n\t\t}\n\t}\n\n\t.avatardiv__initials-wrapper {\n\t\tdisplay: block;\n\t\theight: var(--size);\n\t\twidth: var(--size);\n\t\tbackground-color: var(--color-main-background);\n\t\tborder-radius: calc(var(--size) / 2);\n\n\t\t.avatardiv__initials {\n\t\t\tposition: absolute;\n\t\t\ttop: 0;\n\t\t\tleft: 0;\n\t\t\tdisplay: block;\n\t\t\twidth: 100%;\n\t\t\ttext-align: center;\n\t\t\tfont-weight: normal;\n\t\t}\n\t}\n\n\timg {\n\t\t// Cover entire area\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\t// Keep ratio\n\t\tobject-fit: cover;\n\t}\n\n\t.material-design-icon {\n\t\twidth: var(--size);\n\t\theight: var(--size);\n\t}\n\n\t.avatardiv__user-status {\n\t\tbox-sizing: border-box;\n\t\tposition: absolute;\n\t\tinset-inline-end: -4px;\n\t\tbottom: -4px;\n\t\tmin-height: 14px;\n\t\tmin-width: 14px;\n\t\tmax-height: 18px;\n\t\tmax-width: 18px;\n\t\theight: 40%;\n\t\twidth: 40%;\n\t\tline-height: 1;\n\t\tfont-size: clamp(var(--font-size-small, 13px), 85%, var(--default-font-size));\n\t\tborder: 2px solid var(--color-main-background);\n\t\tbackground-color: var(--color-main-background);\n\t\tbackground-repeat: no-repeat;\n\t\tbackground-size: 16px;\n\t\tbackground-position: center;\n\t\tborder-radius: 50%;\n\n\t\t.acli:hover & {\n\t\t\tborder-color: var(--color-background-hover);\n\t\t\tbackground-color: var(--color-background-hover);\n\t\t}\n\t\t.acli.active & {\n\t\t\tborder-color: var(--color-primary-element-light);\n\t\t\tbackground-color: var(--color-primary-element-light);\n\t\t}\n\n\t\t&--icon {\n\t\t\tborder: none;\n\t\t\tbackground-color: transparent;\n\t\t}\n\t}\n\n\t.popovermenu-wrapper {\n\t\tposition: relative;\n\t\tdisplay: inline-block;\n\t}\n}\n\n.avatar-class-icon {\n\tdisplay: block;\n\tborder-radius: calc(var(--size) / 2);\n\tbackground-color: var(--color-background-darker);\n\theight: 100%;\n}\n\n</style>\n"],"names":["ClickOutside","_withDirectives","_openBlock","_createElementBlock","_mergeProps","_toHandlers","_renderSlot","_normalizeClass","_createCommentVNode","_createBlock","_createSlots","_withCtx","_Fragment","_renderList","_resolveDynamicComponent","_createTextVNode","_toDisplayString","_createVNode","_normalizeStyle","_createElementVNode"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAUA,MAAe,aAAA;AAAA,EACd,OAAO;AACN,WAAO;AAAA,MACN,WAAW;AAAA,MACX,YAAY;AAAA,QACX,QAAQ;AAAA,QACR,SAAS;AAAA,QACT,MAAM;AAAA,MACN;AAAA,IACJ;AAAA,EACE;AAAA,EACD,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQR,MAAM,gBAAgB,QAAQ;AAC7B,UAAI,CAAC,QAAQ;AACZ;AAAA,MACJ;AACG,YAAM,eAAe,gBAAe;AACpC,UAAI,CAAC,OAAO,UAAU,eAAe,KAAK,cAAc,aAAa,KAAK,CAAC,aAAa,YAAY,SAAS;AAC5G;AAAA,MACJ;AAGG,UAAI,CAAC,eAAc,GAAI;AACtB;AAAA,MACJ;AAEG,UAAI;AACH,cAAM,EAAE,KAAM,IAAG,MAAM,MAAM,IAAI,eAAe,6CAA6C,EAAE,QAAQ,CAAC;AACxG,cAAM;AAAA,UACL;AAAA,UACA;AAAA,UACA;AAAA,QACL,IAAQ,KAAK,IAAI;AACb,aAAK,WAAW,SAAS;AACzB,aAAK,WAAW,UAAU,WAAW;AACrC,aAAK,WAAW,OAAO,QAAQ;AAC/B,aAAK,YAAY;AAAA,MACjB,SAAQ,GAAG;AACX,YAAI,EAAE,SAAS,WAAW,OAAO,EAAE,SAAS,KAAK,KAAK,MAAM,WAAW,GAAG;AAEzE;AAAA,QACL;AACI,gBAAQ,MAAM,CAAC;AAAA,MACnB;AAAA,IACG;AAAA,EACD;AACF;;ACqMA,MAAM,iBAAiB,WAAW,WAAW,EAAE,QAAS,EAAC,MAAK;AAK9D,SAAS,iBAAiB,QAAQ;AACjC,QAAM,OAAO,eAAe,QAAQ,qBAAqB,MAAM;AAC/D,MAAI,OAAO,SAAS,UAAU;AAC7B,WAAO,QAAQ,IAAI;AAAA,EACpB;AACA,SAAO;AACR;AAMA,SAAS,iBAAiB,QAAQ,MAAM;AACvC,MAAI,QAAQ;AACX,mBAAe,QAAQ,qBAAqB,QAAQ,IAAI;AAAA,EACzD;AACD;AAEA,MAAK,YAAU;AAAA,EACd,MAAM;AAAA,EAEN,YAAY;AAAA,kBACXA;AAAAA,EACA;AAAA,EACD,YAAY;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACA;AAAA,EACD,QAAQ,CAAC,UAAU;AAAA,EACnB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKN,KAAK;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA,IAID,WAAW;AAAA,MACV,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA;AAAA,IAKD,MAAM;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA,IAID,gBAAgB;AAAA,MACf,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA,IAID,uBAAuB;AAAA,MACtB,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,qBAAqB;AAAA,MACpB,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA,IAID,SAAS;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOD,aAAa;AAAA,MACZ,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA,IAID,MAAM;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA,IAID,kBAAkB;AAAA,MACjB,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA,IAID,gBAAgB;AAAA,MACf,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA,IAID,aAAa;AAAA,MACZ,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOD,gBAAgB;AAAA,MACf,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOD,UAAU;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA,IAKD,eAAe;AAAA,MACd,MAAM,CAAC,QAAQ,QAAQ,SAAS,OAAO;AAAA,MACvC,SAAS;AAAA,IACT;AAAA,EACD;AAAA,EACD,OAAO;AACN,WAAO;AAAA,MACN,iBAAiB;AAAA,MACjB,oBAAoB;AAAA,MACpB,kBAAkB;AAAA,MAClB,gBAAgB;AAAA,MAChB,cAAc;AAAA,MACd,qBAAqB;AAAA,MACrB,qBAAqB,CAAE;AAAA,MACvB,uBAAuB;AAAA,IACxB;AAAA,EACA;AAAA,EACD,UAAU;AAAA,IACT,kBAAkB;AAEjB,UAAI,CAAC,KAAK,SAAS;AAClB;AAAA,MACD;AACA,UAAI,KAAK,wBAAwB,KAAK,4BAA4B;AACjE,eAAO,EAAE,qCAAqC,EAAE,aAAa,KAAK,eAAe,KAAK,MAAM,QAAQ,kBAAkB,KAAK,WAAW,MAAM,EAAG,CAAA;AAAA,MAChJ;AACA,aAAO,EAAE,2BAA2B,EAAE,aAAa,KAAK,eAAe,KAAK,KAAM,CAAA;AAAA,IAClF;AAAA,IACD,uBAAuB;AACtB,aAAO,KAAK,kBACR,KAAK,aACL,CAAC,UAAU,QAAQ,QAAQ,KAAK,EAAE,SAAS,KAAK,WAAW,MAAM;AAAA,IACrE;AAAA,IACD,6BAA6B;AAC5B,aAAO,KAAK,kBACR,KAAK,yBACL,KAAK,aACL,KAAK,WAAW,WAAW,SAC3B,KAAK,WAAW;AAAA,IACpB;AAAA;AAAA;AAAA;AAAA;AAAA,IAKD,iBAAiB;AAChB,UAAI,KAAK,sBAAsB;AAC9B,eAAO,KAAK;AAAA,MACb;AACA,UAAI,KAAK,eAAe;AACvB,eAAO,KAAK;AAAA,MACb;AACA,aAAO;AAAA,IACP;AAAA,IACD,gBAAgB;AACf,aAAO,OAAO,KAAK,SAAS;AAAA,IAC5B;AAAA,IACD,uBAAuB;AACtB,aAAO,OAAO,KAAK,gBAAgB;AAAA,IACnC;AAAA,IACD,eAAe;AACd,aAAO,OAAO,KAAK,QAAQ;AAAA,IAC3B;AAAA,IACD,UAAU;AACT,UAAI,KAAK,aAAa;AACrB,eAAO;AAAA,MACR;AACA,UAAI,KAAK,cAAc;AACtB,eAAO,KAAK,KAAK,SAAS;AAAA,MAC3B;AACA,aAAO,EAAE,KAAK,SAAS,eAAc,GAAI,OAAO,KAAK,oBAAoB,KAAK;AAAA,IAC9E;AAAA;AAAA;AAAA;AAAA,IAKD,eAAe;AACd,aAAO,KAAK,oBAAoB,KAAK,oBAAoB,EAAE,KAAK,aAAa,KAAK,OAAO,OAAQ;AAAA,IACjG;AAAA,IAED,cAAc;AACb,YAAM,QAAQ;AAAA,QACb,UAAU,KAAK,OAAO;AAAA,QACtB,YAAY,KAAK,OAAO;AAAA,QACxB,UAAU,KAAK,MAAM,KAAK,OAAO,IAAI,IAAI;AAAA,MAC1C;AACA,aAAO;AAAA,IACP;AAAA,IACD,uBAAuB;AACtB,YAAM,EAAE,GAAG,GAAG,EAAA,IAAM,gBAAgB,KAAK,cAAc;AACvD,aAAO;AAAA,QACN,iBAAiB,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC;AAAA,MACvC;AAAA,IACA;AAAA,IACD,gBAAgB;AACf,YAAM,EAAE,GAAG,GAAG,EAAA,IAAM,gBAAgB,KAAK,cAAc;AACvD,aAAO;AAAA,QACN,OAAO,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC;AAAA,MAC5B;AAAA,IACA;AAAA,IACD,UAAU;AACT,UAAI,KAAK,gBAAgB;AACxB,eAAO;AAAA,MACR;AACA,UAAI,KAAK,gBAAgB;AACxB,eAAO,KAAK;AAAA,MACb;AAEA,aAAO,KAAK;AAAA,IACZ;AAAA;AAAA;AAAA;AAAA,IAKD,WAAW;AACV,UAAI,WAAW;AACf,UAAI,KAAK,cAAc;AACtB,cAAM,OAAO,KAAK,eAAe,KAAI;AACrC,YAAI,SAAS,IAAI;AAChB,iBAAO;AAAA,QACR;AASA,cAAM,gBAAgB,KAAK,MAAM,kBAAkB;AACnD,YAAI,iBAAiB,MAAM;AAC1B,iBAAO;AAAA,QACR;AAEA,cAAM,WAAW,cAAc,KAAK,EAAE;AACtC,cAAM,MAAM,SAAS,YAAY,GAAG;AACpC,mBAAW,OAAO,cAAc,SAAS,YAAY,CAAC,CAAC;AACvD,YAAI,QAAQ,IAAI;AACf,qBAAW,SAAS,OAAO,OAAO,cAAc,SAAS,YAAY,MAAM,CAAC,CAAC,CAAC;AAAA,QAC/E;AAAA,MACD;AACA,aAAO,SAAS,kBAAiB;AAAA,IACjC;AAAA,IACD,OAAO;AACN,YAAM,UAAU,KAAK,oBAAoB,IAAI,CAAC,SAAS;AACtD,cAAM,QAAQ,SAAS,KAAK,SAAS,KAAK,SAAS;AACnD,eAAO;AAAA,UACN,mBAAmB,QAAQ,iBAAiB;AAAA,UAC5C,wBAAwB,QACrB;AAAA,YACD,IAAI;AAAA,YACJ,MAAM,KAAK;AAAA,UACZ,IACE;AAAA,YACD,MAAM,KAAK;AAAA,YACX,MAAM,KAAK;AAAA,UACX;AAAA,UACF,MAAM,KAAK;AAAA,QACZ;AAAA,MACA,CAAA;AAKD,eAAS,OAAO,MAAM;AACrB,cAAM,OAAO,SAAS,eAAe,IAAI;AACzC,cAAM,IAAI,SAAS,cAAc,GAAG;AACpC,UAAE,YAAY,IAAI;AAClB,eAAO,EAAE;AAAA,MACV;AAEA,UAAI,KAAK,mBAAmB,KAAK,WAAW,QAAQ,KAAK,WAAW,UAAU;AAE7E,cAAM,YAAY;AAAA,qGAC+E,OAAO,KAAK,WAAW,IAAI,CAAC;AAAA;AAE7H,eAAO,CAAC;AAAA,UACP,mBAAmB;AAAA,UACnB,wBAAwB,CAAE;AAAA,UAC1B,SAAS,KAAK,WAAW,OAAO,YAAY;AAAA,UAC5C,MAAM,GAAG,KAAK,WAAW,OAAO;AAAA,QACjC,CAAC,EAAE,OAAO,OAAO;AAAA,MAClB;AAEA,aAAO;AAAA,IACP;AAAA,EACD;AAAA,EAED,OAAO;AAAA,IACN,MAAM;AACL,WAAK,mBAAmB;AACxB,WAAK,cAAa;AAAA,IAClB;AAAA,IACD,OAAO;AACN,WAAK,mBAAmB;AACxB,WAAK,eAAe;AACpB,WAAK,cAAa;AAAA,IAClB;AAAA,EACD;AAAA,EAED,UAAU;AACT,SAAK,cAAa;AAClB,cAAU,2BAA2B,KAAK,aAAa;AACvD,cAAU,iCAAiC,KAAK,aAAa;AAC7D,QAAI,KAAK,kBAAkB,KAAK,QAAQ,CAAC,KAAK,UAAU;AACvD,UAAI,CAAC,KAAK,qBAAqB;AAC9B,aAAK,gBAAgB,KAAK,IAAI;AAAA,aACxB;AACN,aAAK,WAAW,SAAS,KAAK,oBAAoB,UAAU;AAC5D,aAAK,WAAW,UAAU,KAAK,oBAAoB,WAAW;AAC9D,aAAK,WAAW,OAAO,KAAK,oBAAoB,QAAQ;AACxD,aAAK,YAAY,KAAK,oBAAoB,WAAW;AAAA,MACtD;AACA,gBAAU,8BAA8B,KAAK,uBAAuB;AAAA,IACrE;AAAA,EACA;AAAA,EAED,gBAAgB;AACf,gBAAY,2BAA2B,KAAK,aAAa;AACzD,gBAAY,iCAAiC,KAAK,aAAa;AAC/D,QAAI,KAAK,kBAAkB,KAAK,QAAQ,CAAC,KAAK,UAAU;AACvD,kBAAY,8BAA8B,KAAK,uBAAuB;AAAA,IACvE;AAAA,EACA;AAAA,EAED,SAAS;AAAA,IACR;AAAA,IACA,wBAAwB,OAAO;AAC9B,UAAI,KAAK,SAAS,MAAM,QAAQ;AAC/B,aAAK,aAAa;AAAA,UACjB,QAAQ,MAAM;AAAA,UACd,MAAM,MAAM;AAAA,UACZ,SAAS,MAAM;AAAA,QAChB;AAAA,MACD;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,MAAM,WAAW,OAAO;AACvB,UAAI,MAAM,SAAS,aAAa,MAAM,QAAQ,SAAS;AACtD;AAAA,MACD;AACA,UAAI,CAAC,KAAK,uBAAuB;AAChC,cAAM,KAAK,kBAAiB;AAAA,MAC7B;AACA,WAAK,wBAAwB,CAAC,KAAK;AAAA,IACnC;AAAA,IACD,YAAY;AACX,WAAK,wBAAwB;AAAA,IAC7B;AAAA,IACD,MAAM,oBAAoB;AACzB,WAAK,sBAAsB;AAC3B,UAAI;AACH,cAAM,OAAO,mBAAmB,KAAK,IAAI;AACzC,cAAM,EAAE,KAAK,IAAI,MAAM,MAAM,KAAK,YAAY,sBAAsB,GAAG,yBAAyB,IAAI,EAAE;AACtG,aAAK,sBAAsB,KAAK,YAAY,CAAC,KAAK,SAAS,EAAE,OAAO,KAAK,OAAO,IAAI,KAAK;AAAA,MAC1F,SAAS,GAAG;AACX,aAAK,wBAAwB;AAAA,MAC9B;AACA,WAAK,sBAAsB;AAC3B,WAAK,eAAe;AAAA,IACpB;AAAA;AAAA;AAAA;AAAA,IAKD,gBAAgB;AACf,WAAK,iBAAiB;AAGtB,UAAI,CAAC,KAAK,iBAAiB,CAAC,KAAK,iBAAiB,KAAK,WAAW;AACjE,aAAK,iBAAiB;AACtB,aAAK,mBAAmB;AACxB;AAAA,MACD;AAGA,UAAI,KAAK,cAAc;AACtB,aAAK,mBAAmB,KAAK,GAAG;AAChC;AAAA,MACD;AAEA,UAAI,KAAK,QAAQ,IAAI;AACpB,cAAM,YAAY,KAAK,mBAAmB,KAAK,MAAM,EAAE;AACvD,cAAM,SAAS;AAAA,UACd,YAAY;AAAA,UACZ,KAAK,mBAAmB,KAAK,MAAM,GAAG,IAAI;AAAA,QAC1C,EAAC,KAAK,IAAI;AAEX,aAAK,mBAAmB,WAAW,MAAM;AAAA,aACnC;AACN,cAAM,YAAY,KAAK,mBAAmB,KAAK,MAAM,GAAG;AACxD,aAAK,mBAAmB,SAAS;AAAA,MAClC;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IASD,mBAAmB,MAAM,MAAM;AAC9B,UAAI,YAAY,aAAa,MAAM,MAAM,KAAK,OAAO;AAGrD,UAAI,SAAS,eAAgB,GAAE,OAAO,OAAO,kBAAkB,aAAa;AAC3E,qBAAa,QAAQ,cAAc,OAAO;AAAA,MAC3C;AAEA,aAAO;AAAA,IACP;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQD,mBAAmB,KAAK,SAAS,MAAM;AAEtC,YAAM,gBAAgB,iBAAiB,KAAK,IAAI;AAChD,UAAI,KAAK,iBAAiB,OAAO,kBAAkB,WAAW;AAC7D,aAAK,iBAAiB;AACtB,aAAK,kBAAkB;AACvB,YAAI,QAAQ;AACX,eAAK,qBAAqB;AAAA,QAC3B;AACA,YAAI,kBAAkB,OAAO;AAC5B,eAAK,mBAAmB;AAAA,QACzB;AACA;AAAA,MACD;AAEA,YAAM,MAAM,IAAI,MAAK;AACrB,UAAI,SAAS,MAAM;AAClB,aAAK,kBAAkB;AACvB,YAAI,QAAQ;AACX,eAAK,qBAAqB;AAAA,QAC3B;AACA,aAAK,iBAAiB;AAEtB,yBAAiB,KAAK,MAAM,IAAI;AAAA,MACjC;AACA,UAAI,UAAU,MAAM;AACnB,gBAAQ,MAAM,sBAAsB,GAAG;AAEvC,aAAK,kBAAkB;AACvB,aAAK,qBAAqB;AAE1B,aAAK,mBAAmB;AACxB,aAAK,iBAAiB;AACtB,yBAAiB,KAAK,MAAM,KAAK;AAAA,MAClC;AAEA,UAAI,QAAQ;AACX,YAAI,SAAS;AAAA,MACd;AACA,UAAI,MAAM;AAAA,IACV;AAAA,EACD;AACF;AA1wBA,MAAA,aAAA,CAAA,SAAA,YAAA,cAAA,MAAA;AAAA,MAAA,aAAA,CAAA,OAAA,QAAA;;EAAA,KAAA;AAAA,EAwN0C,OAAM;;;;;;;;;;AA9D/C,SAAAC,gBAAAC,UAAA,GAAAC,mBA8EO,QA9EPC,WA8EO;AAAA,IA9ED,KAAI;AAAA,IAER,OAAO,SAAO;AAAA,IACd,OAAK,CAAA;AAAA,4BAA6B,MAAgB;AAAA,8BAA6B,SAAO;AAAA,sCAAqC,MAAmB;AAAA,OAMzI,+BAA+B;AAAA,IADpC,OAAO,SAAW;AAAA,IAElB,UAAU,SAAO,UAAA,MAAS;AAAA,IAC1B,cAAY,SAAe;AAAA,IAC3B,MAAM,SAAO,UAAA,WAAc;AAAA,EAC5B,GAAAC,WAGO,SAHM,UAAA;AAAA,WAAe,SAAU;AAAA,aAAc,SAAU;AAAA;IAK9DC,WAOO,yBAPP,MAOO;AAAA,MALM,OAAS,0BAArBH,mBAAsE,QAAA;AAAA,QA9KzE,KAAA;AAAA,QA8K2B,OA9K3BI,eAAA,CA8KkC,OAAS,WAAQ,mBAAmB,CAAA;AAAA,qBACnD,MAAA,mBAAmB,MAAgB,iCAAnDJ,mBAGQ,OAAA;AAAA,QAlLX,KAAA;AAAA,QAgLK,KAAK,MAAe;AAAA,QACpB,QAAQ,MAAkB;AAAA,QAC3B,KAAI;AAAA,MAlLR,GAAA,MAAA,GAAA,UAAA,KAAAK,mBAAA,IAAA,IAAA;AAAA;IAuLkB,SAAO,WAAI,SAAI,KAAC,WAAM,kBAAtCC,YASW,qBAAA;AAAA,MAhMb,KAAA;AAAA,MAwLG,MAAK;AAAA,MACL,OAAM;AAAA,MACL,cAAY,SAAe;AAAA,MAC3B,SAAO,SAAU;AAAA;MACP,cACV,MAA4C;AAAA,QAAvB,MAAmB,uBAAxCP,UAAA,GAAAO,YAA4C,4BA7LhD,KAAA,EAAA,CAAA,mBA8LIA,YAAoC,2BAAA;AAAA,UA9LxC,KAAA;AAAA,UA8L4B,MAAM;AAAA;;MA9LlC,GAAA;AAAA,wCAiMwB,SAAO,wBAA7BA,YAoBY,sBAAA;AAAA,MArNd,KAAA;AAAA,MAkMW,MAAM,MAAqB;AAAA,MAlMtC,iBAAA,OAAA,CAAA,MAAA,OAAA,CAAA,IAAA,YAkMiB,MAAqB,wBAAA;AAAA,MACnC,cAAA;AAAA,MACA,eAAA;AAAA,MACA,MAAK;AAAA,MACJ,WAAW,OAAa;AAAA,MACxB,cAAY,SAAe;AAAA,MAC3B,SAAO,SAAU;AAAA,IAxMrB,GAAAC,YAAA;AAAA,MAAA,SAAAC,QA0MI,MAA2B;AAAA,SAD5BT,UAAA,IAAA,GAAAC,mBAQYS,gBAjNfC,WA0M0B,SAAA,MA1M1B,CA0MY,MAAM,QAAG;AADlB,iBAAAX,UAAA,GAAAO,YAQYK,wBARI,KAAK,iBAAiB,GAAtCV,WAQY;AAAA,YANV;AAAA,YA3ML,SAAA;AAAA,aA4MY,KAAK,sBAAsB,GA5MvCM,YAAA;AAAA,YAAA,SAAAC,QA+Me,MACX;AAAA,cAhNJI,gBA+Me,MACXC,gBAAG,KAAK,IAAI,GAAA,CAAA;AAAA;YAhNhB,GAAA;AAAA;YA6MoB,KAAK;cA7MzB,MA6MmC;AAAA,cA7MnC,IAAAL,QA8MK,MAAwC;AAAA,gBAAxCM,YAAwC,6BAAA;AAAA,kBAArB,KAAK,KAAK;AAAA;;cA9MlC,KAAA;AAAA,gBAAA;AAAA;;;MAAA,GAAA;AAAA;MAkNmB,MAAmB;QAlNtC,MAkNyC;AAAA,QAlNzC,IAAAN,QAmNI,MAAiB;AAAA,UAAjBM,YAAiB,wBAAA;AAAA;QAnNrB,KAAA;AAAA,UAAA;AAAA,iEAAAT,mBAAA,IAAA,IAAA;AAAA,IAwNc,SAA0B,8BAAtCN,UAAA,GAAAC,mBAEO,QAFP,YACIa,gBAAA,KAAA,WAAW,IAAI,GAAA,CAAA,KAEU,SAAoB,qCAAjDP,YAGkC,6BAAA;AAAA,MA9NpC,KAAA;AAAA,MA4NG,OAAM;AAAA,MACL,QAAQ,KAAU,WAAC;AAAA,MACnB,eAAa,OAAO,SAAO,OAAA;AAAA,8CA9N/BD,mBAAA,IAAA,IAAA;AAAA,IAiOc,SAAY,6BAAxBL,mBAMO,QAAA;AAAA,MAvOT,KAAA;AAAA,MAkOI,OAlOJe,eAkOW,SAAoB,oBAAA;AAAA,MAC5B,OAAM;AAAA;MACNC,mBAEO,QAAA;AAAA,QAFA,OApOVD,eAoOiB,SAAa,aAAA;AAAA,QAAE,OAAM;AAAA,yBAC/B,SAAQ,QAAA,GAAA,CAAA;AAAA,aArOfV,mBAAA,IAAA,IAAA;AAAA,EAAA,GAAA,IAAA,UAAA,IAAA;AAAA,+BA2JmB,SAAS,SAAA;AAAA;;;"}

package/dist/chunks/NcBreadcrumb-D5cRcQg5.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NcBreadcrumb-D5cRcQg5.mjs","sources":["../../src/components/NcBreadcrumb/NcBreadcrumb.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2020 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n\n### General description\n\nThis component is meant to be used inside a Breadcrumbs component.\nRenders a button element when given no redirection props, otherwise, renders <a/> or <router-link/> elements\n\n</docs>\n\n<template>\n\t<li ref=\"crumb\"\n\t\tclass=\"vue-crumb\"\n\t\t:class=\"[{'vue-crumb--hovered': hovering}, $props.class]\"\n\t\t:[crumbId]=\"''\"\n\t\tdraggable=\"false\"\n\t\t@dragstart.prevent=\"() => {/** Prevent the breadcrumb from being draggable. */}\"\n\t\t@drop.prevent=\"dropped\"\n\t\t@dragover.prevent=\"() => {}\"\n\t\t@dragenter=\"dragEnter\"\n\t\t@dragleave=\"dragLeave\">\n\t\t<NcButton v-if=\"(name || icon || $slots.icon) && !$slots.default\"\n\t\t\t:title=\"title\"\n\t\t\t:aria-label=\"icon ? name : undefined\"\n\t\t\ttype=\"tertiary\"\n\t\t\tv-bind=\"linkAttributes\">\n\t\t\t<template v-if=\"$slots.icon || icon\" #icon>\n\t\t\t\t<!-- @slot Slot for passing a material design icon. Precedes the icon and name prop. -->\n\t\t\t\t<slot name=\"icon\">\n\t\t\t\t\t<span :class=\"icon\" class=\"icon\" />\n\t\t\t\t</slot>\n\t\t\t</template>\n\t\t\t<template v-if=\"!($slots.icon || icon) || forceIconText\" #default>\n\t\t\t\t{{ name }}\n\t\t\t</template>\n\t\t</NcButton>\n\t\t<NcActions v-if=\"$slots.default\"\n\t\t\tref=\"actions\"\n\t\t\ttype=\"tertiary\"\n\t\t\t:force-menu=\"forceMenu\"\n\t\t\t:open=\"open\"\n\t\t\t:menu-name=\"name\"\n\t\t\t:title=\"title\"\n\t\t\t:force-name=\"true\"\n\t\t\t:container=\"`.vue-crumb[${crumbId}]`\"\n\t\t\t@update:open=\"onOpenChange\">\n\t\t\t<template #icon>\n\t\t\t\t<!-- @slot Slot for the custom menu icon -->\n\t\t\t\t<slot name=\"menu-icon\" />\n\t\t\t</template>\n\t\t\t<!-- @slot All action elements passed into the default slot will be used -->\n\t\t\t<slot />\n\t\t</NcActions>\n\t\t<ChevronRight class=\"vue-crumb__separator\" :size=\"20\" />\n\t</li>\n</template>\n\n<script>\nimport NcActions from '../NcActions/index.js'\nimport GenRandomId from '../../utils/GenRandomId.js'\nimport NcButton from '../NcButton/NcButton.vue'\n\nimport ChevronRight from 'vue-material-design-icons/ChevronRight.vue'\n\nexport default {\n\tname: 'NcBreadcrumb',\n\tcomponents: {\n\t\tNcActions,\n\t\tChevronRight,\n\t\tNcButton,\n\t},\n\tinheritAttrs: false,\n\tprops: {\n\t\t/**\n\t\t * The main text content of the entry.\n\t\t */\n\t\tname: {\n\t\t\ttype: String,\n\t\t\trequired: true,\n\t\t},\n\t\t/**\n\t\t * The title attribute of the element.\n\t\t */\n\t\ttitle: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * Route Location the link should navigate to when clicked on.\n\t\t *\n\t\t * @see https://v3.router.vuejs.org/api/#to\n\t\t */\n\t\tto: {\n\t\t\ttype: [String, Object],\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * Set this prop if your app doesn't use vue-router, breadcrumbs will show as normal links.\n\t\t */\n\t\thref: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * Set a css icon-class to show an icon along name text (if forceIconText is provided, otherwise just icon).\n\t\t */\n\t\ticon: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * Enables text to accompany the icon, if the icon was provided. The text that will be displayed is the name prop.\n\t\t */\n\t\tforceIconText: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Disable dropping on this breadcrumb.\n\t\t */\n\t\tdisableDrop: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Force the actions to display in a three dot menu\n\t\t */\n\t\tforceMenu: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Open state of the Actions menu\n\t\t */\n\t\topen: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * CSS class to apply to the root element.\n\t\t */\n\t\tclass: {\n\t\t\ttype: [String, Array, Object],\n\t\t\tdefault: '',\n\t\t},\n\t},\n\temits: [\n\t\t'dragenter',\n\t\t'dragleave',\n\t\t'dropped',\n\t\t'update:open',\n\t],\n\tdata() {\n\t\treturn {\n\t\t\t/**\n\t\t\t * Variable to track if we hover over the breadcrumb\n\t\t\t */\n\t\t\thovering: false,\n\t\t\t/**\n\t\t\t * The unique id of the breadcrumb. Necessary to append the\n\t\t\t * Actions menu to the correct crumb.\n\t\t\t */\n\t\t\tcrumbId: `crumb-id-${GenRandomId()}`,\n\t\t}\n\t},\n\tcomputed: {\n\t\t/**\n\t\t * The attributes to pass to `router-link` or `a`\n\t\t */\n\t\tlinkAttributes() {\n\t\t\t// If it's a router-link, we pass `to` and `exact`, if its an <a/> element, we pass `href`, otherwise we have a button\n\t\t\treturn this.to\n\t\t\t\t? { to: this.to, ...this.$attrs }\n\t\t\t\t: (this.href\n\t\t\t\t\t? { href: this.href, ...this.$attrs }\n\t\t\t\t\t: this.$attrs\n\t\t\t\t)\n\t\t},\n\t},\n\tmethods: {\n\t\t/**\n\t\t * Function to handle changing the open state of the Actions menu\n\t\t * $emit the open state.\n\t\t *\n\t\t * @param {boolean} open The open state of the Actions menu\n\t\t */\n\t\tonOpenChange(open) {\n\t\t\t/**\n\t\t\t * Event emitted when the open state of the Actions menu changes\n\t\t\t *\n\t\t\t * @type {null}\n\t\t\t */\n\t\t\tthis.$emit('update:open', open)\n\t\t},\n\t\t/**\n\t\t * Function to handle a drop on the breadcrumb.\n\t\t * $emit the event and the path, remove the hovering state.\n\t\t *\n\t\t * @param {object} e The drop event\n\t\t * @return {boolean}\n\t\t */\n\t\tdropped(e) {\n\t\t\t/**\n\t\t\t * Don't do anything if dropping is disabled.\n\t\t\t */\n\t\t\tif (this.disableDrop) {\n\t\t\t\treturn false\n\t\t\t}\n\t\t\t/**\n\t\t\t * Event emitted when something is dropped on the breadcrumb.\n\t\t\t *\n\t\t\t * @param {Event} event The DOM drop event\n\t\t\t * @param {(string|object)} to The `to` prop or, if not set, the `href` prop\n\t\t\t */\n\t\t\tthis.$emit('dropped', e, this.to || this.href)\n\t\t\tthis.$parent.$emit('dropped', e, this.to || this.href)\n\t\t\tthis.hovering = false\n\t\t\treturn false\n\t\t},\n\t\t/**\n\t\t * Add the hovering state on drag enter\n\t\t *\n\t\t * @param {DragEvent} e The drag-enter event\n\t\t */\n\t\tdragEnter(e) {\n\t\t\tthis.$emit('dragenter', e)\n\t\t\t/**\n\t\t\t * Don't do anything if dropping is disabled.\n\t\t\t */\n\t\t\tif (this.disableDrop) {\n\t\t\t\treturn\n\t\t\t}\n\t\t\tthis.hovering = true\n\t\t},\n\t\t/**\n\t\t * Remove the hovering state on drag leave\n\t\t *\n\t\t * @param {DragEvent} e The drag leave event\n\t\t */\n\t\tdragLeave(e) {\n\t\t\tthis.$emit('dragleave', e)\n\t\t\t/**\n\t\t\t * Don't do anything if dropping is disabled.\n\t\t\t */\n\t\t\tif (this.disableDrop) {\n\t\t\t\treturn\n\t\t\t}\n\t\t\t// Don't do anything if we\n\t\t\t// - leave towards a child element.\n\t\t\t// - or are still within the crumb\n\t\t\tif (e.target.contains(e.relatedTarget)\n\t\t\t\t|| this.$refs.crumb.contains(e.relatedTarget)) {\n\t\t\t\treturn\n\t\t\t}\n\t\t\tthis.hovering = false\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n\n.vue-crumb {\n\tbackground-image: none;\n\tdisplay: inline-flex;\n\theight: var(--default-clickable-area);\n\tpadding: 0;\n\n\t&:last-child {\n\t\tmin-width: 0;\n\n\t\t// Don't show breadcrumb separator for last crumb\n\t\t.vue-crumb__separator {\n\t\t\tdisplay: none;\n\t\t}\n\t}\n\n\t// Necessary to hide hidden crumbs\n\t&--hidden {\n\t\tdisplay: none;\n\t}\n\t&__separator {\n\t\tpadding: 0;\n\t\tcolor: var(--color-text-maxcontrast);\n\t}\n\t// Necessary for indicating hovering for drag and drop\n\t&#{&}--hovered :deep(.button-vue) {\n\t\tbackground-color: var(--color-background-dark);\n\t\tcolor: var(--color-main-text);\n\t}\n\t// Adjust button style\n\t&:not(:last-child) :deep() .button-vue {\n\t\tcolor: var(--color-text-maxcontrast);\n\n\t\t&:hover,\n\t\t&:focus {\n\t\t\tbackground-color: var(--color-background-dark);\n\t\t\tcolor: var(--color-main-text);\n\t\t}\n\n\t\t&__text {\n\t\t\tfont-weight: normal;\n\t\t}\n\t}\n\t:deep(.button-vue__text) {\n\t\tmargin: 0;\n\t}\n\n\t// Adjust action item appearance for crumbs with actions\n\t// to match other crumbs\n\t&:not(.dropdown) :deep(.action-item) {\n\t\t// Adjustments necessary to correctly shrink on small screens\n\t\tmax-width: 100%;\n\n\t\t.button-vue {\n\t\t\tpadding: 0 4px 0 16px;\n\t\t\tmax-width: 100%;\n\n\t\t\t&__wrapper {\n\t\t\t\tflex-direction: row-reverse;\n\t\t\t}\n\t\t}\n\n\t\t// Adjust the background of the last crumb when the action is open\n\t\t&.action-item--open .action-item__menutoggle {\n\t\t\tbackground-color: var(--color-background-dark);\n\t\t\tcolor: var(--color-main-text);\n\t\t}\n\t}\n}\n</style>\n"],"names":["_openBlock","_createElementBlock","_normalizeProps","_withModifiers","_createBlock","_mergeProps","_createSlots","_withCtx","_renderSlot","_createElementVNode","_normalizeClass","_createTextVNode","_toDisplayString","_createCommentVNode","_createVNode"],"mappings":"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"}

package/dist/chunks/NcBreadcrumbs-CnWT9rE5.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NcBreadcrumbs-CnWT9rE5.mjs","sources":["../../node_modules/vue-material-design-icons/Folder.vue","../../src/components/NcBreadcrumbs/NcBreadcrumbs.vue"],"sourcesContent":["<template>\n  <span v-bind=\"$attrs\"\n        :aria-hidden=\"title ? null : 'true'\"\n        :aria-label=\"title\"\n        class=\"material-design-icon folder-icon\"\n        role=\"img\"\n        @click=\"$emit('click', $event)\">\n    <svg :fill=\"fillColor\"\n         class=\"material-design-icon__svg\"\n         :width=\"size\"\n         :height=\"size\"\n         viewBox=\"0 0 24 24\">\n      <path d=\"M10,4H4C2.89,4 2,4.89 2,6V18A2,2 0 0,0 4,20H20A2,2 0 0,0 22,18V8C22,6.89 21.1,6 20,6H12L10,4Z\">\n        <title v-if=\"title\">{{ title }}</title>\n      </path>\n    </svg>\n  </span>\n</template>\n\n<script>\nexport default {\n  name: \"FolderIcon\",\n  emits: ['click'],\n  props: {\n    title: {\n      type: String,\n    },\n    fillColor: {\n      type: String,\n      default: \"currentColor\"\n    },\n    size: {\n      type: Number,\n      default: 24\n    }\n  }\n}\n</script>","<!--\n  - SPDX-FileCopyrightText: 2020 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n\n### General description\n\nThis component renders a breadcrumb bar. It adjusts to the available width\nby hiding breadcrumbs in a dropdown menu and emits an event when something\nis dropped on a creadcrumb.\n\n### Usage\n\n```vue\n<template>\n\t<div>\n\t\t<div class=\"container\">\n\t\t\t<NcBreadcrumbs @dropped=\"dropped\">\n\t\t\t\t<NcBreadcrumb name=\"Home\"\n\t\t\t\t\ttitle=\"Title of the Home folder\"\n\t\t\t\t\thref=\"/\"\n\t\t\t\t\t@dropped=\"droppedOnCrumb\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<Folder :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t</NcBreadcrumb>\n\t\t\t\t<NcBreadcrumb name=\"Folder 1\"\n\t\t\t\t\ttitle=\"Folder 1\"\n\t\t\t\t\thref=\"/Folder 1\" />\n\t\t\t\t<NcBreadcrumb name=\"Folder 2\"\n\t\t\t\t\thref=\"/Folder 1/Folder 2\"\n\t\t\t\t\t:disable-drop=\"true\" />\n\t\t\t\t<NcBreadcrumb name=\"Folder 3\"\n\t\t\t\t\ttitle=\"Folder 3\"\n\t\t\t\t\thref=\"/Folder 1/Folder 2/Folder 3\" />\n\t\t\t\t<NcBreadcrumb name=\"Folder 4\"\n\t\t\t\t\ttitle=\"Folder 4\"\n\t\t\t\t\thref=\"/Folder 1/Folder 2/Folder 3/Folder 4\" />\n\t\t\t\t<NcBreadcrumb name=\"Folder 5 with an overflowing long name\"\n\t\t\t\t\ttitle=\"Folder 5\"\n\t\t\t\t\thref=\"/Folder 1/Folder 2/Folder 3/Folder 4/Folder 5\"\n\t\t\t\t\t:disable-drop=\"true\">\n\t\t\t\t\t<template #menu-icon>\n\t\t\t\t\t\t<MenuDown :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\t<NcActionButton @click=\"alert('Share')\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<ShareVariant :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\tShare\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t\t<NcActionButton @click=\"alert('Download')\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<Download :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\tDownload\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t</NcBreadcrumb>\n\t\t\t\t<template #actions>\n\t\t\t\t\t<NcButton>\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<Plus :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\tNew\n\t\t\t\t\t</NcButton>\n\t\t\t\t</template>\n\t\t\t</NcBreadcrumbs>\n\t\t</div>\n\t\t<br />\n\t\t<div class=\"dragme\" draggable=\"true\" @dragstart=\"dragStart\">\n\t\t\t<span>Drag me onto the breadcrumbs.</span>\n\t\t</div>\n\t</div>\n</template>\n\n<script>\nimport Download from 'vue-material-design-icons/Download'\nimport Folder from 'vue-material-design-icons/Folder'\nimport MenuDown from 'vue-material-design-icons/MenuDown'\nimport Plus from 'vue-material-design-icons/Plus'\nimport ShareVariant from 'vue-material-design-icons/ShareVariant'\n\nexport default {\n\tcomponents: {\n\t\tDownload,\n\t\tFolder,\n\t\tMenuDown,\n\t\tPlus,\n\t\tShareVariant,\n\t},\n\tmethods: {\n\t\tdropped(e, path) {\n\t\t\talert('Global drop on ' + path)\n\t\t},\n\t\tdroppedOnCrumb(e, path) {\n\t\t\talert('Drop on crumb ' + path)\n\t\t},\n\t\tdragStart(e) {\n\t\t\te.dataTransfer.setData('text/plain', 'dragging')\n\t\t},\n\t}\n}\n</script>\n<style>\n.container {\n\tdisplay: inline-flex;\n\twidth: 100%;\n}\n\n.dragme {\n\tdisplay: block;\n\twidth: 100px;\n\theight: var(--default-clickable-area);\n\tbackground-color: var(--color-background-dark);\n}\n</style>\n```\n</docs>\n\n<script>\nimport NcActions from '../NcActions/index.js'\nimport NcActionButton from '../NcActionButton/index.js'\nimport NcActionRouter from '../NcActionRouter/index.js'\nimport NcActionLink from '../NcActionLink/index.js'\nimport NcBreadcrumb from '../NcBreadcrumb/index.js'\nimport isSlotPopulated from '../../utils/isSlotPopulated.ts'\n\nimport { subscribe, unsubscribe } from '@nextcloud/event-bus'\n\nimport IconFolder from 'vue-material-design-icons/Folder.vue'\n\nimport debounce from 'debounce'\nimport { cloneVNode, h, Fragment } from 'vue'\n\nconst crumbClass = 'vue-crumb'\n\nexport default {\n\tname: 'NcBreadcrumbs',\n\tcomponents: {\n\t\tNcActions,\n\t\tNcActionButton,\n\t\tNcActionRouter,\n\t\tNcActionLink,\n\t\tNcBreadcrumb,\n\t\tIconFolder,\n\t},\n\tprops: {\n\t\t/**\n\t\t * Set a css icon-class for the icon of the root breadcrumb to be used.\n\t\t */\n\t\trootIcon: {\n\t\t\ttype: String,\n\t\t\tdefault: 'icon-home',\n\t\t},\n\n\t\t/**\n\t\t * Set the aria-label of the nav element.\n\t\t */\n\t\tariaLabel: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t},\n\t},\n\temits: ['dropped'],\n\tdata() {\n\t\treturn {\n\t\t\t/**\n\t\t\t * Array to track the hidden breadcrumbs by their index.\n\t\t\t * Comparing two crumbs somehow does not work, so we use the indices.\n\t\t\t */\n\t\t\thiddenIndices: [],\n\n\t\t\t/**\n\t\t\t * This is the props of the middle Action menu\n\t\t\t * that show the ellipsised breadcrumbs\n\t\t\t */\n\t\t\tmenuBreadcrumbProps: {\n\t\t\t\t// Don't show a name for this breadcrumb, only the Actions menu\n\t\t\t\tname: '',\n\t\t\t\tforceMenu: true,\n\t\t\t\t// Don't allow dropping directly on the actions breadcrumb\n\t\t\t\tdisableDrop: true,\n\t\t\t\t// Is the menu open or not\n\t\t\t\topen: false,\n\t\t\t},\n\t\t\tbreadcrumbsRefs: [],\n\t\t}\n\t},\n\tcreated() {\n\t\t/**\n\t\t * Add a listener so the component reacts on resize\n\t\t */\n\t\twindow.addEventListener('resize', debounce(() => {\n\t\t\tthis.handleWindowResize()\n\t\t}, 100))\n\t\tsubscribe('navigation-toggled', this.delayedResize)\n\t},\n\tmounted() {\n\t\tthis.handleWindowResize()\n\t},\n\tupdated() {\n\t\t/**\n\t\t * Check the size on update\n\t\t */\n\t\tthis.delayedResize()\n\t\t/**\n\t\t * Check that crumbs to hide are hidden\n\t\t */\n\t\tthis.$nextTick(() => {\n\t\t\tthis.hideCrumbs()\n\t\t})\n\t},\n\tbeforeUnmount() {\n\t\twindow.removeEventListener('resize', this.handleWindowResize)\n\t\tunsubscribe('navigation-toggled', this.delayedResize)\n\t},\n\tmethods: {\n\t\t/**\n\t\t * Close the actions menu\n\t\t *\n\t\t * @param {object} e The event\n\t\t */\n\t\tcloseActions(e) {\n\t\t\t// Don't do anything if we leave towards a child element.\n\t\t\tif (this.$refs.actionsBreadcrumb.$el.contains(e.relatedTarget)) {\n\t\t\t\treturn\n\t\t\t}\n\t\t\tthis.menuBreadcrumbProps.open = false\n\t\t},\n\t\t/**\n\t\t * Call the resize function after a delay\n\t\t */\n\t\t async delayedResize() {\n\t\t\tawait this.$nextTick()\n\t\t\tthis.handleWindowResize()\n\t\t},\n\t\t/**\n\t\t * Check the width of the breadcrumb and hide breadcrumbs\n\t\t * if we overflow otherwise.\n\t\t */\n\t\thandleWindowResize() {\n\t\t\t// If there is no container yet, we cannot determine its size\n\t\t\tif (!this.$refs.container) {\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\tconst nrCrumbs = this.breadcrumbsRefs.length\n\t\t\tconst hiddenIndices = []\n\t\t\tconst availableWidth = this.$refs.container.offsetWidth\n\t\t\tlet totalWidth = this.getTotalWidth()\n\t\t\t// If we have breadcrumbs actions, we have to take their width into account too.\n\t\t\tif (this.$refs.breadcrumb__actions) {\n\t\t\t\ttotalWidth += this.$refs.breadcrumb__actions.offsetWidth\n\t\t\t}\n\t\t\tlet overflow = totalWidth - availableWidth\n\t\t\t// If we overflow, we have to take the action-item width into account as well.\n\t\t\toverflow += (overflow > 0) ? 64 : 0\n\t\t\tlet i = 0\n\t\t\t// We start hiding the breadcrumb in the center\n\t\t\tconst startIndex = Math.floor(nrCrumbs / 2)\n\t\t\t// Don't hide the first and last breadcrumb\n\t\t\twhile (overflow > 0 && i < nrCrumbs - 2) {\n\t\t\t\t// We hide elements alternating to the left and right\n\t\t\t\tconst currentIndex = startIndex + ((i % 2) ? i + 1 : i) / 2 * Math.pow(-1, i + (nrCrumbs % 2))\n\t\t\t\t// Calculate the remaining overflow width after hiding this breadcrumb\n\t\t\t\toverflow -= this.getWidth(this.breadcrumbsRefs[currentIndex]?.$el, currentIndex === (this.breadcrumbsRefs.length - 1))\n\t\t\t\thiddenIndices.push(currentIndex)\n\t\t\t\ti++\n\t\t\t}\n\t\t\t// We only update the hidden crumbs if they have changed,\n\t\t\t// otherwise we will run into an infinite update loop.\n\t\t\tif (!this.arraysEqual(this.hiddenIndices, hiddenIndices.sort((a, b) => a - b))) {\n\t\t\t\tthis.hiddenIndices = hiddenIndices\n\t\t\t}\n\t\t},\n\t\t/**\n\t\t * Checks if two arrays are equal.\n\t\t * Only works for primitive arrays, but that's enough here.\n\t\t *\n\t\t * @param {Array} a The first array\n\t\t * @param {Array} b The second array\n\t\t * @return {boolean} Wether the arrays are equal\n\t\t */\n\t\tarraysEqual(a, b) {\n\t\t\tif (a.length !== b.length) return false\n\t\t\tif (a === b) return true\n\t\t\tif (a === null || b === null) return false\n\n\t\t\tfor (let i = 0; i < a.length; ++i) {\n\t\t\t\tif (a[i] !== b[i]) {\n\t\t\t\t\treturn false\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn true\n\t\t},\n\t\t/**\n\t\t * Calculates the total width of all breadcrumbs\n\t\t *\n\t\t * @return {number} The total width\n\t\t */\n\t\tgetTotalWidth() {\n\t\t\treturn this.breadcrumbsRefs.reduce((width, crumb, index) => width + this.getWidth(crumb.$el, index === (this.breadcrumbsRefs.length - 1)), 0)\n\t\t},\n\t\t/**\n\t\t * Calculates the width of the provided element\n\t\t *\n\t\t * @param {object} el The element\n\t\t * @param {boolean} isLast Is this the last crumb\n\t\t * @return {number} The width\n\t\t */\n\t\tgetWidth(el, isLast) {\n\t\t\tif (!el?.classList) return 0\n\t\t\tconst hide = el.classList.contains(`${crumbClass}--hidden`)\n\t\t\tel.style.minWidth = 'auto'\n\t\t\t// For the last crumb, we calculate with a max-width of 210px,\n\t\t\t// but don't set it in CSS to allow it to grow.\n\t\t\tif (isLast) {\n\t\t\t\tel.style.maxWidth = '210px'\n\t\t\t}\n\t\t\tel.classList.remove(`${crumbClass}--hidden`)\n\t\t\tconst w = el.offsetWidth\n\t\t\tif (hide) {\n\t\t\t\tel.classList.add(`${crumbClass}--hidden`)\n\t\t\t}\n\t\t\tel.style.minWidth = ''\n\t\t\tel.style.maxWidth = ''\n\t\t\treturn w\n\t\t},\n\t\t/**\n\t\t * Prevents the default of a provided event\n\t\t *\n\t\t * @param {object} e The event\n\t\t * @return {boolean}\n\t\t */\n\t\tpreventDefault(e) {\n\t\t\tif (e.preventDefault) {\n\t\t\t\te.preventDefault()\n\t\t\t}\n\t\t\treturn false\n\t\t},\n\t\t/**\n\t\t * Handles the drag start.\n\t\t * Prevents a breadcrumb from being draggable.\n\t\t *\n\t\t * @param {object} e The event\n\t\t * @return {boolean}\n\t\t */\n\t\tdragStart(e) {\n\t\t\treturn this.preventDefault(e)\n\t\t},\n\t\t/**\n\t\t * Handles when something is dropped on the breadcrumb.\n\t\t *\n\t\t * @param {object} e The drop event\n\t\t * @param {string} path The path of the breadcrumb\n\t\t * @param {boolean} disabled Whether dropping is disabled for this breadcrumb\n\t\t * @return {boolean}\n\t\t */\n\t\tdropped(e, path, disabled) {\n\t\t\t/**\n\t\t\t * Don't emit if dropping is disabled.\n\t\t\t */\n\t\t\tif (!disabled) {\n\t\t\t\t/**\n\t\t\t\t * Event emitted when something is dropped on the breadcrumb.\n\t\t\t\t *\n\t\t\t\t * @param {Event} e the drop DOM event\n\t\t\t\t * @param {string} path The path of the breadcrumb\n\t\t\t\t */\n\t\t\t\tthis.$emit('dropped', e, path)\n\t\t\t}\n\t\t\t// Close the actions menu after the drop\n\t\t\tthis.menuBreadcrumbProps.open = false\n\n\t\t\t// Remove all hovering classes\n\t\t\tconst crumbs = document.querySelectorAll(`.${crumbClass}`)\n\t\t\tcrumbs.forEach((f) => { f.classList.remove(`${crumbClass}--hovered`) })\n\t\t\treturn this.preventDefault(e)\n\t\t},\n\t\t/**\n\t\t * Handles the drag over event\n\t\t *\n\t\t * @param {object} e The drag over event\n\t\t * @return {boolean}\n\t\t */\n\t\tdragOver(e) {\n\t\t\treturn this.preventDefault(e)\n\t\t},\n\t\t/**\n\t\t * Handles the drag enter event\n\t\t *\n\t\t * @param {object} e The drag over event\n\t\t * @param {boolean} disabled Whether dropping is disabled for this breadcrumb\n\t\t */\n\t\tdragEnter(e, disabled) {\n\t\t\t/**\n\t\t\t * Don't do anything if dropping is disabled.\n\t\t\t */\n\t\t\tif (disabled) {\n\t\t\t\treturn\n\t\t\t}\n\t\t\t// Get the correct element, in case we hover a child.\n\t\t\tif (e.target.closest) {\n\t\t\t\tconst target = e.target.closest(`.${crumbClass}`)\n\t\t\t\tif (target.classList && target.classList.contains(crumbClass)) {\n\t\t\t\t\tconst crumbs = document.querySelectorAll(`.${crumbClass}`)\n\t\t\t\t\tcrumbs.forEach((f) => { f.classList.remove(`${crumbClass}--hovered`) })\n\t\t\t\t\ttarget.classList.add(`${crumbClass}--hovered`)\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t/**\n\t\t * Handles the drag leave event\n\t\t *\n\t\t * @param {object} e The drag leave event\n\t\t * @param {boolean} disabled Whether dropping is disabled for this breadcrumb\n\t\t */\n\t\tdragLeave(e, disabled) {\n\t\t\t/**\n\t\t\t * Don't do anything if dropping is disabled.\n\t\t\t */\n\t\t\tif (disabled) {\n\t\t\t\treturn\n\t\t\t}\n\t\t\t// Don't do anything if we leave towards a child element.\n\t\t\tif (e.target.contains(e.relatedTarget)) {\n\t\t\t\treturn\n\t\t\t}\n\t\t\t// Get the correct element, in case we leave directly from a child.\n\t\t\tif (e.target.closest) {\n\t\t\t\tconst target = e.target.closest(`.${crumbClass}`)\n\t\t\t\tif (target.contains(e.relatedTarget)) {\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t\tif (target.classList && target.classList.contains(crumbClass)) {\n\t\t\t\t\ttarget.classList.remove(`${crumbClass}--hovered`)\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t/**\n\t\t * Check for each crumb if we have to hide it and\n\t\t * add it to the array of all crumbs.\n\t\t */\n\t\thideCrumbs() {\n\t\t\tthis.breadcrumbsRefs.forEach((crumb, i) => {\n\t\t\t\tif (crumb?.$el?.classList) {\n\t\t\t\t\tif (this.hiddenIndices.includes(i)) {\n\t\t\t\t\t\tcrumb.$el.classList.add(`${crumbClass}--hidden`)\n\t\t\t\t\t} else {\n\t\t\t\t\t\tcrumb.$el.classList.remove(`${crumbClass}--hidden`)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t})\n\t\t},\n\n\t\tisBreadcrumb(vnode) {\n\t\t\treturn vnode?.type?.name === 'NcBreadcrumb'\n\t\t},\n\t},\n\t/**\n\t * The render function to display the component\n\t *\n\t * @return {object|undefined} The created VNode\n\t */\n\trender() {\n\t\t// Get the breadcrumbs\n\t\tlet breadcrumbs = []\n\t\t// We have to iterate over all slot elements\n\t\tthis.$slots.default?.().forEach(vnode => {\n\t\t\tif (this.isBreadcrumb(vnode)) {\n\t\t\t\tbreadcrumbs.push(vnode)\n\t\t\t\treturn\n\t\t\t}\n\t\t\t// If we encounter a Fragment, we have to check its children too\n\t\t\tif (vnode?.type === Fragment) {\n\t\t\t\tvnode?.children?.forEach?.(child => {\n\t\t\t\t\tif (this.isBreadcrumb(child)) {\n\t\t\t\t\t\tbreadcrumbs.push(child)\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t}\n\t\t})\n\n\t\t// Check that we have at least one breadcrumb\n\t\tif (breadcrumbs.length === 0) {\n\t\t\treturn\n\t\t}\n\n\t\t// Add the root icon to the first breadcrumb\n\t\tbreadcrumbs[0] = cloneVNode(breadcrumbs[0], {\n\t\t\ticon: this.rootIcon,\n\t\t\tref: 'breadcrumbs',\n\t\t})\n\n\t\t/**\n\t\t * Use a proxy object to store breadcrumbs refs\n\t\t * and don't write to this.breadcrumbsRefs directly\n\t\t * to not trigger a myriad of re-renders.\n\t\t */\n\t\tconst breadcrumbsRefs = []\n\t\t// Add the breadcrumbs to the array of the created VNodes, check if hiding them is necessary.\n\t\tbreadcrumbs = breadcrumbs.map((crumb, index) => cloneVNode(crumb, {\n\t\t\tref: (crumb) => {\n\t\t\t\tbreadcrumbsRefs[index] = crumb\n\t\t\t},\n\t\t}))\n\n\t\t// The array of all created VNodes\n\t\tconst crumbs = [...breadcrumbs]\n\t\tif (this.hiddenIndices.length) {\n\t\t\t/**\n\t\t\t * We show the first half of the breadcrumbs before the Actions dropdown menu\n\t\t\t * which shows the hidden breadcrumbs.\n\t\t\t */\n\t\t\t crumbs.splice(Math.round(breadcrumbs.length / 2), 0,\n\n\t\t\t\t// The Actions menu\n\t\t\t\t// Use a breadcrumb component for the hidden breadcrumbs\n\t\t\t\th(NcBreadcrumb, {\n\t\t\t\t\tclass: 'dropdown',\n\t\t\t\t\t...this.menuBreadcrumbProps,\n\t\t\t\t\t// Hide the dropdown menu from screen-readers,\n\t\t\t\t\t// since the crumbs in the menu are still in the list.\n\t\t\t\t\t'aria-hidden': true,\n\t\t\t\t\t// Add a ref to the Actions menu\n\t\t\t\t\tref: 'actionsBreadcrumb',\n\t\t\t\t\tkey: 'actions-breadcrumb-1',\n\t\t\t\t\t// Add handlers so the Actions menu opens on hover\n\t\t\t\t\tonDragenter: () => { this.menuBreadcrumbProps.open = true },\n\t\t\t\t\tonDragleave: this.closeActions,\n\t\t\t\t\t// Make sure we keep the same open state\n\t\t\t\t\t// as the Actions component\n\t\t\t\t\t'onUpdate:open': (open) => {\n\t\t\t\t\t\tthis.menuBreadcrumbProps.open = open\n\t\t\t\t\t},\n\t\t\t\t// Add all hidden breadcrumbs as ActionRouter or ActionLink\n\t\t\t\t}, {\n\t\t\t\t\tdefault: () => this.hiddenIndices.filter(index => index <= breadcrumbs.length - 1).map(index => {\n\t\t\t\t\t\tconst crumb = breadcrumbs[index]\n\t\t\t\t\t\tconst {\n\t\t\t\t\t\t\t// Get the parameters from the breadcrumb component props\n\t\t\t\t\t\t\tto,\n\t\t\t\t\t\t\thref,\n\t\t\t\t\t\t\tdisableDrop,\n\t\t\t\t\t\t\tname,\n\t\t\t\t\t\t\t// Props to forward\n\t\t\t\t\t\t\t...propsToForward\n\t\t\t\t\t\t} = crumb.props\n\t\t\t\t\t\t// Do not forward the ref, otherwise it will be null if the hidden crumb gets destroyed\n\t\t\t\t\t\tdelete propsToForward.ref\n\n\t\t\t\t\t\t// Decide whether to show the breadcrumbs as ActionButton, ActionRouter or ActionLink\n\t\t\t\t\t\tlet element = NcActionButton\n\t\t\t\t\t\tlet path = ''\n\t\t\t\t\t\tif (href) {\n\t\t\t\t\t\t\telement = NcActionLink\n\t\t\t\t\t\t\tpath = href\n\t\t\t\t\t\t}\n\t\t\t\t\t\tif (to) {\n\t\t\t\t\t\t\telement = NcActionRouter\n\t\t\t\t\t\t\tpath = to\n\t\t\t\t\t\t}\n\t\t\t\t\t\tconst folderIcon = h(IconFolder, {\n\t\t\t\t\t\t\tsize: 20,\n\t\t\t\t\t\t})\n\t\t\t\t\t\treturn h(element, {\n\t\t\t\t\t\t\t...propsToForward,\n\t\t\t\t\t\t\tclass: crumbClass,\n\t\t\t\t\t\t\thref: href || null,\n\t\t\t\t\t\t\tto: to || null,\n\t\t\t\t\t\t\t// Prevent the breadcrumbs from being draggable\n\t\t\t\t\t\t\tdraggable: false,\n\t\t\t\t\t\t\t// Add the drag and drop handlers\n\t\t\t\t\t\t\tonDragstart: this.dragStart,\n\t\t\t\t\t\t\tonDrop: ($event) => this.dropped($event, path, disableDrop),\n\t\t\t\t\t\t\tonDragover: this.dragOver,\n\t\t\t\t\t\t\tonDragenter: ($event) => this.dragEnter($event, disableDrop),\n\t\t\t\t\t\t\tonDragleave: ($event) => this.dragLeave($event, disableDrop),\n\t\t\t\t\t\t},\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tdefault: () => name,\n\t\t\t\t\t\t\ticon: () => folderIcon,\n\t\t\t\t\t\t})\n\t\t\t\t\t}),\n\t\t\t\t}),\n\t\t\t)\n\t\t}\n\n\t\tconst wrapper = [h('nav', { 'aria-label': this.ariaLabel }, [h('ul', { class: 'breadcrumb__crumbs' }, [crumbs])])]\n\t\t// Append the actions slot if it is populated\n\t\tif (isSlotPopulated(this.$slots.actions?.())) {\n\t\t\twrapper.push(h('div', { class: 'breadcrumb__actions', ref: 'breadcrumb__actions' }, this.$slots.actions?.()))\n\t\t}\n\n\t\tthis.breadcrumbsRefs = breadcrumbsRefs\n\n\t\treturn h('div', { class: ['breadcrumb', { 'breadcrumb--collapsed': (this.hiddenIndices.length === breadcrumbs.length - 2) }], ref: 'container' }, wrapper)\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.breadcrumb {\n\twidth: 100%;\n\tflex-grow: 1;\n\tdisplay: inline-flex;\n\talign-items: center;\n\n\t&--collapsed :deep(.vue-crumb:last-child) {\n\t\tmin-width: 100px;\n\t}\n\n\tnav {\n\t\tflex-shrink: 1;\n\t\tmin-width: 0;\n\t}\n\n\t& #{&}__crumbs {\n\t\tmax-width: 100%;\n\t}\n\n\t& #{&}__crumbs,\n\t& #{&}__actions {\n\t\tdisplay: inline-flex;\n\t}\n}\n</style>\n"],"names":["_sfc_main","_createElementBlock","_mergeProps","_createElementVNode","_createCommentVNode","crumb"],"mappings":"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","x_google_ignoreList":[0]}

package/dist/chunks/NcButton-QmfEsvXC.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NcButton-QmfEsvXC.mjs","sources":["../../src/components/NcButton/types.ts","../../src/utils/isSlotPopulated.ts","../../src/components/NcButton/NcButton.vue"],"sourcesContent":["/**\n * SPDX-FileCopyrightText: 2024 Nextcloud GmbH and Nextcloud contributors\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\n\nexport enum ButtonAlignment {\n\tStart = 'start',\n\tStartReverse = 'start-reverse',\n\tCenter = 'center',\n\tCenterReverse = 'center-reverse',\n\tEnd = 'end',\n\tEndReverse = 'end-reverse',\n}\n\nexport enum ButtonNativeType {\n\tSubmit = 'submit',\n\tReset = 'reset',\n\tButton = 'button',\n}\n\nexport enum ButtonType {\n\tPrimary = 'primary',\n\tSecondary = 'secondary',\n\tTertiary = 'tertiary',\n\tTertiaryNoBackground = 'tertiary-no-background',\n\tTertiaryOnPrimary = 'tertiary-on-primary',\n\tError = 'error',\n\t/**\n\t * @deprecated Design-wise not recommended for new code\n\t */\n\tWarning = 'warning',\n\tSuccess = 'success',\n}\n","/**\n * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\n\nimport type { VNode, VNodeNormalizedChildren } from 'vue'\nimport { Fragment, Comment, Text } from 'vue'\n\n/**\n * Checks whether a slot is populated\n *\n * @param vnodes The array of vnodes to check\n */\nconst isSlotPopulated = function(vnodes?: VNode[] | VNodeNormalizedChildren) {\n\treturn Array.isArray(vnodes) && vnodes.some(node => {\n\t\tif (node === null) return false\n\t\tif (typeof node === 'object') {\n\t\t\tconst vnode = node as VNode\n\t\t\tif (vnode.type === Comment) return false\n\t\t\tif (vnode.type === Fragment && !isSlotPopulated(vnode.children)) return false\n\t\t\tif (vnode.type === Text && !(vnode.children as string).trim()) return false\n\t\t}\n\t\treturn true\n\t})\n}\n\nexport default isSlotPopulated\n","<!--\n  - SPDX-FileCopyrightText: 2020 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n\n### General description\nGeneral purpose button component. See props for different options.\n[Use material design icons only for icons](https://www.npmjs.com/package/vue-material-design-icons) and remember to set their size to 20.\n\n### Usage\n### Custom icon slot\nTo be used with `vue-material-design-icons` only. For icon classes use the `default-icon` slot.\nIt can be used with one or multiple actions.\n```\n<template>\n<div class=\"wrapper\">\n\t<!-- Style selector -->\n\t<div class=\"grid\">\n\t\t<NcCheckboxRadioSwitch v-model=\"style\" value=\"text\" name=\"style\" type=\"radio\">Text only</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"style\" value=\"icon\" name=\"style\" type=\"radio\">Icon only</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"style\" value=\"icontext\" name=\"style\" type=\"radio\">Icon and text</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"disabled\" type=\"checkbox\">Disabled</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"size\" value=\"small\" name=\"size\" type=\"radio\">Small</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"size\" value=\"normal\" name=\"size\" type=\"radio\">Normal (default)</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"size\" value=\"large\" name=\"size\" type=\"radio\">Large</NcCheckboxRadioSwitch>\n\t</div>\n\n\t<h5>Standard buttons</h5>\n\t<div class=\"grid\">\n\t\t<p>Tertiary, no background</p>\n\t\t<p>Tertiary</p>\n\t\t<p>Secondary</p>\n\t\t<p>Primary</p>\n\t\t<NcButton\n\t\t\taria-label=\"Example text\"\n\t\t\t:disabled=\"disabled\"\n\t\t\t:size=\"size\"\n\t\t\ttype=\"tertiary-no-background\">\n\t\t\t<template v-if=\"style.indexOf('icon') !== -1\" #icon>\n\t\t\t\t<Video\n\t\t\t\t\t:size=\"20\" />\n\t\t\t</template>\n\t\t\t<template v-if=\"style.indexOf('text') !== -1\">Example text</template>\n\t\t</NcButton>\n\t\t<NcButton\n\t\t\taria-label=\"Example text\"\n\t\t\t:disabled=\"disabled\"\n\t\t\t:size=\"size\"\n\t\t\ttype=\"tertiary\">\n\t\t\t<template v-if=\"style.indexOf('icon') !== -1\" #icon>\n\t\t\t\t<Video\n\t\t\t\t\t:size=\"20\" />\n\t\t\t</template>\n\t\t\t<template v-if=\"style.indexOf('text') !== -1\">Example text</template>\n\t\t</NcButton>\n\t\t<NcButton\n\t\t\taria-label=\"Example text\"\n\t\t\t:disabled=\"disabled\"\n\t\t\t:size=\"size\">\n\t\t\t<template v-if=\"style.indexOf('icon') !== -1\" #icon>\n\t\t\t\t<Video\n\t\t\t\t\t:size=\"20\" />\n\t\t\t</template>\n\t\t\t<template v-if=\"style.indexOf('text') !== -1\">Example text</template>\n\t\t</NcButton>\n\t\t<NcButton\n\t\t\taria-label=\"Example text\"\n\t\t\t:disabled=\"disabled\"\n\t\t\t:size=\"size\"\n\t\t\ttype=\"primary\">\n\t\t\t<template v-if=\"style.indexOf('icon') !== -1\" #icon>\n\t\t\t\t<Video\n\t\t\t\t\t:size=\"20\" />\n\t\t\t</template>\n\t\t\t<template v-if=\"style.indexOf('text') !== -1\">Example text</template>\n\t\t</NcButton>\n\t</div>\n\n\t<!-- Wide button -->\n\t<h5>Wide button</h5>\n\t<NcButton\n\t\t:disabled=\"disabled\"\n\t\t:size=\"size\"\n\t\t:wide=\"true\"\n\t\ttext=\"Example text\">\n\t\t<template #icon>\n\t\t\t<Video\n\t\t\t\t:size=\"20\" />\n\t\t</template>\n\t\tExample text\n\t</NcButton>\n\n\t<!-- Special buttons -->\n\t<h5>Special buttons</h5>\n\t<div class=\"grid\">\n\t\t<p>Success</p>\n\t\t<p>Warning</p>\n\t\t<p>Error</p>\n\t\t<p> - </p>\n\t\t<NcButton\n\t\t\t:disabled=\"disabled\"\n\t\t\t:size=\"size\"\n\t\t\ttype=\"success\">\n\t\t\t<template #icon>\n\t\t\t\t<Video\n\t\t\t\t\t:size=\"20\" />\n\t\t\t</template>\n\t\t\tExample text\n\t\t</NcButton>\n\t\t<NcButton\n\t\t\t:disabled=\"disabled\"\n\t\t\t:size=\"size\"\n\t\t\ttype=\"warning\">\n\t\t\t<template #icon>\n\t\t\t\t<Video\n\t\t\t\t\t:size=\"20\" />\n\t\t\t</template>\n\t\t\tExample text\n\t\t</NcButton>\n\t\t<NcButton\n\t\t\t:disabled=\"disabled\"\n\t\t\t:size=\"size\"\n\t\t\ttype=\"error\">\n\t\t\t<template #icon>\n\t\t\t\t<Video\n\t\t\t\t\t:size=\"20\" />\n\t\t\t</template>\n\t\t\tExample text\n\t\t</NcButton>\n\t\t<p> - </p>\n\t</div>\n</div>\n\n</template>\n<script>\nimport Video from 'vue-material-design-icons/Video.vue'\n\nexport default {\n\tcomponents: {\n\t\tVideo,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\ttoggled: false,\n\t\t\tdisabled: false,\n\t\t\tsize: 'normal',\n\t\t\tstyle: 'icontext',\n\t\t}\n\t}\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.wrapper {\n\tpadding: 0 12px;\n}\n\n.grid {\n\tdisplay: grid;\n\tgap: 12px;\n\tgrid-template-columns: 1fr 1fr 1fr 1fr;\n\tgrid-template-rows: repeat(auto-fill, auto);\n\tposition: relative;\n\tmargin: 12px 0;\n}\n\nh5 {\n\tfont-weight: bold;\n\tmargin: 40px 0 20px 0;\n}\n\np {\n\ttext-align: center;\n\tmargin: 4px 0 12px 0;\n\tcolor: var(--color-text-maxcontrast)\n}\n\nbutton {\n\tmargin: auto;\n}\n</style>\n```\n\n### Alignment\nSometimes it is required to change the icon alignment on the button, like for switching between pages as in following example:\n\n```vue\n<template>\n\t<div style=\"display: flex; flex-direction: column; gap: 12px;\">\n\t\t<NcButton aria-label=\"center (default)\" type=\"secondary\" wide>\n\t\t\t<template #icon>\n\t\t\t\t<IconLeft :size=\"20\" />\n\t\t\t</template>\n\t\t\tcenter (default)\n\t\t</NcButton>\n\t\t<NcButton alignment=\"center-reverse\" aria-label=\"center-reverse\" type=\"secondary\" wide>\n\t\t\t<template #icon>\n\t\t\t\t<IconRight :size=\"20\" />\n\t\t\t</template>\n\t\t\tcenter-reverse\n\t\t</NcButton>\n\t\t<div style=\"display: flex; gap: 12px;\">\n\t\t\t<div style=\"display: flex; flex-direction: column; gap: 12px; flex: 1\">\n\t\t\t\t<NcButton alignment=\"start\" aria-label=\"start\" type=\"secondary\" wide>\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<IconLeft :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tstart\n\t\t\t\t</NcButton>\n\t\t\t\t<NcButton alignment=\"start-reverse\" aria-label=\"start-reverse\" type=\"secondary\" wide>\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<IconRight :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tstart-reverse\n\t\t\t\t</NcButton>\n\t\t\t</div>\n\t\t\t<div style=\"display: flex; flex-direction: column; gap: 12px; flex: 1\">\n\t\t\t\t<NcButton alignment=\"end\" aria-label=\"end\" type=\"secondary\" wide>\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<IconLeft :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tend\n\t\t\t\t</NcButton>\n\t\t\t\t<NcButton alignment=\"end-reverse\" aria-label=\"end-reverse\" type=\"secondary\" wide>\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<IconRight :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tend-reverse\n\t\t\t\t</NcButton>\n\t\t\t</div>\n\t\t</div>\n\t</div>\n</template>\n<script>\nimport IconLeft from 'vue-material-design-icons/ArrowLeft.vue'\nimport IconRight from 'vue-material-design-icons/ArrowRight.vue'\n\nexport default {\n\tcomponents: {\n\t\tIconLeft,\n\t\tIconRight,\n\t},\n}\n</script>\n```\n\n### Pressed state\n\nIt is possible to make the button stateful by adding a pressed state, e.g. if you like to create a favorite button.\nThe button will have the required `aria` attribute for accessibility and visual style (`primary` when pressed, and the configured type otherwise).\n\nDo not change `text` or `aria-label` of the pressed/unpressed button. See: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-pressed\n\n```vue\n<template>\n\t<div>\n\t\t<div style=\"display: flex; gap: 12px;\">\n\t\t\t<NcButton v-model:pressed=\"isFavorite\" aria-label=\"Favorite\" type=\"tertiary-no-background\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconStar v-if=\"isFavorite\" :size=\"20\" />\n\t\t\t\t\t<IconStarOutline v-else :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t</NcButton>\n\t\t\t<NcButton v-model:pressed=\"isFavorite\" type=\"tertiary\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconStar v-if=\"isFavorite\" :size=\"20\" />\n\t\t\t\t\t<IconStarOutline v-else :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tFavorite\n\t\t\t</NcButton>\n\t\t\t<NcButton v-model:pressed=\"isFavorite\" aria-label=\"Favorite\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconStar v-if=\"isFavorite\" :size=\"20\" />\n\t\t\t\t\t<IconStarOutline v-else :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t</NcButton>\n\t\t</div>\n\t\t<div>\n\t\t\tIt is {{ isFavorite ? 'a' : 'not a' }} favorite.\n\t\t</div>\n\t</div>\n</template>\n<script>\nimport IconStar from 'vue-material-design-icons/Star.vue'\nimport IconStarOutline from 'vue-material-design-icons/StarOutline.vue'\n\nexport default {\n\tcomponents: {\n\t\tIconStar,\n\t\tIconStarOutline,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tisFavorite: false,\n\t\t}\n\t},\n\tmethods: {\n\t\ttoggleFavorite() {\n\t\t\tthis.isFavorite = !this.isFavorite\n\t\t},\n\t},\n}\n</script>\n```\n\n### Usage example: Sorting table columns\nThe standard way to implement sortable table column headers should be like this:\n\n```vue\n<template>\n\t<table>\n\t\t<thead>\n\t\t\t<tr>\n\t\t\t\t<th :aria-sorted=\"sortedName\" class=\"row-name\">\n\t\t\t\t\t<NcButton alignment=\"start-reverse\"\n\t\t\t\t\t\t:wide=\"true\"\n\t\t\t\t\t\ttype=\"tertiary\"\n\t\t\t\t\t\t@click=\"sortName\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<IconDown v-if=\"sortedName === 'ascending'\" class=\"sort-icon\" :size=\"20\" />\n\t\t\t\t\t\t\t<IconUp v-else-if=\"sortedName === 'descending'\" class=\"sort-icon\" :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\t<span class=\"table-header\">Name</span>\n\t\t\t\t\t</NcButton>\n\t\t\t\t</th>\n\t\t\t\t<th :aria-sorted=\"sortedSize\" class=\"row-size\">\n\t\t\t\t\t<NcButton alignment=\"end\"\n\t\t\t\t\t\t:wide=\"true\"\n\t\t\t\t\t\ttype=\"tertiary\"\n\t\t\t\t\t\t@click=\"sortSize\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<IconDown v-if=\"sortedSize === 'ascending'\" class=\"sort-icon\" :size=\"20\" />\n\t\t\t\t\t\t\t<IconUp v-else-if=\"sortedSize === 'descending'\" class=\"sort-icon\" :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\t<span class=\"table-header\">Size</span>\n\t\t\t\t\t</NcButton>\n\t\t\t\t</th>\n\t\t\t</tr>\n\t\t</thead>\n\t\t<tbody>\n\t\t\t<tr>\n\t\t\t\t<td class=\"row-name\">Lorem ipsum</td>\n\t\t\t\t<td class=\"row-size\">8 MiB</td>\n\t\t\t</tr>\n\t\t</tbody>\n\t</table>\n</template>\n<script>\nimport IconUp from 'vue-material-design-icons/MenuUp.vue'\nimport IconDown from 'vue-material-design-icons/MenuDown.vue'\n\nexport default {\n\tcomponents: {\n\t\tIconUp,\n\t\tIconDown,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tsortedName: null,\n\t\t\tsortedSize: null,\n\t\t}\n\t},\n\tmethods: {\n\t\tsortName() {\n\t\t\tif (this.sortedName === 'ascending') {\n\t\t\t\tthis.sortedName = 'descending'\n\t\t\t} else if (this.sortedName === 'descending') {\n\t\t\t\tthis.sortedName = null\n\t\t\t} else {\n\t\t\t\tthis.sortedName = 'ascending'\n\t\t\t}\n\t\t},\n\t\tsortSize() {\n\t\t\tif (this.sortedSize === 'ascending') {\n\t\t\t\tthis.sortedSize = 'descending'\n\t\t\t} else if (this.sortedSize === 'descending') {\n\t\t\t\tthis.sortedSize = null\n\t\t\t} else {\n\t\t\t\tthis.sortedSize = 'ascending'\n\t\t\t}\n\t\t},\n\t},\n}\n</script>\n<style>\ntable {\n\ttable-layout: fixed;\n\twidth: 300px;\n}\n\ntd.row-name {\n\tpadding-inline-start: 16px;\n}\n\ntd.row-size {\n\ttext-align: end;\n\tpadding-inline-end: 16px;\n}\n\n.table-header {\n\tfont-weight: normal;\n\tcolor: var(--color-text-maxcontrast);\n}\n\n.sort-icon {\n\tcolor: var(--color-text-maxcontrast);\n\tposition: relative;\n\tinset-inline: -10px;\n}\n\n.row-size .sort-icon {\n\tinset-inline: 10px;\n}\n</style>\n```\n\n</docs>\n\n<script lang=\"ts\">\nimport type { PropType } from 'vue'\n\nimport { defineComponent, h, resolveComponent } from 'vue'\nimport { ButtonAlignment, ButtonNativeType, ButtonType } from './types'\nimport isSlotPopulated from '../../utils/isSlotPopulated'\n\nexport default defineComponent({\n\tname: 'NcButton',\n\n\tinject: {\n\t\tgetNcPopoverTriggerAttrs: {\n\t\t\tfrom: 'NcPopover:trigger:attrs',\n\t\t\tdefault: () => () => ({}),\n\t\t},\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * Set the text and icon alignment\n\t\t *\n\t\t * @default 'center'\n\t\t * @type {'start' | 'start-reverse' | 'center' | 'center-reverse' | 'end' | 'end-reverse'}\n\t\t */\n\t\talignment: {\n\t\t\ttype: String as PropType<ButtonAlignment>,\n\t\t\tdefault: ButtonAlignment.Center,\n\t\t\tvalidator(value: string) {\n\t\t\t\treturn Object.values(ButtonAlignment).includes(value as ButtonAlignment)\n\t\t\t},\n\t\t},\n\n\t\t/**\n\t\t * Toggles the disabled state of the button on and off.\n\t\t */\n\t\tdisabled: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Specify the button size\n\t\t * Accepted values: `'small'`, `'normal'` (default), `'large'`\n\t\t */\n\t\tsize: {\n\t\t\ttype: String,\n\t\t\tdefault: 'normal',\n\t\t\tvalidator(value: string) {\n\t\t\t\treturn ['small', 'normal', 'large'].includes(value)\n\t\t\t},\n\t\t},\n\n\t\t/**\n\t\t * Specifies the button type\n\t\t * If left empty, the default button style will be applied.\n\t\t *\n\t\t * @default 'secondary'\n\t\t * @type {'primary' | 'secondary' | 'tertiary' | 'tertiary-no-background' | 'tertiary-on-primary' | 'error' | 'warning' | 'success'}\n\t\t */\n\t\ttype: {\n\t\t\ttype: String as PropType<ButtonType>,\n\t\t\tdefault: ButtonType.Secondary,\n\t\t\tvalidator(value: string) {\n\t\t\t\treturn Object.values(ButtonType).includes(value as ButtonType)\n\t\t\t},\n\t\t},\n\n\t\t/**\n\t\t * Specifies the button native type\n\t\t * If left empty, the default \"button\" type will be used.\n\t\t *\n\t\t * @default 'button'\n\t\t * @type {'submit' | 'reset' | 'button'}\n\t\t */\n\t\tnativeType: {\n\t\t\ttype: String as PropType<ButtonNativeType>,\n\t\t\tdefault: ButtonNativeType.Button,\n\t\t\tvalidator(value: string) {\n\t\t\t\treturn Object.values(ButtonNativeType).includes(value as ButtonNativeType)\n\t\t\t},\n\t\t},\n\n\t\t/**\n\t\t * Specifies whether the button should span all the available width.\n\t\t * By default, buttons span the whole width of the container.\n\t\t */\n\t\twide: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Always try to provide an aria-label to your button. Make it more\n\t\t * specific than the button's name by provide some more context. E.g. if\n\t\t * the name of the button is \"send\" in the Mail app, the aria label could\n\t\t * be \"Send email\".\n\t\t */\n\t\tariaLabel: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * Providing the href attribute turns the button component into an `a`\n\t\t * element.\n\t\t */\n\t\thref: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * Target for the `a` element if `href` is set.\n\t\t * @default '_self'\n\t\t */\n\t\ttarget: {\n\t\t\ttype: String,\n\t\t\tdefault: '_self',\n\t\t},\n\n\t\t/**\n\t\t * Providing the download attribute with href downloads file when clicking.\n\t\t */\n\t\tdownload: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * Providing the to attribute turns the button component into a `router-link`\n\t\t * element. Takes precedence over the href attribute.\n\t\t */\n\t\tto: {\n\t\t\ttype: [String, Object],\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * @deprecated To be removed in @nextcloud/vue 9. Migration guide: remove ariaHidden prop from NcAction* components.\n\t\t * @todo Add a check in @nextcloud/vue 9 that this prop is not provided,\n\t\t * otherwise root element will inherit incorrect aria-hidden.\n\t\t */\n\t\tariaHidden: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * The pressed state of the button if it has a checked state\n\t\t * This will add the `aria-pressed` attribute and for the button to have the primary style in checked state.\n\t\t *\n\t\t * Pressed state is not supported for links\n\t\t */\n\t\tpressed: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: null,\n\t\t},\n\t},\n\n\temits: ['update:pressed', 'click'],\n\n\tcomputed: {\n\t\t/**\n\t\t * The real type to be used for the button, enforces `primary` for pressed state and, if stateful button, any other type for not pressed state\n\t\t * Otherwise the type property is used.\n\t\t */\n\t\trealType() {\n\t\t\t// Force *primary* when pressed\n\t\t\tif (this.pressed) {\n\t\t\t\treturn 'primary'\n\t\t\t}\n\t\t\t// If not pressed but button is configured as stateful button then the type must not be primary\n\t\t\tif (this.pressed === false && this.type === 'primary') {\n\t\t\t\treturn 'secondary'\n\t\t\t}\n\t\t\treturn this.type\n\t\t},\n\n\t\t/**\n\t\t * The flexbox alignment of the button content\n\t\t */\n\t\tflexAlignment() {\n\t\t\treturn this.alignment.split('-')[0]\n\t\t},\n\n\t\t/**\n\t\t * If the button content should be reversed (icon on the end)\n\t\t */\n\t\tisReverseAligned() {\n\t\t\treturn this.alignment.includes('-')\n\t\t},\n\n\t\tncPopoverTriggerAttrs() {\n\t\t\treturn (this.getNcPopoverTriggerAttrs as () => Record<string, string|undefined>)()\n\t\t},\n\t},\n\n\t/**\n\t * The render function to display the component\n\t *\n\t * @return {object|undefined} The created VNode\n\t */\n\trender() {\n\t\tconst hasText = isSlotPopulated(this.$slots.default?.())\n\t\tconst hasIcon = isSlotPopulated(this.$slots.icon?.())\n\n\t\t/**\n\t\t * Always fill either the text prop or the ariaLabel one.\n\t\t */\n\t\tif (!hasText && !this.ariaLabel) {\n\t\t\tconsole.warn('You need to fill either the text or the ariaLabel props in the button component.', {\n\t\t\t\ttext: this.$slots.default?.()?.[0]?.children,\n\t\t\t\tariaLabel: this.ariaLabel,\n\t\t\t},\n\t\t\tthis)\n\t\t}\n\n\t\tconst isLink = (this.to || this.href)\n\n\t\tconst hasPressed = !isLink && typeof this.pressed === 'boolean'\n\n\t\tconst renderButton = ({ href, navigate, isActive }: {href?: string, navigate?: (ev: Event) => void, isActive?: boolean } = {}) => h(isLink ? 'a' : 'button',\n\t\t\t{\n\t\t\t\tclass: [\n\t\t\t\t\t'button-vue',\n\t\t\t\t\t`button-vue--size-${this.size}`,\n\t\t\t\t\t{\n\t\t\t\t\t\t'button-vue--icon-only': hasIcon && !hasText,\n\t\t\t\t\t\t'button-vue--text-only': hasText && !hasIcon,\n\t\t\t\t\t\t'button-vue--icon-and-text': hasIcon && hasText,\n\t\t\t\t\t\t[`button-vue--vue-${this.realType}`]: this.realType,\n\t\t\t\t\t\t'button-vue--wide': this.wide,\n\t\t\t\t\t\t[`button-vue--${this.flexAlignment}`]: this.flexAlignment !== 'center',\n\t\t\t\t\t\t'button-vue--reverse': this.isReverseAligned,\n\t\t\t\t\t\tactive: isActive,\n\t\t\t\t\t},\n\t\t\t\t],\n\t\t\t\t'aria-label': this.ariaLabel,\n\t\t\t\t'aria-pressed': hasPressed ? this.pressed.toString() : undefined,\n\t\t\t\tdisabled: this.disabled,\n\t\t\t\ttype: isLink ? null : this.nativeType,\n\t\t\t\trole: isLink ? 'button' : null,\n\t\t\t\thref: this.to ? href : (this.href || null),\n\t\t\t\ttarget: isLink ? this.target : null,\n\t\t\t\trel: isLink ? 'nofollow noreferrer noopener' : null,\n\t\t\t\tdownload: (!this.to && this.href && this.download) ? this.download : null,\n\t\t\t\t// If this button is used as a popover trigger, we need to apply trigger attrs, e.g. aria attributes\n\t\t\t\t...this.ncPopoverTriggerAttrs,\n\t\t\t\tonClick: ($event) => {\n\t\t\t\t\t// Update pressed prop on click if it is set\n\t\t\t\t\tif (hasPressed) {\n\t\t\t\t\t\t/**\n\t\t\t\t\t\t * Update the current pressed state of the button (if the `pressed` property was configured)\n\t\t\t\t\t\t *\n\t\t\t\t\t\t * @property {boolean} newValue The new `pressed`-state\n\t\t\t\t\t\t */\n\t\t\t\t\t\tthis.$emit('update:pressed', !this.pressed)\n\t\t\t\t\t}\n\t\t\t\t\t// We have to both navigate and emit the click event\n\t\t\t\t\tthis.$emit('click', $event)\n\t\t\t\t\tnavigate?.($event)\n\t\t\t\t},\n\t\t\t},\n\t\t\t[\n\t\t\t\th('span', { class: 'button-vue__wrapper' }, [\n\t\t\t\t\thasIcon\n\t\t\t\t\t\t? h('span', {\n\t\t\t\t\t\t\tclass: 'button-vue__icon',\n\t\t\t\t\t\t\t'aria-hidden': 'true',\n\t\t\t\t\t\t},\n\t\t\t\t\t\t[this.$slots.icon?.()],\n\t\t\t\t\t\t)\n\t\t\t\t\t\t: null,\n\t\t\t\t\thasText ? h('span', { class: 'button-vue__text' }, [this.$slots.default?.()]) : null,\n\t\t\t\t]),\n\t\t\t],\n\t\t)\n\n\t\t// If we have a router-link, we wrap the button in it\n\t\tif (this.to) {\n\t\t\treturn h(resolveComponent('router-link'), {\n\t\t\t\tcustom: true,\n\t\t\t\tto: this.to,\n\t\t\t}, {\n\t\t\t\tdefault: renderButton,\n\t\t\t})\n\t\t}\n\t\t// Otherwise we simply return the button\n\t\treturn renderButton()\n\t},\n})\n</script>\n\n<style lang=\"scss\" scoped>\n.button-vue {\n\t// Setup different button sizes\n\t--button-size: var(--default-clickable-area);\n\t--button-radius: var(--border-radius-element, calc(var(--button-size) / 2));\n\t--button-padding: clamp(var(--default-grid-baseline), var(--button-radius), calc(var(--default-grid-baseline) * 4));\n\n\t&--size-small {\n\t\t--button-size: var(--clickable-area-small, 24px);\n\t\t--button-radius: var(--border-radius); // make the border radius even smaller for small buttons\n\t}\n\n\t&--size-large {\n\t\t--button-size: var(--clickable-area-large, 48px);\n\t}\n\n\t// General styles\n\tposition: relative;\n\twidth: fit-content;\n\toverflow: hidden;\n\tborder: 0;\n\tpadding: 0;\n\tfont-size: var(--default-font-size);\n\tfont-weight: bold;\n\tmin-height: var(--button-size);\n\tmin-width: var(--button-size);\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\n\t// Cursor pointer on element and all children\n\tcursor: pointer;\n\t& *,\n\tspan {\n\t\tcursor: pointer;\n\t}\n\tborder-radius: var(--button-radius);\n\ttransition-property: color, border-color, background-color;\n\ttransition-duration: 0.1s;\n\ttransition-timing-function: linear;\n\n\t// No outline feedback for focus. Handled with a toggled class in js (see data)\n\t&:focus {\n\t\toutline: none;\n\t}\n\n\t&:disabled {\n\t\tcursor: default;\n\t\t& * {\n\t\t\tcursor: default;\n\t\t}\n\t\topacity: $opacity_disabled;\n\t\t// Gives a wash out effect\n\t\tfilter: saturate($opacity_normal);\n\t}\n\n\t// Default button type\n\tcolor: var(--color-primary-element-light-text);\n\tbackground-color: var(--color-primary-element-light);\n\t&:hover:not(:disabled) {\n\t\tbackground-color: var(--color-primary-element-light-hover);\n\t}\n\n\t// Back to the default color for this button when active\n\t// TODO: add ripple effect\n\t&:active {\n\t\tbackground-color: var(--color-primary-element-light);\n\t}\n\n\t&__wrapper {\n\t\tdisplay: inline-flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\twidth: 100%;\n\t}\n\n\t&--end &__wrapper {\n\t\tjustify-content: end;\n\t}\n\t&--start &__wrapper {\n\t\tjustify-content: start;\n\t}\n\t&--reverse &__wrapper {\n\t\tflex-direction: row-reverse;\n\t}\n\n\t&--reverse#{&}--icon-and-text {\n\t\tpadding-inline: var(--button-padding) var(--default-grid-baseline);\n\t}\n\n\t&__icon {\n\t\theight: var(--button-size);\n\t\twidth: var(--button-size);\n\t\tmin-height: var(--button-size);\n\t\tmin-width: var(--button-size);\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t}\n\t// For small buttons we need to adjust the icon size\n\t&--size-small &__icon {\n\t\t:deep(> *) {\n\t\t\tmax-height: 16px;\n\t\t\tmax-width: 16px;\n\t\t}\n\t\t:deep(svg) {\n\t\t\theight: 16px;\n\t\t\twidth: 16px;\n\t\t}\n\t}\n\n\t&__text {\n\t\tfont-weight: bold;\n\t\tmargin-bottom: 1px;\n\t\tpadding: 2px 0;\n\t\twhite-space: nowrap;\n\t\ttext-overflow: ellipsis;\n\t\toverflow: hidden;\n\t}\n\n\t// Icon-only button\n\t&--icon-only {\n\t\tline-height: 1;\n\t\twidth: var(--button-size) !important;\n\t}\n\n\t// Text-only button\n\t&--text-only {\n\t\tpadding: 0 var(--button-padding);\n\t\t& .button-vue__text {\n\t\t\tmargin-left: 4px;\n\t\t\tmargin-right: 4px;\n\t\t}\n\t}\n\n\t// Icon and text button\n\t&--icon-and-text {\n\t\t// icon and text means the icon adds \"visual\" padding thus we need to adjust the text padding\n\t\t--button-padding: min(calc(var(--default-grid-baseline) + var(--button-radius)), calc(var(--default-grid-baseline) * 4));\n\t\t// Adjust padding as the icon already got some padding we need to reduce the padding on the icon side and only add larger padding to the text side\n\t\tpadding-block: 0;\n\t\tpadding-inline: var(--default-grid-baseline) var(--button-padding);\n\t}\n\n\t// Wide button spans the whole width of the container\n\t&--wide {\n\t\twidth: 100%;\n\t}\n\n\t&:focus-visible {\n\t\toutline: 2px solid var(--color-main-text) !important;\n\t\tbox-shadow: 0 0 0 4px var(--color-main-background) !important;\n\t\t&.button-vue--vue-tertiary-on-primary {\n\t\t\toutline: 2px solid var(--color-primary-element-text);\n\t\t\tborder-radius: var(--border-radius-element, var(--border-radius));\n\t\t\tbackground-color: transparent;\n\t\t}\n\t}\n\n\t// Button types\n\n\t// Primary\n\t&--vue-primary {\n\t\tbackground-color: var(--color-primary-element);\n\t\tcolor: var(--color-primary-element-text);\n\t\t&:hover:not(:disabled) {\n\t\t\tbackground-color: var(--color-primary-element-hover);\n\t\t}\n\t\t// Back to the default color for this button when active\n\t\t// TODO: add ripple effect\n\t\t&:active {\n\t\t\tbackground-color: var(--color-primary-element);\n\t\t}\n\t}\n\n\t// Secondary\n\t&--vue-secondary {\n\t\tcolor: var(--color-primary-element-light-text);\n\t\tbackground-color: var(--color-primary-element-light);\n\t\t&:hover:not(:disabled) {\n\t\t\tcolor: var(--color-primary-element-light-text);\n\t\t\tbackground-color: var(--color-primary-element-light-hover);\n\t\t}\n\t}\n\n\t// Tertiary\n\t&--vue-tertiary {\n\t\tcolor: var(--color-main-text);\n\t\tbackground-color: transparent;\n\t\t&:hover:not(:disabled) {\n\t\t\tbackground-color: var(--color-background-hover);\n\t\t}\n\t}\n\n\t// Tertiary, no background\n\t&--vue-tertiary-no-background {\n\t\tcolor: var(--color-main-text);\n\t\tbackground-color: transparent;\n\t\t&:hover:not(:disabled) {\n\t\t\tbackground-color: transparent;\n\t\t}\n\t}\n\n\t// Tertiary on primary color (like the header)\n\t&--vue-tertiary-on-primary {\n\t\tcolor: var(--color-primary-element-text);\n\t\tbackground-color: transparent;\n\n\t\t&:hover:not(:disabled) {\n\t\t\tbackground-color: transparent;\n\t\t}\n\t}\n\n\t// Success\n\t&--vue-success {\n\t\tbackground-color: var(--color-success);\n\t\tcolor: white;\n\t\t&:hover:not(:disabled) {\n\t\t\tbackground-color: var(--color-success-hover);\n\t\t}\n\t\t// Back to the default color for this button when active\n\t\t// : add ripple effect\n\t\t&:active {\n\t\t\tbackground-color: var(--color-success);\n\t\t}\n\t}\n\n\t// Warning\n\t&--vue-warning {\n\t\tbackground-color: var(--color-warning);\n\t\tcolor: white;\n\t\t&:hover:not(:disabled) {\n\t\t\tbackground-color: var(--color-warning-hover);\n\t\t}\n\t\t// Back to the default color for this button when active\n\t\t// TODO: add ripple effect\n\t\t&:active {\n\t\t\tbackground-color: var(--color-warning);\n\t\t}\n\t}\n\n\t// Error\n\t&--vue-error {\n\t\tbackground-color: var(--color-error);\n\t\tcolor: white;\n\t\t&:hover:not(:disabled) {\n\t\t\tbackground-color: var(--color-error-hover);\n\t\t}\n\t\t// Back to the default color for this button when active\n\t\t// TODO: add ripple effect\n\t\t&:active {\n\t\t\tbackground-color: var(--color-error);\n\t\t}\n\t}\n}\n\n</style>\n"],"names":["ButtonAlignment","ButtonNativeType","ButtonType"],"mappings":"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"}