@nextcloud/vue 9.0.0-rc.6 → 9.0.0-rc.7

package/dist/chunks/NcAppNavigationItem-0xVXJPEm.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NcAppNavigationItem-0xVXJPEm.mjs","sources":["../../node_modules/vue-material-design-icons/Pencil.vue","../../node_modules/vue-material-design-icons/Undo.vue","../../src/components/NcAppNavigationItem/NcAppNavigationIconCollapsible.vue","../../src/components/NcAppNavigationItem/NcAppNavigationItem.vue"],"sourcesContent":["<template>\n  <span v-bind=\"$attrs\"\n        :aria-hidden=\"title ? null : 'true'\"\n        :aria-label=\"title\"\n        class=\"material-design-icon pencil-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.71,7.04C21.1,6.65 21.1,6 20.71,5.63L18.37,3.29C18,2.9 17.35,2.9 16.96,3.29L15.12,5.12L18.87,8.87M3,17.25V21H6.75L17.81,9.93L14.06,6.18L3,17.25Z\">\n        <title v-if=\"title\">{{ title }}</title>\n      </path>\n    </svg>\n  </span>\n</template>\n\n<script>\nexport default {\n  name: \"PencilIcon\",\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 undo-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.5,8C9.85,8 7.45,9 5.6,10.6L2,7V16H11L7.38,12.38C8.77,11.22 10.54,10.5 12.5,10.5C16.04,10.5 19.05,12.81 20.1,16L22.47,15.22C21.08,11.03 17.15,8 12.5,8Z\">\n        <title v-if=\"title\">{{ title }}</title>\n      </path>\n    </svg>\n  </span>\n</template>\n\n<script>\nexport default {\n  name: \"UndoIcon\",\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<!-- Button to expand or collapse children -->\n\t<NcButton class=\"icon-collapse\"\n\t\t:class=\"{'icon-collapse--open':open}\"\n\t\t:aria-label=\"labelButton\"\n\t\tvariant=\"tertiary\"\n\t\t@click=\"onClick\">\n\t\t<template #icon>\n\t\t\t<ChevronUp v-if=\"open\"\n\t\t\t\t:size=\"20\" />\n\t\t\t<ChevronDown v-else\n\t\t\t\t:size=\"20\" />\n\t\t</template>\n\t</NcButton>\n</template>\n\n<script>\nimport { t } from '../../l10n.ts'\nimport NcButton from '../NcButton/index.ts'\nimport ChevronDown from 'vue-material-design-icons/ChevronDown.vue'\nimport ChevronUp from 'vue-material-design-icons/ChevronUp.vue'\n\nexport default {\n\tname: 'NcAppNavigationIconCollapsible',\n\n\tcomponents: {\n\t\tNcButton,\n\t\tChevronDown,\n\t\tChevronUp,\n\t},\n\n\tprops: {\n\t\topen: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: true,\n\t\t},\n\t},\n\n\temits: ['click'],\n\n\tcomputed: {\n\t\tlabelButton() {\n\t\t\treturn this.open ? t('Collapse menu') : t('Open menu')\n\t\t},\n\t},\n\n\tmethods: {\n\t\tonClick(e) {\n\t\t\tthis.$emit('click', e)\n\t\t},\n\t},\n\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.button-vue.icon-collapse {\n\tposition: relative;\n\tz-index: 105; // above a, under button\n\tcolor: var(--color-main-text);\n\tinset-inline-end: 0;\n\t&--open {\n\t\tcolor: var(--color-main-text);\n\t\t&:hover{\n\t\t\tcolor: var(--color-primary-element);\n\t\t}\n\t}\n}\n\n</style>\n","<!--\n  - SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n\n### Usage\n\n#### Simple element\n\n* With an icon:\n\n```vue\n\t<template>\n\t\t<ul>\n\t\t\t<NcAppNavigationItem name=\"My name\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Check :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t</NcAppNavigationItem>\n\t\t</ul>\n\t</template>\n\t<script>\n\timport Check from 'vue-material-design-icons/Check.vue'\n\n\texport default {\n\t\tcomponents: {\n\t\t\tCheck,\n\t\t},\n\t}\n\t</script>\n```\n* With a spinning loader instead of the icon:\n\n```vue\n<ul>\n\t<NcAppNavigationItem name=\"Loading Item\" :loading=\"true\" />\n</ul>\n```\n* With an active state (only needed when not using `vue-router` and the `to` property, otherwise this is set automatically)\n\n```vue\n<ul>\n\t<NcAppNavigationItem name=\"Current page\" :active=\"true\" />\n</ul>\n```\n\n* Using different icons based on the active state (e.g. using vue-router and showing the filled variant for the current route):\n\n```vue\n<template>\n\t<ul>\n\t\t<NcAppNavigationItem name=\"Current page\" :active=\"true\">\n\t\t\t<template #icon=\"{ active }\">\n\t\t\t\t<NcIconSvgWrapper :path=\"active ? mdiFolder : mdiFolderOutline\" />\n\t\t\t</template>\n\t\t</NcAppNavigationItem>\n\t\t<NcAppNavigationItem name=\"Other page\">\n\t\t\t<template #icon=\"{ active }\">\n\t\t\t\t<NcIconSvgWrapper :path=\"active ? mdiFolder : mdiFolderOutline\" />\n\t\t\t</template>\n\t\t</NcAppNavigationItem>\n\t</ul>\n</template>\n<script>\nimport { mdiFolder, mdiFolderOutline } from '@mdi/js'\n\nexport default {\n\tsetup() {\n\t\treturn {\n\t\t\tmdiFolder,\n\t\t\tmdiFolderOutline,\n\t\t}\n\t},\n}\n</script>\n```\n\n#### Element with actions\nWrap the children in a template. If you have more than 2 actions, a popover menu and a menu\nbutton will be automatically created.\n\n```vue\n\t<template>\n\t\t<div id=\"app-navigation-vue\"><!-- Just a wrapper necessary in the docs. Not needed when NcAppNavigation is correctly used as parent. -->\n\t\t\t<ul>\n\t\t\t\t<NcAppNavigationItem name=\"Item with actions\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<Check :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\t<template #actions>\n\t\t\t\t\t\t<NcActionButton @click=\"alert('Edit')\">\n\t\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t\t<Pencil :size=\"20\" />\n\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t\tEdit\n\t\t\t\t\t\t</NcActionButton>\n\t\t\t\t\t\t<NcActionButton @click=\"alert('Delete')\">\n\t\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t\t<Delete :size=\"20\" />\n\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t\tDelete\n\t\t\t\t\t\t</NcActionButton>\n\t\t\t\t\t\t<NcActionLink name=\"Link\" href=\"https://nextcloud.com\">\n\t\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t\t<OpenInNew :size=\"20\" />\n\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t</NcActionLink>\n\t\t\t\t\t</template>\n\t\t\t\t</NcAppNavigationItem>\n\t\t\t</ul>\n\t\t</div>\n\t</template>\n\t<script>\n\timport Check from 'vue-material-design-icons/Check.vue'\n\timport Delete from 'vue-material-design-icons/Delete.vue'\n\timport OpenInNew from 'vue-material-design-icons/OpenInNew.vue'\n\timport Pencil from 'vue-material-design-icons/Pencil.vue'\n\n\texport default {\n\t\tcomponents: {\n\t\t\tCheck,\n\t\t\tDelete,\n\t\t\tOpenInNew,\n\t\t\tPencil,\n\t\t},\n\t\tmethods: {\n\t\t\talert(msg) {\n\t\t\t\talert(msg)\n\t\t\t},\n\t\t},\n\t}\n\t</script>\n```\n\n#### Element with counter\nJust nest the counter in a template within `<NcAppNavigationItem>` and add `#counter` to it.\n\n```vue\n\t<template>\n\t\t<ul>\n\t\t\t<NcAppNavigationItem name=\"Item with counter\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Folder :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\t<template #counter>\n\t\t\t\t\t<NcCounterBubble :count=\"90\" />\n\t\t\t\t</template>\n\t\t\t</NcAppNavigationItem>\n\t\t</ul>\n\t</template>\n\t<script>\n\timport Folder from 'vue-material-design-icons/Folder.vue'\n\n\texport default {\n\t\tcomponents: {\n\t\t\tFolder,\n\t\t},\n\t}\n\t</script>\n```\n\n#### Element with children\n\nWrap the children in a template with the `slot` property and use the prop `allowCollapse` to choose wether to allow or\nprevent the user from collapsing the items.\n\n```vue\n\t<template>\n\t\t<ul>\n\t\t\t<NcAppNavigationItem name=\"Item with children\" :allowCollapse=\"true\" :open=\"true\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Folder :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\t<template #counter>\n\t\t\t\t\t<NcCounterBubble :count=\"90\" />\n\t\t\t\t</template>\n\t\t\t\t<template #actions>\n\t\t\t\t\t<NcActionButton @click=\"alert('Edit')\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<Pencil :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\tEdit\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t\t<NcActionButton @click=\"alert('Delete')\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<Delete :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\tDelete\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t\t<NcActionLink name=\"Link\" href=\"https://nextcloud.com\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<OpenInNew :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</NcActionLink>\n\t\t\t\t</template>\n\t\t\t\t<template #default>\n\t\t\t\t\t<NcAppNavigationItem name=\"AppNavigationItemChild1\" />\n\t\t\t\t\t<NcAppNavigationItem name=\"AppNavigationItemChild2\" />\n\t\t\t\t\t<NcAppNavigationItem name=\"AppNavigationItemChild3\" />\n\t\t\t\t\t<NcAppNavigationItem name=\"AppNavigationItemChild4\" />\n\t\t\t\t</template>\n\t\t\t</NcAppNavigationItem>\n\t\t</ul>\n\t</template>\n\t<script>\n\timport Folder from 'vue-material-design-icons/Folder.vue'\n\timport Delete from 'vue-material-design-icons/Delete.vue'\n\timport OpenInNew from 'vue-material-design-icons/OpenInNew.vue'\n\timport Pencil from 'vue-material-design-icons/Pencil.vue'\n\n\texport default {\n\t\tcomponents: {\n\t\t\tFolder,\n\t\t\tDelete,\n\t\t\tOpenInNew,\n\t\t\tPencil,\n\t\t},\n\t\tmethods: {\n\t\t\talert(msg) {\n\t\t\t\talert(msg)\n\t\t\t},\n\t\t},\n\t}\n\t</script>\n```\n\n#### Editable element\nAdd the prop `:editable=true` and an edit placeholder if you need it. By default\nthe placeholder is the previous name of the element.\n\n```vue\n\t<template>\n\t\t<ul>\n\t\t\t<NcAppNavigationItem name=\"Editable Item\" :editable=\"true\"\n\t\t\t\teditPlaceholder=\"your_placeholder_here\" @update:name=\"function(value){alert(value)}\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Folder :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t</NcAppNavigationItem>\n\t\t</ul>\n\t</template>\n\t<script>\n\timport Folder from 'vue-material-design-icons/Folder.vue'\n\n\texport default {\n\t\tcomponents: {\n\t\t\tFolder,\n\t\t},\n\t\tmethods: {\n\t\t\talert(msg) {\n\t\t\t\talert(msg)\n\t\t\t},\n\t\t},\n\t}\n\t</script>\n```\n\n#### Undo element\nJust set the `undo` and `name` props. When clicking the undo button, an `undo` event is emitted.\n\n```vue\n\t<template>\n\t\t<ul>\n\t\t\t<NcAppNavigationItem :undo=\"true\" name=\"Deleted important entry\" @undo=\"alert('undo delete')\" />\n\t\t</ul>\n\t</template>\n\t<script>\n\texport default {\n\t\tmethods: {\n\t\t\talert(msg) {\n\t\t\t\talert(msg)\n\t\t\t},\n\t\t},\n\t}\n\t</script>\n```\n\n#### Link element\nHref that start by http will be treated as external and opened in a new tab\n```\n<div>\n\t<ul>\n\t\t<NcAppNavigationItem name=\"Files\" href=\"/index.php/apps/files\" />\n\t\t<NcAppNavigationItem name=\"Nextcloud\" href=\"https://nextcloud.com\" />\n\t</ul>\n</div>\n```\n\n#### Custom title\n```\n<ul>\n\t<NcAppNavigationItem name=\"Nextcloud\" title=\"Open the Nextcloud website\" href=\"https://nextcloud.com\" />\n</ul>\n```\n\n#### Pinned element\nJust set the `pinned` prop.\n```\n<ul>\n\t<NcAppNavigationItem name=\"Pinned item\" :pinned=\"true\" />\n</ul>\n```\n</docs>\n\n<template>\n\t<li :id=\"id\"\n\t\t:class=\"{\n\t\t\t'app-navigation-entry--opened': opened,\n\t\t\t'app-navigation-entry--pinned': pinned,\n\t\t\t'app-navigation-entry--collapsible': allowCollapse && !!$slots.default,\n\t\t}\"\n\t\tclass=\"app-navigation-entry-wrapper\">\n\t\t<component :is=\"isRouterLink ? 'router-link' : 'NcVNodes'\"\n\t\t\tv-slot=\"{ href: routerLinkHref, navigate, isActive }\"\n\t\t\tv-bind=\"{ ...isRouterLink && { custom: true, to } }\">\n\t\t\t<div :class=\"{\n\t\t\t\t\t'app-navigation-entry--editing': editingActive,\n\t\t\t\t\t'app-navigation-entry--deleted': undo,\n\t\t\t\t\t'active': (isActive && to) || active,\n\t\t\t\t}\"\n\t\t\t\tclass=\"app-navigation-entry\">\n\t\t\t\t<!-- Icon and name -->\n\t\t\t\t<a v-if=\"!undo\"\n\t\t\t\t\tclass=\"app-navigation-entry-link\"\n\t\t\t\t\t:aria-current=\"active || (isActive && to) ? 'page' : undefined\"\n\t\t\t\t\t:aria-description=\"ariaDescription\"\n\t\t\t\t\t:aria-expanded=\"!!$slots.default ? opened.toString() : undefined\"\n\t\t\t\t\t:href=\"href || routerLinkHref || '#'\"\n\t\t\t\t\t:target=\"isExternal(href) ? '_blank' : undefined\"\n\t\t\t\t\t:title=\"title || name\"\n\t\t\t\t\t@blur=\"handleBlur\"\n\t\t\t\t\t@click=\"onClick($event, navigate, routerLinkHref)\"\n\t\t\t\t\t@focus=\"handleFocus\"\n\t\t\t\t\t@keydown.tab.exact=\"handleTab\">\n\n\t\t\t\t\t<!-- icon if not collapsible -->\n\t\t\t\t\t<!-- never show the icon over the collapsible if mobile -->\n\t\t\t\t\t<div :class=\"{ [icon]: icon }\"\n\t\t\t\t\t\tclass=\"app-navigation-entry-icon\">\n\t\t\t\t\t\t<NcLoadingIcon v-if=\"loading\" />\n\t\t\t\t\t\t<!-- @slot Slot for the optional leading icon. This slots get the `active`-slot attribute passed which is based on the vue-routers active route or the `active` prop. -->\n\t\t\t\t\t\t<slot v-else name=\"icon\" :active=\"active || (to && isActive)\" />\n\t\t\t\t\t</div>\n\t\t\t\t\t<span class=\"app-navigation-entry__name\" :class=\"{ 'hidden-visually': editingActive }\">\n\t\t\t\t\t\t{{ name }}\n\t\t\t\t\t</span>\n\t\t\t\t\t<div v-if=\"editingActive\" class=\"editingContainer\">\n\t\t\t\t\t\t<NcInputConfirmCancel ref=\"editingInput\"\n\t\t\t\t\t\t\tv-model=\"editingValue\"\n\t\t\t\t\t\t\t:placeholder=\"editPlaceholder !== '' ? editPlaceholder : name\"\n\t\t\t\t\t\t\t:primary=\"(isActive && to) || active\"\n\t\t\t\t\t\t\t@cancel=\"cancelEditing\"\n\t\t\t\t\t\t\t@confirm=\"handleEditingDone\" />\n\t\t\t\t\t</div>\n\t\t\t\t</a>\n\n\t\t\t\t<!-- undo entry -->\n\t\t\t\t<div v-if=\"undo\" class=\"app-navigation-entry__deleted\">\n\t\t\t\t\t<div class=\"app-navigation-entry__deleted-description\">\n\t\t\t\t\t\t{{ name }}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\n\t\t\t\t<!-- Counter and Actions -->\n\t\t\t\t<div v-if=\"(!!$slots.actions || !!$slots.counter || editable || undo) && !editingActive\"\n\t\t\t\t\tclass=\"app-navigation-entry__utils\"\n\t\t\t\t\t:class=\"{'app-navigation-entry__utils--display-actions': forceDisplayActions || menuOpenLocalValue || menuOpen }\">\n\t\t\t\t\t<div v-if=\"!!$slots.counter\"\n\t\t\t\t\t\tclass=\"app-navigation-entry__counter-wrapper\">\n\t\t\t\t\t\t<!-- @slot Slot for the `NcCounterBubble` -->\n\t\t\t\t\t\t<slot name=\"counter\" />\n\t\t\t\t\t</div>\n\t\t\t\t\t<NcActions v-if=\"!!$slots.actions || (editable && !editingActive) || undo\"\n\t\t\t\t\t\tref=\"actions\"\n\t\t\t\t\t\t:inline=\"inlineActions\"\n\t\t\t\t\t\tclass=\"app-navigation-entry__actions\"\n\t\t\t\t\t\tcontainer=\"#app-navigation-vue\"\n\t\t\t\t\t\t:boundaries-element=\"actionsBoundariesElement\"\n\t\t\t\t\t\t:placement=\"menuPlacement\"\n\t\t\t\t\t\t:open=\"menuOpen\"\n\t\t\t\t\t\t:force-menu=\"forceMenu\"\n\t\t\t\t\t\t:default-icon=\"menuIcon\"\n\t\t\t\t\t\t:variant=\"(isActive && to) || active ? 'primary' : null\"\n\t\t\t\t\t\t@update:open=\"onMenuToggle\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<!-- @slot Slot for the custom menu icon -->\n\t\t\t\t\t\t\t<slot name=\"menu-icon\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\t<NcActionButton v-if=\"editable && !editingActive\"\n\t\t\t\t\t\t\t:aria-label=\"editButtonAriaLabel\"\n\t\t\t\t\t\t\t@click=\"handleEdit\">\n\t\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t\t<Pencil :size=\"20\" />\n\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t\t{{ editLabel }}\n\t\t\t\t\t\t</NcActionButton>\n\t\t\t\t\t\t<NcActionButton v-if=\"undo\"\n\t\t\t\t\t\t\t:aria-label=\"undoButtonAriaLabel\"\n\t\t\t\t\t\t\t@click=\"handleUndo\">\n\t\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t\t<Undo :size=\"20\" />\n\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t</NcActionButton>\n\t\t\t\t\t\t<!-- @slot Slot for additional `NcAction*` -->\n\t\t\t\t\t\t<slot name=\"actions\" />\n\t\t\t\t\t</NcActions>\n\t\t\t\t</div>\n\t\t\t\t<NcAppNavigationIconCollapsible v-if=\"allowCollapse && !!$slots.default\" :open=\"opened\" @click.prevent.stop=\"toggleCollapse\" />\n\n\t\t\t\t<!-- @slot Slot for anything (virtual) that should be mounted in the component, like a related modal -->\n\t\t\t\t<slot name=\"extra\" />\n\t\t\t</div>\n\t\t</component>\n\t\t<!-- Children elements -->\n\t\t<ul v-if=\"canHaveChildren && !!$slots.default\" class=\"app-navigation-entry__children\">\n\t\t\t<!-- @slot Slot for children -->\n\t\t\t<slot />\n\t\t</ul>\n\t</li>\n</template>\n\n<script>\nimport { useIsMobile } from '../../composables/useIsMobile/index.js'\nimport { createElementId } from '../../utils/createElementId.ts'\nimport { t } from '../../l10n.ts'\n\nimport Pencil from 'vue-material-design-icons/Pencil.vue'\nimport Undo from 'vue-material-design-icons/Undo.vue'\nimport NcActions from '../NcActions/index.js'\nimport NcActionButton from '../NcActionButton/index.js'\nimport NcAppNavigationIconCollapsible from './NcAppNavigationIconCollapsible.vue'\nimport NcInputConfirmCancel from './NcInputConfirmCancel.vue'\nimport NcLoadingIcon from '../NcLoadingIcon/index.ts'\nimport NcVNodes from '../NcVNodes/index.ts'\n\nexport default {\n\tname: 'NcAppNavigationItem',\n\n\tcomponents: {\n\t\tNcActions,\n\t\tNcActionButton,\n\t\tNcAppNavigationIconCollapsible,\n\t\tNcInputConfirmCancel,\n\t\tNcLoadingIcon,\n\t\tNcVNodes,\n\t\tPencil,\n\t\tUndo,\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * If you are not using vue-router you can use the property to set this item as the active navigation entry.\n\t\t * When using vue-router and the `to` property this is set automatically.\n\t\t */\n\t\tactive: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\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\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 * id attribute of the list item element\n\t\t */\n\t\tid: {\n\t\t\ttype: String,\n\t\t\tdefault: () => createElementId(),\n\t\t\tvalidator: id => id.trim() !== '',\n\t\t},\n\n\t\t/**\n\t\t * Refers to the icon on the left, this prop accepts a class\n\t\t * like 'icon-category-enabled'.\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 * Displays a loading animated icon on the left of the element\n\t\t * instead of the icon.\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 * Passing in a route will make the root element of this\n\t\t * component a `<router-link />` that points to that route.\n\t\t * By leaving this blank, the root element will be a `<li>`.\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 * A direct link. This will be used as the `href` attribute.\n\t\t * This will ignore any `to` prop being defined.\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 * Gives the possibility to collapse the children elements into the\n\t\t * parent element (true) or expands the children elements (false).\n\t\t */\n\t\tallowCollapse: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Makes the name of the item editable by providing an `ActionButton`\n\t\t * component that toggles a form\n\t\t */\n\t\teditable: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Only for 'editable' items, sets label for the edit action button.\n\t\t */\n\t\teditLabel: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * Only for items in 'editable' mode, sets the placeholder text for the editing form.\n\t\t */\n\t\teditPlaceholder: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * Pins the item to the bottom left area, above the settings. Do not\n\t\t * place 'non-pinned' `AppnavigationItem` components below `pinned`\n\t\t * ones.\n\t\t */\n\t\tpinned: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Puts the item in the 'undo' state.\n\t\t */\n\t\tundo: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * The navigation collapsible state (synced)\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 * The actions menu open state (synced)\n\t\t */\n\t\tmenuOpen: {\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 * The action's menu default icon\n\t\t */\n\t\tmenuIcon: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * The action's menu direction\n\t\t */\n\t\tmenuPlacement: {\n\t\t\ttype: String,\n\t\t\tdefault: 'bottom',\n\t\t},\n\n\t\t/**\n\t\t * Entry aria details\n\t\t */\n\t\tariaDescription: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * To be used only when the elements in the actions menu are very important\n\t\t */\n\t\tforceDisplayActions: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Number of action items outside the menu\n\t\t */\n\t\tinlineActions: {\n\t\t\ttype: Number,\n\t\t\tdefault: 0,\n\t\t},\n\t},\n\n\temits: [\n\t\t'update:menuOpen',\n\t\t'update:open',\n\t\t'update:name',\n\t\t'click',\n\t\t'undo',\n\t],\n\n\tsetup() {\n\t\treturn {\n\t\t\tisMobile: useIsMobile(),\n\t\t}\n\t},\n\n\tdata() {\n\t\treturn {\n\t\t\tactionsBoundariesElement: undefined,\n\t\t\teditingValue: '',\n\t\t\topened: this.open, // Collapsible state\n\t\t\teditingActive: false,\n\t\t\t/**\n\t\t\t * Tracks the open state of the actions menu\n\t\t\t */\n\t\t\tmenuOpenLocalValue: false,\n\t\t\tfocused: false,\n\t\t}\n\t},\n\n\tcomputed: {\n\t\tisRouterLink() {\n\t\t\treturn this.to && !this.href\n\t\t},\n\n\t\t// Checks if the component is already a children of another\n\t\t// instance of AppNavigationItem\n\t\tcanHaveChildren() {\n\t\t\tif (this.$parent.$options._componentTag === 'AppNavigationItem') {\n\t\t\t\treturn false\n\t\t\t} else {\n\t\t\t\treturn true\n\t\t\t}\n\t\t},\n\n\t\teditButtonAriaLabel() {\n\t\t\treturn this.editLabel ? this.editLabel : t('Edit item')\n\t\t},\n\n\t\tundoButtonAriaLabel() {\n\t\t\treturn t('Undo changes')\n\t\t},\n\t},\n\n\twatch: {\n\t\topen(newVal) {\n\t\t\tthis.opened = newVal\n\t\t},\n\t},\n\n\tmounted() {\n\t\tthis.actionsBoundariesElement = document.querySelector('#content-vue') || undefined\n\t},\n\n\tmethods: {\n\t\t// sync opened menu state with prop\n\t\tonMenuToggle(state) {\n\t\t\tthis.$emit('update:menuOpen', state)\n\t\t\tthis.menuOpenLocalValue = state\n\t\t},\n\t\t// toggle the collapsible state\n\t\ttoggleCollapse() {\n\t\t\tthis.opened = !this.opened\n\t\t\tthis.$emit('update:open', this.opened)\n\t\t},\n\n\t\t/**\n\t\t * Handle link click\n\t\t *\n\t\t * @param {PointerEvent} event - Native click event\n\t\t * @param {Function} [navigate] - VueRouter link's navigate if any\n\t\t * @param {string} [routerLinkHref] - VueRouter link's href\n\t\t */\n\t\tonClick(event, navigate, routerLinkHref) {\n\t\t\t// Always forward native event\n\t\t\tthis.$emit('click', event)\n\t\t\t// Do not navigate with control keys - it is opening in a new tab\n\t\t\tif (event.metaKey || event.altKey || event.ctrlKey || event.shiftKey) {\n\t\t\t\treturn\n\t\t\t}\n\t\t\t// Prevent default link behaviour if it's a router-link and navigate manually\n\t\t\tif (routerLinkHref) {\n\t\t\t\tnavigate?.(event)\n\t\t\t\tevent.preventDefault()\n\t\t\t}\n\t\t},\n\n\t\t// Edition methods\n\t\thandleEdit() {\n\t\t\tthis.editingValue = this.name\n\t\t\tthis.editingActive = true\n\t\t\tthis.onMenuToggle(false)\n\t\t\tthis.$nextTick(() => {\n\t\t\t\tthis.$refs.editingInput.focusInput()\n\t\t\t})\n\t\t},\n\t\tcancelEditing() {\n\t\t\tthis.editingActive = false\n\t\t},\n\t\thandleEditingDone() {\n\t\t\tthis.$emit('update:name', this.editingValue)\n\t\t\tthis.editingValue = ''\n\t\t\tthis.editingActive = false\n\t\t},\n\n\t\t// Undo methods\n\t\thandleUndo() {\n\t\t\tthis.$emit('undo')\n\t\t},\n\n\t\t/**\n\t\t * Show actions upon focus\n\t\t */\n\t\thandleFocus() {\n\t\t\tthis.focused = true\n\t\t},\n\n\t\thandleBlur() {\n\t\t\tthis.focused = false\n\t\t},\n\n\t\t/**\n\t\t * This method checks if the root element of the component is focused and\n\t\t * if that's the case it focuses the actions button if available\n\t\t *\n\t\t * @param {Event} e the keydown event\n\t\t */\n\t\thandleTab(e) {\n\t\t\t// If there is no actions menu, do nothing.\n\t\t\tif (!this.$refs.actions) {\n\t\t\t\treturn\n\t\t\t}\n\t\t\tif (this.focused) {\n\t\t\t\te.preventDefault()\n\t\t\t\tthis.$refs.actions.$refs.triggerButton.$el.focus()\n\t\t\t\tthis.focused = false\n\t\t\t} else {\n\t\t\t\tthis.$refs.actions.$refs.triggerButton.$el.blur()\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Is this an external link\n\t\t *\n\t\t * @param {string} href The link to check\n\t\t * @return {boolean} Whether it is external or not\n\t\t */\n\t\tisExternal(href) {\n\t\t\t// Match any protocol\n\t\t\treturn href && href.match(/[a-z]+:\\/\\//i)\n\t\t},\n\t},\n}\n</script>\n\n<style scoped lang=\"scss\">\n@use '../../assets/NcAppNavigationItem.scss';\n</style>\n"],"names":["_sfc_main","_hoisted_3","_createElementBlock","_mergeProps","_createElementVNode","_openBlock","_createBlock","_normalizeClass","NcVNodes","_resolveDynamicComponent","_normalizeProps","_guardReactiveProps","_withCtx","_renderSlot","_createVNode","_toDisplayString","_createTextVNode"],"mappings":";;;;;;;;;;;;;;AAoBA,MAAKA,cAAU;AAAA,EACb,MAAM;AAAA,EACN,OAAO,CAAC,OAAO;AAAA,EACf,OAAO;AAAA,IACL,OAAO;AAAA,MACL,MAAM;AAAA;IAER,WAAW;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA;IAEX,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,EACF;AACF;;;AAxBY,MAAAC,eAAA,EAAA,GAAE,sJAAqJ;;;sBAXjKC,mBAeO,QAfPC,WAAc,KAAA,QAAM;AAAA,IACb,eAAa,OAAA,QAAK,OAAA;AAAA,IAClB,cAAY,OAAA;AAAA,IACb,OAAM;AAAA,IACN,MAAK;AAAA,IACJ,SAAK,OAAA,CAAA,MAAA,OAAA,CAAA,IAAA,YAAE,KAAA,MAAK,SAAU,MAAM;AAAA;kBACjCD,mBAQM,OAAA;AAAA,MARA,MAAM,OAAA;AAAA,MACP,OAAM;AAAA,MACL,OAAO,OAAA;AAAA,MACP,QAAQ,OAAA;AAAA,MACT,SAAQ;AAAA;MACXE,mBAEO,QAFPH,cAEO;AAAA,QADQ,OAAA,SAAbI,UAAA,GAAAH,mBAAuC,uCAAhB,OAAA,KAAK,GAAA,CAAA;;;;;;ACOpC,MAAKF,cAAU;AAAA,EACb,MAAM;AAAA,EACN,OAAO,CAAC,OAAO;AAAA,EACf,OAAO;AAAA,IACL,OAAO;AAAA,MACL,MAAM;AAAA;IAER,WAAW;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA;IAEX,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,EACF;AACF;;;AAxBY,MAAAC,eAAA,EAAA,GAAE,6JAA4J;;;sBAXxKC,mBAeO,QAfPC,WAAc,KAAA,QAAM;AAAA,IACb,eAAa,OAAA,QAAK,OAAA;AAAA,IAClB,cAAY,OAAA;AAAA,IACb,OAAM;AAAA,IACN,MAAK;AAAA,IACJ,SAAK,OAAA,CAAA,MAAA,OAAA,CAAA,IAAA,YAAE,KAAA,MAAK,SAAU,MAAM;AAAA;kBACjCD,mBAQM,OAAA;AAAA,MARA,MAAM,OAAA;AAAA,MACP,OAAM;AAAA,MACL,OAAO,OAAA;AAAA,MACP,QAAQ,OAAA;AAAA,MACT,SAAQ;AAAA;MACXE,mBAEO,QAFPH,cAEO;AAAA,QADQ,OAAA,SAAbI,UAAA,GAAAH,mBAAuC,uCAAhB,OAAA,KAAK,GAAA,CAAA;;;;;;;ACcpC,MAAKF,cAAU;AAAA,EACd,MAAM;AAAA,EAEN,YAAY;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA;EAGD,OAAO;AAAA,IACN,MAAM;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA;;EAIX,OAAO,CAAC,OAAO;AAAA,EAEf,UAAU;AAAA,IACT,cAAc;AACb,aAAO,KAAK,OAAO,EAAE,eAAe,IAAI,EAAE,WAAW;AAAA,IACtD;AAAA;EAGD,SAAS;AAAA,IACR,QAAQ,GAAG;AACV,WAAK,MAAM,SAAS,CAAC;AAAA,IACtB;AAAA;AAGF;;;;;sBAlDCM,YAWW,qBAAA;AAAA,IAXD,OAAKC,eAAA,CAAC,iBAAe,EAAA,uBACC,OAAA,KAAI,CAAA,CAAA;AAAA,IAClC,cAAY,SAAA;AAAA,IACb,SAAQ;AAAA,IACP,SAAO,SAAA;AAAA;IACG,cACV,MACc;AAAA,MADG,OAAA,qBAAjBD,YACc,sBAAA;AAAA;QAAZ,MAAM;AAAA,0BACRA,YACc,wBAAA;AAAA;QAAZ,MAAM;AAAA;;;;;;ACqaX,MAAK,YAAU;AAAA,EACd,MAAM;AAAA,EAEN,YAAY;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAAE;AAAAA,IACA;AAAA,IACA;AAAA;EAGD,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKN,QAAQ;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA;;;;IAMV,MAAM;AAAA,MACL,MAAM;AAAA,MACN,UAAU;AAAA;;;;IAMX,OAAO;AAAA,MACN,MAAM;AAAA,MACN,SAAS;AAAA;;;;IAMV,IAAI;AAAA,MACH,MAAM;AAAA,MACN,SAAS,MAAM,gBAAe;AAAA,MAC9B,WAAW,QAAM,GAAG,KAAI,MAAO;AAAA;;;;;IAOhC,MAAM;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA;;;;;IAOV,SAAS;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA;;;;;;IAQV,IAAI;AAAA,MACH,MAAM,CAAC,QAAQ,MAAM;AAAA,MACrB,SAAS;AAAA;;;;;IAOV,MAAM;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA;;;;;IAOV,eAAe;AAAA,MACd,MAAM;AAAA,MACN,SAAS;AAAA;;;;;IAOV,UAAU;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA;;;;IAMV,WAAW;AAAA,MACV,MAAM;AAAA,MACN,SAAS;AAAA;;;;IAMV,iBAAiB;AAAA,MAChB,MAAM;AAAA,MACN,SAAS;AAAA;;;;;;IAQV,QAAQ;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA;;;;IAMV,MAAM;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA;;;;IAMV,MAAM;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA;;;;IAMV,UAAU;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA;;;;IAMV,WAAW;AAAA,MACV,MAAM;AAAA,MACN,SAAS;AAAA;;;;IAMV,UAAU;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA;;;;IAMV,eAAe;AAAA,MACd,MAAM;AAAA,MACN,SAAS;AAAA;;;;IAMV,iBAAiB;AAAA,MAChB,MAAM;AAAA,MACN,SAAS;AAAA;;;;IAMV,qBAAqB;AAAA,MACpB,MAAM;AAAA,MACN,SAAS;AAAA;;;;IAMV,eAAe;AAAA,MACd,MAAM;AAAA,MACN,SAAS;AAAA;;EAIX,OAAO;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;EAGD,QAAQ;AACP,WAAO;AAAA,MACN,UAAU,YAAW;AAAA,IACtB;AAAA,EACD;AAAA,EAEA,OAAO;AACN,WAAO;AAAA,MACN,0BAA0B;AAAA,MAC1B,cAAc;AAAA,MACd,QAAQ,KAAK;AAAA;AAAA,MACb,eAAe;AAAA;AAAA;AAAA;AAAA,MAIf,oBAAoB;AAAA,MACpB,SAAS;AAAA,IACV;AAAA,EACD;AAAA,EAEA,UAAU;AAAA,IACT,eAAe;AACd,aAAO,KAAK,MAAM,CAAC,KAAK;AAAA,IACzB;AAAA;AAAA;AAAA,IAIA,kBAAkB;AACjB,UAAI,KAAK,QAAQ,SAAS,kBAAkB,qBAAqB;AAChE,eAAO;AAAA,MACR,OAAO;AACN,eAAO;AAAA,MACR;AAAA,IACD;AAAA,IAEA,sBAAsB;AACrB,aAAO,KAAK,YAAY,KAAK,YAAY,EAAE,WAAW;AAAA,IACvD;AAAA,IAEA,sBAAsB;AACrB,aAAO,EAAE,cAAc;AAAA,IACxB;AAAA;EAGD,OAAO;AAAA,IACN,KAAK,QAAQ;AACZ,WAAK,SAAS;AAAA,IACf;AAAA;EAGD,UAAU;AACT,SAAK,2BAA2B,SAAS,cAAc,cAAc,KAAK;AAAA,EAC3E;AAAA,EAEA,SAAS;AAAA;AAAA,IAER,aAAa,OAAO;AACnB,WAAK,MAAM,mBAAmB,KAAK;AACnC,WAAK,qBAAqB;AAAA,IAC3B;AAAA;AAAA,IAEA,iBAAiB;AAChB,WAAK,SAAS,CAAC,KAAK;AACpB,WAAK,MAAM,eAAe,KAAK,MAAM;AAAA,IACtC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IASA,QAAQ,OAAO,UAAU,gBAAgB;AAExC,WAAK,MAAM,SAAS,KAAK;AAEzB,UAAI,MAAM,WAAW,MAAM,UAAU,MAAM,WAAW,MAAM,UAAU;AACrE;AAAA,MACD;AAEA,UAAI,gBAAgB;AACnB,mBAAW,KAAK;AAChB,cAAM,eAAc;AAAA,MACrB;AAAA,IACD;AAAA;AAAA,IAGA,aAAa;AACZ,WAAK,eAAe,KAAK;AACzB,WAAK,gBAAgB;AACrB,WAAK,aAAa,KAAK;AACvB,WAAK,UAAU,MAAM;AACpB,aAAK,MAAM,aAAa,WAAU;AAAA,MACnC,CAAC;AAAA,IACF;AAAA,IACA,gBAAgB;AACf,WAAK,gBAAgB;AAAA,IACtB;AAAA,IACA,oBAAoB;AACnB,WAAK,MAAM,eAAe,KAAK,YAAY;AAC3C,WAAK,eAAe;AACpB,WAAK,gBAAgB;AAAA,IACtB;AAAA;AAAA,IAGA,aAAa;AACZ,WAAK,MAAM,MAAM;AAAA,IAClB;AAAA;AAAA;AAAA;AAAA,IAKA,cAAc;AACb,WAAK,UAAU;AAAA,IAChB;AAAA,IAEA,aAAa;AACZ,WAAK,UAAU;AAAA,IAChB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQA,UAAU,GAAG;AAEZ,UAAI,CAAC,KAAK,MAAM,SAAS;AACxB;AAAA,MACD;AACA,UAAI,KAAK,SAAS;AACjB,UAAE,eAAc;AAChB,aAAK,MAAM,QAAQ,MAAM,cAAc,IAAI,MAAK;AAChD,aAAK,UAAU;AAAA,MAChB,OAAO;AACN,aAAK,MAAM,QAAQ,MAAM,cAAc,IAAI,KAAI;AAAA,MAChD;AAAA,IACD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQA,WAAW,MAAM;AAEhB,aAAO,QAAQ,KAAK,MAAM,cAAc;AAAA,IACzC;AAAA;AAEF;;;;;EApc+B,OAAM;;;;EAWhB,OAAM;;AACjB,MAAA,aAAA,EAAA,OAAM,4CAA2C;;;EAUrD,OAAM;;;;EA8CqC,OAAM;;;;;;;;;;sBA7GtDN,mBAiHK,MAAA;AAAA,IAjHA,IAAI,OAAA;AAAA,IACP,OAAKK,eAAA,CAAA;AAAA,sCAAuC,MAAA;AAAA,sCAA2C,OAAA;AAAA,2CAAgD,OAAA,iBAAa,CAAA,CAAM,KAAA,OAAO;AAAA,OAK5J,8BAA8B,CAAA;AAAA;KACpCF,UAAA,GAAAC,YAoGYG,wBApGI,SAAA,eAAY,gBAAA,UAAA,GAAAC,eAAAC,mBAAA,EAAA,GAEd,SAAA,oCAAgC,OAAA,KAAE,CAAA,CAAA,GAAA;AAAA,MAC/C,SAAAC,QAAA,CAgGM,EAAA,MAlGU,gBAAgB,UAAU,eAAQ;AAAA,QAElDR,mBAgGM,OAAA;AAAA,UAhGA,OAAKG,eAAA,CAAA;AAAA,6CAA0C,MAAA;AAAA,6CAAqD,OAAA;AAAA,sBAAsB,YAAY,OAAA,MAAO,OAAA;AAAA,aAK5I,sBAAsB,CAAA;AAAA;WAElB,OAAA,qBAAVL,mBAgCI,KAAA;AAAA;YA/BH,OAAM;AAAA,YACL,gBAAc,OAAA,UAAW,YAAY,OAAA,cAAe;AAAA,YACpD,oBAAkB,OAAA;AAAA,YAClB,iBAAa,CAAA,CAAI,YAAO,UAAU,MAAA,OAAO,SAAQ,IAAK;AAAA,YACtD,MAAM,OAAA,QAAQ,kBAAc;AAAA,YAC5B,QAAQ,SAAA,WAAW,OAAA,IAAI,eAAe;AAAA,YACtC,OAAO,OAAA,SAAS,OAAA;AAAA,YAChB,+CAAM,SAAA,cAAA,SAAA,WAAA,GAAA,IAAA;AAAA,YACN,qBAAO,SAAA,QAAQ,QAAQ,UAAU,cAAc;AAAA,YAC/C,gDAAO,SAAA,eAAA,SAAA,YAAA,GAAA,IAAA;AAAA,YACP,yEAAmB,SAAA,aAAA,SAAA,UAAA,GAAA,IAAA,GAAS,CAAA,OAAA,CAAA,GAAA,CAAA,KAAA,CAAA;AAAA;YAI7BE,mBAKM,OAAA;AAAA,cALA,OAAKG,eAAA,CAAA,EAAA,CAAK,OAAA,IAAI,GAAG,OAAA,KAAI,GACpB,2BAA2B,CAAA;AAAA;cACZ,OAAA,wBAArBD,YAAgC,0BAAA,EAAA,KAAA,EAAA,CAAA,KAEhCO,WAAgE,KAAA,QAAA,QAAA;AAAA;gBAAtC,QAAQ,OAAA,UAAW,OAAA,MAAM;AAAA;;YAEpDT,mBAEO,QAAA;AAAA,cAFD,OAAKG,eAAA,CAAC,8BAA4B,EAAA,mBAA8B,MAAA,eAAa,CAAA;AAAA,+BAC/E,OAAA,IAAI,GAAA,CAAA;AAAA,YAEG,MAAA,iBAAXF,aAAAH,mBAOM,OAPN,YAOM;AAAA,cANLY,YAKgC,iCAAA;AAAA,gBALV,KAAI;AAAA,4BAChB,MAAA;AAAA,6EAAA,MAAA,eAAY;AAAA,gBACpB,aAAa,OAAA,oBAAe,KAAU,OAAA,kBAAkB,OAAA;AAAA,gBACxD,SAAU,YAAY,OAAA,MAAO,OAAA;AAAA,gBAC7B,UAAQ,SAAA;AAAA,gBACR,WAAS,SAAA;AAAA;;;UAKF,OAAA,QAAXT,aAAAH,mBAIM,OAJN,YAIM;AAAA,YAHLE,mBAEM,OAFN,YAEMW,gBADF,OAAA,IAAI,GAAA,CAAA;AAAA;aAKK,KAAA,OAAO,WAAO,CAAA,CAAM,KAAA,OAAO,WAAW,OAAA,YAAY,OAAA,SAAI,CAAM,MAAA,8BAA1Eb,mBA0CM,OAAA;AAAA;YAzCL,uBAAM,+BAA6B,EAAA,gDACsB,8BAAuB,MAAA,sBAAsB,OAAA,SAAQ,CAAA,CAAA;AAAA;YACjG,CAAA,CAAA,KAAA,OAAO,WAApBG,aAAAH,mBAIM,OAJN,YAIM;AAAA,cADLW,WAAuB,KAAA,QAAA,WAAA,CAAA,GAAA,QAAA,IAAA;AAAA;YAEL,CAAA,CAAA,KAAA,OAAO,WAAY,mBAAQ,CAAK,MAAA,iBAAkB,OAAA,qBAArEP,YAiCY,sBAAA;AAAA;cAhCX,KAAI;AAAA,cACH,QAAQ,OAAA;AAAA,cACT,OAAM;AAAA,cACN,WAAU;AAAA,cACT,sBAAoB,MAAA;AAAA,cACpB,WAAW,OAAA;AAAA,cACX,MAAM,OAAA;AAAA,cACN,cAAY,OAAA;AAAA,cACZ,gBAAc,OAAA;AAAA,cACd,SAAU,YAAY,OAAA,MAAO,OAAA,SAAM,YAAA;AAAA,cACnC,iBAAa,SAAA;AAAA;cACH,cAEV,MAAyB;AAAA,gBAAzBO,WAAyB,KAAA,QAAA,aAAA,CAAA,GAAA,QAAA,IAAA;AAAA;+BAE1B,MAOiB;AAAA,gBAPK,OAAA,aAAa,MAAA,8BAAnCP,YAOiB,2BAAA;AAAA;kBANf,cAAY,SAAA;AAAA,kBACZ,SAAO,SAAA;AAAA;kBACG,cACV,MAAqB;AAAA,oBAArBQ,YAAqB,mBAAA,EAAZ,MAAM,GAAE,CAAA;AAAA;mCACP,MACX;AAAA,oBADWE,gBAAA,sBACR,OAAA,SAAS,GAAA,CAAA;AAAA;;;gBAES,OAAA,qBAAtBV,YAMiB,2BAAA;AAAA;kBALf,cAAY,SAAA;AAAA,kBACZ,SAAO,SAAA;AAAA;kBACG,cACV,MAAmB;AAAA,oBAAnBQ,YAAmB,iBAAA,EAAZ,MAAM,GAAE,CAAA;AAAA;;;gBAIjBD,WAAuB,KAAA,QAAA,WAAA,CAAA,GAAA,QAAA,IAAA;AAAA;;;;UAGa,OAAA,iBAAa,CAAA,CAAM,KAAA,OAAO,wBAAhEP,YAA+H,2CAAA;AAAA;YAArD,MAAM,MAAA;AAAA,YAAS,uBAAoB,SAAA,gBAAc,CAAA,WAAA,MAAA,CAAA;AAAA;UAG3HO,WAAqB,KAAA,QAAA,SAAA,CAAA,GAAA,QAAA,IAAA;AAAA;;;;IAIb,SAAA,mBAAe,CAAA,CAAM,KAAA,OAAO,WAAtCR,aAAAH,mBAGK,MAHL,YAGK;AAAA,MADJW,WAAQ,KAAA,QAAA,WAAA,CAAA,GAAA,QAAA,IAAA;AAAA;;;;","x_google_ignoreList":[0,1]}

