npm - @nextcloud/vue - Versions diffs - 9.0.0-rc.1 → 9.0.0-rc.2 - Mend

@nextcloud/vue 9.0.0-rc.1 → 9.0.0-rc.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (280) hide show

package/dist/chunks/NcActionTextEditable-Dv1_bMFY.mjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"NcActionTextEditable-Dv1_bMFY.mjs","sources":["../../src/components/NcActionTextEditable/NcActionTextEditable.vue"],"sourcesContent":["\n\n<docs>\nThis component is made to be used inside of the [Actions](#Actions) component slots.\nAll undocumented attributes will be bound to the textarea. e.g. `maxlength`\n\n```\n<template>\n\t<NcActions>\n\t\t<NcActionTextEditable model-value=\"This is a textarea\">\n\t\t\t<template #icon>\n\t\t\t\t<Pencil :size=\"20\" />\n\t\t\t</template>\n\t\t</NcActionTextEditable>\n\t\t<NcActionTextEditable :disabled=\"true\" model-value=\"This is a disabled textarea\">\n\t\t\t<template #icon>\n\t\t\t\t<Pencil :size=\"20\" />\n\t\t\t</template>\n\t\t</NcActionTextEditable>\n\t\t<NcActionTextEditable name=\"Please edit the text\" model-value=\"This is a textarea with name\">\n\t\t\t<template #icon>\n\t\t\t\t<Pencil :size=\"20\" />\n\t\t\t</template>\n\t\t</NcActionTextEditable>\n\t</NcActions>\n</template>\n<script>\nimport Pencil from 'vue-material-design-icons/Pencil'\n\nexport default {\n\tcomponents: {\n\t\tPencil,\n\t},\n}\n</script>\n```\n</docs>\n\n<template>\n\t<li class=\"action\" :class=\"{ 'action--disabled': disabled }\">\n\t\t<span class=\"action-text-editable\"\n\t\t\t@click=\"onClick\">\n\t\t\t\n\t\t\t<slot name=\"icon\">\n\t\t\t\t<span :class=\"[isIconUrl ? 'action-text-editable__icon--url' : icon]\"\n\t\t\t\t\t:style=\"{ backgroundImage: isIconUrl ? `url(${icon})` : null }\"\n\t\t\t\t\tclass=\"action-text-editable__icon\" />\n\t\t\t</slot>\n\n\t\t\t\n\t\t\t<form ref=\"form\"\n\t\t\t\tclass=\"action-text-editable__form\"\n\t\t\t\t:disabled=\"disabled\"\n\t\t\t\t@submit.prevent=\"onSubmit\">\n\t\t\t\t<input :id=\"id\" type=\"submit\" class=\"action-text-editable__submit\">\n\n\t\t\t\t\n\t\t\t\t<label v-if=\"name\"\n\t\t\t\t\tclass=\"action-text-editable__name\"\n\t\t\t\t\t:for=\"computedId\">\n\t\t\t\t\t{{ name }}\n\t\t\t\t</label>\n\n\t\t\t\t<textarea :id=\"computedId\"\n\t\t\t\t\t:disabled=\"disabled\"\n\t\t\t\t\t:value=\"modelValue\"\n\t\t\t\t\tv-bind=\"$attrs\"\n\t\t\t\t\t:class=\"['action-text-editable__textarea', { focusable: isFocusable }]\"\n\t\t\t\t\t@input=\"onInput\" />\n\n\t\t\t\t\n\t\t\t\t<label v-show=\"!disabled\" :for=\"id\" class=\"action-text-editable__label\">\n\t\t\t\t\t<ArrowLeft v-if=\"isRtl\" :size=\"20\" />\n\t\t\t\t\t<ArrowRight v-else :size=\"20\" />\n\t\t\t\t</label>\n\t\t\t</form>\n\t\t</span>\n\t</li>\n</template>\n\n<script>\nimport ActionTextMixin from '../../mixins/actionText.js'\nimport { createElementId } from '../../utils/createElementId.ts'\n\nimport ArrowLeft from 'vue-material-design-icons/ArrowLeft.vue'\nimport ArrowRight from 'vue-material-design-icons/ArrowRight.vue'\n\nimport { isRtl } from '../../utils/rtl.ts'\n\nexport default {\n\tname: 'NcActionTextEditable',\n\n\tcomponents: {\n\t\tArrowLeft,\n\t\tArrowRight,\n\t},\n\n\tmixins: [ActionTextMixin],\n\n\tprops: {\n\t\t/**\n\t\t * id attribute of the checkbox element\n\t\t */\n\t\tid: {\n\t\t\ttype: String,\n\t\t\tdefault: () => 'action-' + createElementId(),\n\t\t\tvalidator: id => id.trim() !== '',\n\t\t},\n\t\t/**\n\t\t * disabled state of the text area\n\t\t */\n\t\tdisabled: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * value attribute of the input field\n\t\t */\n\t\tmodelValue: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\t},\n\n\temits: [\n\t\t'input',\n\t\t'update:modelValue',\n\t\t'submit',\n\t],\n\n\tsetup() {\n\t\treturn {\n\t\t\tisRtl,\n\t\t}\n\t},\n\n\tcomputed: {\n\t\t/**\n\t\t * determines if the action is focusable\n\t\t *\n\t\t * @return {boolean} is the action focusable ?\n\t\t */\n\t\tisFocusable() {\n\t\t\treturn !this.disabled\n\t\t},\n\n\t\tcomputedId() {\n\t\t\treturn createElementId()\n\t\t},\n\t},\n\n\tmethods: {\n\t\tonInput(event) {\n\t\t\t/**\n\t\t\t * Emitted on input events of the text field\n\t\t\t *\n\t\t\t * @type {Event|Date}\n\t\t\t */\n\t\t\tthis.$emit('input', event)\n\t\t\t/**\n\t\t\t * Emitted when the inputs value changes\n\t\t\t *\n\t\t\t * @type {string|Date}\n\t\t\t */\n\t\t\tthis.$emit('update:modelValue', event.target.value)\n\t\t},\n\t\tonSubmit(event) {\n\t\t\tevent.preventDefault()\n\t\t\tevent.stopPropagation()\n\t\t\tif (!this.disabled) {\n\t\t\t\t/**\n\t\t\t\t * Emitted on submit of the input field\n\t\t\t\t *\n\t\t\t\t * @type {Event}\n\t\t\t\t */\n\t\t\t\tthis.$emit('submit', event)\n\t\t\t} else {\n\t\t\t\t// ignore submit\n\t\t\t\treturn false\n\t\t\t}\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n@use '../../assets/inputs.scss';\n@use '../../assets/action.scss' as *;\n@include action-active;\n@include action--disabled;\n\n$input-margin: 4px;\n\n.action-text-editable {\n\tdisplay: flex;\n\talign-items: flex-start;\n\n\twidth: 100%;\n\theight: auto;\n\tmargin: 0;\n\tpadding: 0;\n\n\tcursor: pointer;\n\twhite-space: nowrap;\n\n\tcolor: var(--color-main-text);\n\tborder: 0;\n\tborder-radius: 0; // otherwise Safari will cut the border-radius area\n\tbackground-color: transparent;\n\tbox-shadow: none;\n\n\tfont-weight: normal;\n\tline-height: var(--default-clickable-area);\n\n\t& > span {\n\t\tcursor: pointer;\n\t\twhite-space: nowrap;\n\t}\n\n\t&__icon {\n\t\tmin-width: 0; /* Overwrite icons*/\n\t\tmin-height: 0;\n\t\t/* Keep padding to define the width to\n\t\t\tassure correct position of a possible text */\n\t\tpadding: calc(var(--default-clickable-area) / 2) 0 calc(var(--default-clickable-area) / 2) var(--default-clickable-area);\n\n\t\tbackground-position: #{$icon-margin} center;\n\t\tbackground-size: $icon-size;\n\t}\n\n\t&:deep(.material-design-icon) {\n\t\twidth: var(--default-clickable-area);\n\t\theight: var(--default-clickable-area);\n\t\topacity: $opacity_full;\n\n\t\t.material-design-icon__svg {\n\t\t\tvertical-align: middle;\n\t\t}\n\t}\n\n\t// Forms & text inputs\n\t&__form {\n\t\tdisplay: flex;\n\t\tflex: 1 1 auto;\n\t\tflex-direction: column;\n\n\t\tposition: relative;\n\t\tmargin: $input-margin 0;\n\t\tpadding-inline-end: $icon-margin;\n\t}\n\n\t&__submit {\n\t\tposition: absolute;\n\t\tinset-inline-start: 0;\n\t\ttop: auto;\n\t\twidth: 1px;\n\t\theight: 1px;\n\t\toverflow: hidden;\n\t\tz-index: -1;\n\t\topacity: 0;\n\t}\n\n\t&__label {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\n\t\t// bottom-right corner\n\t\tposition: absolute;\n\t\tinset-inline-end: calc($icon-margin + 1px);\n\t\tbottom: 1px;\n\t\twidth: calc(var(--default-clickable-area) - $input-margin * 2);\n\t\theight: calc(var(--default-clickable-area) - $input-margin * 2);\n\t\tbox-sizing: border-box;\n\t\tmargin: 0;\n\t\tpadding: 7px 6px;\n\n\t\tborder: 0;\n\t\tborder-radius: 50%;\n\t\t/* Avoid background under border */\n\t\tbackground-color: var(--color-main-background);\n\t\tbackground-clip: padding-box;\n\n\t\t&, * {\n\t\t\tcursor: pointer;\n\t\t}\n\t}\n\n\t/* Inputs inside popover supports text, submit & reset */\n\t&__textarea {\n\t\tflex: 1 1 auto;\n\t\tcolor: inherit;\n\t\tborder-color: var(--color-border-maxcontrast);\n\n\t\tmin-height: calc(var(--default-clickable-area) * 2 - $input-margin * 2); /* twice the element margin-y */\n\t\tmax-height: calc(var(--default-clickable-area) * 3 - $input-margin * 2); /* twice the element margin-y */\n\t\t// block width widening\n\t\tmin-width: calc(var(--default-clickable-area) * 4);\n\t\twidth: 100% !important;\n\t\tmargin: 0;\n\n\t\t// if disabled, change cursor\n\t\t&:disabled {\n\t\t\tcursor: default;\n\t\t}\n\n\t\t/* only show confirm borders if input is not focused */\n\t\t&:not(:active):not(:hover):not(:focus) {\n\t\t\t&:invalid {\n\t\t\t\t& + .action-text-editable__label {\n\t\t\t\t\tbackground-color: var(--color-error);\n\t\t\t\t}\n\t\t\t}\n\t\t\t&:not(:disabled) + .action-text-editable__label {\n\t\t\t\t&:active,\n\t\t\t\t&:hover,\n\t\t\t\t&:focus {\n\t\t\t\t\tbackground-color: var(--color-primary-element);\n\t\t\t\t\tcolor: var(--color-primary-element-text);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t&:active,\n\t\t&:hover,\n\t\t&:focus {\n\t\t\t&:not(:disabled) + .action-text-editable__label {\n\t\t\t\t/* above previous input */\n\t\t\t\tz-index: 2;\n\n\t\t\t\tborder-color: var(--color-primary-element);\n\t\t\t\tborder-inline-start-color: transparent;\n\t\t\t}\n\t\t}\n\t}\n}\n\n// if a form is the last of the list\n// add the same bottomMargin as the right padding\n// for visual balance\nli:last-child > .action-text-editable {\n\tmargin-bottom: calc($icon-margin - $input-margin);\n}\n\n// same for first item\nli:first-child > .action-text-editable {\n\tmargin-top: calc($icon-margin - $input-margin);\n}\n</style>\n"],"names":["_createElementBlock","_normalizeClass","_createElementVNode","_renderSlot","_normalizeStyle","_withModifiers","_toDisplayString","_createCommentVNode","_mergeProps","_createBlock"],"mappings":"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"}

