@nextcloud/vue 8.6.0 → 9.0.0-alpha.1

package/dist/chunks/NcAppNavigationItem-NE1UdZkS.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"NcAppNavigationItem-NE1UdZkS.cjs","sources":["../../node_modules/vue-material-design-icons/ChevronUp.vue","../../src/components/NcAppNavigationItem/NcAppNavigationIconCollapsible.vue","../../node_modules/vue-material-design-icons/Pencil.vue","../../node_modules/vue-material-design-icons/Undo.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 chevron-up-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=\"M7.41,15.41L12,10.83L16.59,15.41L18,14L12,8L6,14L7.41,15.41Z\">\n        <title v-if=\"title\">{{ title }}</title>\n      </path>\n    </svg>\n  </span>\n</template>\n\n<script>\nexport default {\n  name: \"ChevronUpIcon\",\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 - @copyright Copyright (c) 2019 Marco Ambrosini <marcoambrosini@icloud.com>\n -\n - @author Marco Ambrosini <marcoambrosini@icloud.com>\n -\n - @license GNU AGPL version 3 or any later version\n -\n - This program is free software: you can redistribute it and/or modify\n - it under the terms of the GNU Affero General Public License as\n - published by the Free Software Foundation, either version 3 of the\n - License, or (at your option) any later version.\n -\n - This program is distributed in the hope that it will be useful,\n - but WITHOUT ANY WARRANTY; without even the implied warranty of\n - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n - GNU Affero General Public License for more details.\n -\n - You should have received a copy of the GNU Affero General Public License\n - along with this program. If not, see <http://www.gnu.org/licenses/>.\n -\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\ttype=\"tertiary\"\n\t\t:aria-label=\"labelButton\"\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.js'\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\tright: 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","<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 - @copyright Copyright (c) 2018 John Molakvoæ <skjnldsv@protonmail.com>\n -\n - @author John Molakvoæ <skjnldsv@protonmail.com>\n - @author Marco Ambrosini <marcoambrosini@icloud.com>\n - @author Jonas Sulzer <jonas@violoncello.ch>\n - @author Jonathan Treffler <mail@jonathan-treffler.de>\n -\n - @license GNU AGPL version 3 or any later version\n -\n - This program is free software: you can redistribute it and/or modify\n - it under the terms of the GNU Affero General Public License as\n - published by the Free Software Foundation, either version 3 of the\n - License, or (at your option) any later version.\n -\n - This program is distributed in the hope that it will be useful,\n - but WITHOUT ANY WARRANTY; without even the implied warranty of\n - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n - GNU Affero General Public License for more details.\n -\n - You should have received a copy of the GNU Affero General Public License\n - along with this program. If not, see <http://www.gnu.org/licenses/>.\n -\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'\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### 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'\n\timport Delete from 'vue-material-design-icons/Delete'\n\timport OpenInNew from 'vue-material-design-icons/OpenInNew'\n\timport Pencil from 'vue-material-design-icons/Pencil'\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>\n\t\t\t\t\t\t99+\n\t\t\t\t\t</NcCounterBubble>\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'\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>\n\t\t\t\t\t\t99+\n\t\t\t\t\t</NcCounterBubble>\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'\n\timport Delete from 'vue-material-design-icons/Delete'\n\timport OpenInNew from 'vue-material-design-icons/OpenInNew'\n\timport Pencil from 'vue-material-design-icons/Pencil'\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'\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 -->\n\t\t\t\t\t\t<slot v-else name=\"icon\" />\n\t\t\t\t\t</div>\n\t\t\t\t\t<span v-if=\"!editingActive\" class=\"app-navigation-entry__name\">\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:type=\"(isActive && to) || active ? 'primary' : null\"\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@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 NcActions from '../NcActions/index.js'\nimport NcActionButton from '../NcActionButton/index.js'\nimport NcLoadingIcon from '../NcLoadingIcon/index.js'\nimport NcVNodes from '../NcVNodes/index.js'\nimport NcAppNavigationIconCollapsible from './NcAppNavigationIconCollapsible.vue'\nimport { useIsMobile } from '../../composables/useIsMobile/index.js'\nimport NcInputConfirmCancel from './NcInputConfirmCancel.vue'\nimport { t } from '../../l10n.js'\nimport GenRandomId from '../../utils/GenRandomId.js'\n\nimport Pencil from 'vue-material-design-icons/Pencil.vue'\nimport Undo from 'vue-material-design-icons/Undo.vue'\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: () => 'app-navigation-item-' + GenRandomId(),\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\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\tactionsBoundariesElement() {\n\t\t\treturn document.querySelector('#content-vue') || undefined\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\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.menuButton.$el.focus()\n\t\t\t\tthis.focused = false\n\t\t\t} else {\n\t\t\t\tthis.$refs.actions.$refs.menuButton.$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@import '../../assets/NcAppNavigationItem';\n</style>\n"],"names":["_sfc_main$4","_hoisted_1$3","_hoisted_2$3","_hoisted_3$3","$props","vue","_sfc_main$3","NcButton","ChevronUp","e","$options","_sfc_main$2","_hoisted_1$2","_hoisted_2$2","_hoisted_3$2","_sfc_main$1","_hoisted_1$1","_hoisted_2$1","_hoisted_3$1","_sfc_main","NcActions","NcActionButton","NcAppNavigationIconCollapsible","NcInputConfirmCancel","Components_NcVNodes","Pencil","_l10n","newVal","state","event","navigate","routerLinkHref","href","_hoisted_1","_hoisted_2","_hoisted_6","isActive","_cache","args","$event","_component_NcLoadingIcon","_ctx","_hoisted_4","$data","_hoisted_5","_hoisted_7","_hoisted_8"],"mappings":"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","x_google_ignoreList":[0,2,3]}

package/dist/chunks/NcAppNavigationNew-6ZAJS_DY.mjs