package/dist/chunks/NcAppNavigationNew-CjJgIwfl.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NcAppNavigationNew-CjJgIwfl.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\n\t\t\t:variant\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\n\t\t/**\n\t\t * The color variant to use.\n\t\t * @default 'primary'\n\t\t */\n\t\tvariant: {\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","_createTextVNode"],"mappings":";;;AA6CA,MAAK,YAAU;AAAA,EACd,YAAY;AAAA,IACX;AAAA;EAED,OAAO;AAAA,IACN,UAAU;AAAA,MACT,MAAM;AAAA,MACN,UAAU;AAAA,MACV,SAAS;AAAA;IAEV,UAAU;AAAA,MACT,MAAM;AAAA,MACN,UAAU;AAAA,MACV,SAAS;AAAA;IAEV,MAAM;AAAA,MACL,MAAM;AAAA,MACN,UAAU;AAAA;;;;;IAOX,SAAS;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA,MACT,UAAU,OAAO;AAChB,eAAO,CAAC,WAAW,aAAa,UAAU,EAAE,QAAQ,KAAK,MAAM;AAAA,MAChE;AAAA;;EAIF,OAAO,CAAC,OAAO;AAChB;AAlDM,MAAA,aAAA,EAAA,OAAM,qBAAoB;;;AAA/B,SAAAA,UAAA,GAAAC,mBAUM,OAVN,YAUM;AAAA,IATLC,YAQW,qBAAA;AAAA,MARA,IAAI,OAAA;AAAA,MACb,UAAA,OAAA;AAAA,MACA,SAAA,OAAA;AAAA,MACA,+CAAO,KAAA,MAAK,OAAA;AAAA;MACF,cACV,MAAoB;AAAA,QAApBC,WAAoB,KAAA,QAAA,QAAA,CAAA,GAAA,QAAA,IAAA;AAAA;uBACV,MACX;AAAA,QADWC,gBAAA,sBACR,OAAA,IAAI,GAAA,CAAA;AAAA;;;;;;"}

package/dist/chunks/NcAppNavigationNewItem-BCFq6zq8.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NcAppNavigationNewItem-BCFq6zq8.mjs","sources":["../../src/components/NcAppNavigationNewItem/NcAppNavigationNewItem.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### Usage\n\n#### New Item element\n```vue\n\t<template>\n\t\t<NcAppNavigationNewItem name=\"New Item\" @new-item=\"function(value){alert(value)}\">\n\t\t\t<template #icon>\n\t\t\t\t<Plus :size=\"20\" />\n\t\t\t</template>\n\t\t</NcAppNavigationNewItem>\n\t</template>\n\t<script>\n\timport Plus from 'vue-material-design-icons/Plus'\n\n\texport default {\n\t\tcomponents: {\n\t\t\tPlus,\n\t\t},\n\t}\n\t</script>\n```\n\n#### New Item element with a loading animation instead of the icon\n```vue\n\t<template>\n\t\t<NcAppNavigationNewItem name=\"New Item\" :loading=\"true\">\n\t\t\t<template #icon>\n\t\t\t\t<Plus :size=\"20\" />\n\t\t\t</template>\n\t\t</NcAppNavigationNewItem>\n\t</template>\n\t<script>\n\timport Plus from 'vue-material-design-icons/Plus'\n\n\texport default {\n\t\tcomponents: {\n\t\t\tPlus,\n\t\t},\n\t}\n\t</script>\n```\n</docs>\n<template>\n\t<li :class=\"{\n\t\t\t'app-navigation-entry--newItemActive': newItemActive,\n\t\t}\"\n\t\tclass=\"app-navigation-entry\">\n\t\t<!-- New Item -->\n\t\t<button class=\"app-navigation-entry-button\" @click=\"handleNewItem\">\n\t\t\t<span :class=\"{ [icon]: !loading }\"\n\t\t\t\tclass=\"app-navigation-entry-icon\">\n\t\t\t\t<NcLoadingIcon v-if=\"loading\" />\n\t\t\t\t<slot v-else name=\"icon\" />\n\t\t\t</span>\n\n\t\t\t<span v-if=\"!newItemActive\" class=\"app-navigation-new-item__name\" :title=\"name\">\n\t\t\t\t{{ name }}\n\t\t\t</span>\n\n\t\t\t<!-- new Item input -->\n\t\t\t<span v-if=\"newItemActive\" class=\"newItemContainer\">\n\t\t\t\t<NcInputConfirmCancel ref=\"newItemInput\"\n\t\t\t\t\tv-model=\"newItemValue\"\n\t\t\t\t\t:placeholder=\"editPlaceholder !== '' ? editPlaceholder : name\"\n\t\t\t\t\t@cancel=\"cancelNewItem\"\n\t\t\t\t\t@confirm=\"handleNewItemDone\" />\n\t\t\t</span>\n\t\t</button>\n\t</li>\n</template>\n\n<script>\nimport NcInputConfirmCancel from '../NcAppNavigationItem/NcInputConfirmCancel.vue'\nimport NcLoadingIcon from '../NcLoadingIcon/index.ts'\n\nexport default {\n\tname: 'NcAppNavigationNewItem',\n\n\tcomponents: {\n\t\tNcInputConfirmCancel,\n\t\tNcLoadingIcon,\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * The name of the element.\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 * Refers to the icon on the left, this prop accepts a class\n\t\t * like 'icon-category-enabled'.\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 * Displays a loading animated icon on the left of the element\n\t\t * instead of the icon.\n\t\t */\n\t\tloading: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * Only for 'editable' items, sets label for the edit action button.\n\t\t */\n\t\teditLabel: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\t\t/**\n\t\t * Sets the placeholder text for the editing form.\n\t\t */\n\t\teditPlaceholder: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\t},\n\n\temits: ['newItem'],\n\n\tdata() {\n\t\treturn {\n\t\t\tnewItemValue: '',\n\t\t\tnewItemActive: false,\n\t\t}\n\t},\n\n\tmethods: {\n\t\thandleNewItem() {\n\t\t\tif (!this.loading) {\n\t\t\t\tthis.newItemActive = true\n\t\t\t\tthis.$nextTick(() => {\n\t\t\t\t\tthis.$refs.newItemInput.focusInput()\n\t\t\t\t})\n\t\t\t}\n\t\t},\n\t\tcancelNewItem() {\n\t\t\tthis.newItemActive = false\n\t\t},\n\t\thandleNewItemDone() {\n\t\t\tthis.$emit('newItem', this.newItemValue)\n\t\t\tthis.newItemValue = ''\n\t\t\tthis.newItemActive = false\n\t\t},\n\t},\n}\n</script>\n\n<style scoped lang=\"scss\">\n@use '../../assets/NcAppNavigationItem.scss';\n\n.app-navigation-new-item__name {\n\toverflow: hidden;\n\tmax-width: 100%;\n\twhite-space: nowrap;\n\ttext-overflow: ellipsis;\n\tpadding-inline-start: 7px;\n\tfont-size: 14px;\n}\n\n.newItemContainer {\n\twidth: calc(100% - var(--default-clickable-area));\n\tmargin: auto;\n}\n</style>\n"],"names":["_createElementBlock","_normalizeClass","_createElementVNode","_createBlock","_renderSlot","_openBlock","_createVNode"],"mappings":";;;;AAiFA,MAAK,YAAU;AAAA,EACd,MAAM;AAAA,EAEN,YAAY;AAAA,IACX;AAAA,IACA;AAAA;EAGD,OAAO;AAAA;AAAA;AAAA;AAAA,IAIN,MAAM;AAAA,MACL,MAAM;AAAA,MACN,UAAU;AAAA;;;;;IAMX,MAAM;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA;;;;;IAOV,SAAS;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA;;;;IAKV,WAAW;AAAA,MACV,MAAM;AAAA,MACN,SAAS;AAAA;;;;IAKV,iBAAiB;AAAA,MAChB,MAAM;AAAA,MACN,SAAS;AAAA;;EAIX,OAAO,CAAC,SAAS;AAAA,EAEjB,OAAO;AACN,WAAO;AAAA,MACN,cAAc;AAAA,MACd,eAAe;AAAA,IAChB;AAAA,EACD;AAAA,EAEA,SAAS;AAAA,IACR,gBAAgB;AACf,UAAI,CAAC,KAAK,SAAS;AAClB,aAAK,gBAAgB;AACrB,aAAK,UAAU,MAAM;AACpB,eAAK,MAAM,aAAa,WAAU;AAAA,QACnC,CAAC;AAAA,MACF;AAAA,IACD;AAAA,IACA,gBAAgB;AACf,WAAK,gBAAgB;AAAA,IACtB;AAAA,IACA,oBAAoB;AACnB,WAAK,MAAM,WAAW,KAAK,YAAY;AACvC,WAAK,eAAe;AACpB,WAAK,gBAAgB;AAAA,IACtB;AAAA;AAEF;;;;EA3F8B,OAAM;;;;;sBAjBnCA,mBAyBK,MAAA;AAAA,IAzBA,OAAKC,eAAA,CAAA;AAAA,6CAA8C,MAAA;AAAA,OAGjD,sBAAsB,CAAA;AAAA;IAE5BC,mBAmBS,UAAA;AAAA,MAnBD,OAAM;AAAA,MAA+B,gDAAO,SAAA,iBAAA,SAAA,cAAA,GAAA,IAAA;AAAA;MACnDA,mBAIO,QAAA;AAAA,QAJA,OAAKD,eAAA,CAAA,EAAA,CAAK,OAAA,IAAI,GAAA,CAAI,OAAA,QAAO,GACzB,2BAA2B,CAAA;AAAA;QACZ,OAAA,wBAArBE,YAAgC,0BAAA,EAAA,KAAA,EAAA,CAAA,KAChCC,WAA2B,KAAA,QAAA,QAAA,EAAA,KAAA,EAAA,GAAA,QAAA,IAAA;AAAA;OAGf,MAAA,8BAAbJ,mBAEO,QAAA;AAAA;QAFqB,OAAM;AAAA,QAAiC,OAAO,OAAA;AAAA,yBACtE,OAAA,IAAI,GAAA,GAAA,UAAA;MAII,MAAA,iBAAZK,aAAAL,mBAMO,QANP,YAMO;AAAA,QALNM,YAIgC,iCAAA;AAAA,UAJV,KAAI;AAAA,sBAChB,MAAA;AAAA,uEAAA,MAAA,eAAY;AAAA,UACpB,aAAa,OAAA,oBAAe,KAAU,OAAA,kBAAkB,OAAA;AAAA,UACxD,UAAQ,SAAA;AAAA,UACR,WAAS,SAAA;AAAA;;;;;;"}

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

@@ -1 +0,0 @@
-{"version":3,"file":"NcAppNavigationSearch-Bnr0rygy.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\" variant=\"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=\"actions-container-key\"\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.ts'\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('actions-container-key')\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</style>\n"],"names":["_useModel","_createElementBlock","_createVNode","_unref","_renderSlot"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsLA,UAAM,QAAQA,SAAmB,SAAA,YAAgB;AACjD,UAAM,QAAQ,SAAA;AAEd,UAAM,eAAe,IAAA;AACrB,UAAM,EAAE,SAAS,kBAAkB,eAAe,YAAY;AAG9D,UAAM,oBAAoB,OAAO,SAAS,OAAO,iBAAiB,OAAO,SAAS,IAAI,EAAE,iBAAiB,mBAAmB,CAAC,KAAK;AAElI,UAAM,mBAAmB,eAAe,uBAAuB;AAC/D,UAAM,aAAa,MAAM,CAAC,CAAC,MAAM,UAAU,CAAA,CAAE;AAC7C,UAAM,cAAc,IAAI,IAAI;AAC5B,UAAM,YAAY,IAAA;AAElB,UAAM,cAAc,IAAI,KAAK;AAC7B,UAAM,eAAe,MAAM;AAC1B,kBAAY,QAAQ,CAAC,cAAc;AACnC,aAAO,aAAa,UAAU,KAAK;AACnC,UAAI,YAAY,OAAO;AACtB,oBAAY,QAAQ;AAAA,MACrB,OAAO;AAEN,eAAO,WAAW,MAAM;AACvB,sBAAY,QAAQ,CAAC,YAAY;AAAA,QAClC,GAAG,iBAAiB;AAAA,MACrB;AAAA,IACD,CAAC;AAKD,aAAS,gBAAgB;AACxB,YAAM,QAAQ;AACd,UAAI,cAAc;AACjB,oBAAY,QAAQ;AACpB,iBAAS,MAAM,iBAAiB,OAAO,cAAc,QAAQ,GAAG,OAAO;AAAA,MACxE;AAAA,IACD;;0BAjGCC,mBA2BM,OAAA;AAAA,QA3BD,uBAAM,yBAAuB;AAAA,gDACkB,WAAA;AAAA,QAAU;;QAG7DC,YAae,cAAA;AAAA,mBAbG;AAAA,UAAJ,KAAI;AAAA,sBACR,MAAA;AAAA,uEAAA,MAAK,QAAA;AAAA,UACb,cAAY,QAAA;AAAA,UACb,OAAM;AAAA,UACN,iBAAA;AAAA,UACC,aAAa,QAAA,eAAe,QAAA;AAAA,UAC7B,wBAAA;AAAA,UACC,yBAAuBC,MAAA,CAAA,EAAC,cAAA;AAAA,UACzB,MAAK;AAAA,UACJ,uBAAuB;AAAA,QAAA;UACb,gCACV,MAAwB;AAAA,YAAxBD,YAAwB,WAAA,EAAZ,MAAM,IAAE;AAAA,UAAA;;;QAGX,6BAAXD,mBAQM,OAAA;AAAA;UAPL,KAAI;AAAA,UACJ,uBAAM,kCAAgC;AAAA,uDACmB,YAAA;AAAA,+BAAoC,YAAA;AAAA,UAAA;;UAI7FG,WAAuB,KAAA,QAAA,WAAA,CAAA,GAAA,QAAA,IAAA;AAAA,QAAA;;;;;;"}

package/dist/chunks/NcAppNavigationSettings-CM0_QsTH.mjs

@@ -1,138 +0,0 @@
-import '../assets/NcAppNavigationSettings-B0I7HR1V.css';
-import { createElementBlock, openBlock, mergeProps, createElementVNode, createCommentVNode, toDisplayString, defineComponent, ref, useTemplateRef, computed, normalizeClass, createVNode, unref, withCtx, createTextVNode, Transition, withDirectives, renderSlot, vShow } from "vue";
-import { onClickOutside } from "@vueuse/core";
-import { c as createElementId } from "./createElementId-DhjFt1I9.mjs";
-import { r as register, a as t } from "./_l10n-ZllQPIu_.mjs";
-import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
-import { N as NcButton } from "./NcButton-BMnvzy1A.mjs";
-register();
-const _sfc_main$1 = {
-  name: "CogOutlineIcon",
-  emits: ["click"],
-  props: {
-    title: {
-      type: String
-    },
-    fillColor: {
-      type: String,
-      default: "currentColor"
-    },
-    size: {
-      type: Number,
-      default: 24
-    }
-  }
-};
-const _hoisted_1$1 = ["aria-hidden", "aria-label"];
-const _hoisted_2 = ["fill", "width", "height"];
-const _hoisted_3 = { d: "M12,8A4,4 0 0,1 16,12A4,4 0 0,1 12,16A4,4 0 0,1 8,12A4,4 0 0,1 12,8M12,10A2,2 0 0,0 10,12A2,2 0 0,0 12,14A2,2 0 0,0 14,12A2,2 0 0,0 12,10M10,22C9.75,22 9.54,21.82 9.5,21.58L9.13,18.93C8.5,18.68 7.96,18.34 7.44,17.94L4.95,18.95C4.73,19.03 4.46,18.95 4.34,18.73L2.34,15.27C2.21,15.05 2.27,14.78 2.46,14.63L4.57,12.97L4.5,12L4.57,11L2.46,9.37C2.27,9.22 2.21,8.95 2.34,8.73L4.34,5.27C4.46,5.05 4.73,4.96 4.95,5.05L7.44,6.05C7.96,5.66 8.5,5.32 9.13,5.07L9.5,2.42C9.54,2.18 9.75,2 10,2H14C14.25,2 14.46,2.18 14.5,2.42L14.87,5.07C15.5,5.32 16.04,5.66 16.56,6.05L19.05,5.05C19.27,4.96 19.54,5.05 19.66,5.27L21.66,8.73C21.79,8.95 21.73,9.22 21.54,9.37L19.43,11L19.5,12L19.43,13L21.54,14.63C21.73,14.78 21.79,15.05 21.66,15.27L19.66,18.73C19.54,18.95 19.27,19.04 19.05,18.95L16.56,17.95C16.04,18.34 15.5,18.68 14.87,18.93L14.5,21.58C14.46,21.82 14.25,22 14,22H10M11.25,4L10.88,6.61C9.68,6.86 8.62,7.5 7.85,8.39L5.44,7.35L4.69,8.65L6.8,10.2C6.4,11.37 6.4,12.64 6.8,13.8L4.68,15.36L5.43,16.66L7.86,15.62C8.63,16.5 9.68,17.14 10.87,17.38L11.24,20H12.76L13.13,17.39C14.32,17.14 15.37,16.5 16.14,15.62L18.57,16.66L19.32,15.36L17.2,13.81C17.6,12.64 17.6,11.37 17.2,10.2L19.31,8.65L18.56,7.35L16.15,8.39C15.38,7.5 14.32,6.86 13.12,6.62L12.75,4H11.25Z" };
-const _hoisted_4 = { key: 0 };
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("span", mergeProps(_ctx.$attrs, {
-    "aria-hidden": $props.title ? null : "true",
-    "aria-label": $props.title,
-    class: "material-design-icon cog-outline-icon",
-    role: "img",
-    onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("click", $event))
-  }), [
-    (openBlock(), createElementBlock("svg", {
-      fill: $props.fillColor,
-      class: "material-design-icon__svg",
-      width: $props.size,
-      height: $props.size,
-      viewBox: "0 0 24 24"
-    }, [
-      createElementVNode("path", _hoisted_3, [
-        $props.title ? (openBlock(), createElementBlock("title", _hoisted_4, toDisplayString($props.title), 1)) : createCommentVNode("", true)
-      ])
-    ], 8, _hoisted_2))
-  ], 16, _hoisted_1$1);
-}
-const IconCog = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render]]);
-const _hoisted_1 = ["id"];
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "NcAppNavigationSettings",
-  props: {
-    excludeClickOutsideSelectors: { default: () => [] },
-    name: { default: () => t("Settings") }
-  },
-  setup(__props) {
-    const contentId = createElementId();
-    const open = ref(false);
-    const container2 = useTemplateRef("wrapperElement");
-    const ignore = computed(
-      () => Array.isArray(__props.excludeClickOutsideSelectors) ? __props.excludeClickOutsideSelectors : __props.excludeClickOutsideSelectors.split(" ")
-    );
-    onClickOutside(container2, () => {
-      open.value = false;
-    }, { ignore });
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", {
-        ref: "wrapperElement",
-        class: normalizeClass(_ctx.$style.container)
-      }, [
-        createElementVNode("div", {
-          class: normalizeClass(_ctx.$style.header)
-        }, [
-          createVNode(NcButton, {
-            "aria-controls": unref(contentId),
-            "aria-expanded": open.value ? "true" : "false",
-            class: normalizeClass(_ctx.$style.button),
-            alignment: "start",
-            variant: "tertiary",
-            wide: "",
-            onClick: _cache[0] || (_cache[0] = ($event) => open.value = !open.value)
-          }, {
-            icon: withCtx(() => [
-              createVNode(IconCog, { size: 20 })
-            ]),
-            default: withCtx(() => [
-              createTextVNode(" " + toDisplayString(_ctx.name), 1)
-            ]),
-            _: 1
-          }, 8, ["aria-controls", "aria-expanded", "class"])
-        ], 2),
-        createVNode(Transition, {
-          "enter-active-class": _ctx.$style.animationActive,
-          "leave-active-class": _ctx.$style.animationActive,
-          "enter-from-class": _ctx.$style.animationStop,
-          "leave-to-class": _ctx.$style.animationStop
-        }, {
-          default: withCtx(() => [
-            withDirectives(createElementVNode("div", {
-              id: unref(contentId),
-              class: normalizeClass(_ctx.$style.content)
-            }, [
-              renderSlot(_ctx.$slots, "default")
-            ], 10, _hoisted_1), [
-              [vShow, open.value]
-            ])
-          ]),
-          _: 3
-        }, 8, ["enter-active-class", "leave-active-class", "enter-from-class", "leave-to-class"])
-      ], 2);
-    };
-  }
-});
-const container = "_container_svdcj_2";
-const header = "_header_svdcj_7";
-const button = "_button_svdcj_13";
-const content = "_content_svdcj_22";
-const animationActive = "_animationActive_svdcj_34";
-const animationStop = "_animationStop_svdcj_40";
-const style0 = {
-  container,
-  header,
-  button,
-  content,
-  animationActive,
-  animationStop
-};
-const cssModules = {
-  "$style": style0
-};
-const NcAppNavigationSettings = /* @__PURE__ */ _export_sfc(_sfc_main, [["__cssModules", cssModules]]);
-export {
-  NcAppNavigationSettings as N
-};
-//# sourceMappingURL=NcAppNavigationSettings-CM0_QsTH.mjs.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"NcAppNavigationSettings-CM0_QsTH.mjs","sources":["../../node_modules/vue-material-design-icons/CogOutline.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-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,8A4,4 0 0,1 16,12A4,4 0 0,1 12,16A4,4 0 0,1 8,12A4,4 0 0,1 12,8M12,10A2,2 0 0,0 10,12A2,2 0 0,0 12,14A2,2 0 0,0 14,12A2,2 0 0,0 12,10M10,22C9.75,22 9.54,21.82 9.5,21.58L9.13,18.93C8.5,18.68 7.96,18.34 7.44,17.94L4.95,18.95C4.73,19.03 4.46,18.95 4.34,18.73L2.34,15.27C2.21,15.05 2.27,14.78 2.46,14.63L4.57,12.97L4.5,12L4.57,11L2.46,9.37C2.27,9.22 2.21,8.95 2.34,8.73L4.34,5.27C4.46,5.05 4.73,4.96 4.95,5.05L7.44,6.05C7.96,5.66 8.5,5.32 9.13,5.07L9.5,2.42C9.54,2.18 9.75,2 10,2H14C14.25,2 14.46,2.18 14.5,2.42L14.87,5.07C15.5,5.32 16.04,5.66 16.56,6.05L19.05,5.05C19.27,4.96 19.54,5.05 19.66,5.27L21.66,8.73C21.79,8.95 21.73,9.22 21.54,9.37L19.43,11L19.5,12L19.43,13L21.54,14.63C21.73,14.78 21.79,15.05 21.66,15.27L19.66,18.73C19.54,18.95 19.27,19.04 19.05,18.95L16.56,17.95C16.04,18.34 15.5,18.68 14.87,18.93L14.5,21.58C14.46,21.82 14.25,22 14,22H10M11.25,4L10.88,6.61C9.68,6.86 8.62,7.5 7.85,8.39L5.44,7.35L4.69,8.65L6.8,10.2C6.4,11.37 6.4,12.64 6.8,13.8L4.68,15.36L5.43,16.66L7.86,15.62C8.63,16.5 9.68,17.14 10.87,17.38L11.24,20H12.76L13.13,17.39C14.32,17.14 15.37,16.5 16.14,15.62L18.57,16.66L19.32,15.36L17.2,13.81C17.6,12.64 17.6,11.37 17.2,10.2L19.31,8.65L18.56,7.35L16.15,8.39C15.38,7.5 14.32,6.86 13.12,6.62L12.75,4H11.25Z\">\n        <title v-if=\"title\">{{ title }}</title>\n      </path>\n    </svg>\n  </span>\n</template>\n\n<script>\nexport default {\n  name: \"CogOutlineIcon\",\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 { createElementId } from '../../utils/createElementId.js'\nimport { t } from '../../l10n.ts'\n\nimport IconCog from 'vue-material-design-icons/CogOutline.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 = createElementId()\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:class=\"$style.button\"\n\t\t\t\talignment=\"start\"\n\t\t\t\tvariant=\"tertiary\"\n\t\t\t\twide\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/* Overwrite the padding to match NcAppNavigationItem */\n.button {\n\tpadding-left: 0 !important;\n\tpadding-inline-end: calc((var(--default-clickable-area) - 16px) / 2) !important;\n\n\t:global(.button-vue__text) {\n\t\tfont-weight: normal;\n\t}\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","_createElementBlock","_mergeProps","_createElementVNode","_openBlock","container","_normalizeClass","$style","_createVNode","_unref","_createTextVNode","name","_Transition","_renderSlot"],"mappings":";;;;;;;AAoBA,MAAKA,cAAU;AAAA,EACb,MAAM;AAAA,EACN,OAAO,CAAC,OAAO;AAAA,EACf,OAAO;AAAA,IACL,OAAO;AAAA,MACL,MAAM;AAAA;IAER,WAAW;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA;IAEX,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,EACF;AACF;;;AAxBY,MAAA,aAAA,EAAA,GAAE,otCAAmtC;;;sBAX/tCC,mBAeO,QAfPC,WAAc,KAAA,QAAM;AAAA,IACb,eAAa,OAAA,QAAK,OAAA;AAAA,IAClB,cAAY,OAAA;AAAA,IACb,OAAM;AAAA,IACN,MAAK;AAAA,IACJ,SAAK,OAAA,CAAA,MAAA,OAAA,CAAA,IAAA,YAAE,KAAA,MAAK,SAAU,MAAM;AAAA;kBACjCD,mBAQM,OAAA;AAAA,MARA,MAAM,OAAA;AAAA,MACP,OAAM;AAAA,MACL,OAAO,OAAA;AAAA,MACP,QAAQ,OAAA;AAAA,MACT,SAAQ;AAAA;MACXE,mBAEO,QAFP,YAEO;AAAA,QADQ,OAAA,SAAbC,UAAA,GAAAH,mBAAuC,qCAAhB,OAAA,KAAK,GAAA,CAAA;;;;;;;;;;;;;;AC0BpC,UAAM,YAAY,gBAAA;AAIlB,UAAM,OAAO,IAAI,KAAK;AAGtB,UAAMI,aAAY,eAAe,gBAAgB;AACjD,UAAM,SAAS;AAAA,MAAS,MAAM,MAAM,QAAQ,QAAA,4BAA4B,IACrE,QAAA,+BACA,QAAA,6BAA6B,MAAM,GAAG;AAAA,IAAA;AAEzC,mBAAeA,YAAW,MAAM;AAAE,WAAK,QAAQ;AAAA,IAAM,GAAG,EAAE,QAAQ;;0BAIjEJ,mBAyBM,OAAA;AAAA,QAzBD,KAAI;AAAA,QAAkB,OAAKK,eAAEC,KAAAA,OAAO,SAAS;AAAA,MAAA;QACjDJ,mBAaM,OAAA;AAAA,UAbA,OAAKG,eAAEC,KAAAA,OAAO,MAAM;AAAA,QAAA;UACzBC,YAWW,UAAA;AAAA,YAXA,iBAAeC,MAAA,SAAA;AAAA,YACxB,iBAAe,KAAA,QAAI,SAAA;AAAA,YACnB,OAAKH,eAAEC,KAAAA,OAAO,MAAM;AAAA,YACrB,WAAU;AAAA,YACV,SAAQ;AAAA,YACR,MAAA;AAAA,YACC,SAAK,OAAA,CAAA,MAAA,OAAA,CAAA,IAAA,CAAA,WAAE,KAAA,QAAI,CAAI,KAAA;AAAA,UAAA;YACL,cACV,MAAsB;AAAA,cAAtBC,YAAsB,SAAA,EAAZ,MAAM,IAAE;AAAA,YAAA;6BACR,MACX;AAAA,cADWE,gBAAA,sBACRC,KAAAA,IAAI,GAAA,CAAA;AAAA,YAAA;;;;QAGTH,YASaI,YAAA;AAAA,UATA,sBAAoBL,KAAAA,OAAO;AAAA,UACtC,sBAAoBA,KAAAA,OAAO;AAAA,UAC3B,oBAAkBA,KAAAA,OAAO;AAAA,UACzB,kBAAgBA,KAAAA,OAAO;AAAA,QAAA;2BACxB,MAIM;AAAA,2BAJNJ,mBAIM,OAAA;AAAA,cAHJ,IAAIM,MAAA,SAAA;AAAA,cACJ,OAAKH,eAAEC,KAAAA,OAAO,OAAO;AAAA,YAAA;cACtBM,WAAQ,KAAA,QAAA,SAAA;AAAA,YAAA;sBAHI,KAAA,KAAI;AAAA,YAAA;;;;;;;;;;;;;;;;;;;;;;;;;;","x_google_ignoreList":[0]}