package/dist/chunks/NcActions-2UedVnLW.mjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"NcActions-2UedVnLW.mjs","sources":["../../src/utils/isSlotPopulated.ts","../../src/components/NcActions/NcActions.vue"],"sourcesContent":["/**\n * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\n\nimport type { VNode, VNodeNormalizedChildren } from 'vue'\nimport { Fragment, Comment, Text } from 'vue'\n\n/**\n * Checks whether a slot is populated\n *\n * @param vnodes The array of vnodes to check\n */\nexport function isSlotPopulated(vnodes?: VNode[] | VNodeNormalizedChildren) {\n\treturn Array.isArray(vnodes) && vnodes.some(node => {\n\t\tif (node === null) return false\n\t\tif (typeof node === 'object') {\n\t\t\tconst vnode = node as VNode\n\t\t\tif (vnode.type === Comment) return false\n\t\t\tif (vnode.type === Fragment && !isSlotPopulated(vnode.children)) return false\n\t\t\tif (vnode.type === Text && !(vnode.children as string).trim()) return false\n\t\t}\n\t\treturn true\n\t})\n}\n","\n\n\n\n<docs>\n### Single action\n\n```vue\n<template>\n\t<NcActions>\n\t\t<NcActionButton @click=\"actionDelete\">\n\t\t\t<template #icon>\n\t\t\t\t<Delete :size=\"20\" />\n\t\t\t</template>\n\t\t\tDelete\n\t\t</NcActionButton>\n\t</NcActions>\n</template>\n<script>\nimport Delete from 'vue-material-design-icons/Delete.vue'\n\nexport default {\n\tcomponents: {\n\t\tDelete,\n\t},\n\tmethods: {\n\t\tactionDelete() {\n\t\t\talert('Delete')\n\t\t},\n\t},\n}\n</script>\n```\n\n### Multiple actions\n\n```vue\n<template>\n\t<NcActions>\n\t\t<NcActionButton @click=\"showMessage('Edit')\">\n\t\t\t<template #icon>\n\t\t\t\t<Pencil :size=\"20\" />\n\t\t\t</template>\n\t\t\tEdit\n\t\t</NcActionButton>\n\t\t<NcActionButton @click=\"showMessage('Delete')\">\n\t\t\t<template #icon>\n\t\t\t\t<Delete :size=\"20\" />\n\t\t\t</template>\n\t\t\tDelete\n\t\t</NcActionButton>\n\t\t<NcActionLink href=\"https://nextcloud.com\">\n\t\t\t<template #icon>\n\t\t\t\t<OpenInNew :size=\"20\" />\n\t\t\t</template>\n\t\t\tLink\n\t\t</NcActionLink>\n\t</NcActions>\n</template>\n<script>\nimport Delete from 'vue-material-design-icons/Delete.vue'\nimport OpenInNew from 'vue-material-design-icons/OpenInNew.vue'\nimport Pencil from 'vue-material-design-icons/Pencil.vue'\n\nexport default {\n\tcomponents: {\n\t\tDelete,\n\t\tOpenInNew,\n\t\tPencil,\n\t},\n\tmethods: {\n\t\tshowMessage(msg) {\n\t\t\talert(msg)\n\t\t},\n\t},\n}\n</script>\n```\n\n### Multiple actions with 2 items inline\n\n```vue\n<template>\n\t<NcActions :inline=\"2\">\n\t\t<NcActionButton @click=\"showMessage('Add')\">\n\t\t\t<template #icon>\n\t\t\t\t<Plus :size=\"20\" />\n\t\t\t</template>\n\t\t\tAdd\n\t\t</NcActionButton>\n\t\t<NcActionButton @click=\"showMessage('Edit')\">\n\t\t\t<template #icon>\n\t\t\t\t<Pencil :size=\"20\" />\n\t\t\t</template>\n\t\t\tEdit\n\t\t</NcActionButton>\n\t\t<NcActionButton @click=\"showMessage('Delete')\">\n\t\t\t<template #icon>\n\t\t\t\t<Delete :size=\"20\" />\n\t\t\t</template>\n\t\t\tDelete\n\t\t</NcActionButton>\n\t\t<NcActionLink href=\"https://nextcloud.com\">\n\t\t\t<template #icon>\n\t\t\t\t<OpenInNew :size=\"20\" />\n\t\t\t</template>\n\t\t\tLink\n\t\t</NcActionLink>\n\t</NcActions>\n</template>\n<script>\nimport Plus from 'vue-material-design-icons/Plus.vue'\nimport Delete from 'vue-material-design-icons/Delete.vue'\nimport OpenInNew from 'vue-material-design-icons/OpenInNew.vue'\nimport Pencil from 'vue-material-design-icons/Pencil.vue'\n\nexport default {\n\tcomponents: {\n\t\tDelete,\n\t\tOpenInNew,\n\t\tPencil,\n\t\tPlus,\n\t},\n\tmethods: {\n\t\tshowMessage(msg) {\n\t\t\talert(msg)\n\t\t},\n\t},\n}\n</script>\n```\n\n### Multiple actions with 2 items inline AND forced names\n\n```vue\n<template>\n\t<NcActions :force-name=\"true\" :inline=\"2\">\n\t\t<NcActionButton @click=\"showMessage('Add')\">\n\t\t\t<template #icon>\n\t\t\t\t<Plus :size=\"20\" />\n\t\t\t</template>\n\t\t\tAdd\n\t\t</NcActionButton>\n\t\t<NcActionButton @click=\"showMessage('Edit')\">\n\t\t\t<template #icon>\n\t\t\t\t<Pencil :size=\"20\" />\n\t\t\t</template>\n\t\t\tEdit\n\t\t</NcActionButton>\n\t\t<NcActionButton @click=\"showMessage('Delete')\">\n\t\t\t<template #icon>\n\t\t\t\t<Delete :size=\"20\" />\n\t\t\t</template>\n\t\t\tDelete\n\t\t</NcActionButton>\n\t\t<NcActionLink href=\"https://nextcloud.com\">\n\t\t\t<template #icon>\n\t\t\t\t<OpenInNew :size=\"20\" />\n\t\t\t</template>\n\t\t\tLink\n\t\t</NcActionLink>\n\t</NcActions>\n</template>\n<script>\nimport Plus from 'vue-material-design-icons/Plus.vue'\nimport Delete from 'vue-material-design-icons/Delete.vue'\nimport OpenInNew from 'vue-material-design-icons/OpenInNew.vue'\nimport Pencil from 'vue-material-design-icons/Pencil.vue'\nexport default {\n\tcomponents: {\n\t\tDelete,\n\t\tOpenInNew,\n\t\tPencil,\n\t\tPlus,\n\t},\n\tmethods: {\n\t\tshowMessage(msg) {\n\t\t\talert(msg)\n\t\t},\n\t},\n}\n</script>\n```\n\n### Multiple actions with custom icon\n\n```vue\n<template>\n\t<NcActions>\n\t\t<template #icon>\n\t\t\t<Pencil :size=\"20\" />\n\t\t</template>\n\t\t<NcActionButton @click=\"showMessage('Edit')\">\n\t\t\t<template #icon>\n\t\t\t\t<Pencil :size=\"20\" />\n\t\t\t</template>\n\t\t\tEdit\n\t\t</NcActionButton>\n\t\t<NcActionButton @click=\"showMessage('Delete')\">\n\t\t\t<template #icon>\n\t\t\t\t<Delete :size=\"20\" />\n\t\t\t</template>\n\t\t\tDelete\n\t\t</NcActionButton>\n\t\t<NcActionLink href=\"https://nextcloud.com\">\n\t\t\t<template #icon>\n\t\t\t\t<OpenInNew :size=\"20\" />\n\t\t\t</template>\n\t\t\tLink\n\t\t</NcActionLink>\n\t</NcActions>\n</template>\n<script>\nimport Delete from 'vue-material-design-icons/Delete.vue'\nimport OpenInNew from 'vue-material-design-icons/OpenInNew.vue'\nimport Pencil from 'vue-material-design-icons/Pencil.vue'\n\nexport default {\n\tcomponents: {\n\t\tDelete,\n\t\tOpenInNew,\n\t\tPencil,\n\t},\n\tmethods: {\n\t\tshowMessage(msg) {\n\t\t\talert(msg)\n\t\t},\n\t},\n}\n</script>\n```\n\n### With menu name\n\n```vue\n<template>\n\t<NcActions menu-name=\"Object management\">\n\t\t<template #icon>\n\t\t\t<Pencil :size=\"20\" />\n\t\t</template>\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<Pencil :size=\"20\" />\n\t\t\t</template>\n\t\t\tRename\n\t\t</NcActionButton>\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<Delete :size=\"20\" />\n\t\t\t</template>\n\t\t\tDelete\n\t\t</NcActionButton>\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<ArrowRight :size=\"20\" />\n\t\t\t</template>\n\t\t\tValidate\n\t\t</NcActionButton>\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<Download :size=\"20\" />\n\t\t\t</template>\n\t\t\tDownload\n\t\t</NcActionButton>\n\t</NcActions>\n</template>\n<script>\nimport ArrowRight from 'vue-material-design-icons/ArrowRight.vue'\nimport Delete from 'vue-material-design-icons/Delete.vue'\nimport Download from 'vue-material-design-icons/Download.vue'\nimport Pencil from 'vue-material-design-icons/Pencil.vue'\n\nexport default {\n\tcomponents: {\n\t\tArrowRight,\n\t\tDelete,\n\t\tDownload,\n\t\tPencil,\n\t},\n}\n</script>\n```\n\n### Various icons styles\n```vue\n<template>\n\t<NcActions :primary=\"true\">\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<Pencil :size=\"20\" />\n\t\t\t</template>\n\t\t\tEdit\n\t\t</NcActionButton>\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<Delete :size=\"20\" />\n\t\t\t</template>\n\t\t\tDelete\n\t\t</NcActionButton>\n\t</NcActions>\n</template>\n<script>\nimport Delete from 'vue-material-design-icons/Delete.vue'\nimport Pencil from 'vue-material-design-icons/Pencil.vue'\n\nexport default {\n\tcomponents: {\n\t\tDelete,\n\t\tPencil,\n\t},\n}\n</script>\n```\n\n```vue\n<template>\n\t<NcActions :primary=\"true\" menu-name=\"Object management\">\n\t\t<template #icon>\n\t\t\t<Plus :size=\"20\" />\n\t\t</template>\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<Pencil :size=\"20\" />\n\t\t\t</template>\n\t\t\tRename\n\t\t</NcActionButton>\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<Delete :size=\"20\" />\n\t\t\t</template>\n\t\t\tDelete\n\t\t</NcActionButton>\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<ArrowRight :size=\"20\" />\n\t\t\t</template>\n\t\t\tValidate\n\t\t</NcActionButton>\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<Download :size=\"20\" />\n\t\t\t</template>\n\t\t\tDownload\n\t\t</NcActionButton>\n\t</NcActions>\n</template>\n<script>\nimport ArrowRight from 'vue-material-design-icons/ArrowRight.vue'\nimport Delete from 'vue-material-design-icons/Delete.vue'\nimport Download from 'vue-material-design-icons/Download.vue'\nimport Pencil from 'vue-material-design-icons/Pencil.vue'\nimport Plus from 'vue-material-design-icons/Plus.vue'\n\nexport default {\n\tcomponents: {\n\t\tArrowRight,\n\t\tDelete,\n\t\tDownload,\n\t\tPencil,\n\t\tPlus,\n\t},\n}\n</script>\n```\n\n### Custom icon slot\nTo be used with `vue-material-design-icons` only. For icon classes use the `default-icon` slot.\nIt can be used with one or multiple actions.\n```vue\n<template>\n\t<div style=\"display: flex;align-items: center;\">\n\t\t<NcButton @click=\"toggled = !toggled\">Toggle multiple action</NcButton>\n\t\t<NcActions>\n\t\t\t<template #icon>\n\t\t\t\t<DotsHorizontalCircleOutline :size=\"20\" />\n\t\t\t</template>\n\t\t\t<NcActionButton>\n\t\t\t\t<template #icon>\n\t\t\t\t\t<MicrophoneOff :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tMute\n\t\t\t</NcActionButton>\n\t\t\t<NcActionButton v-if=\"toggled\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Delete :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tDelete\n\t\t\t</NcActionButton>\n\t\t</NcActions>\n\t</div>\n</template>\n<script>\nimport Delete from 'vue-material-design-icons/Delete.vue'\nimport DotsHorizontalCircleOutline from 'vue-material-design-icons/DotsHorizontalCircleOutline.vue'\nimport MicrophoneOff from 'vue-material-design-icons/MicrophoneOff.vue'\n\nexport default {\n\tcomponents: {\n\t\tDelete,\n\t\tDotsHorizontalCircleOutline,\n\t\tMicrophoneOff,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\ttoggled: false\n\t\t}\n\t}\n}\n</script>\n```\n\n### Custom icon slot in child elements\n```vue\n<template>\n\t<NcActions :primary=\"true\">\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<Magnify :size=\"20\" />\n\t\t\t</template>\n\t\t\tSearch\n\t\t</NcActionButton>\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<Delete :size=\"20\" />\n\t\t\t</template>\n\t\t\tDelete\n\t\t</NcActionButton>\n\t</NcActions>\n</template>\n<script>\nimport Delete from 'vue-material-design-icons/Delete.vue'\nimport Magnify from 'vue-material-design-icons/Magnify.vue'\n\nexport default {\n\tcomponents: {\n\t\tDelete,\n\t\tMagnify,\n\t},\n}\n</script>\n```\n\n### Design variants\n\n```vue\n<template>\n\t<div>\n\t\t<NcActions :variant=\"current\">\n\t\t\t<template #icon>\n\t\t\t\t<SelectColor :size=\"20\" />\n\t\t\t</template>\n\n\t\t\t<NcActionButton v-if=\"current\" close-after-click @click=\"define()\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Delete :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tRemove\n\t\t\t</NcActionButton>\n\n\t\t\t<NcActionButton v-for=\"row in variants\" close-after-click @click=\"define(row)\" :key=\"`type-icon--${row}`\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<CheckboxMarkedCircleOutline v-if=\"row === current\" :size=\"20\" />\n\t\t\t\t\t<SelectColor v-else :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\t{{ row }}\n\t\t\t</NcActionButton>\n\t\t</NcActions>\n\n\t\t<NcActions :variant=\"current\" menu-name=\"Choose a variant\">\n\t\t\t<NcActionButton v-if=\"current\" close-after-click @click=\"define()\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Delete :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tRemove\n\t\t\t</NcActionButton>\n\n\t\t\t<NcActionButton v-for=\"row in variants\" close-after-click @click=\"define(row)\" :key=\"`type-text--${row}`\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<CheckboxMarkedCircleOutline v-if=\"row === current\" :size=\"20\" />\n\t\t\t\t\t<SelectColor v-else :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\t{{ row }}\n\t\t\t</NcActionButton>\n\t\t</NcActions>\n\n\t\t<NcActions :variant=\"current\" menu-name=\"Choose a variant\">\n\t\t\t<template #icon>\n\t\t\t\t<SelectColor :size=\"20\" />\n\t\t\t</template>\n\n\t\t\t<NcActionButton v-if=\"current\" close-after-click @click=\"define()\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Delete :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tRemove\n\t\t\t</NcActionButton>\n\n\t\t\t<NcActionButton v-for=\"row in variants\" close-after-click @click=\"define(row)\" :key=\"`type-icon-text--${row}`\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<CheckboxMarkedCircleOutline v-if=\"row === current\" :size=\"20\" />\n\t\t\t\t\t<SelectColor v-else :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\t{{ row }}\n\t\t\t</NcActionButton>\n\t\t</NcActions>\n\t</div>\n</template>\n\n<script>\nimport Delete from 'vue-material-design-icons/Delete.vue'\nimport Palette from 'vue-material-design-icons/Palette.vue'\nimport SelectColor from 'vue-material-design-icons/SelectColor.vue'\nimport CheckboxMarkedCircleOutline from 'vue-material-design-icons/CheckboxMarkedCircleOutline.vue'\n\nexport default {\n\tcomponents: {\n\t\tDelete,\n\t\tPalette,\n\t\tSelectColor,\n\t\tCheckboxMarkedCircleOutline,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tcurrent: 'primary',\n\t\t\tvariants: [\n\t\t\t\t'primary',\n\t\t\t\t'secondary',\n\t\t\t\t'tertiary',\n\t\t\t\t'error',\n\t\t\t\t'warning',\n\t\t\t\t'success'\n\t\t\t]\n\t\t}\n\t},\n\tmethods: {\n\t\tdefine(row = undefined) {\n\t\t\tthis.current = row\n\t\t}\n\t}\n}\n</script>\n```\n\n### Use cases\n\n```vue\n<template>\n\t<div>\n\t\t<h2>Application menu</h2>\n\t\t<p>Has buttons, button groups, links and router links, separators, texts. May have checkboxes and radio buttons. Separator can be used to make groups of radio buttons as well.</p>\n\t\t<p><kbd>Arrows</kbd> are used to navigate between items, <kbd>Tab</kbd> is used to navigate to the next UI element on the page.</p>\n\t\t<p>\n\t\t\t<NcActions aria-label=\"Email menu\" variant=\"tertiary\">\n\t\t\t\t<NcActionButtonGroup>\n\t\t\t\t\t<NcActionButton>\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<StarOutline :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\tFavorite\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t\t<NcActionButton>\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<EmailUnread :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\tUnread\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t\t<NcActionButton>\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<Bookmark :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\tImportant\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t</NcActionButtonGroup>\n\t\t\t\t<NcActionText>\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<ClockOutlineIcon :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\t{{ new Date().toLocaleDateString('en-US') }}\n\t\t\t\t</NcActionText>\n\t\t\t\t<NcActionSeparator />\n\t\t\t\t<NcActionButton>\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<AlertOctagonIcon :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tMark as spam\n\t\t\t\t</NcActionButton>\n\t\t\t\t<NcActionCheckbox v-model=\"selected\">\n\t\t\t\t\tSelect\n\t\t\t\t</NcActionCheckbox>\n\t\t\t\t<NcActionButton>\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<OpenInNewIcon :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tMove thread\n\t\t\t\t</NcActionButton>\n\t\t\t\t<NcActionLink href=\"#\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<DownloadIcon :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tDownload message\n\t\t\t\t</NcActionLink>\n\t\t\t</NcActions>\n\t\t</p>\n\t\t<p>\n\t\t\t<NcActions aria-label=\"Text settings\" variant=\"tertiary\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<FormatTitle :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\t<NcActionButtonGroup name=\"Alignment\">\n\t\t\t\t\t<NcActionButton aria-label=\"Left\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<FormatAlignLeft :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t\t<NcActionButton aria-label=\"Center\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<FormatAlignCenter :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t\t<NcActionButton aria-label=\"Right\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<FormatAlignRight :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t</NcActionButtonGroup>\n\t\t\t\t<NcActionSeparator />\n\t\t\t\t<NcActionCheckbox v-model=\"checked.bold\" value=\"bold\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<FormatBold :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tBold\n\t\t\t\t</NcActionCheckbox>\n\t\t\t\t<NcActionCheckbox v-model=\"checked.italic\" value=\"italic\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<FormatItalic :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tItalic\n\t\t\t\t</NcActionCheckbox>\n\t\t\t\t<NcActionCheckbox v-model=\"checked.underline\" value=\"underline\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<FormatUnderline :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tUnderline\n\t\t\t\t</NcActionCheckbox>\n\t\t\t\t<NcActionSeparator />\n\t\t\t\t<NcActionRadio name=\"color\" v-model=\"color.black\" value=\"Black\">Black</NcActionRadio>\n\t\t\t\t<NcActionRadio name=\"color\" v-model=\"color.blue\" value=\"Blue\">Blue</NcActionRadio>\n\t\t\t\t<NcActionRadio name=\"color\" v-model=\"color.red\" value=\"Red\">Red</NcActionRadio>\n\t\t\t\t<NcActionRadio name=\"color\" v-model=\"color.green\" value=\"Green\">Green</NcActionRadio>\n\t\t\t</NcActions>\n\t\t</p>\n\n\t\t<h2>Navigation</h2>\n\t\t<p>Has links or router links. May use text elements, captions and separators.</p>\n\t\t<p>Uses classic <kbd>Tab</kbd> navigation.</p>\n\t\t<p>\n\t\t\t<NcActions aria-label=\"Applications navigation\" :inline=\"2\" variant=\"tertiary\">\n\t\t\t\t<NcActionLink href=\"/apps/dashboard\" icon=\"icon-category-dashboard-white\">\n\t\t\t\t\tDashboard\n\t\t\t\t</NcActionLink>\n\t\t\t\t<NcActionLink href=\"/apps/files\" icon=\"icon-files-white\">\n\t\t\t\t\tFiles\n\t\t\t\t</NcActionLink>\n\t\t\t\t<NcActionLink href=\"/apps/spreed\" icon=\"icon-talk-white\">\n\t\t\t\t\tTalk\n\t\t\t\t</NcActionLink>\n\t\t\t\t<NcActionLink href=\"/apps/contacts\" icon=\"icon-contacts-white\">\n\t\t\t\t\tContacts\n\t\t\t\t</NcActionLink>\n\t\t\t\t<NcActionLink href=\"/apps/circles\" icon=\"icon-circles-white\">\n\t\t\t\t\tCircles\n\t\t\t\t</NcActionLink>\n\t\t\t</NcActions>\n\t\t</p>\n\n\t\t<h2>Dialog</h2>\n\t\t<p>Includes data input elements, forms.</p>\n\t\t<p>Uses <kbd>Tab</kbd> navigation with a focus trap.</p>\n\t\t<p>\n\t\t\t<NcActions aria-label=\"Group management\">\n\t\t\t\t<NcActionInput trailing-button-label=\"Submit\" label=\"Rename group\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<Pencil :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t</NcActionInput>\n\t\t\t\t<NcActionButton>\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<Delete :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tRemove group\n\t\t\t\t</NcActionButton>\n\t\t\t</NcActions>\n\t\t</p>\n\n\t\t<h2>Tooltip</h2>\n\t\t<p>Has only text and no interactive elements.</p>\n\t\t<p>\n\t\t\t<NcActions aria-label=\"Contact\" :inline=\"1\">\n\t\t\t\t<NcActionLink aria-label=\"View profile\" href=\"/u/alice\" icon=\"icon-user-white\">\n\t\t\t\t\tView profile\n\t\t\t\t</NcActionLink>\n\t\t\t\t<NcActionText icon=\"icon-timezone-white\">\n\t\t\t\t\tLocal time: 10:12\n\t\t\t\t</NcActionText>\n\t\t\t</NcActions>\n\t\t</p>\n\t</div>\n</template>\n\n<script>\n// Common icons\nimport Pencil from 'vue-material-design-icons/Pencil.vue'\nimport Delete from 'vue-material-design-icons/Delete.vue'\n\n// Email icons\nimport StarOutline from 'vue-material-design-icons/StarOutline.vue'\nimport EmailUnread from 'vue-material-design-icons/Email.vue'\nimport Bookmark from 'vue-material-design-icons/Bookmark.vue'\nimport ClockOutlineIcon from 'vue-material-design-icons/ClockOutline.vue'\nimport AlertOctagonIcon from 'vue-material-design-icons/AlertOctagon.vue'\nimport CheckIcon from 'vue-material-design-icons/Check.vue'\nimport OpenInNewIcon from 'vue-material-design-icons/OpenInNew.vue'\nimport DownloadIcon from 'vue-material-design-icons/Download.vue'\n\n// Formatting icons\nimport FormatTitle from 'vue-material-design-icons/FormatTitle.vue'\nimport FormatAlignLeft from 'vue-material-design-icons/FormatAlignLeft.vue'\nimport FormatAlignCenter from 'vue-material-design-icons/FormatAlignCenter.vue'\nimport FormatAlignRight from 'vue-material-design-icons/FormatAlignRight.vue'\nimport FormatBold from 'vue-material-design-icons/FormatBold.vue'\nimport FormatItalic from 'vue-material-design-icons/FormatItalic.vue'\nimport FormatUnderline from 'vue-material-design-icons/FormatUnderline.vue'\n\nexport default {\n\tcomponents: {\n\t\t// Common icons\n\t\tPencil,\n\t\tDelete,\n\n\t\t// Email icons\n\t\tStarOutline,\n\t\tEmailUnread,\n\t\tBookmark,\n\t\tClockOutlineIcon,\n\t\tAlertOctagonIcon,\n\t\tCheckIcon,\n\t\tOpenInNewIcon,\n\t\tDownloadIcon,\n\n\t\t// Formatting icons\n\t\tFormatTitle,\n\t\tFormatAlignLeft,\n\t\tFormatAlignCenter,\n\t\tFormatAlignRight,\n\t\tFormatBold,\n\t\tFormatItalic,\n\t\tFormatUnderline,\n\t},\n\n\tdata() {\n\t\treturn {\n\t\t\tselected: false,\n\t\t\t// Formatting\n\t\t\tchecked: {\n\t\t\t\tbold: true,\n\t\t\t\titalic: false,\n\t\t\t\tunderline: false,\n\t\t\t},\n\t\t\tcolor: {\n\t\t\t\tblack: true,\n\t\t\t\tblue: false,\n\t\t\t\tred: false,\n\t\t\t\tgreen: false,\n\t\t\t},\n\t\t}\n\t},\n}\n</script>\n\n<style scoped>\np {\n\tmargin: 1rem 0;\n}\n</style>\n```\n\n## NcActions children limitations\n\n`<NcActions>` is supposed to be used with direct `<NcAction*>` children.\nAlthough it works when actions are not direct children but wrapped in custom components, it has limitations:\n- No `inline` prop property, including a single action display;\n- Accessibility issues, including changed keyboard behavior;\n- Invalid HTML.\n\n```\n<template>\n\t<table class=\"actions-limitations-table\">\n\t\t<tr>\n\t\t\t<th style=\"width: 50%\">Non-direct children</th>\n\t\t\t<th style=\"width: 50%\">Direct NcAction* children</th>\n\t\t</tr>\n\n\t\t<tr>\n\t\t\t<th colspan=\"2\">This single button is supposed to be rendered as inline action but it is rendered as a menu:</th>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td>\n\t\t\t\t<NcActions>\n\t\t\t\t\t<MyUserActionButton />\n\t\t\t\t</NcActions>\n\t\t\t</td>\n\t\t\t<td>\n\t\t\t\t<NcActions>\n\t\t\t\t\t<NcActionButton>\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<Account :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\tButton\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t</NcActions>\n\t\t\t</td>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<th colspan=\"2\">This NcActions is supposed to have 2 inline buttons but it has none:</th>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td>\n\t\t\t\t<NcActions :inline=\"2\">\n\t\t\t\t\t<MyUserActionButton v-for=\"i in 4\" />\n\t\t\t\t</NcActions>\n\t\t\t</td>\n\t\t\t<td>\n\t\t\t\t<NcActions :inline=\"2\">\n\t\t\t\t\t<NcActionButton v-for=\"i in 4\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<Account :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\tButton\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t</NcActions>\n\t\t\t</td>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<th colspan=\"2\">This NcActions is supposed to have a11y role menu and keyboard navigation but it acts like a dialog:</th>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td>\n\t\t\t\t<NcActions>\n\t\t\t\t\t<MyActionsList />\n\t\t\t\t</NcActions>\n\t\t\t</td>\n\t\t\t<td>\n\t\t\t\t<NcActions>\n\t\t\t\t\t<NcActionButton v-for=\"i in 4\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<Account :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\tButton\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t</NcActions>\n\t\t\t</td>\n\t\t</tr>\n\t</table>\n</template>\n\n<script>\nimport { h, resolveComponent } from 'vue'\nimport Account from 'vue-material-design-icons/Account.vue'\n\nexport default {\n\tcomponents: {\n\t\tAccount,\n\n\t\tMyUserActionButton: {\n\t\t\tname: 'MyUserActionButton',\n\t\t\tcomponents: { Account },\n\t\t\trender: () => h(resolveComponent('NcActionButton'), null, { default: () => 'Button', icon: () => h(Account, { size: 20 }) }),\n\t\t},\n\n\t\tMyActionsList: {\n\t\t\tname: 'MyActionsList',\n\t\t\tcomponents: { Account },\n\t\t\trender: () => h('div', null, {\n\t\t\t\tdefault: () => [\n\t\t\t\t\th(resolveComponent('NcActionButton'), null, { default: () => 'Button', icon: () => h(Account, { size: 20 }) }),\n\t\t\t\t\th(resolveComponent('NcActionButton'), null, { default: () => 'Button', icon: () => h(Account, { size: 20 }) }),\n\t\t\t\t\th(resolveComponent('NcActionButton'), null, { default: () => 'Button', icon: () => h(Account, { size: 20 }) }),\n\t\t\t\t\th(resolveComponent('NcActionButton'), null, { default: () => 'Button', icon: () => h(Account, { size: 20 }) }),\n\t\t\t\t],\n\t\t\t}),\n\t\t},\n\t},\n}\n</script>\n\n<style>\n.actions-limitations-table {\n\tborder-collapse: collapse;\n\twidth: 100%;\n\tth,\n\ttd {\n\t\tborder: 1px solid var(--color-border);\n\t\tpadding: var(--default-grid-baseline);\n\t\tmax-width: 50%;\n\t}\n\n\tth {\n\t\ttext-align: center;\n\t\ttext-wrap: wrap;\n\t}\n}\n</style>\n```\n</docs>\n\n<script>\nimport { useElementBounding, useWindowSize } from '@vueuse/core'\nimport { Fragment, computed, h, mergeProps, ref, toRef, warn } from 'vue'\nimport { useTrapStackControl } from '../../composables/useTrapStackControl.ts'\nimport { createElementId } from '../../utils/createElementId.ts'\nimport { isSlotPopulated } from '../../utils/isSlotPopulated.ts'\nimport { t } from '../../l10n.js'\n\nimport IconDotsHorizontal from 'vue-material-design-icons/DotsHorizontal.vue'\nimport NcButton from '../NcButton/index.ts'\nimport NcPopover from '../NcPopover/index.js'\nimport { NC_ACTIONS_CLOSE_MENU, NC_ACTIONS_IS_SEMANTIC_MENU } from './useNcActions.ts'\n\nconst focusableSelector = '.focusable'\n\n/**\n * The Actions component can be used to display one ore more actions.\n * If only a single action is provided, it will be rendered as an inline icon.\n * For more, a menu indicator will be shown and a popover menu containing the\n * actions will be opened on click.\n *\n * @since 0.10.0\n */\nexport default {\n\tname: 'NcActions',\n\n\tcomponents: {\n\t\tNcButton,\n\t\tNcPopover,\n\t},\n\n\tprovide() {\n\t\treturn {\n\t\t\t/**\n\t\t\t * NcActions can be used as:\n\t\t\t * - Application menu (has menu role)\n\t\t\t * - Navigation (has no specific role, should be used an element with navigation role)\n\t\t\t * - Popover with plain text or text inputs (has no specific role)\n\t\t\t * Depending on the usage (used items), the menu and its items should have different roles for a11y.\n\t\t\t * Provide the role for NcAction* components in the NcActions content.\n\t\t\t * @type {import('vue').ComputedRef<boolean>}\n\t\t\t */\n\t\t\t[NC_ACTIONS_IS_SEMANTIC_MENU]: computed(() => this.actionsMenuSemanticType === 'menu'),\n\t\t\t[NC_ACTIONS_CLOSE_MENU]: this.closeMenu,\n\t\t}\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * Specify the open state of the popover menu\n\t\t */\n\t\topen: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * This disables the internal open management,\n\t\t * so the actions menu only respects the `open` prop.\n\t\t * This is e.g. necessary for the NcAvatar component\n\t\t * to only open the actions menu after loading it's entries has finished.\n\t\t */\n\t\tmanualOpen: {\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 * Force the name to show for single actions\n\t\t */\n\t\tforceName: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Specify the menu name\n\t\t */\n\t\tmenuName: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * Apply primary styling for this menu\n\t\t */\n\t\tprimary: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Icon to show for the toggle menu button\n\t\t * when more than one action is inside the actions component.\n\t\t * Only replace the default three-dot icon if really necessary.\n\t\t */\n\t\tdefaultIcon: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * Aria label for the actions menu.\n\t\t *\n\t\t * If `menuName` is defined this will not be used to prevent\n\t\t * any accessible name conflicts. This ensures that the\n\t\t * element can be activated via voice input.\n\t\t */\n\t\tariaLabel: {\n\t\t\ttype: String,\n\t\t\tdefault: t('Actions'),\n\t\t},\n\n\t\t/**\n\t\t * @deprecated To be removed in @nextcloud/vue 9. Migration guide: remove ariaHidden prop from NcAction* components.\n\t\t * @todo Add a check in @nextcloud/vue 9 that this prop is not provided,\n\t\t * otherwise root element will inherit incorrect aria-hidden.\n\t\t */\n\t\tariaHidden: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * Wanted direction of the menu\n\t\t */\n\t\tplacement: {\n\t\t\ttype: String,\n\t\t\tdefault: 'bottom',\n\t\t},\n\n\t\t/**\n\t\t * DOM element for the actions' popover boundaries\n\t\t */\n\t\tboundariesElement: {\n\t\t\ttype: Element,\n\t\t\tdefault: () => document.getElementById('content-vue') ?? document.querySelector('body'),\n\t\t},\n\n\t\t/**\n\t\t * Selector for the actions' popover container\n\t\t */\n\t\tcontainer: {\n\t\t\ttype: [String, Object, Element, Boolean],\n\t\t\tdefault: 'body',\n\t\t},\n\n\t\t/**\n\t\t * Disabled state of the main button (single action or menu toggle)\n\t\t */\n\t\tdisabled: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Display x items inline out of the dropdown menu\n\t\t * Will be ignored if `forceMenu` is set\n\t\t */\n\t\tinline: {\n\t\t\ttype: Number,\n\t\t\tdefault: 0,\n\t\t},\n\n\t\t/**\n\t\t * Specifies the button variant used for trigger and single actions buttons.\n\t\t *\n\t\t * Accepted values: primary, secondary, tertiary, tertiary-no-background, tertiary-on-primary, error, warning, success.\n\t\t * If left empty, the default button style will be applied.\n\t\t *\n\t\t * @since 8.23.0\n\t\t */\n\t\tvariant: {\n\t\t\ttype: String,\n\t\t\tvalidator(value) {\n\t\t\t\treturn ['primary', 'secondary', 'tertiary', 'tertiary-no-background', 'tertiary-on-primary', 'error', 'warning', 'success'].includes(value)\n\t\t\t},\n\t\t\tdefault: null,\n\t\t},\n\t},\n\n\temits: [\n\t\t'click',\n\t\t'blur',\n\t\t'focus',\n\n\t\t'close',\n\t\t'closed',\n\t\t'open',\n\t\t'opened',\n\t\t'update:open',\n\t],\n\n\tsetup(props) {\n\t\tconst randomId = createElementId()\n\t\tconst triggerRandomId = `trigger-${randomId}`\n\n\t\tconst triggerButton = ref()\n\n\t\tconst { top, bottom } = useElementBounding(triggerButton)\n\t\tconst { top: boundaryTop, bottom: boundaryBottom } = useElementBounding(toRef(() => props.boundariesElement))\n\t\tconst { height: windowHeight } = useWindowSize()\n\t\tconst maxMenuHeight = computed(() => Math.max(\n\t\t\t// Either expand to the top\n\t\t\tMath.min(\n\t\t\t\t// max height is the top position of the trigger minus the header height minus the wedge and the padding\n\t\t\t\ttop.value - 84,\n\t\t\t\t// and also limited to the space in the boundary\n\t\t\t\ttop.value - boundaryTop.value,\n\t\t\t),\n\t\t\t// or expand to the bottom\n\t\t\tMath.min(\n\t\t\t\t// the max height is the window height minus current position of the trigger minus the wedge and padding\n\t\t\t\twindowHeight.value - bottom.value - 34,\n\t\t\t\t// and limit to the available space in the boundary\n\t\t\t\tboundaryBottom.value - bottom.value,\n\t\t\t),\n\t\t))\n\n\t\treturn {\n\t\t\ttriggerButton,\n\t\t\tmaxMenuHeight,\n\n\t\t\trandomId,\n\t\t\ttriggerRandomId,\n\t\t}\n\t},\n\n\tdata() {\n\t\treturn {\n\t\t\topened: this.open,\n\t\t\tfocusIndex: 0,\n\t\t\t/**\n\t\t\t * @type {'menu'|'navigation'|'dialog'|'tooltip'|'unknown'}\n\t\t\t */\n\t\t\tactionsMenuSemanticType: 'unknown',\n\t\t}\n\t},\n\n\tcomputed: {\n\t\ttriggerButtonVariant() {\n\t\t\t// If requested, we use a primary button\n\t\t\treturn this.variant || (this.primary\n\t\t\t\t? 'primary'\n\t\t\t\t// If it has a name, we use a secondary button\n\t\t\t\t: this.menuName ? 'secondary' : 'tertiary')\n\t\t},\n\n\t\t/**\n\t\t * A11y roles and keyboard navigation configuration depending on the semantic type\n\t\t */\n\t\tconfig() {\n\t\t\t/**\n\t\t\t * Accessibility notes:\n\t\t\t *\n\t\t\t * There is no valid popup role for navigation and tooltip in `aria-haspopup`.\n\t\t\t * aria-haspopup=\"true\" is equivalent to aria-haspopup=\"menu\".\n\t\t\t * They must not be treated as menus.\n\t\t\t *\n\t\t\t * Having both arrow and tab navigation is not allowed for a11y.\n\t\t\t * Either menu is an atomic UI element, and arrows select menu items, Tab moves to the next UI element.\n\t\t\t * Or the menu is an expanded list of UI elements.\n\t\t\t *\n\t\t\t * Navigation type is just an \"expanded\" block, similar to native <details> element.\n\t\t\t */\n\t\t\tconst configs = {\n\t\t\t\tmenu: {\n\t\t\t\t\tpopupRole: 'menu',\n\t\t\t\t\twithArrowNavigation: true,\n\t\t\t\t\twithTabNavigation: false,\n\t\t\t\t\twithFocusTrap: false,\n\t\t\t\t},\n\t\t\t\tnavigation: {\n\t\t\t\t\tpopupRole: undefined,\n\t\t\t\t\twithArrowNavigation: false,\n\t\t\t\t\twithTabNavigation: true,\n\t\t\t\t\twithFocusTrap: false,\n\t\t\t\t},\n\t\t\t\tdialog: {\n\t\t\t\t\tpopupRole: 'dialog',\n\t\t\t\t\twithArrowNavigation: false,\n\t\t\t\t\twithTabNavigation: true,\n\t\t\t\t\twithFocusTrap: true,\n\t\t\t\t},\n\t\t\t\ttooltip: {\n\t\t\t\t\tpopupRole: undefined,\n\t\t\t\t\twithArrowNavigation: false,\n\t\t\t\t\twithTabNavigation: false,\n\t\t\t\t\twithFocusTrap: false,\n\t\t\t\t},\n\t\t\t\t// Due to Vue limitations, we sometimes cannot determine the true type\n\t\t\t\t// As a fallback use both arrow navigation and focus trap\n\t\t\t\tunknown: {\n\t\t\t\t\tpopupRole: undefined,\n\t\t\t\t\trole: undefined,\n\t\t\t\t\twithArrowNavigation: true,\n\t\t\t\t\twithTabNavigation: false,\n\t\t\t\t\twithFocusTrap: true,\n\t\t\t\t},\n\t\t\t}\n\t\t\treturn configs[this.actionsMenuSemanticType]\n\t\t},\n\n\t\twithFocusTrap() {\n\t\t\treturn this.config.withFocusTrap\n\t\t},\n\t},\n\n\twatch: {\n\t\t// Watch parent prop\n\t\topen(state) {\n\t\t\tif (state === this.opened) {\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\tthis.opened = state\n\t\t},\n\n\t\topened() {\n\t\t\t// Ensure that pressing escape will close the menu even if the menu is not hovered\n\t\t\t// and not currently active, e.g. because user opened the context menu\n\t\t\tif (this.opened) {\n\t\t\t\tdocument.body.addEventListener('keydown', this.handleEscapePressed)\n\t\t\t} else {\n\t\t\t\tdocument.body.removeEventListener('keydown', this.handleEscapePressed)\n\t\t\t}\n\t\t},\n\t},\n\n\tcreated() {\n\t\t// When component has its own custom focus management\n\t\t// The global focus trap stack should be paused\n\t\tuseTrapStackControl(() => this.opened, {\n\t\t\tdisabled: () => this.config.withFocusTrap,\n\t\t})\n\t},\n\n\tmethods: {\n\t\t/**\n\t\t * Get the name of the action component\n\t\t *\n\t\t * @param {import('vue').VNode} action - a vnode with a NcAction* component instance\n\t\t * @return {string} the name of the action component\n\t\t */\n\t\tgetActionName(action) {\n\t\t\treturn action?.type?.name\n\t\t},\n\n\t\t/**\n\t\t * Do we have exactly one Action and\n\t\t * is it allowed as a standalone element?\n\t\t *\n\t\t * @param {import('vue').VNode} action The action to check\n\t\t * @return {boolean}\n\t\t */\n\t\tisValidSingleAction(action) {\n\t\t\treturn ['NcActionButton', 'NcActionLink', 'NcActionRouter'].includes(this.getActionName(action))\n\t\t},\n\t\tisAction(action) {\n\t\t\treturn this.getActionName(action)?.startsWith?.('NcAction')\n\t\t},\n\n\t\t/**\n\t\t * Check whether a icon prop value is an URL or not\n\t\t * @param {string} url The icon prop value\n\t\t */\n\t\tisIconUrl(url) {\n\t\t\ttry {\n\t\t\t\treturn !!(new URL(url, url.startsWith('/') ? window.location.origin : undefined))\n\t\t\t} catch (error) {\n\t\t\t\treturn false\n\t\t\t}\n\t\t},\n\n\t\t// MENU STATE MANAGEMENT\n\t\topenMenu() {\n\t\t\tif (this.opened) {\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\tthis.opened = true\n\n\t\t\t/**\n\t\t\t * Event emitted when the popover menu open state is changed\n\t\t\t *\n\t\t\t * @type {boolean}\n\t\t\t */\n\t\t\tthis.$emit('update:open', true)\n\n\t\t\t/**\n\t\t\t * Event emitted when the popover menu is opened\n\t\t\t */\n\t\t\tthis.$emit('open')\n\t\t},\n\t\tasync closeMenu(returnFocus = true) {\n\t\t\tif (!this.opened) {\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\t// Wait for the next tick to keep the menu in DOM, allowing other components to find what button in what menu was used,\n\t\t\t// for example, to implement auto set return focus.\n\t\t\t// NcPopover will actually remove the menu from DOM also on the next tick.\n\t\t\tawait this.$nextTick()\n\n\t\t\tthis.opened = false\n\n\t\t\tthis.$refs.popover?.clearFocusTrap({ returnFocus })\n\n\t\t\t/**\n\t\t\t * Event emitted when the popover menu open state is changed\n\t\t\t *\n\t\t\t * @type {boolean}\n\t\t\t */\n\t\t\tthis.$emit('update:open', false)\n\n\t\t\t/**\n\t\t\t * Event emitted when the popover menu is closed\n\t\t\t */\n\t\t\tthis.$emit('close')\n\n\t\t\t// close everything\n\t\t\tthis.focusIndex = 0\n\n\t\t\tif (returnFocus) {\n\t\t\t\t// Focus back the trigger button\n\t\t\t\tthis.$refs.triggerButton?.$el.focus()\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Called when popover is shown after the show delay\n\t\t */\n\t\tonOpened() {\n\t\t\tthis.$nextTick(() => {\n\t\t\t\tthis.focusFirstAction(null)\n\t\t\t\tthis.resizePopover()\n\n\t\t\t\t/**\n\t\t\t\t * Event emitted when the popover menu is opened.\n\t\t\t\t *\n\t\t\t\t * This event is emitted after `update:open` was emitted and the opening transition finished.\n\t\t\t\t */\n\t\t\t\tthis.$emit('opened')\n\t\t\t})\n\t\t},\n\n\t\tonClosed() {\n\t\t\t/**\n\t\t\t * Event emitted when the popover menu is closed.\n\t\t\t *\n\t\t\t * This event is emitted after `update:open` was emitted and the closing transition finished.\n\t\t\t */\n\t\t\t this.$emit('closed')\n\t\t},\n\n\t\t/**\n\t\t * Handle resizing the popover to make sure users can discover there is more to scroll\n\t\t */\n\t\tresizePopover() {\n\t\t\t// Get the inner v-popper element that defines the popover height (from floating-vue)\n\t\t\tconst inner = this.$refs.menu.closest('.v-popper__inner')\n\t\t\tconst height = this.$refs.menu.clientHeight\n\n\t\t\t// If the popover height is limited by the max-height (scrollbars shown) limit the height to half of the last element\n\t\t\tif (height > this.maxMenuHeight) {\n\t\t\t\t// sum of action heights\n\t\t\t\tlet currentHeight = 0\n\t\t\t\t// last action height\n\t\t\t\tlet actionHeight = 0\n\t\t\t\tfor (const action of this.$refs.menuList.children) {\n\t\t\t\t\t// If the max height would be overflown by half of the current element,\n\t\t\t\t\t// then we limit the height to the half of the previous element\n\t\t\t\t\tif ((currentHeight + action.clientHeight / 2) > this.maxMenuHeight) {\n\t\t\t\t\t\tinner.style.height = `${currentHeight - actionHeight / 2}px`\n\t\t\t\t\t\tbreak\n\t\t\t\t\t}\n\t\t\t\t\t// otherwise sum up the height\n\t\t\t\t\tactionHeight = action.clientHeight\n\t\t\t\t\tcurrentHeight += actionHeight\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tinner.style.height = 'fit-content'\n\t\t\t}\n\t\t},\n\n\t\t// MENU KEYS & FOCUS MANAGEMENT\n\t\t/**\n\t\t * @return {HTMLElement|null}\n\t\t */\n\t\tgetCurrentActiveMenuItemElement() {\n\t\t\treturn this.$refs.menu.querySelector('li.active')\n\t\t},\n\n\t\t/**\n\t\t * @return {NodeListOf<HTMLElement>}\n\t\t */\n\t\tgetFocusableMenuItemElements() {\n\t\t\treturn this.$refs.menu.querySelectorAll(focusableSelector)\n\t\t},\n\n\t\t/**\n\t\t * Dispatches the keydown listener to different handlers\n\t\t *\n\t\t * @param {object} event The keydown event\n\t\t */\n\t\tonKeydown(event) {\n\t\t\tif (event.key === 'Tab') {\n\t\t\t\tif (this.config.withFocusTrap) {\n\t\t\t\t\t// Focus is managed by focus-trap\n\t\t\t\t\treturn\n\t\t\t\t}\n\n\t\t\t\tif (!this.config.withTabNavigation) {\n\t\t\t\t\t// Tab is not used for navigation - close the menu\n\t\t\t\t\t// Return focus to restore Tab sequence\n\t\t\t\t\t// So browser will correctly move focus to the next element\n\t\t\t\t\tthis.closeMenu(true)\n\t\t\t\t\treturn\n\t\t\t\t}\n\n\t\t\t\t// Tab is used for classic navigation but we implement it manually\n\n\t\t\t\tevent.preventDefault()\n\n\t\t\t\tconst focusList = this.getFocusableMenuItemElements()\n\t\t\t\tconst focusIndex = [...focusList].indexOf(document.activeElement)\n\t\t\t\tif (focusIndex === -1) {\n\t\t\t\t\t// This is not supposed to happen\n\t\t\t\t\t// But if it does - do nothing and keep native behavior\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t\tconst newFocusIndex = event.shiftKey ? focusIndex - 1 : focusIndex + 1\n\n\t\t\t\t// There is no focus-trap, so going out of the menu closes it\n\t\t\t\tif (newFocusIndex < 0 || newFocusIndex === focusList.length) {\n\t\t\t\t\tthis.closeMenu(true)\n\t\t\t\t}\n\n\t\t\t\t// Update current focused element\n\t\t\t\tthis.focusIndex = newFocusIndex\n\t\t\t\tthis.focusAction()\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\tif (this.config.withArrowNavigation) {\n\t\t\t\tif (event.key === 'ArrowUp') {\n\t\t\t\t\tthis.focusPreviousAction(event)\n\t\t\t\t}\n\n\t\t\t\tif (event.key === 'ArrowDown') {\n\t\t\t\t\tthis.focusNextAction(event)\n\t\t\t\t}\n\n\t\t\t\tif (event.key === 'PageUp') {\n\t\t\t\t\tthis.focusFirstAction(event)\n\t\t\t\t}\n\n\t\t\t\tif (event.key === 'PageDown') {\n\t\t\t\t\tthis.focusLastAction(event)\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tthis.handleEscapePressed(event)\n\t\t},\n\n\t\tonTriggerKeydown(event) {\n\t\t\tif (event.key === 'Escape') {\n\t\t\t\t// Tooltip has no focusable elements and the focus remains on the trigger button.\n\t\t\t\t// So keydown event on the menu cannot be handled to close Tooltip on Escape.\n\t\t\t\t// Handle on the trigger.\n\t\t\t\tif (this.actionsMenuSemanticType === 'tooltip') {\n\t\t\t\t\tthis.closeMenu()\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\thandleEscapePressed(event) {\n\t\t\tif (event.key === 'Escape') {\n\t\t\t\tthis.closeMenu()\n\t\t\t\tevent.preventDefault()\n\t\t\t}\n\t\t},\n\n\t\tremoveCurrentActive() {\n\t\t\tconst currentActiveElement = this.$refs.menu.querySelector('li.active')\n\t\t\tif (currentActiveElement) {\n\t\t\t\tcurrentActiveElement.classList.remove('active')\n\t\t\t}\n\t\t},\n\t\tfocusAction() {\n\t\t\t// TODO: have a global disabled state for non input elements\n\t\t\tconst focusElement = this.getFocusableMenuItemElements()[this.focusIndex]\n\t\t\tif (focusElement) {\n\t\t\t\tthis.removeCurrentActive()\n\t\t\t\tconst liMenuParent = focusElement.closest('li.action')\n\t\t\t\tfocusElement.focus()\n\t\t\t\tif (liMenuParent) {\n\t\t\t\t\tliMenuParent.classList.add('active')\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\tfocusPreviousAction(event) {\n\t\t\tif (this.opened) {\n\t\t\t\tif (this.focusIndex === 0) {\n\t\t\t\t\tthis.focusLastAction(event)\n\t\t\t\t} else {\n\t\t\t\t\tthis.preventIfEvent(event)\n\t\t\t\t\tthis.focusIndex = this.focusIndex - 1\n\t\t\t\t}\n\t\t\t\tthis.focusAction()\n\t\t\t}\n\t\t},\n\t\tfocusNextAction(event) {\n\t\t\tif (this.opened) {\n\t\t\t\tconst indexLength = this.getFocusableMenuItemElements().length - 1\n\t\t\t\tif (this.focusIndex === indexLength) {\n\t\t\t\t\tthis.focusFirstAction(event)\n\t\t\t\t} else {\n\t\t\t\t\tthis.preventIfEvent(event)\n\t\t\t\t\tthis.focusIndex = this.focusIndex + 1\n\t\t\t\t}\n\t\t\t\tthis.focusAction()\n\t\t\t}\n\t\t},\n\t\tfocusFirstAction(event) {\n\t\t\tif (this.opened) {\n\t\t\t\tthis.preventIfEvent(event)\n\t\t\t\t// In case a NcActionButton is considered checked we will use this one as a initial focus\n\t\t\t\t// Having aria-checked is the simplest way to determine the checked state of a button\n\t\t\t\t// TODO: determine when we need to focus the first checked item and when we not, for example, if menu has many radio groups\n\t\t\t\tconst firstCheckedIndex = [...this.getFocusableMenuItemElements()].findIndex((button) => {\n\t\t\t\t\treturn button.getAttribute('aria-checked') === 'true' && button.getAttribute('role') === 'menuitemradio'\n\t\t\t\t})\n\t\t\t\tthis.focusIndex = firstCheckedIndex > -1 ? firstCheckedIndex : 0\n\t\t\t\tthis.focusAction()\n\t\t\t}\n\t\t},\n\t\tfocusLastAction(event) {\n\t\t\tif (this.opened) {\n\t\t\t\tthis.preventIfEvent(event)\n\t\t\t\tthis.focusIndex = this.getFocusableMenuItemElements().length - 1\n\t\t\t\tthis.focusAction()\n\t\t\t}\n\t\t},\n\t\tpreventIfEvent(event) {\n\t\t\tif (event) {\n\t\t\t\tevent.preventDefault()\n\t\t\t\tevent.stopPropagation()\n\t\t\t}\n\t\t},\n\t\tonFocus(event) {\n\t\t\tthis.$emit('focus', event)\n\t\t},\n\t\tonBlur(event) {\n\t\t\tthis.$emit('blur', event)\n\n\t\t\t// When there is no focusable elements to handle Tab press from actions menu\n\t\t\t// It requires manual closing\n\t\t\tif (this.actionsMenuSemanticType === 'tooltip') {\n\t\t\t\t// Tooltip is supposed to have no focusable element.\n\t\t\t\t// However, if there is a custom focusable element, it will be auto-focused and cause the menu to be closed on open.\n\t\t\t\tif (this.$refs.menu && this.getFocusableMenuItemElements().length === 0) {\n\t\t\t\t\tthis.closeMenu(false)\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\tonClick(event) {\n\t\t\t/**\n\t\t\t * Event emitted when the menu toggle button is clicked.\n\t\t\t *\n\t\t\t * This is e.g. necessary for the NcAvatar component\n\t\t\t * which needs to fetch the menu items on click.\n\t\t\t *\n\t\t\t * @type {PointerEvent}\n\t\t\t */\n\t\t\tthis.$emit('click', event)\n\t\t},\n\t},\n\n\t/**\n\t * The render function to display the component\n\t *\n\t * @return {object|undefined} The created VNode\n\t */\n\trender() {\n\t\tconst actions = []\n\t\t// We have to iterate over all slot elements\n\t\tconst findActions = (vnodes, actions) => {\n\t\t\tvnodes.forEach(vnode => {\n\t\t\t\tif (this.isAction(vnode)) {\n\t\t\t\t\tactions.push(vnode)\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t\t// If we encounter a Fragment, we have to check its children too\n\t\t\t\tif (vnode.type === Fragment) {\n\t\t\t\t\tfindActions(vnode.children, actions)\n\t\t\t\t}\n\t\t\t})\n\t\t}\n\t\tfindActions(this.$slots.default?.(), actions)\n\n\t\t// Check that we have at least one action\n\t\tif (actions.length === 0) {\n\t\t\treturn\n\t\t}\n\n\t\t/**\n\t\t * Separate the actions into inline and menu actions\n\t\t */\n\n\t\t/**\n\t\t * @type {import('vue').VNode[]}\n\t\t */\n\t\tlet validInlineActions = actions.filter(this.isValidSingleAction)\n\t\tif (this.forceMenu && validInlineActions.length > 0 && this.inline > 0) {\n\t\t\twarn('Specifying forceMenu will ignore any inline actions rendering.')\n\t\t\tvalidInlineActions = []\n\t\t}\n\t\t/**\n\t\t * @type {import('vue').VNode[]}\n\t\t */\n\t\tconst inlineActions = validInlineActions.slice(0, this.inline)\n\t\t/**\n\t\t * @type {import('vue').VNode[]}\n\t\t */\n\t\tconst menuActions = actions.filter(action => !inlineActions.includes(action))\n\n\t\t/**\n\t\t * Determine what kind of menu we have.\n\t\t * It defines keyboard navigation and a11y.\n\t\t */\n\n\t\tconst menuItemsActions = ['NcActionButton', 'NcActionButtonGroup', 'NcActionCheckbox', 'NcActionRadio']\n\t\tconst textInputActions = ['NcActionInput', 'NcActionTextEditable']\n\t\tconst linkActions = ['NcActionLink', 'NcActionRouter']\n\n\t\tconst hasTextInputAction = menuActions.some(action => textInputActions.includes(this.getActionName(action)))\n\t\tconst hasMenuItemAction = menuActions.some(action => menuItemsActions.includes(this.getActionName(action)))\n\t\tconst hasLinkAction = menuActions.some(action => linkActions.includes(this.getActionName(action)))\n\n\t\tif (hasTextInputAction) {\n\t\t\tthis.actionsMenuSemanticType = 'dialog'\n\t\t} else if (hasMenuItemAction) {\n\t\t\tthis.actionsMenuSemanticType = 'menu'\n\t\t} else if (hasLinkAction) {\n\t\t\tthis.actionsMenuSemanticType = 'navigation'\n\t\t} else {\n\t\t\t// (!) Hotfix (!)\n\t\t\t// In Vue 2 it is not easy to search for NcAction* in sub-component of a slot.\n\t\t\t// When a menu is rendered, children are not mounted yet.\n\t\t\t// If we have NcActions > MyActionsList > NcActionButton, only MyActionsList's vnode is available.\n\t\t\t// So when NcActions has actions as non-direct children, here then we don't know about them.\n\t\t\t// Like this menu has no buttons/links/inputs.\n\t\t\t// It makes the menu incorrectly considered a tooltip.\n\t\t\tconst ncActions = actions.filter((action) => this.getActionName(action).startsWith('NcAction'))\n\t\t\tif (ncActions.length === actions.length) {\n\t\t\t\t// True tooltip\n\t\t\t\tthis.actionsMenuSemanticType = 'tooltip'\n\t\t\t} else {\n\t\t\t\t// Custom components are passed to the NcActions\n\t\t\t\tthis.actionsMenuSemanticType = 'unknown'\n\t\t\t}\n\t\t}\n\n\t\t/**\n\t\t * Render the provided action\n\t\t *\n\t\t * @param {import('vue').VNode} action the action to render\n\t\t * @return {Function} the vue render function\n\t\t */\n\t\tconst renderInlineAction = (action) => {\n\t\t\tconst iconProp = action?.props?.icon\n\t\t\tconst icon = action?.children?.icon?.()?.[0] ?? (\n\t\t\t\tthis.isIconUrl(iconProp)\n\t\t\t\t\t? h('img', { class: 'action-item__menutoggle__icon', src: iconProp, alt: '' })\n\t\t\t\t\t: h('span', { class: ['icon', iconProp] })\n\t\t\t)\n\t\t\tconst text = action?.children?.default?.()?.[0]?.children?.trim()\n\t\t\tconst buttonText = this.forceName ? text : ''\n\n\t\t\tlet title = action?.props?.title\n\t\t\t// Show a default title for single actions if none is present\n\t\t\tif (!(this.forceName || title)) {\n\t\t\t\ttitle = text\n\t\t\t}\n\n\t\t\tconst propsToForward = { ...(action?.props ?? {}) }\n\t\t\tconst type = ['submit', 'reset'].includes(propsToForward.type) ? propsToForward.modelValue : 'button'\n\t\t\t// not available on NcButton or with different meaning\n\t\t\tdelete propsToForward.modelValue\n\t\t\tdelete propsToForward.type\n\n\t\t\treturn h(NcButton,\n\t\t\t\tmergeProps(\n\t\t\t\t\tpropsToForward,\n\t\t\t\t\t{\n\t\t\t\t\t\tclass: 'action-item action-item--single',\n\t\t\t\t\t\t'aria-label': action?.props?.['aria-label'] || text,\n\t\t\t\t\t\ttitle,\n\t\t\t\t\t\tdisabled: this.disabled || action?.props?.disabled,\n\t\t\t\t\t\tpressed: action?.props?.modelValue,\n\t\t\t\t\t\ttype,\n\t\t\t\t\t\t// If it has a menuName, we use a secondary button\n\t\t\t\t\t\tvariant: this.variant || (buttonText ? 'secondary' : 'tertiary'),\n\t\t\t\t\t\tonFocus: this.onFocus,\n\t\t\t\t\t\tonBlur: this.onBlur,\n\t\t\t\t\t\t// forward any pressed state from NcButton just like NcActionButton does\n\t\t\t\t\t\t'onUpdate:pressed': action?.props?.['onUpdate:modelValue'] ?? (() => {}),\n\t\t\t\t\t},\n\t\t\t\t),\n\t\t\t\t{\n\t\t\t\t\tdefault: () => buttonText,\n\t\t\t\t\ticon: () => icon,\n\t\t\t\t},\n\t\t\t)\n\t\t}\n\n\t\t/**\n\t\t * Render the actions popover\n\t\t *\n\t\t * @param {Array} actions the actions to render within\n\t\t * @return {Function} the vue render function\n\t\t */\n\t\tconst renderActionsPopover = (actions) => {\n\t\t\tconst triggerIcon = isSlotPopulated(this.$slots.icon?.())\n\t\t\t\t? this.$slots.icon?.()\n\t\t\t\t: (this.defaultIcon\n\t\t\t\t\t? h('span', { class: ['icon', this.defaultIcon] })\n\t\t\t\t\t: h(IconDotsHorizontal, { size: 20 })\n\t\t\t\t)\n\t\t\tconst triggerRandomId = `${this.randomId}-trigger`\n\t\t\treturn h(NcPopover,\n\t\t\t\t{\n\t\t\t\t\tref: 'popover',\n\t\t\t\t\tdelay: 0,\n\t\t\t\t\thandleResize: true,\n\t\t\t\t\tshown: this.opened,\n\t\t\t\t\tplacement: this.placement,\n\t\t\t\t\tboundary: this.boundariesElement,\n\t\t\t\t\tcontainer: this.container,\n\t\t\t\t\t...this.manualOpen && { triggers: [] },\n\t\t\t\t\tpopoverBaseClass: 'action-item__popper',\n\t\t\t\t\tpopupRole: this.config.popupRole,\n\t\t\t\t\tsetReturnFocus: this.config.withFocusTrap ? this.$refs.triggerButton?.$el : null,\n\t\t\t\t\tfocusTrap: this.config.withFocusTrap,\n\t\t\t\t\tonShow: this.openMenu,\n\t\t\t\t\tonAfterShow: this.onOpened,\n\t\t\t\t\tonAfterClose: this.onClosed,\n\t\t\t\t\tonHide: this.closeMenu,\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\ttrigger: () => h(NcButton, {\n\t\t\t\t\t\tid: triggerRandomId,\n\t\t\t\t\t\tclass: 'action-item__menutoggle',\n\t\t\t\t\t\tdisabled: this.disabled,\n\t\t\t\t\t\tvariant: this.triggerButtonVariant,\n\t\t\t\t\t\tref: 'triggerButton',\n\t\t\t\t\t\t'aria-label': this.menuName ? null : this.ariaLabel,\n\t\t\t\t\t\t// 'aria-controls' should only present together with a valid aria-haspopup\n\t\t\t\t\t\t'aria-controls': this.opened && this.config.popupRole ? this.randomId : null,\n\t\t\t\t\t\tonFocus: this.onFocus,\n\t\t\t\t\t\tonBlur: this.onBlur,\n\t\t\t\t\t\tonClick: this.onClick,\n\t\t\t\t\t\tonKeydown: this.onTriggerKeydown,\n\t\t\t\t\t}, {\n\t\t\t\t\t\ticon: () => triggerIcon,\n\t\t\t\t\t\tdefault: () => this.menuName,\n\t\t\t\t\t}),\n\t\t\t\t\tdefault: () => h('div', {\n\t\t\t\t\t\tclass: {\n\t\t\t\t\t\t\topen: this.opened,\n\t\t\t\t\t\t},\n\t\t\t\t\t\ttabindex: '-1',\n\t\t\t\t\t\tonKeydown: this.onKeydown,\n\t\t\t\t\t\tref: 'menu',\n\t\t\t\t\t}, [\n\t\t\t\t\t\th('ul', {\n\t\t\t\t\t\t\tid: this.randomId,\n\t\t\t\t\t\t\ttabindex: '-1',\n\t\t\t\t\t\t\tref: 'menuList',\n\t\t\t\t\t\t\trole: this.config.popupRole,\n\t\t\t\t\t\t\t// For most roles a label is required (dialog, menu), but also in general nothing speaks against labelling a list.\n\t\t\t\t\t\t\t// It is even recommended to do so.\n\t\t\t\t\t\t\t'aria-labelledby': triggerRandomId,\n\t\t\t\t\t\t\t'aria-modal': this.actionsMenuSemanticType === 'dialog' ? 'true' : undefined,\n\t\t\t\t\t\t}, [\n\t\t\t\t\t\t\tactions,\n\t\t\t\t\t\t]),\n\t\t\t\t\t]),\n\t\t\t\t},\n\t\t\t)\n\t\t}\n\n\t\t/**\n\t\t * If we have a single action only and didn't force a menu,\n\t\t * we render the action as a standalone button\n\t\t */\n\t\tif (actions.length === 1 && validInlineActions.length === 1 && !this.forceMenu) {\n\t\t\treturn renderInlineAction(actions[0])\n\t\t}\n\n\t\t// If we completely re-render the children\n\t\t// we need to focus the first action again\n\t\t// Mostly used when clicking a menu item\n\t\tthis.$nextTick(() => {\n\t\t\tif (this.opened && this.$refs.menu) {\n\t\t\t\tthis.resizePopover()\n\t\t\t\tconst isAnyActive = this.$refs.menu.querySelector('li.active') || []\n\t\t\t\tif (isAnyActive.length === 0) {\n\t\t\t\t\tthis.focusFirstAction()\n\t\t\t\t}\n\t\t\t}\n\t\t})\n\n\t\t/**\n\t\t * If we some inline actions to render, render them, then the menu\n\t\t */\n\t\tif (inlineActions.length > 0 && this.inline > 0) {\n\t\t\treturn h('div',\n\t\t\t\t{\n\t\t\t\t\tclass: [\n\t\t\t\t\t\t'action-items',\n\t\t\t\t\t\t`action-item--${this.triggerButtonVariant}`,\n\t\t\t\t\t],\n\t\t\t\t},\n\t\t\t\t[\n\t\t\t\t\t// Render inline actions\n\t\t\t\t\t...inlineActions.map(renderInlineAction),\n\t\t\t\t\t// render the rest within the popover menu\n\t\t\t\t\tmenuActions.length > 0\n\t\t\t\t\t\t? h('div',\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tclass: [\n\t\t\t\t\t\t\t\t\t'action-item',\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t'action-item--open': this.opened,\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t[\n\t\t\t\t\t\t\t\trenderActionsPopover(menuActions),\n\t\t\t\t\t\t\t])\n\t\t\t\t\t\t: null,\n\t\t\t\t])\n\t\t}\n\n\t\t/**\n\t\t * Otherwise, we render the actions in a popover\n\t\t */\n\t\treturn h('div',\n\t\t\t{\n\t\t\t\tclass: [\n\t\t\t\t\t'action-item action-item--default-popover',\n\t\t\t\t\t`action-item--${this.triggerButtonVariant}`,\n\t\t\t\t\t{\n\t\t\t\t\t\t'action-item--open': this.opened,\n\t\t\t\t\t},\n\t\t\t\t],\n\t\t\t},\n\t\t\t[\n\t\t\t\trenderActionsPopover(actions),\n\t\t\t],\n\t\t)\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n// Inline buttons\n.action-items {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: calc($icon-margin / 2);\n}\n\n.action-item {\n\t--open-background-color: var(--color-background-hover, $action-background-hover);\n\tposition: relative;\n\tdisplay: inline-block;\n\n\t&.action-item--primary {\n\t\t--open-background-color: var(--color-primary-element-hover);\n\t}\n\n\t&.action-item--secondary {\n\t\t--open-background-color: var(--color-primary-element-light-hover);\n\t}\n\n\t&.action-item--error {\n\t\t--open-background-color: var(--color-error-hover);\n\t}\n\n\t&.action-item--warning {\n\t\t--open-background-color: var(--color-warning-hover);\n\t}\n\n\t&.action-item--success {\n\t\t--open-background-color: var(--color-success-hover);\n\t}\n\n\t&.action-item--tertiary-no-background {\n\t\t--open-background-color: transparent;\n\t}\n\n\t&.action-item--open .action-item__menutoggle {\n\t\tbackground-color: var(--open-background-color);\n\t}\n\n\t&__menutoggle__icon {\n\t\twidth: 20px;\n\t\theight: 20px;\n\t\tobject-fit: contain;\n\t}\n}\n</style>\n\n<style lang=\"scss\">\n// We overwrote the popover base class, so we can style\n// the popover__inner for actions only.\n.v-popper--theme-dropdown.v-popper__popper.action-item__popper .v-popper__wrapper {\n\tborder-radius: var(--border-radius-large);\n\n\t.v-popper__inner {\n\t\tborder-radius: var(--border-radius-large);\n\t\tpadding: 4px;\n\t\tmax-height: calc(100vh - var(--header-height));\n\t\toverflow: auto;\n\t}\n}\n</style>\n"],"names":["actions","IconDotsHorizontal"],"mappings":"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"}

