@nextcloud/vue
Version:
Nextcloud vue components
1 lines • 4.96 kB
Source Map (JSON)
{"version":3,"file":"NcAppNavigationSettings-T04pqKfn.mjs","sources":["../../src/components/NcAppNavigationSettings/NcAppNavigationSettings.vue"],"sourcesContent":["<!--\n - SPDX-FileCopyrightText: 2018 Nextcloud GmbH and Nextcloud contributors\n - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<script setup lang=\"ts\">\nimport type { Slot } from 'vue'\n\nimport { mdiCog, mdiCogOutline } from '@mdi/js'\nimport { onClickOutside } from '@vueuse/core'\nimport { computed, ref, useTemplateRef } from 'vue'\nimport NcButton from '../NcButton/NcButton.vue'\nimport NcIconSvgWrapper from '../NcIconSvgWrapper/NcIconSvgWrapper.vue'\nimport { t } from '../../l10n.ts'\nimport { createElementId } from '../../utils/createElementId.js'\nimport { isLegacy } from '../../utils/legacy.ts'\n\nconst {\n\texcludeClickOutsideSelectors = [],\n\tname = t('Settings'),\n} = defineProps<{\n\t/**\n\t * A query-selector or an array of query-selectors\n\t * to be ignored when clicking outside an element\n\t */\n\texcludeClickOutsideSelectors?: string | string[]\n\n\t/**\n\t * Text of the button\n\t *\n\t * @default 'Settings'\n\t */\n\tname?: string\n}>()\n\ndefineSlots<{\n\t/**\n\t * Content of the accordion button (the settings).\n\t */\n\tdefault: Slot\n}>()\n\nconst contentId = createElementId()\n/**\n * Are the settings open\n */\nconst open = ref(false)\n\n// Close the menu when the user clicks outside of the container\nconst container = useTemplateRef('wrapperElement')\nconst ignore = computed(() => Array.isArray(excludeClickOutsideSelectors)\n\t? excludeClickOutsideSelectors\n\t: excludeClickOutsideSelectors.split(' '))\nonClickOutside(container, () => {\n\topen.value = false\n}, { ignore })\n</script>\n\n<template>\n\t<div ref=\"wrapperElement\" :class=\"$style.container\">\n\t\t<div :class=\"$style.header\">\n\t\t\t<NcButton\n\t\t\t\t:aria-controls=\"contentId\"\n\t\t\t\t:aria-expanded=\"open ? 'true' : 'false'\"\n\t\t\t\t:class=\"$style.button\"\n\t\t\t\talignment=\"start\"\n\t\t\t\tvariant=\"tertiary\"\n\t\t\t\twide\n\t\t\t\t@click=\"open = !open\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<NcIconSvgWrapper :path=\"isLegacy ? mdiCog : mdiCogOutline\" />\n\t\t\t\t</template>\n\t\t\t\t{{ name }}\n\t\t\t</NcButton>\n\t\t</div>\n\t\t<Transition\n\t\t\t:enter-active-class=\"$style.animationActive\"\n\t\t\t:leave-active-class=\"$style.animationActive\"\n\t\t\t:enter-from-class=\"$style.animationStop\"\n\t\t\t:leave-to-class=\"$style.animationStop\">\n\t\t\t<div\n\t\t\t\tv-show=\"open\"\n\t\t\t\t:id=\"contentId\"\n\t\t\t\t:class=\"$style.content\">\n\t\t\t\t<slot />\n\t\t\t</div>\n\t\t</Transition>\n\t</div>\n</template>\n\n<style module>\n.container {\n\tmargin-top: auto;\n\tpadding: var(--default-grid-baseline);\n}\n\n.header {\n\tmargin-block: 0 var(--default-grid-baseline);\n\tmargin-inline: var(--default-grid-baseline);\n}\n\n/* Overwrite the padding to match NcAppNavigationItem */\n.button {\n\tpadding-inline: 0 calc((var(--default-clickable-area) - 16px) / 2) !important;\n\n\t:global(.button-vue__text) {\n\t\tfont-weight: normal;\n\t}\n}\n\n.content {\n\tdisplay: block;\n\tpadding: 10px;\n\n\t/* prevent scrolled contents from stopping too early */\n\tmargin-bottom: calc(-1 * var(--default-grid-baseline));\n\n\t/* restrict height of settings and make scrollable */\n\tmax-height: 300px;\n\toverflow-y: auto;\n}\n\n.animationActive {\n\ttransition-duration: var(--animation-slow);\n\ttransition-property: max-height, padding;\n\toverflow-y: hidden !important;\n}\n\n.animationStop {\n\tmax-height: 0 !important;\n\tpadding: 0 10px !important;\n}\n</style>\n"],"names":["container","_createElementBlock","_normalizeClass","$style","_createElementVNode","_createVNode","_unref","_createTextVNode","name","_Transition","_renderSlot"],"mappings":";;;;;;;;;;;;;;;;;;AA0CA,UAAM,YAAY,gBAAA;AAIlB,UAAM,OAAO,IAAI,KAAK;AAGtB,UAAMA,aAAY,eAAe,gBAAgB;AACjD,UAAM,SAAS,SAAS,MAAM,MAAM,QAAQ,QAAA,4BAA4B,IACrE,QAAA,+BACA,QAAA,6BAA6B,MAAM,GAAG,CAAC;AAC1C,mBAAeA,YAAW,MAAM;AAC/B,WAAK,QAAQ;AAAA,IACd,GAAG,EAAE,QAAQ;;0BAIZC,mBA4BM,OAAA;AAAA,QA5BD,KAAI;AAAA,QAAkB,OAAKC,eAAEC,KAAAA,OAAO,SAAS;AAAA,MAAA;QACjDC,mBAcM,OAAA;AAAA,UAdA,OAAKF,eAAEC,KAAAA,OAAO,MAAM;AAAA,QAAA;UACzBE,YAYW,UAAA;AAAA,YAXT,iBAAeC,MAAA,SAAA;AAAA,YACf,iBAAe,KAAA,QAAI,SAAA;AAAA,YACnB,OAAKJ,eAAEC,KAAAA,OAAO,MAAM;AAAA,YACrB,WAAU;AAAA,YACV,SAAQ;AAAA,YACR,MAAA;AAAA,YACC,SAAK,OAAA,CAAA,MAAA,OAAA,CAAA,IAAA,CAAA,WAAE,KAAA,QAAI,CAAI,KAAA;AAAA,UAAA;YACL,cACV,MAA8D;AAAA,cAA9DE,YAA8D,kBAAA;AAAA,gBAA3C,MAAMC,MAAA,QAAA,IAAWA,MAAA,MAAA,IAASA,MAAA,aAAA;AAAA,cAAA;;6BACnC,MACX;AAAA,cADWC,gBAAA,sBACRC,KAAAA,IAAI,GAAA,CAAA;AAAA,YAAA;;;;QAGTH,YAWaI,YAAA;AAAA,UAVX,sBAAoBN,KAAAA,OAAO;AAAA,UAC3B,sBAAoBA,KAAAA,OAAO;AAAA,UAC3B,oBAAkBA,KAAAA,OAAO;AAAA,UACzB,kBAAgBA,KAAAA,OAAO;AAAA,QAAA;2BACxB,MAKM;AAAA,2BALNC,mBAKM,OAAA;AAAA,cAHJ,IAAIE,MAAA,SAAA;AAAA,cACJ,OAAKJ,eAAEC,KAAAA,OAAO,OAAO;AAAA,YAAA;cACtBO,WAAQ,KAAA,QAAA,SAAA;AAAA,YAAA;sBAHA,KAAA,KAAI;AAAA,YAAA;;;;;;;;;;;;;;;;;;;;;;;;;;"}