package/dist/chunks/NcAppSettingsDialog-DBI8-FZa.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NcAppSettingsDialog-DBI8-FZa.mjs","sources":["../../src/components/NcAppSettingsDialog/NcAppSettingsDialog.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2020 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\nJust nest the `AppSettingSections` component into `NcAppSettingsDialog`,\nproviding the section's name prop. You can put your settings within each\n`NcAppSettingsSection` component.\n\n```vue\n<template>\n\t<div>\n\t\t<NcButton @click=\"settingsOpen = true\">Show Settings</NcButton>\n\t\t<NcAppSettingsDialog v-model:open=\"settingsOpen\" :show-navigation=\"true\" name=\"Application settings\">\n\t\t\t<NcAppSettingsSection id=\"asci-name-1\" name=\"Example name 1\">\n\t\t\t\tSome example content\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-2\" name=\"Example name 2\">\n\t\t\t\tSome more content\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-3\" name=\"Example name 3\">\n\t\t\t\tSome example content\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-4\" name=\"Example name 4\">\n\t\t\t\tSome more content\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-5\" name=\"Example name 5\">\n\t\t\t\tSome example content\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-6\" name=\"Example name 6\">\n\t\t\t\tSome more content\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-7\" name=\"Example name 7\">\n\t\t\t\tSome example content\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-8\" name=\"Example name 8\">\n\t\t\t\tSome more content\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-9\" name=\"Example name 9\">\n\t\t\t\tSome more content\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-10\" name=\"Example name 10\">\n\t\t\t\tSome more content\n\t\t\t</NcAppSettingsSection>\n\t\t</NcAppSettingsDialog>\n\t</div>\n</template>\n\n<script>\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\tsettingsOpen: false,\n\t\t}\n\t},\n}\n</script>\n```\n\nYou can also add icons to the section navigation:\n\n```vue\n<template>\n\t<div>\n\t\t<NcButton @click=\"settingsOpen = true\">Show Settings</NcButton>\n\t\t<NcAppSettingsDialog v-model:open=\"settingsOpen\" :show-navigation=\"true\" name=\"Application settings\">\n\t\t\t<NcAppSettingsSection id=\"asci-name-1\" name=\"Instagram\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Instagram :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\t<p style=\"height: 100vh;\">\n\t\t\t\t\tInstagram setting\n\t\t\t\t</p>\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-2\" name=\"Mastodon\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Mastodon :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\t<p style=\"height: 100vh;\">\n\t\t\t\t\tMastodon setting\n\t\t\t\t</p>\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-3\" name=\"Twitch\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Twitch :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\t<p style=\"height: 100vh;\">\n\t\t\t\t\tTwitch setting\n\t\t\t\t</p>\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-4\" name=\"Twitter\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Twitter :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tTwitter setting\n\t\t\t</NcAppSettingsSection>\n\t\t</NcAppSettingsDialog>\n\t</div>\n</template>\n\n<script>\nimport Instagram from 'vue-material-design-icons/Instagram.vue'\nimport Mastodon from 'vue-material-design-icons/Mastodon.vue'\nimport Twitch from 'vue-material-design-icons/Twitch.vue'\nimport Twitter from 'vue-material-design-icons/Twitter.vue'\n\nexport default {\n\tcomponents: {\n\t\tInstagram,\n\t\tMastodon,\n\t\tTwitch,\n\t\tTwitter,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tsettingsOpen: false,\n\t\t}\n\t},\n}\n</script>\n```\n</docs>\n\n<template>\n\t<NcDialog v-if=\"open\"\n\t\t:navigation-aria-label=\"settingsNavigationAriaLabel\"\n\t\tv-bind=\"dialogProperties\"\n\t\t@update:open=\"handleCloseModal\">\n\t\t<template v-if=\"hasNavigation\" #navigation=\"{ isCollapsed }\">\n\t\t\t<ul v-if=\"!isCollapsed\"\n\t\t\t\tclass=\"navigation-list\">\n\t\t\t\t<li v-for=\"section in sections\" :key=\"section.id\">\n\t\t\t\t\t<a :aria-current=\"`${section.id === selectedSection}`\"\n\t\t\t\t\t\t:class=\"{\n\t\t\t\t\t\t\t'navigation-list__link': true,\n\t\t\t\t\t\t\t'navigation-list__link--active': section.id === selectedSection,\n\t\t\t\t\t\t\t'navigation-list__link--icon': hasNavigationIcons,\n\t\t\t\t\t\t}\"\n\t\t\t\t\t\t:href=\"`#settings-section_${section.id}`\"\n\t\t\t\t\t\ttabindex=\"0\"\n\t\t\t\t\t\t@click.prevent=\"handleSettingsNavigationClick(section.id)\"\n\t\t\t\t\t\t@keydown.enter=\"handleSettingsNavigationClick(section.id)\">\n\t\t\t\t\t\t<div v-if=\"hasNavigationIcons\" class=\"navigation-list__link-icon\">\n\t\t\t\t\t\t\t<NcVNodes v-if=\"section.icon\" :vnodes=\"section.icon\" />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<span class=\"navigation-list__link-text\">\n\t\t\t\t\t\t\t{{ section.name }}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</a>\n\t\t\t\t</li>\n\t\t\t</ul>\n\t\t</template>\n\t\t<div ref=\"settingsScroller\">\n\t\t\t<slot />\n\t\t</div>\n\t</NcDialog>\n</template>\n\n<script>\nimport debounce from 'debounce'\nimport { warn } from 'vue'\nimport { useIsMobile } from '../../composables/useIsMobile/index.ts'\nimport { t } from '../../l10n.ts'\n\nimport NcDialog from '../NcDialog/index.ts'\nimport NcVNodes from '../NcVNodes/index.ts'\n\nexport default {\n\n\tname: 'NcAppSettingsDialog',\n\n\tcomponents: {\n\t\tNcDialog,\n\t\tNcVNodes,\n\t},\n\n\tprovide() {\n\t\treturn {\n\t\t\tregisterSection: this.registerSection,\n\t\t\tunregisterSection: this.unregisterSection,\n\t\t}\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * Determines the open / closed state of the modal\n\t\t */\n\t\topen: {\n\t\t\ttype: Boolean,\n\t\t\trequired: true,\n\t\t},\n\t\t/**\n\t\t * Shows the navigation on desktop if true\n\t\t */\n\t\tshowNavigation: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Selector for the popover container\n\t\t */\n\t\tcontainer: {\n\t\t\ttype: String,\n\t\t\tdefault: 'body',\n\t\t},\n\n\t\t/**\n\t\t * Name of the settings\n\t\t */\n\t\tname: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * Additional elements to add to the focus trap\n\t\t */\n\t\tadditionalTrapElements: {\n\t\t\ttype: Array,\n\t\t\tdefault: () => [],\n\t\t},\n\n\t},\n\n\temits: ['update:open'],\n\n\tsetup() {\n\t\treturn {\n\t\t\tisMobile: useIsMobile(),\n\t\t}\n\t},\n\n\tdata() {\n\t\treturn {\n\t\t\tselectedSection: '',\n\t\t\tlinkClicked: false,\n\t\t\taddedScrollListener: false,\n\t\t\tscroller: null,\n\t\t\t/**\n\t\t\t * Currently registered settings sections\n\t\t\t * @type {{ id: string, name: string, icon?: import('vue').VNode[] }[]}\n\t\t\t */\n\t\t\tsections: [],\n\t\t}\n\t},\n\n\tcomputed: {\n\t\tdialogProperties() {\n\t\t\treturn {\n\t\t\t\tadditionalTrapElements: this.additionalTrapElements,\n\t\t\t\tcloseOnClickOutside: true,\n\t\t\t\tclass: 'app-settings',\n\t\t\t\tcontainer: this.container,\n\t\t\t\tcontentClasses: 'app-settings__content',\n\t\t\t\tsize: 'large',\n\t\t\t\tname: this.name,\n\t\t\t\tnavigationClasses: 'app-settings__navigation',\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Check if one or more navigation entries provide icons\n\t\t */\n\t\thasNavigationIcons() {\n\t\t\treturn this.sections.some(({ icon }) => !!icon)\n\t\t},\n\n\t\thasNavigation() {\n\t\t\tif (this.isMobile || !this.showNavigation) {\n\t\t\t\treturn false\n\t\t\t} else {\n\t\t\t\treturn true\n\t\t\t}\n\t\t},\n\n\t\tsettingsNavigationAriaLabel() {\n\t\t\treturn t('Settings navigation')\n\t\t},\n\t},\n\n\tupdated() {\n\t\t// Check that the scroller element has been mounted\n\t\tif (!this.$refs.settingsScroller) {\n\t\t\treturn\n\t\t}\n\t\t// Get the scroller element\n\t\tthis.scroller = this.$refs.settingsScroller\n\t\tif (!this.addedScrollListener) {\n\t\t\tthis.scroller.addEventListener('scroll', this.handleScroll)\n\t\t\tthis.addedScrollListener = true\n\t\t}\n\n\t},\n\n\tmethods: {\n\t\t/**\n\t\t * Called when a new section is registered\n\t\t * @param {string} id The section ID\n\t\t * @param {string} name The section name\n\t\t * @param {import('vue').VNode[]|undefined} icon Optional icon component\n\t\t */\n\t\tregisterSection(id, name, icon) {\n\t\t\t// Check for the uniqueness of section names\n\t\t\tif (this.sections.some(({ id: otherId }) => id === otherId)) {\n\t\t\t\tthrow new Error(`Duplicate section id found: ${id}. Settings navigation sections must have unique section ids.`)\n\t\t\t}\n\t\t\tif (this.sections.some(({ name: otherName }) => name === otherName)) {\n\t\t\t\twarn(`Duplicate section name found: ${name}. Settings navigation sections must have unique section names.`)\n\t\t\t}\n\n\t\t\tconst newSections = [...this.sections, { id, name, icon }]\n\t\t\t// Sort sections by order in slots\n\t\t\tthis.sections = newSections.sort(({ id: idA }, { id: idB }) => {\n\t\t\t\tconst indexOf = (id) => this.$slots.default?.().indexOf(vnode => vnode?.props?.id === id) ?? -1\n\t\t\t\treturn indexOf(idA) - indexOf(idB)\n\t\t\t})\n\n\t\t\t// If this is the first section registered, set it as selected\n\t\t\tif (this.sections.length === 1) {\n\t\t\t\tthis.selectedSection = id\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Called when a section is unregistered to remove it from dialog\n\t\t * @param {string} id The section ID\n\t\t */\n\t\tunregisterSection(id) {\n\t\t\tthis.sections = this.sections.filter(({ id: otherId }) => id !== otherId)\n\n\t\t\t// If the current section is unregistered, set the first section as selected\n\t\t\tif (this.selectedSection === id) {\n\t\t\t\tthis.selectedSection = this.sections[0]?.id ?? ''\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Scrolls the content to the selected settings section.absolute\n\t\t *\n\t\t * @param {string} item the ID of the section\n\t\t */\n\t\thandleSettingsNavigationClick(item) {\n\t\t\tthis.linkClicked = true\n\t\t\tdocument.getElementById('settings-section_' + item).scrollIntoView({\n\t\t\t\tbehavior: 'smooth',\n\t\t\t\tinline: 'nearest',\n\t\t\t})\n\t\t\tthis.selectedSection = item\n\t\t\tsetTimeout(() => {\n\t\t\t\tthis.linkClicked = false\n\t\t\t}, 1000)\n\t\t},\n\n\t\thandleCloseModal(isOpen) {\n\t\t\tif (isOpen) {\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\tthis.$emit('update:open', false)\n\t\t\t// Remove scroll listener each time the modal is closed\n\t\t\tthis.scroller.removeEventListener('scroll', this.handleScroll)\n\t\t\tthis.addedScrollListener = false\n\t\t\tthis.scroller.scrollTop = 0\n\t\t},\n\n\t\thandleScroll() {\n\t\t\tif (!this.linkClicked) {\n\t\t\t\tthis.unfocusNavigationItem()\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Remove selected section once the user starts scrolling\n\t\t *\n\t\t * @type {import('debounce').DebouncedFunction<() => void>}\n\t\t */\n\t\tunfocusNavigationItem: debounce(function() {\n\t\t\tthis.selectedSection = ''\n\t\t\tif (document.activeElement.className.includes('navigation-list__link')) {\n\t\t\t\tdocument.activeElement.blur()\n\t\t\t}\n\t\t}, 300),\n\t},\n}\n\n</script>\n\n<style lang=\"scss\" scoped>\n.app-settings {\n\t:deep &__navigation {\n\t\tmin-width: 200px;\n\t\tmargin-inline-end: calc(4 * var(--default-grid-baseline));\n\t\toverflow-x: hidden;\n\t\toverflow-y: auto;\n\t\tposition: relative;\n\t}\n\t:deep &__content {\n\t\tpadding-inline: calc(4 * var(--default-grid-baseline));\n\t}\n}\n\n.navigation-list {\n\theight: 100%;\n\toverflow-y: auto;\n\tpadding: calc(3 * var(--default-grid-baseline));\n\n\t&__link {\n\t\tdisplay: flex;\n\t\talign-content: center;\n\t\tfont-size: 16px;\n\t\theight: var(--default-clickable-area);\n\t\tmargin: 4px 0;\n\t\tline-height: var(--default-clickable-area);\n\t\tborder-radius: var(--border-radius-element);\n\t\tfont-weight: bold;\n\t\tpadding: 0 calc(4 * var(--default-grid-baseline));\n\t\tcursor: pointer;\n\t\twhite-space: nowrap;\n\t\ttext-overflow: ellipsis;\n\t\toverflow: hidden;\n\t\tbackground-color: transparent;\n\t\tborder: none;\n\n\t\t&:hover,\n\t\t&:focus {\n\t\t\tbackground-color: var(--color-background-hover);\n\t\t}\n\n\t\t&--active {\n\t\t\tbackground-color: var(--color-primary-element-light) !important;\n\t\t}\n\n\t\t&--icon {\n\t\t\tpadding-inline-start: calc(2 * var(--default-grid-baseline));\n\t\t\tgap: var(--default-grid-baseline);\n\t\t}\n\n\t\t&-icon {\n\t\t\tdisplay: flex;\n\t\t\tjustify-content: center;\n\t\t\talign-content: center;\n\t\t\twidth: calc(var(--default-clickable-area) - 2 * var(--default-grid-baseline));\n\t\t\tmax-width: calc(var(--default-clickable-area) - 2 * var(--default-grid-baseline));\n\t\t}\n\t}\n}\n\n@media only screen and (max-width: $breakpoint-small-mobile) {\n\t.app-settings {\n\t\t:deep .dialog__name {\n\t\t\tpadding-inline-start: 16px;\n\t\t}\n\t}\n}\n</style>\n"],"names":["NcVNodes","id","_openBlock","_createBlock","_mergeProps","_createSlots","_createElementVNode","_renderSlot","_withCtx","_createElementBlock","_Fragment","_renderList","_normalizeClass","_withModifiers","_withKeys","_toDisplayString"],"mappings":"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"}