package/dist/chunks/NcAppContent-Bdlo1JwI.mjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"NcAppContent-Bdlo1JwI.mjs","sources":["../../src/utils/appName.ts","../../src/components/NcAppContent/NcAppDetailsToggle.vue","../../src/components/NcAppContent/NcAppContent.vue"],"sourcesContent":["/**\n * SPDX-FileCopyrightText: 2025 Nextcloud GmbH and Nextcloud contributors\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\n\nimport logger from './logger.ts'\n\nlet realAppName = 'missing-app-name'\n\ntry {\n\t// @ts-expect-error This is a name replaces by the compiler\n\trealAppName = appName\n} catch {\n\tlogger.error('The `@nextcloud/vue` library was used without setting / replacing the `appName`.')\n}\n\nexport const APP_NAME = realAppName\n","\n\n<template>\n\t<NcButton :aria-label=\"title\"\n\t\tclass=\"app-details-toggle\"\n\t\t:class=\"{ 'app-details-toggle--mobile': isMobile }\"\n\t\t:title\n\t\tvariant=\"tertiary\">\n\t\t<template #icon>\n\t\t\t<ArrowLeft v-if=\"isRtl\" :size=\"20\" />\n\t\t\t<ArrowRight v-else :size=\"20\" />\n\t\t</template>\n\t</NcButton>\n</template>\n\n<script>\nimport { emit } from '@nextcloud/event-bus'\nimport { useIsMobile } from '../../composables/useIsMobile/index.js'\nimport { isRtl } from '../../utils/rtl.ts'\nimport { t } from '../../l10n.js'\n\nimport ArrowRight from 'vue-material-design-icons/ArrowRight.vue'\nimport ArrowLeft from 'vue-material-design-icons/ArrowLeft.vue'\nimport NcButton from '../NcButton/index.ts'\n\nexport default {\n\tname: 'NcAppDetailsToggle',\n\n\tcomponents: {\n\t\tArrowRight,\n\t\tArrowLeft,\n\t\tNcButton,\n\t},\n\tsetup() {\n\t\treturn {\n\t\t\tisRtl,\n\t\t\tisMobile: useIsMobile(),\n\t\t}\n\t},\n\n\tcomputed: {\n\t\ttitle() {\n\t\t\treturn t('Go back to the list')\n\t\t},\n\t},\n\twatch: {\n\t\tisMobile: {\n\t\t\timmediate: true,\n\t\t\thandler() {\n\t\t\t\tthis.toggleAppNavigationButton(this.isMobile)\n\t\t\t},\n\t\t},\n\t},\n\n\tbeforeUnmount() {\n\t\tif (this.isMobile) {\n\t\t\tthis.toggleAppNavigationButton(false)\n\t\t}\n\t},\n\n\tmethods: {\n\t\ttoggleAppNavigationButton(hide = true) {\n\t\t\tconst appNavigationToggle = document.querySelector('.app-navigation .app-navigation-toggle')\n\t\t\tif (appNavigationToggle) {\n\t\t\t\tappNavigationToggle.style.display = hide ? 'none' : null\n\n\t\t\t\t// If we hide the NavigationToggle, we need to make sure the Navigation is also closed\n\t\t\t\tif (hide === true) {\n\t\t\t\t\temit('toggle-navigation', { open: false })\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.app-details-toggle {\n\tposition: sticky;\n\twidth: var(--default-clickable-area);\n\theight: var(--default-clickable-area);\n\tpadding: $icon-margin;\n\tcursor: pointer;\n\topacity: .6;\n\ttransform: rotate(180deg);\n\tbackground-color: var(--color-main-background);\n\tz-index: 2000;\n\n\ttop: var(--app-navigation-padding);\n\t// Navigation Toggle button width + 2 paddings around\n\tinset-inline-start: calc(var(--default-clickable-area) + var(--app-navigation-padding) * 2);\n\t&--mobile {\n\t\t// There is no NavigationToggle button\n\t\tinset-inline-start: var(--app-navigation-padding);\n\t}\n\n\t&:active,\n\t&:hover,\n\t&:focus {\n\t\topacity: 1;\n\t}\n}\n\n</style>\n","\n\n<docs>\n### General description\n\nThis components provides a wrapper around the main app's content.\n\nSingle-column layouts can just use the default slot. A resizable column\ncan be added by providing content to the named slot `list`.\n\n### CSS variables\nIn the css section some css variables are declared and will be available for\nall the children of the NcAppContent component\n\n### Examples\n\n#### Usage: Single-column content\n```vue\n<template>\n\t<NcAppContent>\n\t\t<h2>Single-column main content</h2>\n\t</NcAppContent>\n</template>\n```\n\n#### Usage: Two resizable columns\n```vue\n<template>\n\t<NcAppContent>\n\t\t<template #list>\n\t\t\t<div>Resizable list content</div>\n\t\t</template>\n\n\t\t<div>Main content</div>\n\t</NcAppContent>\n</template>\n```\n\n#### Overriding Defaults\nThe default, min and max sizes (in percent) of the resizable list column can be overridden.\nThe list size must be between the min and the max width value.\n\n```\n<NcAppContent\n\t:list-size=\"35\"\n\t:list-min-width=\"20\"\n\t:list-max-width=\"45\"\n>...</NcAppContent>\n```\n\n#### Usage: Custom document title\nFor accessibility reasons every document should have a `h1` heading,\nthis is visually hidden, but required for a semantically correct document.\nYou can use your app name or current view for the heading.\n\nAdditionally you can set a custom document title, e.g. to show the current status.\n\n```vue\n<template>\n\t<NcAppContent :pageHeading=\"heading ? 'Heading' : undefined\" :pageTitle=\"title ? 'Title' : undefined\" >\n\t\t<NcCheckboxRadioSwitch type=\"switch\" :checked.sync=\"title\">\n\t\t\tToggle title\n\t\t</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch type=\"switch\" :checked.sync=\"heading\">\n\t\t\tToggle Heading\n\t\t</NcCheckboxRadioSwitch>\n\t\t<NcButton @click=\"reset\">Reset</NcButton>\n\t</NcAppContent>\n</template>\n\n<script>\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\theading: false,\n\t\t\ttitle: false,\n\t\t}\n\t},\n\tmethods: {\n\t\treset() {\n\t\t\tthis.heading = false\n\t\t\tthis.title = false\n\t\t\tdocument.title = ''\n\t\t},\n\t},\n}\n</script>\n```\n</docs>\n\n<template>\n\t<main id=\"app-content-vue\" class=\"app-content no-snapper\" :class=\"{ 'app-content--has-list': hasList }\">\n\t\t<h1 v-if=\"pageHeading\" class=\"hidden-visually\">\n\t\t\t{{ pageHeading }}\n\t\t</h1>\n\n\t\t<template v-if=\"hasList\">\n\t\t\t\n\t\t\t<div v-if=\"isMobile || layout === 'no-split'\"\n\t\t\t\tclass=\"app-content-wrapper app-content-wrapper--no-split\"\n\t\t\t\t:class=\"{\n\t\t\t\t\t'app-content-wrapper--show-details': showDetails,\n\t\t\t\t\t'app-content-wrapper--show-list': !showDetails,\n\t\t\t\t\t'app-content-wrapper--mobile': isMobile,}\">\n\t\t\t\t<NcAppDetailsToggle v-if=\"showDetails\" @click.stop.prevent=\"hideDetails\" />\n\n\t\t\t\t<div v-show=\"!showDetails\">\n\t\t\t\t\t<slot name=\"list\" />\n\t\t\t\t</div>\n\t\t\t\t<slot v-if=\"showDetails\" />\n\t\t\t</div>\n\t\t\t<div v-else-if=\"layout === 'vertical-split' || layout === 'horizontal-split'\" class=\"app-content-wrapper\">\n\t\t\t\t<Splitpanes :horizontal=\"layout === 'horizontal-split'\"\n\t\t\t\t\tclass=\"default-theme\"\n\t\t\t\t\t:class=\"{ 'splitpanes--horizontal': layout === 'horizontal-split',\n\t\t\t\t\t\t'splitpanes--vertical': layout === 'vertical-split'\n\t\t\t\t\t}\"\n\t\t\t\t\t:rtl=\"isRtl\"\n\t\t\t\t\t@resized=\"handlePaneResize\">\n\t\t\t\t\t<Pane class=\"splitpanes__pane-list\"\n\t\t\t\t\t\t:size=\"listPaneSize || paneDefaults.list.size\"\n\t\t\t\t\t\t:min-size=\"paneDefaults.list.min\"\n\t\t\t\t\t\t:max-size=\"paneDefaults.list.max\">\n\t\t\t\t\t\t\n\t\t\t\t\t\t<slot name=\"list\" />\n\t\t\t\t\t</Pane>\n\n\t\t\t\t\t<Pane class=\"splitpanes__pane-details\"\n\t\t\t\t\t\t:size=\"detailsPaneSize\"\n\t\t\t\t\t\t:min-size=\"paneDefaults.details.min\"\n\t\t\t\t\t\t:max-size=\"paneDefaults.details.max\">\n\t\t\t\t\t\t\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</Pane>\n\t\t\t\t</Splitpanes>\n\t\t\t</div>\n\t\t</template>\n\t\t\n\t\t<slot v-if=\"!hasList\" />\n\t</main>\n</template>\n\n<script>\nimport { getBuilder } from '@nextcloud/browser-storage'\nimport { emit } from '@nextcloud/event-bus'\nimport { loadState } from '@nextcloud/initial-state'\nimport { useSwipe } from '@vueuse/core'\nimport { Splitpanes, Pane } from 'splitpanes'\nimport { useIsMobile } from '../../composables/useIsMobile/index.js'\nimport { APP_NAME } from '../../utils/appName.ts'\nimport { isRtl } from '../../utils/rtl.ts'\n\nimport NcAppDetailsToggle from './NcAppDetailsToggle.vue'\n\nimport 'splitpanes/dist/splitpanes.css'\n\nconst browserStorage = getBuilder('nextcloud').persist().build()\nconst { name: productName } = loadState('theming', 'data', { name: 'Nextcloud' })\nconst activeApp = loadState('core', 'active-app', APP_NAME)\nconst localizedAppName = loadState('core', 'apps', {})[activeApp]?.name ?? APP_NAME\n\n/**\n * App content container to be used for the main content of your app\n *\n */\nexport default {\n\tname: 'NcAppContent',\n\n\tcomponents: {\n\t\tNcAppDetailsToggle,\n\t\tPane,\n\t\tSplitpanes,\n\t},\n\tprops: {\n\t\t/**\n\t\t * Allows to disable the control by swipe of the app navigation open state.\n\t\t */\n\t\tdisableSwipe: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Allows you to set the default width of the resizable list in % on vertical-split\n\t\t * Allows you to set the default height of the resizable list in % on horizontal-split\n\t\t * Must be between listMinWidth and listMaxWidth\n\t\t */\n\t\tlistSize: {\n\t\t\ttype: Number,\n\t\t\tdefault: 20,\n\t\t},\n\n\t\t/**\n\t\t * Allows you to set the minimum width of the list column in % on vertical-split\n\t\t * Allows you to set the minimum height of the list column in % on horizontal-split\n\t\t */\n\t\tlistMinWidth: {\n\t\t\ttype: Number,\n\t\t\tdefault: 15,\n\t\t},\n\n\t\t/**\n\t\t * Allows you to set the maximum width of the list column in % on vertical-split\n\t\t * Allows you to set the maximum height of the list column in % on horizontal-split\n\t\t */\n\t\tlistMaxWidth: {\n\t\t\ttype: Number,\n\t\t\tdefault: 40,\n\t\t},\n\n\t\t/**\n\t\t * Specify the config key for the pane config sizes\n\t\t * Default is the global var appName if you use the webpack-vue-config\n\t\t */\n\t\tpaneConfigKey: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * When in mobile view, only the list or the details are shown.\n\t\t *\n\t\t * If you provide a list, you need to provide a variable\n\t\t * that will be set to true by the user when an element of\n\t\t * the list gets selected. The details will then show a back\n\t\t * arrow to return to the list that will update this prop to false.\n\t\t */\n\t\tshowDetails: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: true,\n\t\t},\n\n\t\t/**\n\t\t * Specify the `<h1>` page heading\n\t\t */\n\t\tpageHeading: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t},\n\t\t/**\n\t\t * Content layout used when there is a list together with content:\n\t\t * - `vertical-split` - a 2-column layout with list and default content separated vertically\n\t\t * - `no-split` - a single column layout; List is shown when `showDetails` is `false`, otherwise the default slot content is shown with a back button to return to the list.\n\t\t * - 'horizontal-split' - a 2-column layout with list and default content separated horizontally\n\t\t * On mobile screen `no-split` layout is forced.\n\t\t */\n\t\tlayout: {\n\t\t\ttype: String,\n\t\t\tdefault: 'vertical-split',\n\t\t\tvalidator(value) {\n\t\t\t\treturn ['no-split', 'vertical-split', 'horizontal-split'].includes(value)\n\t\t\t},\n\t\t},\n\n\t\t/**\n\t\t * Allow setting the page's `<title>`\n\t\t *\n\t\t * If a page heading is set it defaults to `{pageHeading} - {appName} - {productName}` e.g. `Favorites - Files - Nextcloud`.\n\t\t * When the page heading and the app name is the same only one is used, e.g. `Files - Files - Nextcloud` is shown as `Files - Nextcloud`.\n\t\t * When setting the prop then the following format will be used: `{pageTitle} - {pageHeading || appName} - {productName}`\n\t\t */\n\t\tpageTitle: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t},\n\t},\n\n\temits: [\n\t\t'update:showDetails',\n\t\t'resize:list',\n\t],\n\n\tsetup() {\n\t\treturn {\n\t\t\tisMobile: useIsMobile(),\n\t\t\tisRtl,\n\t\t}\n\t},\n\n\tdata() {\n\t\treturn {\n\t\t\tcontentHeight: 0,\n\t\t\thasList: false,\n\t\t\thasContent: false,\n\t\t\tswiping: {},\n\t\t\tlistPaneSize: this.restorePaneConfig(),\n\t\t}\n\t},\n\n\tcomputed: {\n\t\tpaneConfigID() {\n\t\t\t// If provided, let's use it\n\t\t\tif (this.paneConfigKey !== '') {\n\t\t\t\treturn `pane-list-size-${this.paneConfigKey}`\n\t\t\t}\n\n\t\t\ttry {\n\t\t\t\t// Using the webpack-vue-config, appName is a global variable\n\t\t\t\t// This will throw a ReferenceError when the global variable is missing\n\t\t\t\t// In that case either you provide paneConfigKey or else it fallback\n\t\t\t\t// to a global storage key\n\t\t\t\treturn `pane-list-size-${APP_NAME}`\n\t\t\t} catch (e) {\n\t\t\t\tconsole.info('[INFO] AppContent:', 'falling back to global nextcloud pane config')\n\t\t\t\treturn 'pane-list-size-nextcloud'\n\t\t\t}\n\t\t},\n\n\t\tdetailsPaneSize() {\n\t\t\tif (this.listPaneSize) {\n\t\t\t\treturn 100 - this.listPaneSize\n\t\t\t}\n\t\t\treturn this.paneDefaults.details.size\n\t\t},\n\n\t\tpaneDefaults() {\n\t\t\treturn {\n\t\t\t\tlist: {\n\t\t\t\t\tsize: this.listSize,\n\t\t\t\t\tmin: this.listMinWidth,\n\t\t\t\t\tmax: this.listMaxWidth,\n\t\t\t\t},\n\n\t\t\t\t// set the inverse values of the details column\n\t\t\t\t// based on the provided (or default) values of the list column\n\t\t\t\tdetails: {\n\t\t\t\t\tsize: 100 - this.listSize,\n\t\t\t\t\tmin: 100 - this.listMaxWidth,\n\t\t\t\t\tmax: 100 - this.listMinWidth,\n\t\t\t\t},\n\t\t\t}\n\t\t},\n\n\t\trealPageTitle() {\n\t\t\tconst entries = new Set()\n\t\t\tif (this.pageTitle) {\n\t\t\t\tentries.add(this.pageTitle)\n\t\t\t}\n\t\t\tif (this.pageHeading) {\n\t\t\t\tentries.add(this.pageHeading)\n\t\t\t}\n\t\t\tif (entries.size === 0) {\n\t\t\t\treturn null\n\t\t\t}\n\n\t\t\tif (entries.size < 2) {\n\t\t\t\t// Only add if not already pageHeading and pageTitle are included\n\t\t\t\tentries.add(localizedAppName)\n\t\t\t}\n\t\t\tentries.add(productName)\n\t\t\treturn [...entries.values()].join(' - ')\n\t\t},\n\t},\n\n\twatch: {\n\t\trealPageTitle: {\n\t\t\timmediate: true,\n\t\t\thandler() {\n\t\t\t\tif (this.realPageTitle !== null) {\n\t\t\t\t\tdocument.title = this.realPageTitle\n\t\t\t\t}\n\t\t\t},\n\t\t},\n\t},\n\n\tupdated() {\n\t\tthis.checkSlots()\n\t},\n\n\tmounted() {\n\t\tif (!this.disableSwipe) {\n\t\t\tthis.swiping = useSwipe(this.$el, {\n\t\t\t\tonSwipeEnd: this.handleSwipe,\n\t\t\t})\n\t\t}\n\n\t\tthis.checkSlots()\n\t\tthis.restorePaneConfig()\n\t},\n\n\tmethods: {\n\t\t/**\n\t\t * handle the swipe event\n\t\t *\n\t\t * @param {TouchEvent} e The touch event\n\t\t * @param {import('@vueuse/core').SwipeDirection} direction The swipe direction of the event\n\t\t */\n\t\thandleSwipe(e, direction) {\n\t\t\tconst minSwipeX = 70\n\t\t\tconst touchZone = 300\n\t\t\tif (Math.abs(this.swiping.lengthX) > minSwipeX) {\n\t\t\t\tif (this.swiping.coordsStart.x < (touchZone / 2) && direction === 'right') {\n\t\t\t\t\temit('toggle-navigation', {\n\t\t\t\t\t\topen: true,\n\t\t\t\t\t})\n\t\t\t\t} else if (this.swiping.coordsStart.x < touchZone * 1.5 && direction === 'left') {\n\t\t\t\t\temit('toggle-navigation', {\n\t\t\t\t\t\topen: false,\n\t\t\t\t\t})\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\thandlePaneResize(event) {\n\t\t\tconst listPaneSize = parseInt(event[0].size, 10)\n\t\t\tbrowserStorage.setItem(this.paneConfigID, JSON.stringify(listPaneSize))\n\t\t\tthis.listPaneSize = listPaneSize\n\t\t\t/**\n\t\t\t * Emitted when the list pane is resized by the user\n\t\t\t */\n\t\t\tthis.$emit('resize:list', { size: listPaneSize })\n\t\t\tconsole.debug('AppContent pane config', listPaneSize)\n\t\t},\n\n\t\t// $slots is not reactive, we need to update this manually\n\t\tcheckSlots() {\n\t\t\tthis.hasList = !!this.$slots.list\n\t\t\tthis.hasContent = !!this.$slots.default\n\t\t},\n\n\t\t// browserStorage is not reactive, we need to update this manually\n\t\trestorePaneConfig() {\n\t\t\tconst listPaneSize = parseInt(browserStorage.getItem(this.paneConfigID), 10)\n\t\t\tif (!isNaN(listPaneSize) && listPaneSize !== this.listPaneSize) {\n\t\t\t\tconsole.debug('AppContent pane config', listPaneSize)\n\t\t\t\tthis.listPaneSize = listPaneSize\n\t\t\t\treturn listPaneSize\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * The user clicked the back arrow from the details view\n\t\t */\n\t\thideDetails() {\n\t\t\tthis.$emit('update:showDetails', false)\n\t\t},\n\t},\n}\n</script>\n<style lang=\"scss\" scoped>\n\n.app-content {\n\tposition: initial;\n\tz-index: 1000;\n\tflex-basis: 100vw;\n\theight: 100%;\n\t// Overriding server styles TODO: cleanup!\n\tmargin: 0 !important;\n\tbackground-color: var(--color-main-background);\n\tmin-width: 0;\n\n\t&:not(.app-content--has-list) {\n\t\toverflow: auto;\n\t}\n}\n\n.app-content-wrapper {\n\tposition: relative;\n\twidth: 100%;\n\theight: 100%;\n}\n\n// Mobile list/details handling\n.app-content-wrapper--no-split {\n\t&.app-content-wrapper--show-list :deep() {\n\t\t.app-content-list {\n\t\t\tdisplay: flex;\n\t\t}\n\t\t.app-content-details {\n\t\t\tdisplay: none;\n\t\t}\n\t}\n\t&.app-content-wrapper--show-details :deep() {\n\t\t.app-content-list {\n\t\t\tdisplay: none;\n\t\t}\n\t\t.app-content-details {\n\t\t\tdisplay: block;\n\t\t}\n\t}\n}\n\n:deep(.splitpanes.default-theme) {\n\t.app-content-list {\n\t\tmax-width: none;\n\t\t/* Thin scrollbar is hard to catch on resizable columns */\n\t\tscrollbar-width: auto;\n\t}\n\n\t.splitpanes__pane {\n\t\tbackground-color: transparent;\n\t\ttransition: none;\n\n\t\t&-list {\n\t\t\tmin-width: 300px;\n\t\t\tposition: sticky;\n\n\t\t\t@media only screen and (width < $breakpoint-mobile) {\n\t\t\t\tdisplay: none;\n\t\t\t}\n\t\t}\n\n\t\t&-details {\n\t\t\toverflow-y: auto;\n\n\t\t\t@media only screen and (width < $breakpoint-mobile) {\n\t\t\t\tmin-width: 100%;\n\t\t\t}\n\t\t}\n\t}\n\n\t.splitpanes__splitter {\n\t\tbackground-color: var(--color-main-background);\n\t\t&::before, &::after {\n\t\t\tbackground-color: var(--color-border);\n\t\t}\n\t}\n\n\t&.splitpanes--vertical .splitpanes__splitter {\n\t\tborder-inline-start: 1px solid var(--color-border);\n\t}\n\n\t&.splitpanes--horizontal .splitpanes__splitter {\n\t\tborder-top: 1px solid var(--color-border);\n\t}\n}\n\n.app-content-wrapper--show-list {\n\t:deep(.app-content-list) {\n\t\tmax-width: none;\n\t}\n}\n</style>\n"],"names":["_sfc_main","_createBlock","_normalizeClass","_createElementBlock","_toDisplayString","_createCommentVNode","_openBlock","_Fragment","_withModifiers","_createElementVNode","_renderSlot","_createVNode","_withCtx"],"mappings":";;;;;;;;;;;;;;;AAOA,IAAI,cAAc;AAElB,IAAI;AAEW,gBAAA;AACf,QAAQ;AACP,SAAO,MAAM,kFAAkF;AAChG;AAEO,MAAM,WAAW;;ACYxB,MAAKA,cAAU;AAAA,EACd,MAAM;AAAA,EAEN,YAAY;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,EACA;AAAA,EACD,QAAQ;AACP,WAAO;AAAA,MACN;AAAA,MACA,UAAU,YAAa;AAAA,IACxB;AAAA,EACA;AAAA,EAED,UAAU;AAAA,IACT,QAAQ;AACP,aAAO,EAAE,qBAAqB;AAAA,IAC9B;AAAA,EACD;AAAA,EACD,OAAO;AAAA,IACN,UAAU;AAAA,MACT,WAAW;AAAA,MACX,UAAU;AACT,aAAK,0BAA0B,KAAK,QAAQ;AAAA,MAC5C;AAAA,IACD;AAAA,EACD;AAAA,EAED,gBAAgB;AACf,QAAI,KAAK,UAAU;AAClB,WAAK,0BAA0B,KAAK;AAAA,IACrC;AAAA,EACA;AAAA,EAED,SAAS;AAAA,IACR,0BAA0B,OAAO,MAAM;AACtC,YAAM,sBAAsB,SAAS,cAAc,wCAAwC;AAC3F,UAAI,qBAAqB;AACxB,4BAAoB,MAAM,UAAU,OAAO,SAAS;AAGpD,YAAI,SAAS,MAAM;AAClB,eAAK,qBAAqB,EAAE,MAAM,MAAO,CAAA;AAAA,QAC1C;AAAA,MACD;AAAA,IACA;AAAA,EACD;AACF;;;;;sBAtECC,YASW,qBAAA;AAAA,IATA,cAAY,SAAK;AAAA,IAC3B,OAPFC,eAAA,CAOQ,sBAAoB,EAAA,8BACc,OAAQ,SAAA,CAAA,CAAA;AAAA,IAC/C,OAAA,SAAK;AAAA,IACN,SAAQ;AAAA;IACG,cACV,MAAqC;AAAA,MAApB,OAAK,sBAAtBD,YAAqC,sBAAA;AAAA,QAZxC,KAAA;AAAA,QAY4B,MAAM;AAAA,0BAC/BA,YAAgC,uBAAA;AAAA,QAbnC,KAAA;AAAA,QAauB,MAAM;AAAA;;IAb7B,GAAA;AAAA;;;AC+JA,MAAM,iBAAiB,WAAW,WAAW,EAAE,QAAS,EAAC,MAAK;AAC9D,MAAM,EAAE,MAAM,YAAU,IAAM,UAAU,WAAW,QAAQ,EAAE,MAAM,YAAa,CAAA;AAChF,MAAM,YAAY,UAAU,QAAQ,cAAc,QAAQ;AAC1D,MAAM,mBAAmB,UAAU,QAAQ,QAAQ,CAAA,CAAE,EAAE,SAAS,GAAG,QAAQ;AAM3E,MAAK,YAAU;AAAA,EACd,MAAM;AAAA,EAEN,YAAY;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,EACA;AAAA,EACD,OAAO;AAAA;AAAA;AAAA;AAAA,IAIN,cAAc;AAAA,MACb,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOD,UAAU;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,cAAc;AAAA,MACb,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,cAAc;AAAA,MACb,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,eAAe;AAAA,MACd,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAUD,aAAa;AAAA,MACZ,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA,IAKD,aAAa;AAAA,MACZ,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQD,QAAQ;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,MACT,UAAU,OAAO;AAChB,eAAO,CAAC,YAAY,kBAAkB,kBAAkB,EAAE,SAAS,KAAK;AAAA,MACxE;AAAA,IACD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IASD,WAAW;AAAA,MACV,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA,EACD;AAAA,EAED,OAAO;AAAA,IACN;AAAA,IACA;AAAA,EACA;AAAA,EAED,QAAQ;AACP,WAAO;AAAA,MACN,UAAU,YAAa;AAAA,MACvB;AAAA,IACD;AAAA,EACA;AAAA,EAED,OAAO;AACN,WAAO;AAAA,MACN,eAAe;AAAA,MACf,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,SAAS,CAAE;AAAA,MACX,cAAc,KAAK,kBAAmB;AAAA,IACvC;AAAA,EACA;AAAA,EAED,UAAU;AAAA,IACT,eAAe;AAEd,UAAI,KAAK,kBAAkB,IAAI;AAC9B,eAAO,kBAAkB,KAAK,aAAa;AAAA,MAC5C;AAEA,UAAI;AAKH,eAAO,kBAAkB,QAAQ;AAAA,MAClC,SAAS,GAAG;AACX,gBAAQ,KAAK,sBAAsB,8CAA8C;AACjF,eAAO;AAAA,MACR;AAAA,IACA;AAAA,IAED,kBAAkB;AACjB,UAAI,KAAK,cAAc;AACtB,eAAO,MAAM,KAAK;AAAA,MACnB;AACA,aAAO,KAAK,aAAa,QAAQ;AAAA,IACjC;AAAA,IAED,eAAe;AACd,aAAO;AAAA,QACN,MAAM;AAAA,UACL,MAAM,KAAK;AAAA,UACX,KAAK,KAAK;AAAA,UACV,KAAK,KAAK;AAAA,QACV;AAAA;AAAA;AAAA,QAID,SAAS;AAAA,UACR,MAAM,MAAM,KAAK;AAAA,UACjB,KAAK,MAAM,KAAK;AAAA,UAChB,KAAK,MAAM,KAAK;AAAA,QAChB;AAAA,MACF;AAAA,IACA;AAAA,IAED,gBAAgB;AACf,YAAM,UAAU,oBAAI,IAAG;AACvB,UAAI,KAAK,WAAW;AACnB,gBAAQ,IAAI,KAAK,SAAS;AAAA,MAC3B;AACA,UAAI,KAAK,aAAa;AACrB,gBAAQ,IAAI,KAAK,WAAW;AAAA,MAC7B;AACA,UAAI,QAAQ,SAAS,GAAG;AACvB,eAAO;AAAA,MACR;AAEA,UAAI,QAAQ,OAAO,GAAG;AAErB,gBAAQ,IAAI,gBAAgB;AAAA,MAC7B;AACA,cAAQ,IAAI,WAAW;AACvB,aAAO,CAAC,GAAG,QAAQ,OAAM,CAAE,EAAE,KAAK,KAAK;AAAA,IACvC;AAAA,EACD;AAAA,EAED,OAAO;AAAA,IACN,eAAe;AAAA,MACd,WAAW;AAAA,MACX,UAAU;AACT,YAAI,KAAK,kBAAkB,MAAM;AAChC,mBAAS,QAAQ,KAAK;AAAA,QACvB;AAAA,MACA;AAAA,IACD;AAAA,EACD;AAAA,EAED,UAAU;AACT,SAAK,WAAU;AAAA,EACf;AAAA,EAED,UAAU;AACT,QAAI,CAAC,KAAK,cAAc;AACvB,WAAK,UAAU,SAAS,KAAK,KAAK;AAAA,QACjC,YAAY,KAAK;AAAA,MACjB,CAAA;AAAA,IACF;AAEA,SAAK,WAAU;AACf,SAAK,kBAAiB;AAAA,EACtB;AAAA,EAED,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOR,YAAY,GAAG,WAAW;AACzB,YAAM,YAAY;AAClB,YAAM,YAAY;AAClB,UAAI,KAAK,IAAI,KAAK,QAAQ,OAAO,IAAI,WAAW;AAC/C,YAAI,KAAK,QAAQ,YAAY,IAAK,YAAY,KAAM,cAAc,SAAS;AAC1E,eAAK,qBAAqB;AAAA,YACzB,MAAM;AAAA,UACN,CAAA;AAAA,QACF,WAAW,KAAK,QAAQ,YAAY,IAAI,YAAY,OAAO,cAAc,QAAQ;AAChF,eAAK,qBAAqB;AAAA,YACzB,MAAM;AAAA,UACN,CAAA;AAAA,QACF;AAAA,MACD;AAAA,IACA;AAAA,IAED,iBAAiB,OAAO;AACvB,YAAM,eAAe,SAAS,MAAM,CAAC,EAAE,MAAM,EAAE;AAC/C,qBAAe,QAAQ,KAAK,cAAc,KAAK,UAAU,YAAY,CAAC;AACtE,WAAK,eAAe;AAIpB,WAAK,MAAM,eAAe,EAAE,MAAM,aAAc,CAAA;AAChD,cAAQ,MAAM,0BAA0B,YAAY;AAAA,IACpD;AAAA;AAAA,IAGD,aAAa;AACZ,WAAK,UAAU,CAAC,CAAC,KAAK,OAAO;AAC7B,WAAK,aAAa,CAAC,CAAC,KAAK,OAAO;AAAA,IAChC;AAAA;AAAA,IAGD,oBAAoB;AACnB,YAAM,eAAe,SAAS,eAAe,QAAQ,KAAK,YAAY,GAAG,EAAE;AAC3E,UAAI,CAAC,MAAM,YAAY,KAAK,iBAAiB,KAAK,cAAc;AAC/D,gBAAQ,MAAM,0BAA0B,YAAY;AACpD,aAAK,eAAe;AACpB,eAAO;AAAA,MACR;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKD,cAAc;AACb,WAAK,MAAM,sBAAsB,KAAK;AAAA,IACtC;AAAA,EACD;AACF;;EAxbA,KAAA;AAAA,EA+FyB,OAAM;;;EA/F/B,KAAA;AAAA,EAkHiF,OAAM;;;;;;sBApBtFE,mBAgDO,QAAA;AAAA,IAhDD,IAAG;AAAA,IAAkB,OA9F5BD,eAAA,CA8FkC,0BAAwB,EAAA,yBAAoC,MAAO,SAAA,CAAA;AAAA;IACzF,OAAW,4BAArBC,mBAEK,MAFL,YAEKC,gBADD,OAAW,WAAA,GAAA,CAAA,KAhGjBC,mBAAA,IAAA,IAAA;AAAA,IAmGkB,MAAO,WAAvBC,UAAA,GAAAH,mBAwCWI,YA3Ib,KAAA,EAAA,GAAA;AAAA,MAqGc,OAAA,YAAY,OAAM,WAAA,2BAA7BJ,mBAYM,OAAA;AAAA,QAjHT,KAAA;AAAA,QAsGI,OAtGJD,gBAsGU,qDAAmD;AAAA,+CACL,OAAW;AAAA,6CAA0C,OAAW;AAAA,yCAAsC,OAAQ;AAAA,SAAA,CAAA;AAAA;QAIxI,OAAW,4BAArCD,YAA2E,+BAAA;AAAA,UA3G/E,KAAA;AAAA,UA2G4C,SA3G5CO,cA2GgE,SAAW,aAAA,CAAA,QAAA,SAAA,CAAA;AAAA,oCA3G3EH,mBAAA,IAAA,IAAA;AAAA,uBA6GII,mBAEM,OAAA,MAAA;AAAA,UADLC,WAAoB,KAAA,QAAA,QAAA,CAAA,GAAA,QAAA,IAAA;AAAA;mBADP,OAAW,WAAA;AAAA;QAGb,OAAW,cAAvBA,WAA2B,0BAhH/B,KAAA,EAAA,GAAA,QAAA,IAAA,IAAAL,mBAAA,IAAA,IAAA;AAAA,eAkHmB,OAAA,+BAA+B,OAAM,WAAA,sBAArDC,aAAAH,mBAwBM,OAxBN,YAwBM;AAAA,QAvBLQ,YAsBa,uBAAA;AAAA,UAtBA,YAAY,OAAM,WAAA;AAAA,UAC9B,OApHLT,eAAA,CAoHW,iBAAe;AAAA,YAAA,0BACe,OAAM,WAAA;AAAA,oCAAuD,OAAM,WAAA;AAAA;UAGtG,KAAK,OAAK;AAAA,UACV,WAAS,SAAgB;AAAA;UAzH/B,SAAAU,QA0HK,MAMO;AAAA,YANPD,YAMO,iBAAA;AAAA,cAND,OAAM;AAAA,cACV,MAAM,MAAY,gBAAI,sBAAa,KAAK;AAAA,cACxC,YAAU,SAAA,aAAa,KAAK;AAAA,cAC5B,YAAU,SAAA,aAAa,KAAK;AAAA;cA7HnC,SAAAC,QA+HM,MAAoB;AAAA,gBAApBF,WAAoB,KAAA,QAAA,QAAA,CAAA,GAAA,QAAA,IAAA;AAAA;cA/H1B,GAAA;AAAA;YAkIKC,YAMO,iBAAA;AAAA,cAND,OAAM;AAAA,cACV,MAAM,SAAe;AAAA,cACrB,YAAU,SAAA,aAAa,QAAQ;AAAA,cAC/B,YAAU,SAAA,aAAa,QAAQ;AAAA;cArItC,SAAAC,QAuIM,MAAQ;AAAA,gBAARF,WAAQ,KAAA,QAAA,WAAA,CAAA,GAAA,QAAA,IAAA;AAAA;cAvId,GAAA;AAAA;;UAAA,GAAA;AAAA;YAAAL,mBAAA,IAAA,IAAA;AAAA,cAAAA,mBAAA,IAAA,IAAA;AAAA,KA6Ie,MAAO,UAApBK,WAAwB,0BA7I1B,KAAA,EAAA,GAAA,QAAA,IAAA,IAAAL,mBAAA,IAAA,IAAA;AAAA;;;"}