@@ -0,0 +1,56 @@
+import "../assets/NcAppNavigationNew-PtSC3Wy5.css";
+import { N as r } from "./NcButton-YOXv3gFY.mjs";
+import { resolveComponent as a, openBlock as d, createElementBlock as s, createVNode as c, withCtx as n, renderSlot as l, createTextVNode as p, toDisplayString as u } from "vue";
+import { _ as f } from "./_plugin-vue_export-helper-hUChTQA_.mjs";
+const m = {
+  components: {
+    NcButton: r
+  },
+  props: {
+    buttonId: {
+      type: String,
+      required: !1,
+      default: ""
+    },
+    disabled: {
+      type: Boolean,
+      required: !1,
+      default: !1
+    },
+    text: {
+      type: String,
+      required: !0
+    },
+    type: {
+      type: String,
+      default: "primary",
+      validator(e) {
+        return ["primary", "secondary", "tertiary"].indexOf(e) !== -1;
+      }
+    }
+  },
+  emits: ["click"]
+}, y = { class: "app-navigation-new" };
+function _(e, o, t, N, b, v) {
+  const i = a("NcButton");
+  return d(), s("div", y, [
+    c(i, {
+      id: t.buttonId,
+      disabled: t.disabled,
+      type: t.type,
+      onClick: o[0] || (o[0] = (g) => e.$emit("click"))
+    }, {
+      icon: n(() => [
+        l(e.$slots, "icon", {}, void 0, !0)
+      ]),
+      default: n(() => [
+        p(" " + u(t.text), 1)
+      ]),
+      _: 3
+    }, 8, ["id", "disabled", "type"])
+  ]);
+}
+const q = /* @__PURE__ */ f(m, [["render", _], ["__scopeId", "data-v-44b06f7e"]]);
+export {
+  q as N
+};

package/dist/chunks/NcAppNavigationNew-6ZAJS_DY.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"NcAppNavigationNew-6ZAJS_DY.mjs","sources":["../../src/components/NcAppNavigationNew/NcAppNavigationNew.vue"],"sourcesContent":["<!--\n - @copyright Copyright (c) 2018 Christoph Wurst <christoph@winzerhof-wurst.at>\n -\n - @author Christoph Wurst <christoph@winzerhof-wurst.at>\n -\n - @license GNU AGPL version 3 or any later version\n -\n - This program is free software: you can redistribute it and/or modify\n - it under the terms of the GNU Affero General Public License as\n - published by the Free Software Foundation, either version 3 of the\n - License, or (at your option) any later version.\n -\n - This program is distributed in the hope that it will be useful,\n - but WITHOUT ANY WARRANTY; without even the implied warranty of\n - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n - GNU Affero General Public License for more details.\n -\n - You should have received a copy of the GNU Affero General Public License\n - along with this program. If not, see <http://www.gnu.org/licenses/>.\n -\n -->\n\n <docs>\n### Usage\n\n ```\n <template>\n\t<NcAppNavigationNew text=\"New Element\">\n\t\t<template #icon>\n\t\t\t<Plus :size=\"20\" />\n\t\t</template>\n\t</NcAppNavigationNew>\n </template>\n <script>\n import Plus from 'vue-material-design-icons/Plus'\n\n export default {\n\tcomponents: {\n\t\tPlus,\n\t},\n }\n </script>\n ```\n </docs>\n\n<template>\n\t<div class=\"app-navigation-new\">\n\t\t<NcButton :id=\"buttonId\"\n\t\t\t:disabled=\"disabled\"\n\t\t\t:type=\"type\"\n\t\t\t@click=\"$emit('click')\">\n\t\t\t<template #icon>\n\t\t\t\t<slot name=\"icon\" />\n\t\t\t</template>\n\t\t\t{{ text }}\n\t\t</NcButton>\n\t</div>\n</template>\n\n<script>\nimport NcButton from '../NcButton/index.ts'\n\nexport default {\n\tcomponents: {\n\t\tNcButton,\n\t},\n\tprops: {\n\t\tbuttonId: {\n\t\t\ttype: String,\n\t\t\trequired: false,\n\t\t\tdefault: '',\n\t\t},\n\t\tdisabled: {\n\t\t\ttype: Boolean,\n\t\t\trequired: false,\n\t\t\tdefault: false,\n\t\t},\n\t\ttext: {\n\t\t\ttype: String,\n\t\t\trequired: true,\n\t\t},\n\t\ttype: {\n\t\t\ttype: String,\n\t\t\tdefault: 'primary',\n\t\t\tvalidator(value) {\n\t\t\t\treturn ['primary', 'secondary', 'tertiary'].indexOf(value) !== -1\n\t\t\t},\n\t\t},\n\t},\n\n\temits: ['click'],\n}\n</script>\n\n<style lang=\"scss\" scoped>\n/* 'New' button */\n.app-navigation-new {\n\tdisplay: block;\n\tpadding: calc(var(--default-grid-baseline, 4px) * 2);\n\tbutton {\n\t\twidth: 100%;\n\t}\n}\n</style>\n"],"names":["_sfc_main","NcButton","value","_hoisted_1","openBlock","createElementBlock","$props","_cache","$event","_ctx","withCtx"],"mappings":";;;;AA8DA,MAAAA,IAAA;AAAA;IAEE,UAAAC;AAAA;EAED,OAAA;AAAA,IACC,UAAA;AAAA;MAEC,UAAA;AAAA;;IAGD,UAAA;AAAA;MAEC,UAAA;AAAA;;;;;;;;MASA,SAAA;AAAA,MACA,UAAAC,GAAA;;;;;EAMF,OAAA,CAAA,OAAA;AACD,GA7CMC,IAAA,EAAA,OAAA,qBAAA;;;AAAL,SAAAC,EAAA,GAAAC,EAAA,OAAAF,GAAA;AAAA;MACY,IAAAG,EAAA;AAAA,MACT,UAAAA,EAAA;AAAA,MACA,MAAAA,EAAA;AAAA,MACA,SAAAC,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAC,MAAAC,EAAA,MAAA,OAAA;AAAA;MACU,MAAAC,EAAA,MAAA;AAAA;;MAnDd,SAAAA,EAAA,MAAA;AAAA;;;;;;;"}

package/dist/chunks/NcAppNavigationNew-hmJL2IDR.cjs

@@ -0,0 +1,51 @@
+var N = require("../assets/NcAppNavigationNew-PtSC3Wy5.css");
+const r = require("./NcButton-7UKtzkX5.cjs"), e = require("vue"), a = require("./_plugin-vue_export-helper-xG2iG1wl.cjs"), d = {
+  components: {
+    NcButton: r.NcButton
+  },
+  props: {
+    buttonId: {
+      type: String,
+      required: !1,
+      default: ""
+    },
+    disabled: {
+      type: Boolean,
+      required: !1,
+      default: !1
+    },
+    text: {
+      type: String,
+      required: !0
+    },
+    type: {
+      type: String,
+      default: "primary",
+      validator(t) {
+        return ["primary", "secondary", "tertiary"].indexOf(t) !== -1;
+      }
+    }
+  },
+  emits: ["click"]
+}, c = { class: "app-navigation-new" };
+function s(t, i, n, l, p, f) {
+  const o = e.resolveComponent("NcButton");
+  return e.openBlock(), e.createElementBlock("div", c, [
+    e.createVNode(o, {
+      id: n.buttonId,
+      disabled: n.disabled,
+      type: n.type,
+      onClick: i[0] || (i[0] = (y) => t.$emit("click"))
+    }, {
+      icon: e.withCtx(() => [
+        e.renderSlot(t.$slots, "icon", {}, void 0, !0)
+      ]),
+      default: e.withCtx(() => [
+        e.createTextVNode(" " + e.toDisplayString(n.text), 1)
+      ]),
+      _: 3
+    }, 8, ["id", "disabled", "type"])
+  ]);
+}
+const u = /* @__PURE__ */ a._export_sfc(d, [["render", s], ["__scopeId", "data-v-44b06f7e"]]);
+exports.NcAppNavigationNew = u;