package/dist/chunks/NcAppSettingsSection-CssmXyZ0.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NcAppSettingsSection-CssmXyZ0.mjs","sources":["../../src/components/NcAppSettingsSection/NcAppSettingsSection.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2020 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<template>\n\t<section :id=\"htmlId\" :aria-labelledby=\"`${htmlId}--label`\" class=\"app-settings-section\">\n\t\t<h3 :id=\"`${htmlId}--label`\" class=\"app-settings-section__name\">\n\t\t\t{{ name }}\n\t\t</h3>\n\t\t<slot />\n\t\t<!-- @slot Optonal icon to for the secion in the navigation -->\n\t\t<slot v-if=\"false\" name=\"icon\" />\n\t</section>\n</template>\n\n<script>\nexport default {\n\tname: 'NcAppSettingsSection',\n\tinject: ['registerSection', 'unregisterSection'],\n\n\tprops: {\n\t\tname: {\n\t\t\ttype: String,\n\t\t\trequired: true,\n\t\t},\n\n\t\tid: {\n\t\t\ttype: String,\n\t\t\trequired: true,\n\t\t\tvalidator(id) {\n\t\t\t\t// Only alphanumeric, dash and underscore\n\t\t\t\treturn /^[a-z0-9\\-_]+$/.test(id)\n\t\t\t},\n\t\t},\n\t},\n\tcomputed: {\n\t\t// generate an id for each settingssection based on the name without whitespaces\n\t\thtmlId() {\n\t\t\treturn 'settings-section_' + this.id\n\t\t},\n\t},\n\t// Reactive changes for section navigation\n\twatch: {\n\t\tid(newId, oldId) {\n\t\t\tthis.unregisterSection(oldId)\n\t\t\tthis.registerSection(newId, this.name, this.$slots?.icon?.())\n\t\t},\n\t\tname(newName) {\n\t\t\tthis.unregisterSection(this.id)\n\t\t\tthis.registerSection(this.id, newName, this.$slots?.icon?.())\n\t\t},\n\t},\n\tmounted() {\n\t\t// register section for navigation\n\t\tthis.registerSection(this.id, this.name, this.$slots?.icon?.())\n\t},\n\tbeforeUnmount() {\n\t\tthis.unregisterSection(this.id)\n\t},\n}\n\n</script>\n\n<style lang=\"scss\" scoped>\n.app-settings-section {\n\tmargin-bottom: 80px;\n\t&__name {\n\t\tfont-size: 1.6em;\n\t\tmargin: 0;\n\t\tpadding: 20px 0;\n\t\tfont-weight: bold;\n\t\toverflow: hidden;\n\t\twhite-space: nowrap;\n\t\ttext-overflow: ellipsis;\n\t}\n}\n</style>\n"],"names":["_createElementBlock","_createElementVNode","_renderSlot"],"mappings":";;AAiBA,MAAK,YAAU;AAAA,EACd,MAAM;AAAA,EACN,QAAQ,CAAC,mBAAmB,mBAAmB;AAAA,EAE/C,OAAO;AAAA,IACN,MAAM;AAAA,MACL,MAAM;AAAA,MACN,UAAU;AAAA;IAGX,IAAI;AAAA,MACH,MAAM;AAAA,MACN,UAAU;AAAA,MACV,UAAU,IAAI;AAEb,eAAO,iBAAiB,KAAK,EAAE;AAAA,MAChC;AAAA;;EAGF,UAAU;AAAA;AAAA,IAET,SAAS;AACR,aAAO,sBAAsB,KAAK;AAAA,IACnC;AAAA;;EAGD,OAAO;AAAA,IACN,GAAG,OAAO,OAAO;AAChB,WAAK,kBAAkB,KAAK;AAC5B,WAAK,gBAAgB,OAAO,KAAK,MAAM,KAAK,QAAQ,OAAI,CAAI;AAAA,IAC7D;AAAA,IACA,KAAK,SAAS;AACb,WAAK,kBAAkB,KAAK,EAAE;AAC9B,WAAK,gBAAgB,KAAK,IAAI,SAAS,KAAK,QAAQ,OAAI,CAAI;AAAA,IAC7D;AAAA;EAED,UAAU;AAET,SAAK,gBAAgB,KAAK,IAAI,KAAK,MAAM,KAAK,QAAQ,OAAI,CAAI;AAAA,EAC/D;AAAA,EACA,gBAAgB;AACf,SAAK,kBAAkB,KAAK,EAAE;AAAA,EAC/B;AACD;;;;sBAtDCA,mBAOU,WAAA;AAAA,IAPA,IAAI,SAAA;AAAA,IAAS,sBAAoB,SAAA,MAAM;AAAA,IAAW,OAAM;AAAA;IACjEC,mBAEK,MAAA;AAAA,MAFA,OAAO,SAAA,MAAM;AAAA,MAAW,OAAM;AAAA,uBAC/B,OAAA,IAAI,GAAA,GAAA,UAAA;AAAA,IAERC,WAAQ,KAAA,QAAA,WAAA,CAAA,GAAA,QAAA,IAAA;AAAA;;;;"}