package/dist/chunks/NcAppContentDetails-DsEEBJ0U.mjs DELETED Viewed

@@ -1,16 +0,0 @@
-import { createElementBlock, openBlock, renderSlot } from "vue";
-import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
-const _sfc_main = {
-  name: "NcAppContentDetails"
-};
-const _hoisted_1 = { class: "app-content-details" };
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("div", _hoisted_1, [
-    renderSlot(_ctx.$slots, "default")
-  ]);
-}
-const NcAppContentDetails = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
-export {
-  NcAppContentDetails as N
-};
-//# sourceMappingURL=NcAppContentDetails-DsEEBJ0U.mjs.map

package/dist/chunks/NcAppContentDetails-DsEEBJ0U.mjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"NcAppContentDetails-DsEEBJ0U.mjs","sources":["../../src/components/NcAppContentDetails/NcAppContentDetails.vue"],"sourcesContent":["\n\n<template>\n\t<div class=\"app-content-details\">\n\t\t\n\t\t<slot />\n\t</div>\n</template>\n\n<script>\nexport default {\n\tname: 'NcAppContentDetails',\n}\n</script>\n"],"names":["_openBlock","_createElementBlock","_renderSlot"],"mappings":";;AAaA,MAAK,YAAU;AAAA,EACd,MAAM;AACP;AATM,MAAA,aAAA,EAAA,OAAM,sBAAqB;;AAAhC,SAAAA,UAAA,GAAAC,mBAGM,OAHN,YAGM;AAAA,IADLC,WAAQ,KAAA,QAAA,SAAA;AAAA;;;"}