package/dist/chunks/NcAppNavigationNew-hmJL2IDR.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"NcAppNavigationNew-hmJL2IDR.cjs","sources":["../../src/components/NcAppNavigationNew/NcAppNavigationNew.vue"],"sourcesContent":["<!--\n - @copyright Copyright (c) 2018 Christoph Wurst <christoph@winzerhof-wurst.at>\n -\n - @author Christoph Wurst <christoph@winzerhof-wurst.at>\n -\n - @license GNU AGPL version 3 or any later version\n -\n - This program is free software: you can redistribute it and/or modify\n - it under the terms of the GNU Affero General Public License as\n - published by the Free Software Foundation, either version 3 of the\n - License, or (at your option) any later version.\n -\n - This program is distributed in the hope that it will be useful,\n - but WITHOUT ANY WARRANTY; without even the implied warranty of\n - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n - GNU Affero General Public License for more details.\n -\n - You should have received a copy of the GNU Affero General Public License\n - along with this program. If not, see <http://www.gnu.org/licenses/>.\n -\n -->\n\n <docs>\n### Usage\n\n ```\n <template>\n\t<NcAppNavigationNew text=\"New Element\">\n\t\t<template #icon>\n\t\t\t<Plus :size=\"20\" />\n\t\t</template>\n\t</NcAppNavigationNew>\n </template>\n <script>\n import Plus from 'vue-material-design-icons/Plus'\n\n export default {\n\tcomponents: {\n\t\tPlus,\n\t},\n }\n </script>\n ```\n </docs>\n\n<template>\n\t<div class=\"app-navigation-new\">\n\t\t<NcButton :id=\"buttonId\"\n\t\t\t:disabled=\"disabled\"\n\t\t\t:type=\"type\"\n\t\t\t@click=\"$emit('click')\">\n\t\t\t<template #icon>\n\t\t\t\t<slot name=\"icon\" />\n\t\t\t</template>\n\t\t\t{{ text }}\n\t\t</NcButton>\n\t</div>\n</template>\n\n<script>\nimport NcButton from '../NcButton/index.ts'\n\nexport default {\n\tcomponents: {\n\t\tNcButton,\n\t},\n\tprops: {\n\t\tbuttonId: {\n\t\t\ttype: String,\n\t\t\trequired: false,\n\t\t\tdefault: '',\n\t\t},\n\t\tdisabled: {\n\t\t\ttype: Boolean,\n\t\t\trequired: false,\n\t\t\tdefault: false,\n\t\t},\n\t\ttext: {\n\t\t\ttype: String,\n\t\t\trequired: true,\n\t\t},\n\t\ttype: {\n\t\t\ttype: String,\n\t\t\tdefault: 'primary',\n\t\t\tvalidator(value) {\n\t\t\t\treturn ['primary', 'secondary', 'tertiary'].indexOf(value) !== -1\n\t\t\t},\n\t\t},\n\t},\n\n\temits: ['click'],\n}\n</script>\n\n<style lang=\"scss\" scoped>\n/* 'New' button */\n.app-navigation-new {\n\tdisplay: block;\n\tpadding: calc(var(--default-grid-baseline, 4px) * 2);\n\tbutton {\n\t\twidth: 100%;\n\t}\n}\n</style>\n"],"names":["_sfc_main","NcButton","value","_hoisted_1","vue","$props","_cache","$event","_ctx"],"mappings":";2HA8DAA,IAAA;AAAA;IAEE,UAAAC,EAAA;AAAA;EAED,OAAA;AAAA,IACC,UAAA;AAAA;MAEC,UAAA;AAAA;;IAGD,UAAA;AAAA;MAEC,UAAA;AAAA;;;;;;;;MASA,SAAA;AAAA,MACA,UAAAC,GAAA;;;;;EAMF,OAAA,CAAA,OAAA;AACD,GA7CMC,IAAA,EAAA,OAAA,qBAAA;;;AAAL,SAAAC,EAAA,UAAA,GAAAA,EAAA,mBAAA,OAAAD,GAAA;AAAA;MACY,IAAAE,EAAA;AAAA,MACT,UAAAA,EAAA;AAAA,MACA,MAAAA,EAAA;AAAA,MACA,SAAAC,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAC,MAAAC,EAAA,MAAA,OAAA;AAAA;MACU,MAAAJ,EAAA,QAAA,MAAA;AAAA;;MAnDd,SAAAA,EAAA,QAAA,MAAA;AAAA;;;;;;;;"}

package/dist/chunks/NcAppNavigationNewItem-MjsbS_dO.cjs