package/dist/chunks/NcAppSidebar-CyyFi0n6.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NcAppSidebar-CyyFi0n6.mjs","sources":["../../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/NcAppSidebarTabs.vue","../../src/components/NcAppSidebar/NcAppSidebar.vue"],"sourcesContent":["<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<!-- 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 NcCheckboxRadioSwitch from '../NcCheckboxRadioSwitch/index.js'\nimport NcVNodes from '../NcVNodes/index.ts'\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","<!--\n  - SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n### Exposed CSS Variables\n\n| Variable                | Description                                                                                                                               |\n|-------------------------|-------------------------------------------------------------------------------------------------------------------------------------------|\n| `--app-sidebar-padding` | The padding between the toggle button and the page border.                                                                                |\n| `--app-sidebar-offset`  | The minimal offset width required to be reserved for the toggle button. <br /> Automatically changes to 0 when there is no toggle button. |\n\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 variant=\"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 ref=\"toggle\"\n\t\t\t\t\t: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\tvariant=\"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<!-- @slot Alternative to the default header info: use for bare NcAppSidebar with tabs.\n\t\t\t\t\tNcAppSidebarHeader would be required to use for accessibility reasons.\n\t\t\t\t\tThis will be overridden by `empty` prop.\n\t\t\t\t-->\n\t\t\t\t<slot v-if=\"!empty\" name=\"info\">\n\t\t\t\t\t<!-- container for figure and description, allows easy switching to compact mode -->\n\t\t\t\t\t<div class=\"app-sidebar-header__info\">\n\t\t\t\t\t\t<!-- sidebar header illustration/figure -->\n\t\t\t\t\t\t<div v-if=\"(isSlotPopulated($slots.header?.()) || background)\"\n\t\t\t\t\t\t\t:class=\"{\n\t\t\t\t\t\t\t\t'app-sidebar-header__figure--with-action': hasFigureClickListener\n\t\t\t\t\t\t\t}\"\n\t\t\t\t\t\t\tclass=\"app-sidebar-header__figure\"\n\t\t\t\t\t\t\t:style=\"{\n\t\t\t\t\t\t\t\tbackgroundImage: `url(${background})`\n\t\t\t\t\t\t\t}\"\n\t\t\t\t\t\t\ttabindex=\"0\"\n\t\t\t\t\t\t\t@click=\"onFigureClick\"\n\t\t\t\t\t\t\t@keydown.enter=\"onFigureClick\">\n\t\t\t\t\t\t\t<slot class=\"app-sidebar-header__background\" name=\"header\" />\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t<!-- sidebar details -->\n\t\t\t\t\t\t<div :class=\"{\n\t\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\t'app-sidebar-header__desc--editable': nameEditable && !subname,\n\t\t\t\t\t\t\t\t'app-sidebar-header__desc--with-subname--editable': nameEditable && subname,\n\t\t\t\t\t\t\t\t'app-sidebar-header__desc--without-actions': !isSlotPopulated($slots['secondary-actions']?.()),\n\t\t\t\t\t\t\t}\"\n\t\t\t\t\t\t\tclass=\"app-sidebar-header__desc\">\n\t\t\t\t\t\t\t<!-- favourite icon -->\n\t\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\t<slot name=\"tertiary-actions\">\n\t\t\t\t\t\t\t\t\t<NcButton v-if=\"canStar\"\n\t\t\t\t\t\t\t\t\t\t:aria-label=\"favoriteTranslated\"\n\t\t\t\t\t\t\t\t\t\t:pressed=\"isStarred\"\n\t\t\t\t\t\t\t\t\t\tclass=\"app-sidebar-header__star\"\n\t\t\t\t\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\t\t\t\t\t@click.prevent=\"toggleStarred\">\n\t\t\t\t\t\t\t\t\t\t<template #icon>\n\t\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\t<IconStar v-else-if=\"isStarred\" :size=\"20\" />\n\t\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\t</template>\n\t\t\t\t\t\t\t\t\t</NcButton>\n\t\t\t\t\t\t\t\t</slot>\n\t\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t\t<!-- name -->\n\t\t\t\t\t\t\t<div class=\"app-sidebar-header__name-container\">\n\t\t\t\t\t\t\t\t<div class=\"app-sidebar-header__mainname-container\">\n\t\t\t\t\t\t\t\t\t<!-- main name -->\n\t\t\t\t\t\t\t\t\t<NcAppSidebarHeader v-show=\"!nameEditable\"\n\t\t\t\t\t\t\t\t\t\tclass=\"app-sidebar-header__mainname\"\n\t\t\t\t\t\t\t\t\t\t:name\n\t\t\t\t\t\t\t\t\t\t:linkify=\"linkifyName\"\n\t\t\t\t\t\t\t\t\t\t:title\n\t\t\t\t\t\t\t\t\t\t:tabindex=\"nameEditable ? 0 : -1\"\n\t\t\t\t\t\t\t\t\t\t@click.self=\"editName\" />\n\t\t\t\t\t\t\t\t\t<template v-if=\"nameEditable\">\n\t\t\t\t\t\t\t\t\t\t<form v-click-outside=\"() => onSubmitName()\"\n\t\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\t@submit.prevent=\"onSubmitName\">\n\t\t\t\t\t\t\t\t\t\t\t<input ref=\"nameInput\"\n\t\t\t\t\t\t\t\t\t\t\t\tv-focus\n\t\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\t\ttype=\"text\"\n\t\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\t:value=\"name\"\n\t\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\t@input=\"onNameInput\">\n\t\t\t\t\t\t\t\t\t\t\t<NcButton :aria-label=\"changeNameTranslated\"\n\t\t\t\t\t\t\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\t\t\t\t\t\t\tvariant=\"tertiary-no-background\">\n\t\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\t<IconArrowRight :size=\"20\" />\n\t\t\t\t\t\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t\t\t\t\t\t</NcButton>\n\t\t\t\t\t\t\t\t\t\t</form>\n\t\t\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t\t\t\t<!-- header main menu -->\n\t\t\t\t\t\t\t\t\t<NcActions v-if=\"isSlotPopulated($slots['secondary-actions']?.())\"\n\t\t\t\t\t\t\t\t\t\tclass=\"app-sidebar-header__menu\"\n\t\t\t\t\t\t\t\t\t\t:force-menu=\"forceMenu\">\n\t\t\t\t\t\t\t\t\t\t<slot name=\"secondary-actions\" />\n\t\t\t\t\t\t\t\t\t</NcActions>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t<!-- secondary name -->\n\t\t\t\t\t\t\t\t<p v-if=\"subname.trim() !== '' || $slots['subname']\"\n\t\t\t\t\t\t\t\t\t:title=\"subtitle || undefined\"\n\t\t\t\t\t\t\t\t\tclass=\"app-sidebar-header__subname\">\n\t\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\t<slot name=\"subname\">\n\t\t\t\t\t\t\t\t\t\t{{ subname }}\n\t\t\t\t\t\t\t\t\t</slot>\n\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</slot>\n\t\t\t\t<!-- a11y fallback for empty content -->\n\t\t\t\t<NcAppSidebarHeader v-else\n\t\t\t\t\tclass=\"app-sidebar-header__mainname--hidden\"\n\t\t\t\t\t:name\n\t\t\t\t\ttabindex=\"-1\" />\n\n\t\t\t\t<NcButton ref=\"closeButton\"\n\t\t\t\t\t:aria-label=\"closeTranslated\"\n\t\t\t\t\t:title=\"closeTranslated\"\n\t\t\t\t\tclass=\"app-sidebar__close\"\n\t\t\t\t\tvariant=\"tertiary\"\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 { vOnClickOutside as ClickOutside } from '@vueuse/components'\nimport { createFocusTrap } from 'focus-trap'\nimport { provide, ref, warn } from 'vue'\nimport { useIsSmallMobile } from '../../composables/useIsMobile/index.js'\nimport { createElementId } from '../../utils/createElementId.ts'\nimport { getTrapStack } from '../../utils/focusTrap.ts'\nimport { isSlotPopulated } from '../../utils/isSlotPopulated.ts'\nimport { t } from '../../l10n.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 NcAppSidebarTabs from './NcAppSidebarTabs.vue'\nimport NcActions from '../NcActions/index.js'\nimport NcButton from '../NcButton/index.ts'\nimport NcEmptyContent from '../NcEmptyContent/index.ts'\nimport NcLoadingIcon from '../NcLoadingIcon/index.ts'\nimport NcAppSidebarHeader from '../NcAppSidebarHeader/index.ts'\nimport Focus from '../../directives/Focus/index.ts'\n\nexport default {\n\tname: 'NcAppSidebar',\n\n\tcomponents: {\n\t\tNcActions,\n\t\tNcAppSidebarHeader,\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,\n\t\t/** @type {import('vue').ObjectDirective} */\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// 'figureClick', 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'submitName',\n\t\t'dismissEditing',\n\t],\n\n\tsetup() {\n\t\tconst headerRef = ref(null)\n\t\tprovide('NcAppSidebar:header:ref', headerRef)\n\n\t\treturn {\n\t\t\tuid: createElementId(),\n\t\t\tisMobile: useIsSmallMobile(),\n\t\t\theaderRef,\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.$el,\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('figureClick', 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\tif (!this.open && !this.noToggle) {\n\t\t\t\tthis.$refs.toggle.$el.focus()\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\ttry {\n\t\t\t\tthis.headerRef.focus()\n\t\t\t} catch {\n\t\t\t\twarn('NcAppSidebar should have focusable header for accessibility reasons. Use NcAppSidebarHeader component.')\n\t\t\t}\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('submitName', 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('dismissEditing')\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\nbody {\n\t/**\n\t * The padding between the toggle button and the page border\n\t */\n\t--app-sidebar-padding: calc(var(--default-grid-baseline, 4px) * 2);\n\t/**\n\t * The minimal offset width required to be reserved for the toggle button.\n\t * Automatically changes to 0 when there is no toggle button.\n\t */\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\nbody:has(.app-sidebar.slide-right-enter-active),\nbody:has(.app-sidebar.slide-right-leave-active) {\n\ttransition: --app-sidebar-offset var(--animation-quick);\n}\n\nbody: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-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/*\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\t--app-sidebar-padding: #{$app-navigation-padding};\n\twidth: var(--app-sidebar-width);\n\n\tz-index: 1500;\n\ttop: 0;\n\tinset-inline-end: 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-inline-start: 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// Variable for custom content to be aware of space taken by close button (from top-right corner)\n\t\t--app-sidebar-close-button-offset: calc(var(--default-clickable-area) + var(--app-sidebar-padding));\n\n\t\t> .app-sidebar__close {\n\t\t\tposition: absolute;\n\t\t\tz-index: 100;\n\t\t\ttop: var(--app-sidebar-padding);\n\t\t\tinset-inline-end: var(--app-sidebar-padding);\n\t\t\twidth: var(--default-clickable-area);\n\t\t\theight: var(--default-clickable-area);\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\t--figure-size: calc($desc-height + var(--app-sidebar-padding));\n\t\t\t\t\tz-index: 2;\n\t\t\t\t\twidth: var(--figure-size);\n\t\t\t\t\theight: var(--figure-size);\n\t\t\t\t\tmargin: calc(var(--app-sidebar-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-inline-start: 0;\n\t\t\t\t\tflex: 1 1 auto;\n\t\t\t\t\tmin-width: 0;\n\t\t\t\t\tpadding-inline-end: calc(var(--default-clickable-area) + var(--app-sidebar-close-button-offset));\n\t\t\t\t\tpadding-top: var(--app-sidebar-padding);\n\n\t\t\t\t\t&.app-sidebar-header__desc--without-actions {\n\t\t\t\t\t\tpadding-inline-end: var(--app-sidebar-close-button-offset);\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: calc(var(--app-sidebar-padding) / 2);\n\t\t\t\t\t\tinset-inline-start: 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: var(--app-sidebar-padding);\n\t\t\t\t\t\tinset-inline-end: var(--app-sidebar-close-button-offset); // 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: var(--app-sidebar-padding);\n\t\t\t\tinset-inline-end: var(--app-sidebar-close-button-offset);\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-inline-end: calc(var(--default-clickable-area) + var(--app-sidebar-close-button-offset));\n\n\t\t\t\t&.app-sidebar-header__desc--without-actions {\n\t\t\t\t\tpadding-inline-end: var(--app-sidebar-close-button-offset);\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-inline: var(--app-sidebar-padding);\n\t\t\tpadding-block: var(--app-sidebar-padding) calc(var(--app-sidebar-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-inline-start: 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-inline-start: 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// Hidden a11y fallback\n\t\t.app-sidebar-header__mainname--hidden {\n\t\t\tposition: absolute;\n\t\t\ttop: 0;\n\t\t\tinset-inline-start: 0;\n\t\t\tmargin: 0;\n\t\t\twidth: 1px;\n\t\t\theight: 1px;\n\t\t\toverflow: hidden;\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-inline-end;\n}\n\n.slide-right-enter-to,\n.slide-right-leave {\n\tmargin-inline-end: 0;\n}\n\n.slide-right-enter-from,\n.slide-right-leave-to {\n\tmargin-inline-end: calc(-1 * var(--app-sidebar-width));\n}\n</style>\n"],"names":["_sfc_main","_hoisted_3","_createElementBlock","_mergeProps","_createElementVNode","_openBlock","NcVNodes","_hoisted_1","_hoisted_2","_Fragment","_renderList","_createBlock","_createVNode","_normalizeClass","_toDisplayString","_renderSlot","NcAppSidebarHeader","Focus","ClickOutside","_Transition","_Teleport","_normalizeStyle"],"mappings":"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","x_google_ignoreList":[0,1,2]}