package/dist/chunks/NcBreadcrumb-DpW0HXlg.mjs.map DELETED Viewed

@@ -1 +0,0 @@

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

package/dist/chunks/NcChip-BQRPT42V.mjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"NcChip-BQRPT42V.mjs","sources":["../../src/components/NcChip/NcChip.vue"],"sourcesContent":["\n<docs>\n### Basic usage\n\n```vue\n<template>\n\t<div style=\"display: flex; gap: 8px; flex-wrap: wrap;\">\n\t\t<NcChip text=\"Notes.txt\" />\n\t\t<NcChip text=\"Files\" :icon-path=\"mdiFile\" />\n\t\t<NcChip text=\"Color\" :icon-path=\"mdiPalette\" variant=\"tertiary\" />\n\t\t<NcChip text=\"Current time\" :icon-path=\"mdiClock\" no-close variant=\"primary\" />\n\t</div>\n</template>\n<script>\nimport { mdiClock, mdiFile, mdiPalette } from '@mdi/js'\n\nexport default {\n\tsetup() {\n\t\treturn {\n\t\t\tmdiClock,\n\t\t\tmdiFile,\n\t\t\tmdiPalette,\n\t\t}\n\t}\n}\n</script>\n```\n\n### Advanced usage\n\nIt is also possible to use custom components for the icon by using the `icon` slot.\nIn this example we are using the `NcAvatar` component to render the users avatar as the icon.\n\n*Hint: If you use round icons like avatars you should set their size to `24px` (or use CSS variable `--chip-size`) to make them fully fill and align with the the chip*\n\nAlso it is possible to pass custom actions.\n\n```vue\n<template>\n\t<NcChip>\n\t\t\n\t\t<template #icon>\n\t\t\t<NcAvatar :size=\"24\" user=\"jdoe\" display-name=\"J. Doe\" />\n\t\t</template>\n\t\t\n\t\t<template #actions>\n\t\t\t<NcActionButton>\n\t\t\t\t<template #icon>\n\t\t\t\t\t<ContactsIcon :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tAdd to contacts\n\t\t\t</NcActionButton>\n\t\t</template>\n\t\t\n\t\tJ. Doe\n\t</NcChip>\n</template>\n<script>\nimport ContactsIcon from 'vue-material-design-icons/Contacts.vue'\nexport default {\n\tcomponents: {\n\t\tContactsIcon,\n\t},\n}\n</script>\n```\n</docs>\n\n<template>\n\t<div class=\"nc-chip\"\n\t\t:class=\"{\n\t\t\t[`nc-chip--${variant}`]: true,\n\t\t\t'nc-chip--no-actions': noClose && !hasActions(),\n\t\t\t'nc-chip--no-icon': !hasIcon(),\n\t\t}\">\n\t\t<span v-if=\"hasIcon()\" class=\"nc-chip__icon\">\n\t\t\t<slot name=\"icon\">\n\t\t\t\t\n\t\t\t\t<NcIconSvgWrapper v-if=\"iconPath || iconSvg\"\n\t\t\t\t\tinline\n\t\t\t\t\t:path=\"iconPath\"\n\t\t\t\t\t:svg=\"iconPath ? undefined : iconSvg\"\n\t\t\t\t\t:size=\"18\" />\n\t\t\t</slot>\n\t\t</span>\n\t\t<span class=\"nc-chip__text\">\n\t\t\t<slot>{{ text }}</slot>\n\t\t</span>\n\t\t<NcActions v-if=\"canClose || hasActions()\"\n\t\t\tclass=\"nc-chip__actions\"\n\t\t\t:force-menu=\"!canClose\"\n\t\t\tvariant=\"tertiary-no-background\">\n\t\t\t<NcActionButton v-if=\"canClose\"\n\t\t\t\tclose-after-click\n\t\t\t\t@click=\"emit('close')\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiClose\" :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\t{{ ariaLabelClose }}\n\t\t\t</NcActionButton>\n\t\t\t<slot name=\"actions\" />\n\t\t</NcActions>\n\t</div>\n</template>\n\n<script setup lang=\"ts\">\nimport type { Slot } from 'vue'\n\nimport { mdiClose } from '@mdi/js'\nimport { computed } from 'vue'\nimport { t } from '../../l10n.js'\nimport NcActions from '../NcActions/NcActions.vue'\nimport NcActionButton from '../NcActionButton/NcActionButton.vue'\nimport NcIconSvgWrapper from '../NcIconSvgWrapper/NcIconSvgWrapper.vue'\n\nconst props = withDefaults(defineProps<{\n\t/**\n\t * aria label to set on the close button\n\t * @default 'Close'\n\t */\n\tariaLabelClose?: string\n\n\t/**\n\t * Main text of the chip.\n\t */\n\ttext?: string\n\n\t/**\n\t * SVG path of the icon to use, this takes precedence over `iconSVG`.\n\t * For example icon paths from `@mdi/js` can be used.\n\t */\n\ticonPath?: string\n\n\t/**\n\t * Inline SVG to use as the icon\n\t */\n\ticonSvg?: string\n\n\t/**\n\t * Set to true to prevent the close button to be shown\n\t */\n\tnoClose?: boolean\n\n\t/**\n\t * Set the chips design variant-\n\t *\n\t * This sets the background style of the chip, similar to NcButton's `variant`.\n\t * @default 'secondary'\n\t * @since 8.23.0\n\t */\n\tvariant: 'primary' | 'secondary' | 'tertiary'\n}>(), {\n\tariaLabelClose: t('Close'),\n\ticonPath: undefined,\n\ticonSvg: undefined,\n\ttext: '',\n\tvariant: 'secondary',\n})\n\nconst emit = defineEmits<{\n\t/**\n\t * Emitted when the close button is clicked\n\t */\n\tclose: []\n}>()\n\nconst slots = defineSlots<{\n\t/**\n\t * The actions slot can be used to add custom actions (`NcAction*`) to the chips actions.\n\t */\n\tactions?: Slot\n\n\t/**\n\t * The default slot can be used to set the text that is shown.\n\t */\n\tdefault?: Slot\n\n\t/**\n\t * The icon slot can be used to set the chip icon.\n\t * Make sure that the icon is not exceeding a height of `--chip-size`.\n\t * For round icons a exact size of `var(--chip-size)` is recommended.\n\t */\n\ticon?: Slot\n}>()\n\nconst canClose = computed(() => !props.noClose)\nconst hasActions = () => !!slots.actions\nconst hasIcon = () => Boolean(props.iconPath || props.iconSvg || !!slots.icon)\n</script>\n\n<style scoped lang=\"scss\">\n.nc-chip {\n\t--chip-size: 24px;\n\t--chip-radius: calc(var(--chip-size) / 2);\n\t// Setup size of wrapper\n\theight: var(--chip-size);\n\tmax-width: fit-content;\n\tdisplay: flex;\n\tflex-direction: row;\n\talign-items: center;\n\tborder-radius: var(--chip-radius);\n\tbackground-color: var(--color-background-hover);\n\n\t&--primary {\n\t\tbackground-color: var(--color-primary-element);\n\t\tcolor: var(--color-primary-element-text);\n\t}\n\n\t&--secondary {\n\t\tbackground-color: var(--color-primary-element-light);\n\t\tcolor: var(--color-primary-element-light-text);\n\t}\n\n\t&--no-actions &__text {\n\t\t// If there are no actions we need to add some padding to ensure the text is not cut-off\n\t\tpadding-inline-end: calc(1.5 * var(--default-grid-baseline));\n\t}\n\n\t&--no-icon &__text {\n\t\t// Add some more space to the border\n\t\tpadding-inline-start: calc(1.5 * var(--default-grid-baseline));\n\t}\n\n\t&__text {\n\t\t// Allow to grow the text\n\t\t// this is only used if an app forces a width of the chip\n\t\tflex: 1 auto;\n\n\t\toverflow: hidden;\n\t\ttext-overflow: ellipsis;\n\t\ttext-wrap: nowrap;\n\t}\n\n\t&__icon {\n\t\t// Do neither grow nor shrink, size is fixed\n\t\tflex: 0 0 var(--chip-size);\n\t\tmargin-inline-end: var(--default-grid-baseline);\n\n\t\tline-height: 1;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\n\t\t// Force size\n\t\toverflow: hidden;\n\t\theight: var(--chip-size);\n\t\twidth: var(--chip-size);\n\t}\n\n\t&__actions {\n\t\t// Do neither grow nor shrink, size is fixed\n\t\tflex: 0 0 var(--chip-size);\n\t\t// Adjust action size to match chip size\n\t\t--default-clickable-area: var(--chip-size);\n\t\t--border-radius-element: var(--chip-radius);\n\t}\n}\n</style>\n"],"names":["_useSlots"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAsHA,UAAM,QAAQ;AA4Cd,UAAM,OAAO;AAOb,UAAM,QAAQA,SAAA;AAmBd,UAAM,WAAW,SAAS,MAAM,CAAC,MAAM,OAAO;AAC9C,UAAM,aAAa,MAAM,CAAC,CAAC,MAAM;AAC3B,UAAA,UAAU,MAAM,QAAQ,MAAM,YAAY,MAAM,WAAW,CAAC,CAAC,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/chunks/NcCounterBubble-6B_JNUUS.mjs DELETED Viewed

@@ -1,78 +0,0 @@
-import '../assets/NcCounterBubble-DWgyYB0d.css';
-import { getCanonicalLocale } from "@nextcloud/l10n";
-import { createElementBlock, openBlock, normalizeClass, toDisplayString } from "vue";
-import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
-const _sfc_main = {
-  name: "NcCounterBubble",
-  props: {
-    type: {
-      type: String,
-      default: "",
-      validator(value) {
-        return ["highlighted", "outlined", ""].includes(value);
-      }
-    },
-    /**
-     * Specifies whether the component is used within a component that is
-     * active and therefore has a primary background. Inverts the color of
-     * this component when that is the case.
-     */
-    active: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * The count to display in the counter bubble.
-     */
-    count: {
-      type: Number,
-      required: true
-    },
-    /**
-     * Disables humanization to display count as it is.
-     */
-    raw: {
-      type: Boolean,
-      required: false,
-      default: false
-    }
-  },
-  computed: {
-    counterClassObject() {
-      return {
-        "counter-bubble__counter--highlighted": this.type === "highlighted",
-        "counter-bubble__counter--outlined": this.type === "outlined",
-        active: this.active
-      };
-    },
-    humanizedCount() {
-      if (this.raw) {
-        return this.count.toString();
-      }
-      const formatter = new Intl.NumberFormat(getCanonicalLocale(), {
-        notation: "compact",
-        compactDisplay: "short"
-      });
-      return formatter.format(this.count);
-    },
-    originalCountAsTitleIfNeeded() {
-      const countAsString = this.count.toString();
-      if (this.raw || countAsString === this.humanizedCount) {
-        return void 0;
-      }
-      return countAsString;
-    }
-  }
-};
-const _hoisted_1 = ["title"];
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("div", {
-    class: normalizeClass(["counter-bubble__counter", $options.counterClassObject]),
-    title: $options.originalCountAsTitleIfNeeded
-  }, toDisplayString($options.humanizedCount), 11, _hoisted_1);
-}
-const NcCounterBubble = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-f328a941"]]);
-export {
-  NcCounterBubble as N
-};
-//# sourceMappingURL=NcCounterBubble-6B_JNUUS.mjs.map