@@ -0,0 +1,106 @@
+var g = require("../assets/NcAppNavigationNewItem-ue-H4LQY.css");
+const r = require("./NcInputConfirmCancel-DYlc289d.cjs"), s = require("./NcLoadingIcon-Fwid-wWE.cjs"), e = require("vue"), d = require("./_plugin-vue_export-helper-xG2iG1wl.cjs"), u = {
+  name: "NcAppNavigationNewItem",
+  components: {
+    NcInputConfirmCancel: r.NcInputConfirmCancel,
+    NcLoadingIcon: s.NcLoadingIcon
+  },
+  props: {
+    /**
+     * The name of the element.
+     */
+    name: {
+      type: String,
+      required: !0
+    },
+    /**
+     * Refers to the icon on the left, this prop accepts a class
+     * like 'icon-category-enabled'.
+     */
+    icon: {
+      type: String,
+      default: ""
+    },
+    /**
+     * Displays a loading animated icon on the left of the element
+     * instead of the icon.
+     */
+    loading: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * Only for 'editable' items, sets label for the edit action button.
+     */
+    editLabel: {
+      type: String,
+      default: ""
+    },
+    /**
+     * Sets the placeholder text for the editing form.
+     */
+    editPlaceholder: {
+      type: String,
+      default: ""
+    }
+  },
+  emits: ["new-item"],
+  data() {
+    return {
+      newItemValue: "",
+      newItemActive: !1
+    };
+  },
+  methods: {
+    handleNewItem() {
+      this.loading || (this.newItemActive = !0, this.$nextTick(() => {
+        this.$refs.newItemInput.focusInput();
+      }));
+    },
+    cancelNewItem() {
+      this.newItemActive = !1;
+    },
+    handleNewItemDone() {
+      this.$emit("new-item", this.newItemValue), this.newItemValue = "", this.newItemActive = !1;
+    }
+  }
+}, I = ["title"], p = {
+  key: 1,
+  class: "newItemContainer"
+};
+function N(c, o, n, f, t, a) {
+  const l = e.resolveComponent("NcLoadingIcon"), m = e.resolveComponent("NcInputConfirmCancel");
+  return e.openBlock(), e.createElementBlock("li", {
+    class: e.normalizeClass([{
+      "app-navigation-entry--newItemActive": t.newItemActive
+    }, "app-navigation-entry"])
+  }, [
+    e.createElementVNode("button", {
+      class: "app-navigation-entry-button",
+      onClick: o[1] || (o[1] = (...i) => a.handleNewItem && a.handleNewItem(...i))
+    }, [
+      e.createElementVNode("span", {
+        class: e.normalizeClass([{ [n.icon]: !n.loading }, "app-navigation-entry-icon"])
+      }, [
+        n.loading ? (e.openBlock(), e.createBlock(l, { key: 0 })) : e.renderSlot(c.$slots, "icon", { key: 1 }, void 0, !0)
+      ], 2),
+      t.newItemActive ? e.createCommentVNode("", !0) : (e.openBlock(), e.createElementBlock("span", {
+        key: 0,
+        class: "app-navigation-new-item__name",
+        title: n.name
+      }, e.toDisplayString(n.name), 9, I)),
+      t.newItemActive ? (e.openBlock(), e.createElementBlock("span", p, [
+        e.createVNode(m, {
+          ref: "newItemInput",
+          modelValue: t.newItemValue,
+          "onUpdate:modelValue": o[0] || (o[0] = (i) => t.newItemValue = i),
+          placeholder: n.editPlaceholder !== "" ? n.editPlaceholder : n.name,
+          onCancel: a.cancelNewItem,
+          onConfirm: a.handleNewItemDone
+        }, null, 8, ["modelValue", "placeholder", "onCancel", "onConfirm"])
+      ])) : e.createCommentVNode("", !0)
+    ])
+  ], 2);
+}
+const w = /* @__PURE__ */ d._export_sfc(u, [["render", N], ["__scopeId", "data-v-8950be04"]]);
+exports.NcAppNavigationNewItem = w;

package/dist/chunks/NcAppNavigationNewItem-MjsbS_dO.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"NcAppNavigationNewItem-MjsbS_dO.cjs","sources":["../../src/components/NcAppNavigationNewItem/NcAppNavigationNewItem.vue"],"sourcesContent":["<!--\n - @copyright Copyright (c) 2020 Jonathan Treffler <mail@jonathan-treffler.de>\n -\n - @author Jonathan Treffler <mail@jonathan-treffler.de>\n -\n - @license GNU AGPL version 3 or any later version\n -\n - This program is free software: you can redistribute it and/or modify\n - it under the terms of the GNU Affero General Public License as\n - published by the Free Software Foundation, either version 3 of the\n - License, or (at your option) any later version.\n -\n - This program is distributed in the hope that it will be useful,\n - but WITHOUT ANY WARRANTY; without even the implied warranty of\n - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n - GNU Affero General Public License for more details.\n -\n - You should have received a copy of the GNU Affero General Public License\n - along with this program. If not, see <http://www.gnu.org/licenses/>.\n -\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.js'\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: ['new-item'],\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('new-item', 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@import '../../assets/NcAppNavigationItem';\n\n.app-navigation-new-item__name {\n\toverflow: hidden;\n\tmax-width: 100%;\n\twhite-space: nowrap;\n\ttext-overflow: ellipsis;\n\tpadding-left: 7px;\n\tfont-size: 14px;\n}\n\n.newItemContainer {\n\twidth: calc(100% - #{$clickable-area});\n\tmargin: auto;\n}\n</style>\n"],"names":["_sfc_main","NcInputConfirmCancel","_hoisted_1","vue","_cache","args","$options","$props","_component_NcLoadingIcon","_ctx","_hoisted_2","$data","$event"],"mappings":";oLAkGAA,IAAA;AAAA;;IAIE,sBAAAC,EAAA;AAAA;;EAID,OAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;IAqBC,SAAA;AAAA;;;;;;;;;;;;;IAcA,iBAAA;AAAA;;;;EAMD,OAAA,CAAA,UAAA;AAAA,EAEA,OAAA;AACC,WAAA;AAAA,MACC,cAAA;AAAA,MACA,eAAA;AAAA,IACD;AAAA;EAGD,SAAA;AAAA,IACC,gBAAA;AACC,MAAA,KAAA,qCAEC,KAAA,UAAA,MAAA;AACC,aAAA,MAAA,aAAA,WAAA;AAAA;;IAIH,gBAAA;;;IAGA,oBAAA;AACC,WAAA,MAAA,YAAA,KAAA,YAAA,GACA,KAAA,eAAA;;;AAIH,GA9KAC,IAAA,CAAA,OAAA;;EAmF8B,OAAA;;;;;IAjBxB,OAAAC,EAAA,eAAA,CAAA;AAAA;;;;MAKI,OAAA;AAAA,MAAqC,SAAAC,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,IAAAC,MAAAC,EAAA,iBAAAA,EAAA,cAAA,GAAAD,CAAA;AAAA;;QACrC,OAAAF,EAAA,eAAA,CAAA,EAAA,CAAAI,EAAA,IAAA,GAAA,CAAAA,EAAA,QAAA,GAAA,2BAAA,CAAA;AAAA;qBAENJ,EAAA,UAAA,GAAAA,EAAA,YAAAK,GAAA,EAAA,KAAA,EAAA,CAAA,KACAL,EAAA,WAAAM,EAAA,QAAA,QAAA,EAAA,KAAA,EAAA,GAAA,QAAA,EAAA;AAAA;wBA3EJN,EAAA,mBAAA,IAAA,EAAA;;QA8E+B,OAAA;AAAA,QAAuC,OAAAI,EAAA;AAAA,MAC/D,GAAAJ,EAAA,gBAAAI,EAAA,IAAA,GAAA,GAAAL,CAAA;AAAA,yBAIJC,EAAA,UAAA,GAAAA,EAAA,mBAAA,QAAAO,GAAA;AAAA;UACuB,KAAA;AAAA,UApF1B,YAAAC,EAAA;AAAA,UAAA,uBAAAP,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAQ,MAAAD,EAAA,eAAAC;AAAA,UAsFM,aAAAL,EAAA,oBAAA,KAAAA,EAAA,kBAAAA,EAAA;AAAA,UACA,UAAAD,EAAA;AAAA,UACA,WAAAA,EAAA;AAAA;YAxFNH,EAAA,mBAAA,IAAA,EAAA;AAAA;;;;;"}