package/dist/chunks/NcAppSidebarTab-D1RmFRTu.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NcAppSidebarTab-D1RmFRTu.mjs","sources":["../../src/components/NcAppSidebarTab/NcAppSidebarTab.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\n<template>\n\t<section :id=\"`tab-${id}`\"\n\t\t:class=\"{'app-sidebar__tab--active': isActive}\"\n\t\t:aria-hidden=\"!isActive\"\n\t\t:aria-label=\"isTablistShown() ? undefined : name\"\n\t\t:aria-labelledby=\"isTablistShown() ? `tab-button-${id}` : undefined\"\n\t\tclass=\"app-sidebar__tab\"\n\t\t:tabindex=\"isTablistShown() ? 0 : -1\"\n\t\t:role=\"isTablistShown() ? 'tabpanel' : undefined\"\n\t\t@scroll=\"onScroll\">\n\t\t<h3 class=\"hidden-visually\">\n\t\t\t{{ name }}\n\t\t</h3>\n\t\t<!-- @slot Tab panel content -->\n\t\t<slot />\n\t</section>\n</template>\n\n<script>\nexport default {\n\tname: 'NcAppSidebarTab',\n\n\tinject: ['registerTab', 'unregisterTab', 'getActiveTab', 'isTablistShown'],\n\n\tprops: {\n\t\tid: {\n\t\t\ttype: String,\n\t\t\trequired: true,\n\t\t},\n\n\t\t/**\n\t\t * Tab name in navigation\n\t\t */\n\t\tname: {\n\t\t\ttype: String,\n\t\t\trequired: true,\n\t\t},\n\n\t\t/**\n\t\t * Tab icon's html class in navigation. Used if #icon slot is not provided\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 * Tab order in navigation. If not provided, name is used.\n\t\t */\n\t\torder: {\n\t\t\ttype: Number,\n\t\t\tdefault: 0,\n\t\t},\n\t},\n\n\temits: [\n\t\t'bottomReached',\n\t\t'scroll',\n\t],\n\n\texpose: ['id', 'name', 'icon', 'order', 'renderIcon'],\n\n\tcomputed: {\n\t\t/**\n\t\t * Is the current tab an active tab, that should be shown?\n\t\t *\n\t\t * @return {boolean}\n\t\t */\n\t\tisActive() {\n\t\t\treturn this.getActiveTab() === this.id\n\t\t},\n\t},\n\n\tcreated() {\n\t\t// As the tab is created - register it in the tabs component\n\t\t// It's better to provide computed tab object, not component instance as it easy\n\t\tthis.registerTab(this)\n\t},\n\n\tbeforeUnmount() {\n\t\t// Unregister the tab from tabs\n\t\tthis.unregisterTab(this.id)\n\t},\n\n\tmethods: {\n\t\tonScroll(event) {\n\t\t\t// Are we scrolled to the very bottom ?\n\t\t\tif (this.$el.scrollHeight - this.$el.scrollTop === this.$el.clientHeight) {\n\t\t\t\t/**\n\t\t\t\t * Bottom scroll is reached\n\t\t\t\t *\n\t\t\t\t * @property {Event} event Native scroll event\n\t\t\t\t */\n\t\t\t\tthis.$emit('bottomReached', event)\n\t\t\t}\n\t\t\t/**\n\t\t\t * @property {Event} event Native scroll event\n\t\t\t */\n\t\t\tthis.$emit('scroll', event)\n\t\t},\n\n\t\t/**\n\t\t * Render tab's icon slot if any\n\t\t *\n\t\t * @return {import('vue').VNode[]}\n\t\t */\n\t\trenderIcon() {\n\t\t\treturn this.$slots.icon?.()\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.app-sidebar__tab {\n\tdisplay: none;\n\tpadding: 10px;\n\tmin-height: 100%; // fill available height\n\tmax-height: 100%; // scroll inside\n\theight: 100%;\n\toverflow: auto;\n\n\t&:focus {\n\t\tborder-color: var(--color-primary-element);\n\t\tbox-shadow: 0 0 0.2em var(--color-primary-element);\n\t\toutline: 0;\n\t}\n\n\t&--active {\n\t\tdisplay: block;\n\t}\n}\n</style>\n"],"names":["_createElementBlock","_normalizeClass","_createElementVNode","_toDisplayString","_renderSlot"],"mappings":";;AA2BA,MAAK,YAAU;AAAA,EACd,MAAM;AAAA,EAEN,QAAQ,CAAC,eAAe,iBAAiB,gBAAgB,gBAAgB;AAAA,EAEzE,OAAO;AAAA,IACN,IAAI;AAAA,MACH,MAAM;AAAA,MACN,UAAU;AAAA;;;;IAMX,MAAM;AAAA,MACL,MAAM;AAAA,MACN,UAAU;AAAA;;;;IAMX,MAAM;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA;;;;IAMV,OAAO;AAAA,MACN,MAAM;AAAA,MACN,SAAS;AAAA;;EAIX,OAAO;AAAA,IACN;AAAA,IACA;AAAA;EAGD,QAAQ,CAAC,MAAM,QAAQ,QAAQ,SAAS,YAAY;AAAA,EAEpD,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMT,WAAW;AACV,aAAO,KAAK,aAAY,MAAO,KAAK;AAAA,IACrC;AAAA;EAGD,UAAU;AAGT,SAAK,YAAY,IAAI;AAAA,EACtB;AAAA,EAEA,gBAAgB;AAEf,SAAK,cAAc,KAAK,EAAE;AAAA,EAC3B;AAAA,EAEA,SAAS;AAAA,IACR,SAAS,OAAO;AAEf,UAAI,KAAK,IAAI,eAAe,KAAK,IAAI,cAAc,KAAK,IAAI,cAAc;AAMzE,aAAK,MAAM,iBAAiB,KAAK;AAAA,MAClC;AAIA,WAAK,MAAM,UAAU,KAAK;AAAA,IAC3B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,aAAa;AACZ,aAAO,KAAK,OAAO,OAAI;AAAA,IACxB;AAAA;AAEF;;AApGM,MAAA,aAAA,EAAA,OAAM,kBAAiB;;sBAT5BA,mBAcU,WAAA;AAAA,IAdA,WAAW,OAAA,EAAE;AAAA,IACrB,OAAKC,eAAA,CAAA,EAAA,4BAA+B,SAAA,SAAQ,GAIvC,kBAAkB,CAAA;AAAA,IAHvB,gBAAc,SAAA;AAAA,IACd,cAAY,SAAA,eAAc,IAAK,SAAY,OAAA;AAAA,IAC3C,mBAAiB,SAAA,mBAAc,cAAmB,OAAA,EAAE,KAAK;AAAA,IAEzD,UAAU,SAAA,eAAc,IAAA,IAAA;AAAA,IACxB,MAAM,SAAA,eAAc,IAAA,aAAkB;AAAA,IACtC,iDAAQ,SAAA,YAAA,SAAA,SAAA,GAAA,IAAA;AAAA;IACTC,mBAEK,MAFL,YAEKC,gBADD,OAAA,IAAI,GAAA,CAAA;AAAA,IAGRC,WAAQ,KAAA,QAAA,WAAA,CAAA,GAAA,QAAA,IAAA;AAAA;;;"}