package/dist/chunks/NcCounterBubble-6B_JNUUS.mjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"NcCounterBubble-6B_JNUUS.mjs","sources":["../../src/components/NcCounterBubble/NcCounterBubble.vue"],"sourcesContent":["\n\n<docs>\n\n### Default usage\n\nNcCounterBubble displays a number from the `count` prop in a bubble.\n\nBy default, the number is **humanized** according to Nextcloud user's locale setting. Humanization can be disabled via `raw` prop.\n\n```vue\n<template>\n\t<table>\n\t\t<tr>\n\t\t\t<th>count</th>\n\t\t\t<th>default</th>\n\t\t\t<th>raw</th>\n\t\t</tr>\n\t\t<tr v-for=\"num in numbers\" :key=\"num\">\n\t\t\t<td>{{ num }}</td>\n\t\t\t<td>\n\t\t\t\t<NcCounterBubble :count=\"num\" />\n\t\t\t</td>\n\t\t\t<td>\n\t\t\t\t<NcCounterBubble :count=\"num\" raw />\n\t\t\t</td>\n\t\t</tr>\n\t</table>\n</template>\n\n<script>\nexport default {\n\tsetup() {\n\t\treturn {\n\t\t\tnumbers: [1, 9, 75, 450, 1042, 1750, 1999, 14567, 14567890, 2000000008],\n\t\t}\n\t},\n}\n</script>\n\n<style scoped>\ntable {\n\tborder-collapse: collapse;\n}\n\nth,\ntd {\n\tborder: 1px solid var(--color-border);\n\tpadding: var(--default-grid-baseline) calc(var(--default-grid-baseline) * 2);\n}\n\nth {\n\tcolor: var(--color-text-maxcontrast);\n}\n</style>\n```\n\n### Styles\n\nUse different styles for different types of counters.\n\n```\n<template>\n\t<table>\n\t\t<tr>\n\t\t\t<th>type</th>\n\t\t\t<th>counter</th>\n\t\t\t<th>Usage example</th>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td>'' (default)</td>\n\t\t\t<td>\n\t\t\t\t<NcCounterBubble :count=\"3\" />\n\t\t\t</td>\n\t\t\t<td></td>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td>outlined</td>\n\t\t\t<td><NcCounterBubble :count=\"3\" type=\"outlined\" /></td>\n\t\t\t<td>Team/group mentions</td>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td>highlighted</td>\n\t\t\t<td>\n\t\t\t\t<NcCounterBubble :count=\"3\" type=\"highlighted\" />\n\t\t\t</td>\n\t\t\t<td>Direct mentions</td>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td>outlined active</td>\n\t\t\t<td class=\"active-like\">\n\t\t\t\t<NcCounterBubble :count=\"3\" type=\"outlined\" active />\n\t\t\t</td>\n\t\t\t<td>Same as \"outlined\", but in an \"active\" container</td>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td>highlighted active</td>\n\t\t\t<td class=\"active-like\">\n\t\t\t\t<NcCounterBubble :count=\"3\" type=\"highlighted\" active />\n\t\t\t</td>\n\t\t\t<td>Same as \"highlighted\", but in an \"active\" container</td>\n\t\t</tr>\n\t</table>\n</template>\n\n<style scoped>\ntable {\n\tborder-collapse: collapse;\n}\n\nth,\ntd {\n\tborder: 1px solid var(--color-border);\n\tpadding: var(--default-grid-baseline) calc(var(--default-grid-baseline) * 2);\n\n\t&.active-like {\n\t\tbackground-color: var(--color-primary-element);\n\t}\n}\n\nth {\n\tcolor: var(--color-text-maxcontrast);\n}\n</style>\n```\n\n### Custom content (removed)\n\nIn v8 it was possible to pass any custom content via the default slot. This feature has been removed. Use `count` prop for numbers or [NcChip](#/Components/NcChip) component for a custom content.\n</docs>\n\n<template>\n\t<div class=\"counter-bubble__counter\"\n\t\t:class=\"counterClassObject\"\n\t\t:title=\"originalCountAsTitleIfNeeded\">\n\t\t{{ humanizedCount }}\n\t</div>\n</template>\n\n<script>\nimport { getCanonicalLocale } from '@nextcloud/l10n'\n\nexport default {\n\tname: 'NcCounterBubble',\n\n\tprops: {\n\t\ttype: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t\tvalidator(value) {\n\t\t\t\treturn ['highlighted', 'outlined', ''].includes(value)\n\t\t\t},\n\t\t},\n\n\t\t/**\n\t\t * Specifies whether the component is used within a component that is\n\t\t * active and therefore has a primary background. Inverts the color of\n\t\t * this component when that is the case.\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 count to display in the counter bubble.\n\t\t */\n\t\tcount: {\n\t\t\ttype: Number,\n\t\t\trequired: true,\n\t\t},\n\n\t\t/**\n\t\t * Disables humanization to display count as it is.\n\t\t */\n\t\traw: {\n\t\t\ttype: Boolean,\n\t\t\trequired: false,\n\t\t\tdefault: false,\n\t\t},\n\t},\n\n\tcomputed: {\n\t\tcounterClassObject() {\n\t\t\treturn {\n\t\t\t\t'counter-bubble__counter--highlighted': this.type === 'highlighted',\n\t\t\t\t'counter-bubble__counter--outlined': this.type === 'outlined',\n\t\t\t\tactive: this.active,\n\t\t\t}\n\t\t},\n\n\t\thumanizedCount() {\n\t\t\tif (this.raw) {\n\t\t\t\treturn this.count.toString()\n\t\t\t}\n\n\t\t\tconst formatter = new Intl.NumberFormat(getCanonicalLocale(), {\n\t\t\t\tnotation: 'compact',\n\t\t\t\tcompactDisplay: 'short',\n\t\t\t})\n\n\t\t\treturn formatter.format(this.count)\n\t\t},\n\n\t\toriginalCountAsTitleIfNeeded() {\n\t\t\tconst countAsString = this.count.toString()\n\n\t\t\t// If raw or unchanged - no need for the title\n\t\t\tif (this.raw || countAsString === this.humanizedCount) {\n\t\t\t\treturn undefined\n\t\t\t}\n\n\t\t\treturn countAsString\n\t\t},\n\t},\n}\n\n</script>\n\n<style lang=\"scss\" scoped>\n.counter-bubble__counter {\n\t--counter-bubble-height: 22px; // ~ 1cap + 2 * 1.5 * grid\n\tfont-size: var(--font-size-small, 13px);\n\toverflow: hidden;\n\twidth: fit-content;\n\tmin-width: var(--counter-bubble-height); // Make it not narrower than a circle\n\ttext-align: center;\n\tline-height: var(--counter-bubble-height); // Expand line-height to full height to center text vertically\n\tpadding: 0 calc(1.5 * var(--default-grid-baseline));\n\tborder-radius: var(--border-radius-pill);\n\tbackground-color: var(--color-primary-element-light);\n\tfont-weight: bold;\n\tcolor: var(--color-primary-element-light-text);\n\n\t& .active {\n\t\tcolor: var(--color-main-background);\n\t\tbackground-color: var(--color-primary-element-light);\n\t}\n\n\t&--highlighted {\n\t\tcolor: var(--color-primary-element-text);\n\t\tbackground-color: var(--color-primary-element);\n\t}\n\n\t&--highlighted.active {\n\t\tcolor: var(--color-primary-element);\n\t\tbackground-color: var(--color-main-background);\n\t}\n\n\t&--outlined {\n\t\tcolor: var(--color-primary-element);\n\t\tbackground: transparent;\n\t\tbox-shadow: inset 0 0 0 2px;\n\t}\n\n\t&--outlined.active {\n\t\tcolor: var(--color-main-background);\n\t\tbox-shadow: inset 0 0 0 2px;\n\t}\n}\n</style>\n"],"names":["_createElementBlock","_normalizeClass","_toDisplayString"],"mappings":";;;AAiJA,MAAK,YAAU;AAAA,EACd,MAAM;AAAA,EAEN,OAAO;AAAA,IACN,MAAM;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,MACT,UAAU,OAAO;AAChB,eAAO,CAAC,eAAe,YAAY,EAAE,EAAE,SAAS,KAAK;AAAA,MACrD;AAAA,IACD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOD,QAAQ;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA,IAKD,OAAO;AAAA,MACN,MAAM;AAAA,MACN,UAAU;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,KAAK;AAAA,MACJ,MAAM;AAAA,MACN,UAAU;AAAA,MACV,SAAS;AAAA,IACT;AAAA,EACD;AAAA,EAED,UAAU;AAAA,IACT,qBAAqB;AACpB,aAAO;AAAA,QACN,wCAAwC,KAAK,SAAS;AAAA,QACtD,qCAAqC,KAAK,SAAS;AAAA,QACnD,QAAQ,KAAK;AAAA,MACd;AAAA,IACA;AAAA,IAED,iBAAiB;AAChB,UAAI,KAAK,KAAK;AACb,eAAO,KAAK,MAAM,SAAQ;AAAA,MAC3B;AAEA,YAAM,YAAY,IAAI,KAAK,aAAa,mBAAkB,GAAI;AAAA,QAC7D,UAAU;AAAA,QACV,gBAAgB;AAAA,MAChB,CAAA;AAED,aAAO,UAAU,OAAO,KAAK,KAAK;AAAA,IAClC;AAAA,IAED,+BAA+B;AAC9B,YAAM,gBAAgB,KAAK,MAAM,SAAQ;AAGzC,UAAI,KAAK,OAAO,kBAAkB,KAAK,gBAAgB;AACtD,eAAO;AAAA,MACR;AAEA,aAAO;AAAA,IACP;AAAA,EACD;AACF;AA1NA,MAAA,aAAA,CAAA,OAAA;;sBAuICA,mBAIM,OAAA;AAAA,IAJD,OAvINC,eAAA,CAuIY,2BACF,SAAkB,kBAAA,CAAA;AAAA,IACzB,OAAO,SAA4B;AAAA,EACjC,GAAAC,gBAAA,SAAA,cAAc,GA1InB,IAAA,UAAA;;;"}