package/dist/chunks/NcAppNavigationNewItem-NzRL8Uwy.mjs

@@ -0,0 +1,112 @@
+import "../assets/NcAppNavigationNewItem-ue-H4LQY.css";
+import { N as p } from "./NcInputConfirmCancel-lmWu4ouW.mjs";
+import { N as w } from "./NcLoadingIcon-DnhhU7Z8.mjs";
+import { resolveComponent as m, openBlock as o, createElementBlock as l, normalizeClass as c, createElementVNode as r, createBlock as f, renderSlot as N, toDisplayString as g, createCommentVNode as s, createVNode as h } from "vue";
+import { _ as v } from "./_plugin-vue_export-helper-hUChTQA_.mjs";
+const _ = {
+  name: "NcAppNavigationNewItem",
+  components: {
+    NcInputConfirmCancel: p,
+    NcLoadingIcon: w
+  },
+  props: {
+    /**
+     * The name of the element.
+     */
+    name: {
+      type: String,
+      required: !0
+    },
+    /**
+     * Refers to the icon on the left, this prop accepts a class
+     * like 'icon-category-enabled'.
+     */
+    icon: {
+      type: String,
+      default: ""
+    },
+    /**
+     * Displays a loading animated icon on the left of the element
+     * instead of the icon.
+     */
+    loading: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * Only for 'editable' items, sets label for the edit action button.
+     */
+    editLabel: {
+      type: String,
+      default: ""
+    },
+    /**
+     * Sets the placeholder text for the editing form.
+     */
+    editPlaceholder: {
+      type: String,
+      default: ""
+    }
+  },
+  emits: ["new-item"],
+  data() {
+    return {
+      newItemValue: "",
+      newItemActive: !1
+    };
+  },
+  methods: {
+    handleNewItem() {
+      this.loading || (this.newItemActive = !0, this.$nextTick(() => {
+        this.$refs.newItemInput.focusInput();
+      }));
+    },
+    cancelNewItem() {
+      this.newItemActive = !1;
+    },
+    handleNewItemDone() {
+      this.$emit("new-item", this.newItemValue), this.newItemValue = "", this.newItemActive = !1;
+    }
+  }
+}, C = ["title"], y = {
+  key: 1,
+  class: "newItemContainer"
+};
+function V(d, n, e, A, t, a) {
+  const I = m("NcLoadingIcon"), u = m("NcInputConfirmCancel");
+  return o(), l("li", {
+    class: c([{
+      "app-navigation-entry--newItemActive": t.newItemActive
+    }, "app-navigation-entry"])
+  }, [
+    r("button", {
+      class: "app-navigation-entry-button",
+      onClick: n[1] || (n[1] = (...i) => a.handleNewItem && a.handleNewItem(...i))
+    }, [
+      r("span", {
+        class: c([{ [e.icon]: !e.loading }, "app-navigation-entry-icon"])
+      }, [
+        e.loading ? (o(), f(I, { key: 0 })) : N(d.$slots, "icon", { key: 1 }, void 0, !0)
+      ], 2),
+      t.newItemActive ? s("", !0) : (o(), l("span", {
+        key: 0,
+        class: "app-navigation-new-item__name",
+        title: e.name
+      }, g(e.name), 9, C)),
+      t.newItemActive ? (o(), l("span", y, [
+        h(u, {
+          ref: "newItemInput",
+          modelValue: t.newItemValue,
+          "onUpdate:modelValue": n[0] || (n[0] = (i) => t.newItemValue = i),
+          placeholder: e.editPlaceholder !== "" ? e.editPlaceholder : e.name,
+          onCancel: a.cancelNewItem,
+          onConfirm: a.handleNewItemDone
+        }, null, 8, ["modelValue", "placeholder", "onCancel", "onConfirm"])
+      ])) : s("", !0)
+    ])
+  ], 2);
+}
+const x = /* @__PURE__ */ v(_, [["render", V], ["__scopeId", "data-v-8950be04"]]);
+export {
+  x as N
+};

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

@@ -0,0 +1 @@
+{"version":3,"file":"NcAppNavigationNewItem-NzRL8Uwy.mjs","sources":["../../src/components/NcAppNavigationNewItem/NcAppNavigationNewItem.vue"],"sourcesContent":["<!--\n - @copyright Copyright (c) 2020 Jonathan Treffler <mail@jonathan-treffler.de>\n -\n - @author Jonathan Treffler <mail@jonathan-treffler.de>\n -\n - @license GNU AGPL version 3 or any later version\n -\n - This program is free software: you can redistribute it and/or modify\n - it under the terms of the GNU Affero General Public License as\n - published by the Free Software Foundation, either version 3 of the\n - License, or (at your option) any later version.\n -\n - This program is distributed in the hope that it will be useful,\n - but WITHOUT ANY WARRANTY; without even the implied warranty of\n - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n - GNU Affero General Public License for more details.\n -\n - You should have received a copy of the GNU Affero General Public License\n - along with this program. If not, see <http://www.gnu.org/licenses/>.\n -\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.js'\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: ['new-item'],\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('new-item', 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@import '../../assets/NcAppNavigationItem';\n\n.app-navigation-new-item__name {\n\toverflow: hidden;\n\tmax-width: 100%;\n\twhite-space: nowrap;\n\ttext-overflow: ellipsis;\n\tpadding-left: 7px;\n\tfont-size: 14px;\n}\n\n.newItemContainer {\n\twidth: calc(100% - #{$clickable-area});\n\tmargin: auto;\n}\n</style>\n"],"names":["_sfc_main","NcInputConfirmCancel","_hoisted_1","normalizeClass","_cache","args","$options","$props","openBlock","createBlock","_component_NcLoadingIcon","renderSlot","_ctx","createCommentVNode","toDisplayString","createElementBlock","_hoisted_2","$data","$event"],"mappings":";;;;;AAkGA,MAAAA,IAAA;AAAA;;IAIE,sBAAAC;AAAA;;EAID,OAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;IAqBC,SAAA;AAAA;;;;;;;;;;;;;IAcA,iBAAA;AAAA;;;;EAMD,OAAA,CAAA,UAAA;AAAA,EAEA,OAAA;AACC,WAAA;AAAA,MACC,cAAA;AAAA,MACA,eAAA;AAAA,IACD;AAAA;EAGD,SAAA;AAAA,IACC,gBAAA;AACC,MAAA,KAAA,qCAEC,KAAA,UAAA,MAAA;AACC,aAAA,MAAA,aAAA,WAAA;AAAA;;IAIH,gBAAA;;;IAGA,oBAAA;AACC,WAAA,MAAA,YAAA,KAAA,YAAA,GACA,KAAA,eAAA;;;AAIH,GA9KAC,IAAA,CAAA,OAAA;;EAmF8B,OAAA;;;;;IAjBxB,OAAAC,EAAA,CAAA;AAAA;;;;MAKI,OAAA;AAAA,MAAqC,SAAAC,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,IAAAC,MAAAC,EAAA,iBAAAA,EAAA,cAAA,GAAAD,CAAA;AAAA;;QACrC,OAAAF,EAAA,CAAA,EAAA,CAAAI,EAAA,IAAA,GAAA,CAAAA,EAAA,QAAA,GAAA,2BAAA,CAAA;AAAA;qBAENC,EAAA,GAAAC,EAAAC,GAAA,EAAA,KAAA,EAAA,CAAA,KACAC,EAAAC,EAAA,QAAA,QAAA,EAAA,KAAA,EAAA,GAAA,QAAA,EAAA;AAAA;wBA3EJC,EAAA,IAAA,EAAA;;QA8E+B,OAAA;AAAA,QAAuC,OAAAN,EAAA;AAAA,MAC/D,GAAAO,EAAAP,EAAA,IAAA,GAAA,GAAAL,CAAA;AAAA,yBAIJM,EAAA,GAAAO,EAAA,QAAAC,GAAA;AAAA;UACuB,KAAA;AAAA,UApF1B,YAAAC,EAAA;AAAA,UAAA,uBAAAb,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAc,MAAAD,EAAA,eAAAC;AAAA,UAsFM,aAAAX,EAAA,oBAAA,KAAAA,EAAA,kBAAAA,EAAA;AAAA,UACA,UAAAD,EAAA;AAAA,UACA,WAAAA,EAAA;AAAA;YAxFNO,EAAA,IAAA,EAAA;AAAA;;;;"}

package/dist/chunks/NcAppNavigationSettings-DPeH305A.cjs

@@ -0,0 +1,128 @@
+var O = require("../assets/NcAppNavigationSettings-Q_od5CcP.css");
+const c = require("./_l10n-Fl7RzbcZ.cjs"), _ = require("../Mixins/clickOutsideOptions.cjs");
+require("@nextcloud/router");
+const e = require("vue");
+;/* empty css                                                                           */
+const l = require("./_plugin-vue_export-helper-xG2iG1wl.cjs");
+require("linkify-string");
+require("escape-html");
+require("striptags");
+require("@nextcloud/auth");
+require("@nextcloud/axios");
+require("@nextcloud/capabilities");
+const p = require("@vueuse/components");
+c.register(c.t37);
+const g = {
+  name: "CogIcon",
+  emits: ["click"],
+  props: {
+    title: {
+      type: String
+    },
+    fillColor: {
+      type: String,
+      default: "currentColor"
+    },
+    size: {
+      type: Number,
+      default: 24
+    }
+  }
+}, C = ["aria-hidden", "aria-label"], m = ["fill", "width", "height"], h = { d: "M12,15.5A3.5,3.5 0 0,1 8.5,12A3.5,3.5 0 0,1 12,8.5A3.5,3.5 0 0,1 15.5,12A3.5,3.5 0 0,1 12,15.5M19.43,12.97C19.47,12.65 19.5,12.33 19.5,12C19.5,11.67 19.47,11.34 19.43,11L21.54,9.37C21.73,9.22 21.78,8.95 21.66,8.73L19.66,5.27C19.54,5.05 19.27,4.96 19.05,5.05L16.56,6.05C16.04,5.66 15.5,5.32 14.87,5.07L14.5,2.42C14.46,2.18 14.25,2 14,2H10C9.75,2 9.54,2.18 9.5,2.42L9.13,5.07C8.5,5.32 7.96,5.66 7.44,6.05L4.95,5.05C4.73,4.96 4.46,5.05 4.34,5.27L2.34,8.73C2.21,8.95 2.27,9.22 2.46,9.37L4.57,11C4.53,11.34 4.5,11.67 4.5,12C4.5,12.33 4.53,12.65 4.57,12.97L2.46,14.63C2.27,14.78 2.21,15.05 2.34,15.27L4.34,18.73C4.46,18.95 4.73,19.03 4.95,18.95L7.44,17.94C7.96,18.34 8.5,18.68 9.13,18.93L9.5,21.58C9.54,21.82 9.75,22 10,22H14C14.25,22 14.46,21.82 14.5,21.58L14.87,18.93C15.5,18.67 16.04,18.34 16.56,17.94L19.05,18.95C19.27,19.03 19.54,18.95 19.66,18.73L21.66,15.27C21.78,15.05 21.73,14.78 21.54,14.63L19.43,12.97Z" }, f = { key: 0 };
+function k(n, i, t, a, o, s) {
+  return e.openBlock(), e.createElementBlock("span", e.mergeProps(n.$attrs, {
+    "aria-hidden": t.title ? null : !0,
+    "aria-label": t.title,
+    class: "material-design-icon cog-icon",
+    role: "img",
+    onClick: i[0] || (i[0] = (r) => n.$emit("click", r))
+  }), [
+    (e.openBlock(), e.createElementBlock("svg", {
+      fill: t.fillColor,
+      class: "material-design-icon__svg",
+      width: t.size,
+      height: t.size,
+      viewBox: "0 0 24 24"
+    }, [
+      e.createElementVNode("path", h, [
+        t.title ? (e.openBlock(), e.createElementBlock("title", f, e.toDisplayString(t.title), 1)) : e.createCommentVNode("", !0)
+      ])
+    ], 8, m))
+  ], 16, C);
+}
+const v = /* @__PURE__ */ l._export_sfc(g, [["render", k]]), L = {
+  directives: {
+    ClickOutside: p.vOnClickOutside
+  },
+  components: {
+    Cog: v
+  },
+  mixins: [
+    _
+  ],
+  props: {
+    name: {
+      type: String,
+      required: !1,
+      default: c.t("Settings")
+    }
+  },
+  data() {
+    return {
+      open: !1
+    };
+  },
+  computed: {
+    clickOutsideConfig() {
+      return [
+        this.closeMenu,
+        this.clickOutsideOptions
+      ];
+    }
+  },
+  methods: {
+    toggleMenu() {
+      this.open = !this.open;
+    },
+    closeMenu() {
+      this.open = !1;
+    }
+  }
+}, q = { id: "app-settings__header" }, N = ["aria-expanded"], b = { class: "settings-button__label" }, S = { id: "app-settings__content" };
+function B(n, i, t, a, o, s) {
+  const r = e.resolveComponent("Cog"), d = e.resolveDirective("click-outside");
+  return e.withDirectives((e.openBlock(), e.createElementBlock("div", {
+    id: "app-settings",
+    class: e.normalizeClass({ open: o.open })
+  }, [
+    e.createElementVNode("div", q, [
+      e.createElementVNode("button", {
+        class: "settings-button",
+        type: "button",
+        "aria-expanded": o.open ? "true" : "false",
+        "aria-controls": "app-settings__content",
+        onClick: i[0] || (i[0] = (...u) => s.toggleMenu && s.toggleMenu(...u))
+      }, [
+        e.createVNode(r, {
+          class: "settings-button__icon",
+          size: 20
+        }),
+        e.createElementVNode("span", b, e.toDisplayString(t.name), 1)
+      ], 8, N)
+    ]),
+    e.createVNode(e.Transition, { name: "slide-up" }, {
+      default: e.withCtx(() => [
+        e.withDirectives(e.createElementVNode("div", S, [
+          e.renderSlot(n.$slots, "default", {}, void 0, !0)
+        ], 512), [
+          [e.vShow, o.open]
+        ])
+      ]),
+      _: 3
+    })
+  ], 2)), [
+    [d, s.clickOutsideConfig]
+  ]);
+}
+const E = /* @__PURE__ */ l._export_sfc(L, [["render", B], ["__scopeId", "data-v-50899abb"]]);
+exports.NcAppNavigationSettings = E;