package/dist/chunks/NcDateTimePickerNative-DoGQFKev.mjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"NcDateTimePickerNative-DoGQFKev.mjs","sources":["../../src/components/NcDateTimePickerNative/NcDateTimePickerNative.vue"],"sourcesContent":["\n\n<docs>\n\n### General description\n\nThis components provides a wrapper around the native browser datetime picker. <br>\nThis is an input with some type of date e.g. https://html.spec.whatwg.org/multipage/input.html#local-date-and-time-state-(type=datetime-local). <br>\nAll available types are: 'date', 'datetime-local', 'month', 'time' and 'week', please check them here: https://html.spec.whatwg.org/multipage/input.html# <br>\n\n### Examples\n\n```vue\n<template>\n\t<div>\n\t\t<span>Picked date: {{ value || 'null' }}</span>\n\t\t<hr/>\n\t\t<div class=\"flex\">\n\t\t\t<NcSelect v-bind=\"props\" v-model=\"type\" />\n\t\t\t<NcDateTimePickerNative\n\t\t\t\tv-model=\"value\"\n\t\t\t\t:label=\"label\"\n\t\t\t\t:type=\"type\" />\n\t\t</div>\n\t</div>\n</template>\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tprops: {\n\t\t\t\t\tclearable: false,\n\t\t\t\t\tinputLabel: 'Picker type',\n\t\t\t\t\toptions: [\n\t\t\t\t\t\t'date',\n\t\t\t\t\t\t'datetime-local',\n\t\t\t\t\t\t'month',\n\t\t\t\t\t\t'time',\n\t\t\t\t\t\t'week',\n\t\t\t\t\t],\n\t\t\t\t},\n\t\t\t\ttype: 'datetime-local',\n\t\t\t\tvalue: new Date(),\n\t\t\t\tlabel: 'Select a new date or time',\n\t\t\t}\n\t\t},\n\t}\n</script>\n<style scoped>\n.flex {\n\tdisplay: flex;\n\tgap: 4px;\n}\n</style>\n```\n\n#### Usage: type='datetime-local' with min date and max date\n```vue\n<template>\n\t<div>\n\t\t<span>Picked date: {{ value || 'null' }}</span>\n\t\t<NcDateTimePickerNative\n\t\t\tv-model=\"value\"\n\t\t\t:min=\"yesterdayDate\"\n\t\t\t:max=\"someDate\"\n\t\t\t:label=\"label\"\n\t\t\ttype=\"datetime-local\" />\n\t</div>\n</template>\n\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tvalue: new Date(),\n\t\t\t\tlabel: 'Please select a new date',\n\t\t\t\tyesterdayDate: new Date(new Date().setDate(new Date().getDate() - 1)),\n\t\t\t\tsomeDate: new Date(new Date().setDate(new Date().getDate() + 7)),\n\t\t\t}\n\t\t},\n\t}\n</script>\n```\n\n</docs>\n\n<template>\n\t<div class=\"native-datetime-picker\">\n\t\t<label class=\"native-datetime-picker--label\"\n\t\t\t:class=\"{ 'hidden-visually': hideLabel }\"\n\t\t\t:for=\"id\">\n\t\t\t{{ label }}\n\t\t</label>\n\t\t<input :id=\"id\"\n\t\t\tclass=\"native-datetime-picker--input\"\n\t\t\t:class=\"inputClass\"\n\t\t\t:type=\"type\"\n\t\t\t:value=\"formattedValue\"\n\t\t\t:min=\"formattedMin\"\n\t\t\t:max=\"formattedMax\"\n\t\t\tv-bind=\"$attrs\"\n\t\t\t@input=\"onInput\">\n\t</div>\n</template>\n\n<script>\nimport { createElementId } from '../../utils/createElementId.js'\nimport ScopeComponent from '../../utils/ScopeComponent.js'\n\nconst inputDateTypes = ['date', 'datetime-local', 'month', 'time', 'week']\n\nexport default ScopeComponent({\n\tname: 'NcDateTimePickerNative',\n\tinheritAttrs: false,\n\n\tprops: {\n\t\t/**\n\t\t * The date is – like the `Date` object in JavaScript – tied to UTC.\n\t\t * The selected time zone does not have an influence of the selected time and date value.\n\t\t * You have to translate the time yourself when you want to factor in time zones.\n\t\t * Pass null to clear the input field.\n\t\t */\n\t\tmodelValue: {\n\t\t\ttype: Date,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * id attribute of the input field\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\t\t/**\n\t\t * type attribute of the input field\n\t\t * default type: String\n\t\t * The type of the input element, it can be `date`, `datetime-local`, `month`, `time`, `week`\n\t\t */\n\t\ttype: {\n\t\t\ttype: String,\n\t\t\tdefault: 'date',\n\t\t\tvalidate: (name) => inputDateTypes.includes(name),\n\t\t},\n\t\t/**\n\t\t * text inside the label element\n\t\t * default type: String\n\t\t */\n\t\tlabel: {\n\t\t\ttype: String,\n\t\t\tdefault: 'Please choose a date',\n\t\t},\n\t\t/**\n\t\t * min attribute of the input field\n\t\t * default type: null\n\t\t */\n\t\tmin: {\n\t\t\ttype: [Date, Boolean],\n\t\t\tdefault: null,\n\t\t},\n\t\t/**\n\t\t * max attribute of the input field\n\t\t * default type: null\n\t\t */\n\t\tmax: {\n\t\t\ttype: [Date, Boolean],\n\t\t\tdefault: null,\n\t\t},\n\t\t/**\n\t\t * Flag to hide the label\n\t\t * default type: String\n\t\t * The hidden input label for accessibility purposes.\n\t\t */\n\t\thideLabel: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * Class to add to the input field.\n\t\t * Necessary to use NcDateTimePickerNative in the NcActionInput component.\n\t\t */\n\t\tinputClass: {\n\t\t\ttype: [Object, String],\n\t\t\tdefault: '',\n\t\t},\n\t},\n\n\temits: [\n\t\t'update:modelValue',\n\t],\n\n\tcomputed: {\n\t\tformattedValue() {\n\t\t\treturn this.formatValue(this.modelValue)\n\t\t},\n\t\tformattedMin() {\n\t\t\tif (this.min) {\n\t\t\t\treturn this.formatValue(this.min)\n\t\t\t}\n\t\t\treturn false\n\t\t},\n\t\tformattedMax() {\n\t\t\tif (this.max) {\n\t\t\t\treturn this.formatValue(this.max)\n\t\t\t}\n\t\t\treturn false\n\t\t},\n\t},\n\n\tmethods: {\n\t\t/**\n\t\t * Handle the input event\n\t\t *\n\t\t * @param {InputEvent} $event input event payload\n\t\t * @return {Date|null} new chosen Date() or null\n\t\t */\n\t\tonInput($event) {\n\t\t\tif (isNaN($event.target.valueAsNumber)) {\n\t\t\t\t/**\n\t\t\t\t * Emitted when the input value changes\n\t\t\t\t *\n\t\t\t\t * @return {null} null value\n\t\t\t\t */\n\t\t\t\treturn this.$emit('update:modelValue', null)\n\t\t\t}\n\t\t\tif (this.type === 'time') {\n\t\t\t\tconst time = $event.target.value\n\t\t\t\tif (this.modelValue === '' || this.modelValue === null) {\n\t\t\t\t\t// this case is because of Chrome bug\n\t\t\t\t\tconst { yyyy, MM, dd } = this.getReadableDate(new Date())\n\t\t\t\t\t/**\n\t\t\t\t\t * Emitted when the input value changes\n\t\t\t\t\t *\n\t\t\t\t\t * @return {Date} new chosen Date()\n\t\t\t\t\t */\n\t\t\t\t\treturn this.$emit('update:modelValue', new Date(`${yyyy}-${MM}-${dd}T${time}`))\n\t\t\t\t}\n\t\t\t\tconst { yyyy, MM, dd } = this.getReadableDate(this.modelValue)\n\t\t\t\t/**\n\t\t\t\t * Emitted when the input value changes\n\t\t\t\t *\n\t\t\t\t * @return {Date} new chosen Date()\n\t\t\t\t */\n\t\t\t\treturn this.$emit('update:modelValue', new Date(`${yyyy}-${MM}-${dd}T${time}`))\n\t\t\t} else if (this.type === 'month') {\n\t\t\t\tconst MM = (new Date($event.target.value).getMonth() + 1).toString().padStart(2, '0')\n\t\t\t\tif (this.modelValue === '' || this.modelValue === null) {\n\t\t\t\t\tconst { yyyy, dd, hh, mm } = this.getReadableDate(new Date())\n\t\t\t\t\t/**\n\t\t\t\t\t * Emitted when the input value changes\n\t\t\t\t\t *\n\t\t\t\t\t * @return {Date} new chosen Date()\n\t\t\t\t\t */\n\t\t\t\t\treturn this.$emit('update:modelValue', new Date(`${yyyy}-${MM}-${dd}T${hh}:${mm}`))\n\t\t\t\t}\n\t\t\t\tconst { yyyy, dd, hh, mm } = this.getReadableDate(this.modelValue)\n\t\t\t\t/**\n\t\t\t\t * Emitted when the input value changes\n\t\t\t\t *\n\t\t\t\t * @return {Date} new chosen Date()\n\t\t\t\t */\n\t\t\t\treturn this.$emit('update:modelValue', new Date(`${yyyy}-${MM}-${dd}T${hh}:${mm}`))\n\t\t\t}\n\t\t\tconst timezoneOffsetSeconds = new Date($event.target.valueAsNumber).getTimezoneOffset() * 1000 * 60\n\t\t\tconst inputDateWithTimezone = $event.target.valueAsNumber + timezoneOffsetSeconds\n\t\t\t/**\n\t\t\t * Emitted when the input value changes\n\t\t\t *\n\t\t\t * @return {Date} new chosen Date()\n\t\t\t */\n\t\t\treturn this.$emit('update:modelValue', new Date(inputDateWithTimezone))\n\t\t},\n\t\t/**\n\t\t * Returns Object with string values of a Date\n\t\t *\n\t\t * @param {Date} value The selected value\n\t\t * @return {object|undefined}\n\t\t */\n\t\tgetReadableDate(value) {\n\t\t\tif (value instanceof Date) {\n\t\t\t\tconst yyyy = value.getFullYear().toString().padStart(4, '0')\n\t\t\t\tconst MM = (value.getMonth() + 1).toString().padStart(2, '0')\n\t\t\t\tconst dd = value.getDate().toString().padStart(2, '0')\n\t\t\t\tconst hh = value.getHours().toString().padStart(2, '0')\n\t\t\t\tconst mm = value.getMinutes().toString().padStart(2, '0')\n\n\t\t\t\treturn { yyyy, MM, dd, hh, mm }\n\t\t\t}\n\t\t},\n\t\t/**\n\t\t * Returns preformatted value for the input field\n\t\t *\n\t\t * @param {Date} value The selected value\n\t\t * @return {string|undefined}\n\t\t */\n\t\tformatValue(value) {\n\t\t\tif (value instanceof Date) {\n\t\t\t\tconst { yyyy, MM, dd, hh, mm } = this.getReadableDate(value)\n\t\t\t\tif (this.type === 'datetime-local') {\n\t\t\t\t\treturn `${yyyy}-${MM}-${dd}T${hh}:${mm}`\n\t\t\t\t} else if (this.type === 'date') {\n\t\t\t\t\treturn `${yyyy}-${MM}-${dd}`\n\t\t\t\t} else if (this.type === 'month') {\n\t\t\t\t\treturn `${yyyy}-${MM}`\n\t\t\t\t} else if (this.type === 'time') {\n\t\t\t\t\treturn `${hh}:${mm}`\n\t\t\t\t} else if (this.type === 'week') {\n\t\t\t\t\tconst startDate = new Date(yyyy, 0, 1)\n\t\t\t\t\tconst daysSinceBeginningOfYear = Math.floor((value - startDate)\n\t\t\t\t\t\t/ (24 * 60 * 60 * 1000))\n\t\t\t\t\tconst weekNumber = Math.ceil(daysSinceBeginningOfYear / 7)\n\t\t\t\t\treturn `${yyyy}-W${weekNumber}`\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\treturn ''\n\t\t\t}\n\t\t},\n\t},\n})\n</script>\n\n<style lang=\"scss\" scoped>\n\t.native-datetime-picker {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t}\n\n\t.native-datetime-picker .native-datetime-picker--label {\n\t\tmargin-block-end: 2px;\n\t}\n\n\t.native-datetime-picker .native-datetime-picker--input {\n\t\t// If border width differs between focused and unfocused we need to compensate to prevent jumping\n\t\t--input-border-width-offset: calc(var(--border-width-input-focused, 2px) - var(--border-width-input, 2px));\n\t\twidth: 100%;\n\t\tflex: 0 0 auto;\n\t\tmargin: 0;\n\t\tpadding-inline-start: calc(var(--border-radius-large) + var(--input-border-width-offset));\n\t\tpadding-inline-end: calc(var(--default-grid-baseline) + var(--input-border-width-offset));\n\t\tborder: var(--border-width-input, 2px) solid var(--color-border-maxcontrast);\n\n\t\t&:active:not([disabled]),\n\t\t&:hover:not([disabled]),\n\t\t&:focus:not([disabled]),\n\t\t&:focus-within:not([disabled]) {\n\t\t\tborder-color: var(--color-main-text);\n\t\t\tborder-width: var(--border-width-input-focused, 2px);\n\t\t\tbox-shadow: 0 0 0 2px var(--color-main-background) !important;\n\t\t\t// Reset padding offset when focused\n\t\t\t--input-border-width-offset: 0px;\n\t\t}\n\t}\n\n\t[data-theme-light],\n\t[data-themes*=light] {\n\t\t.native-datetime-picker--input {\n\t\t\tcolor-scheme: light;\n\t\t}\n\t}\n\n\t[data-theme-dark],\n\t[data-themes*=dark] {\n\t\t.native-datetime-picker--input {\n\t\t\tcolor-scheme: dark;\n\t\t}\n\t}\n\n\t[data-theme-default],\n\t[data-themes*=default] {\n\t\t@media (prefers-color-scheme: light) {\n\t\t\t.native-datetime-picker--input {\n\t\t\t\tcolor-scheme: light;\n\t\t\t}\n\t\t}\n\t\t@media (prefers-color-scheme: dark) {\n\t\t\t.native-datetime-picker--input {\n\t\t\t\tcolor-scheme: dark;\n\t\t\t}\n\t\t}\n\t}\n</style>\n"],"names":["yyyy","MM","dd","hh","mm","_openBlock","_createElementBlock","_createElementVNode","_normalizeClass","_toDisplayString","_mergeProps"],"mappings":"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"}