package/dist/chunks/NcAppNavigationSettings-DPeH305A.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"NcAppNavigationSettings-DPeH305A.cjs","sources":["../../node_modules/vue-material-design-icons/Cog.vue","../../src/components/NcAppNavigationSettings/NcAppNavigationSettings.vue"],"sourcesContent":["<template>\n  <span v-bind=\"$attrs\"\n        :aria-hidden=\"title ? null : true\"\n        :aria-label=\"title\"\n        class=\"material-design-icon cog-icon\"\n        role=\"img\"\n        @click=\"$emit('click', $event)\">\n    <svg :fill=\"fillColor\"\n         class=\"material-design-icon__svg\"\n         :width=\"size\"\n         :height=\"size\"\n         viewBox=\"0 0 24 24\">\n      <path d=\"M12,15.5A3.5,3.5 0 0,1 8.5,12A3.5,3.5 0 0,1 12,8.5A3.5,3.5 0 0,1 15.5,12A3.5,3.5 0 0,1 12,15.5M19.43,12.97C19.47,12.65 19.5,12.33 19.5,12C19.5,11.67 19.47,11.34 19.43,11L21.54,9.37C21.73,9.22 21.78,8.95 21.66,8.73L19.66,5.27C19.54,5.05 19.27,4.96 19.05,5.05L16.56,6.05C16.04,5.66 15.5,5.32 14.87,5.07L14.5,2.42C14.46,2.18 14.25,2 14,2H10C9.75,2 9.54,2.18 9.5,2.42L9.13,5.07C8.5,5.32 7.96,5.66 7.44,6.05L4.95,5.05C4.73,4.96 4.46,5.05 4.34,5.27L2.34,8.73C2.21,8.95 2.27,9.22 2.46,9.37L4.57,11C4.53,11.34 4.5,11.67 4.5,12C4.5,12.33 4.53,12.65 4.57,12.97L2.46,14.63C2.27,14.78 2.21,15.05 2.34,15.27L4.34,18.73C4.46,18.95 4.73,19.03 4.95,18.95L7.44,17.94C7.96,18.34 8.5,18.68 9.13,18.93L9.5,21.58C9.54,21.82 9.75,22 10,22H14C14.25,22 14.46,21.82 14.5,21.58L14.87,18.93C15.5,18.67 16.04,18.34 16.56,17.94L19.05,18.95C19.27,19.03 19.54,18.95 19.66,18.73L21.66,15.27C21.78,15.05 21.73,14.78 21.54,14.63L19.43,12.97Z\">\n        <title v-if=\"title\">{{ title }}</title>\n      </path>\n    </svg>\n  </span>\n</template>\n\n<script>\nexport default {\n  name: \"CogIcon\",\n  emits: ['click'],\n  props: {\n    title: {\n      type: String,\n    },\n    fillColor: {\n      type: String,\n      default: \"currentColor\"\n    },\n    size: {\n      type: Number,\n      default: 24\n    }\n  }\n}\n</script>","<!--\n - @copyright Copyright (c) 2018 Christoph Wurst <christoph@winzerhof-wurst.at>\n -\n - @author Christoph Wurst <christoph@winzerhof-wurst.at>\n -\n - @license GNU AGPL version 3 or any later version\n -\n - This program is free software: you can redistribute it and/or modify\n - it under the terms of the GNU Affero General Public License as\n - published by the Free Software Foundation, either version 3 of the\n - License, or (at your option) any later version.\n -\n - This program is distributed in the hope that it will be useful,\n - but WITHOUT ANY WARRANTY; without even the implied warranty of\n - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n - GNU Affero General Public License for more details.\n -\n - You should have received a copy of the GNU Affero General Public License\n - along with this program. If not, see <http://www.gnu.org/licenses/>.\n -\n -->\n\n<template>\n\t<div id=\"app-settings\"\n\t\tv-click-outside=\"clickOutsideConfig\"\n\t\t:class=\"{ open }\">\n\t\t<div id=\"app-settings__header\">\n\t\t\t<button class=\"settings-button\"\n\t\t\t\ttype=\"button\"\n\t\t\t\t:aria-expanded=\"open ? 'true' : 'false'\"\n\t\t\t\taria-controls=\"app-settings__content\"\n\t\t\t\t@click=\"toggleMenu\">\n\t\t\t\t<Cog class=\"settings-button__icon\" :size=\"20\" />\n\t\t\t\t<span class=\"settings-button__label\">{{ name }}</span>\n\t\t\t</button>\n\t\t</div>\n\t\t<Transition name=\"slide-up\">\n\t\t\t<div v-show=\"open\" id=\"app-settings__content\">\n\t\t\t\t<slot />\n\t\t\t</div>\n\t\t</Transition>\n\t</div>\n</template>\n\n<script>\nimport { t } from '../../l10n.js'\nimport { clickOutsideOptions } from '../../mixins/index.js'\n\nimport Cog from 'vue-material-design-icons/Cog.vue'\n\nimport { vOnClickOutside as ClickOutside } from '@vueuse/components'\n\nexport default {\n\tdirectives: {\n\t\tClickOutside,\n\t},\n\tcomponents: {\n\t\tCog,\n\t},\n\tmixins: [\n\t\tclickOutsideOptions,\n\t],\n\tprops: {\n\t\tname: {\n\t\t\ttype: String,\n\t\t\trequired: false,\n\t\t\tdefault: t('Settings'),\n\t\t},\n\t},\n\tdata() {\n\t\treturn {\n\t\t\topen: false,\n\t\t}\n\t},\n\tcomputed: {\n\t\tclickOutsideConfig() {\n\t\t\treturn [\n\t\t\t\tthis.closeMenu,\n\t\t\t\tthis.clickOutsideOptions,\n\t\t\t]\n\t\t},\n\t},\n\tmethods: {\n\t\ttoggleMenu() {\n\t\t\tthis.open = !this.open\n\t\t},\n\t\tcloseMenu() {\n\t\t\tthis.open = false\n\t\t},\n\t},\n}\n</script>\n<style lang=\"scss\" scoped>\n#app-settings {\n\tmargin-top: auto;\n\tpadding: $app-navigation-settings-margin;\n\n\t&__header {\n\t\tbox-sizing: border-box;\n\t\tmargin: 0 $app-navigation-settings-margin $app-navigation-settings-margin $app-navigation-settings-margin;\n\n\t\t.settings-button {\n\t\t\tdisplay: flex;\n\t\t\tflex: 1 1 0;\n\t\t\theight: $clickable-area;\n\t\t\twidth: 100%;\n\t\t\tpadding: 0;\n\t\t\tmargin: 0;\n\t\t\tbackground-color: var(--color-main-background);\n\t\t\tbox-shadow: none;\n\t\t\tborder: 0;\n\t\t\tborder-radius: var(--border-radius-pill);\n\t\t\ttext-align: left;\n\t\t\tfont-weight: normal;\n\t\t\tfont-size: 100%;\n\t\t\tcolor: var(--color-main-text);\n\t\t\tpadding-right: 14px;\n\t\t\tline-height: $clickable-area;\n\n\t\t\t&:hover,\n\t\t\t&:focus {\n\t\t\t\tbackground-color: var(--color-background-hover);\n\t\t\t}\n\n\t\t\t&__icon {\n\t\t\t\twidth: $clickable-area;\n\t\t\t\theight: $clickable-area;\n\t\t\t\tmin-width: $clickable-area;\n\t\t\t}\n\t\t\t&__label {\n\t\t\t\toverflow: hidden;\n\t\t\t\tmax-width: 100%;\n\t\t\t\twhite-space: nowrap;\n\t\t\t\ttext-overflow: ellipsis;\n\t\t\t}\n\t\t}\n\t}\n\n\t&__content {\n\t\tdisplay: block;\n\t\tpadding: 10px;\n\n\t\t/* prevent scrolled contents from stopping too early */\n\t\tmargin-bottom: -$app-navigation-settings-margin;\n\n\t\t/* restrict height of settings and make scrollable */\n\t\tmax-height: 300px;\n\t\toverflow-y: auto;\n\t\tbox-sizing: border-box;\n\t}\n}\n\n.slide-up-leave-active,\n.slide-up-enter-active {\n\ttransition-duration: var(--animation-slow);\n\ttransition-property: max-height, padding;\n\toverflow-y: hidden !important;\n}\n\n.slide-up-enter-from,\n.slide-up-leave-to {\n\tmax-height: 0 !important;\n\tpadding: 0 10px !important;\n}\n\n</style>\n"],"names":["_sfc_main$1","_hoisted_1$1","_hoisted_2$1","_hoisted_3$1","$props","vue","_sfc_main","Cog","Mixins_clickOutsideOptions","_l10n","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","$data","_cache","args","$options"],"mappings":";;;;;;;;;;;;;;AAoBA,MAAAA,IAAA;AAAA,EACE,MAAA;AAAA,EACA,OAAA,CAAA,OAAA;AAAA,EACA,OAAA;AAAA,IACE,OAAA;AAAA;;;;MAKE,SAAA;AAAA;;;MAIA,SAAA;AAAA,IACF;AAAA,EACF;AACF,GApCAC,IAAA,CAAA,eAAA,YAAA,GAAAC,IAAA,CAAA,QAAA,SAAA,QAAA,GAYYC,IAAA,EAAA,GAAA,84BAAA;;;IAVH,eAAAC,EAAA,QAAA,OAAA;AAAA,IACA,cAAAA,EAAA;AAAA,IACD,OAAA;AAAA,IACA,MAAA;AAAA;;;MAEE,MAAAA,EAAA;AAAA,MACD,OAAA;AAAA,MACC,OAAAA,EAAA;AAAA,MACA,QAAAA,EAAA;AAAA,MACD,SAAA;AAAA;MACHC,EAAA,mBAAA,QAAAF,GAAA;AAAA,qGAZNE,EAAA,mBAAA,IAAA,EAAA;AAAA;IAAA,GAAA,GAAAH,CAAA;AAAA,EAAA,GAAA,IAAAD,CAAA;;6DCoDAK,IAAA;AAAA;;;;IAKE,KAAAC;AAAA;EAED,QAAA;AAAA,IACCC;AAAA;EAED,OAAA;AAAA;;MAGE,UAAA;AAAA,MACA,SAAAC,EAAA,EAAA,UAAA;AAAA;;EAGF,OAAA;AACC,WAAA;AAAA;IAEA;AAAA;EAED,UAAA;AAAA,IACC,qBAAA;AACC,aAAA;AAAA,QACC,KAAA;AAAA;MAED;AAAA;;EAGF,SAAA;AAAA;AAEE,WAAA,OAAA,CAAA,KAAA;AAAA;;AAGA,WAAA,OAAA;AAAA;;AAGH,GAhEOC,IAAA,EAAA,IAAA,uBAAA,GA1BPC,IAAA,CAAA,eAAA,GAiCUC,IAAA,EAAA,OAAA,yBAAA,GAIYC,IAAA,EAAA,IAAA,wBAAA;;;;IAdhB,IAAA;AAAA;;IAGJR,EAAA,mBAAA,OAAAK,GAAA;AAAA;QACS,OAAA;AAAA,QACP,MAAA;AAAA,QACC,iBAAAI,EAAA,OAAA,SAAA;AAAA,QACD,iBAAA;AAAA,QACC,SAAAC,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,IAAAC,MAAAC,EAAA,cAAAA,EAAA,WAAA,GAAAD,CAAA;AAAA;;UACI,OAAA;AAAA,UAA+B,MAAA;AAAA;;MAhCxC,GAAA,GAAAL,CAAA;AAAA;;MAAA,SAAAN,EAAA,QAAA,MAAA;AAAA,QAqCGA,EAAA,eAAAA,EAAA,mBAAA,OAAAQ,GAAA;AAAA;;;;;;;;;;;;;","x_google_ignoreList":[0]}