package/dist/chunks/NcEmptyContent-CBWBkBL8.mjs.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"NcEmptyContent-CBWBkBL8.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/chunks/NcGuestContent-iQpV7mLC.mjs DELETED Viewed

@@ -1,23 +0,0 @@
-import '../assets/NcGuestContent-C9lbC3vg.css';
-import { createElementBlock, openBlock, renderSlot } from "vue";
-import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
-const _sfc_main = {
-  name: "NcGuestContent",
-  mounted() {
-    document.getElementById("content").classList.add("nc-guest-content");
-  },
-  unmounted() {
-    document.getElementById("content").classList.remove("nc-guest-content");
-  }
-};
-const _hoisted_1 = { id: "guest-content-vue" };
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("div", _hoisted_1, [
-    renderSlot(_ctx.$slots, "default", {}, void 0, true)
-  ]);
-}
-const NcGuestContent = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-d19aa4ee"]]);
-export {
-  NcGuestContent as N
-};
-//# sourceMappingURL=NcGuestContent-iQpV7mLC.mjs.map

package/dist/chunks/NcGuestContent-iQpV7mLC.mjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"NcGuestContent-iQpV7mLC.mjs","sources":["../../src/components/NcGuestContent/NcGuestContent.vue"],"sourcesContent":["\n\n<docs>\n### General description\n\nThis components provides a wrapper around guest page content.\nIt should be used as the main wrapper for public pages, similar to `NcContent`.\n\nIt can't be used multiple times on the same page.\n\n### Usage\n\n```vue\n<template>\n\t<NcGuestContent>\n\t\t<h2>Hello guest</h2>\n\t\t<span>How are you?</span>\n\t</NcGuestContent>\n</template>\n```\n</docs>\n\n<template>\n\t<div id=\"guest-content-vue\">\n\t\t<slot />\n\t</div>\n</template>\n\n<script>\n/**\n * Guest content container to be used for the guest content of your app\n */\nexport default {\n\tname: 'NcGuestContent',\n\tmounted() {\n\t\tdocument.getElementById('content').classList.add('nc-guest-content')\n\t},\n\tunmounted() {\n\t\tdocument.getElementById('content').classList.remove('nc-guest-content')\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n#guest-content-vue {\n\tcolor: var(--color-main-text);\n\tbackground-color: var(--color-main-background);\n\tmin-width: 0;\n\tborder-radius: var(--border-radius-large);\n\tbox-shadow: 0 0 10px var(--color-box-shadow);\n\theight: fit-content;\n\tpadding: 15px;\n\tmargin: 20px auto;\n}\n</style>\n\n<style lang=\"scss\">\n#content.nc-guest-content {\n\t// Enable scrolling\n\toverflow: auto;\n\n\t// Fix box being cutoff at the bottom\n\tmargin-bottom: 0;\n\theight: calc(var(--body-height) + var(--body-container-margin));\n}\n</style>\n"],"names":["_openBlock","_createElementBlock","_renderSlot"],"mappings":";;AAmCA,MAAK,YAAU;AAAA,EACd,MAAM;AAAA,EACN,UAAU;AACT,aAAS,eAAe,SAAS,EAAE,UAAU,IAAI,kBAAkB;AAAA,EACnE;AAAA,EACD,YAAY;AACX,aAAS,eAAe,SAAS,EAAE,UAAU,OAAO,kBAAkB;AAAA,EACtE;AACF;AAjBM,MAAA,aAAA,EAAA,IAAG,oBAAmB;;AAA3B,SAAAA,UAAA,GAAAC,mBAEM,OAFN,YAEM;AAAA,IADLC,WAAQ,KAAA,QAAA,WAAA,CAAA,GAAA,QAAA,IAAA;AAAA;;;"}