npm - @nextcloud/vue - Versions diffs - 8.29.2 → 8.30.0 - Mend

@nextcloud/vue 8.29.2 → 8.30.0

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 (252) hide show

package/dist/index.mjs CHANGED Viewed

@@ -1,53 +1,56 @@
-import { N as NcActionButton } from "./chunks/NcActionButton-rjMoymt-.mjs";
+import { N as NcActionButton } from "./chunks/NcActionButton-DC3oAI2L.mjs";
 import { N as NcActionButtonGroup } from "./chunks/NcActionButtonGroup-hhh3GBSS.mjs";
 import NcActionCaption from "./Components/NcActionCaption.mjs";
 import { N as NcActionCheckbox } from "./chunks/NcActionCheckbox-DSMKeccY.mjs";
-import { N as NcActionInput } from "./chunks/NcActionInput-CQ_WEPqQ.mjs";
+import { N as NcActionInput } from "./chunks/NcActionInput-B5ysJl2S.mjs";
 import NcActionLink from "./Components/NcActionLink.mjs";
 import { N as NcActionRadio } from "./chunks/NcActionRadio-yAm71xxU.mjs";
 import NcActionRouter from "./Components/NcActionRouter.mjs";
-import { N as NcActions } from "./chunks/NcActions-BKZA1xVL.mjs";
+import { N as NcActions } from "./chunks/NcActions-DdARGGZ_.mjs";
 import NcActionSeparator from "./Components/NcActionSeparator.mjs";
 import NcActionText from "./Components/NcActionText.mjs";
-import { N as NcActionTextEditable } from "./chunks/NcActionTextEditable-xWQGdOVl.mjs";
+import { N as NcActionTextEditable } from "./chunks/NcActionTextEditable-CpxJ_LEa.mjs";
 import { N as NcAppContent } from "./chunks/NcAppContent-BS7BiMG0.mjs";
 import NcAppContentDetails from "./Components/NcAppContentDetails.mjs";
 import NcAppContentList from "./Components/NcAppContentList.mjs";
 import { N as NcAppNavigation } from "./chunks/NcAppNavigation-BvEa92PC.mjs";
-import { N as NcAppNavigationCaption } from "./chunks/NcAppNavigationCaption-hDsiQMLr.mjs";
+import { N as NcAppNavigationCaption } from "./chunks/NcAppNavigationCaption-O4l8dFkh.mjs";
 import NcAppNavigationIconBullet from "./Components/NcAppNavigationIconBullet.mjs";
-import { N as NcAppNavigationItem } from "./chunks/NcAppNavigationItem-NIMhmJHh.mjs";
+import { N as NcAppNavigationItem } from "./chunks/NcAppNavigationItem-BFF0p136.mjs";
 import NcAppNavigationList from "./Components/NcAppNavigationList.mjs";
 import NcAppNavigationNew from "./Components/NcAppNavigationNew.mjs";
 import { N as NcAppNavigationNewItem } from "./chunks/NcAppNavigationNewItem-D4fJeBl0.mjs";
 import { N as NcAppNavigationSearch } from "./chunks/NcAppNavigationSearch-B9OkdsuE.mjs";
-import { N as NcAppNavigationSettings } from "./chunks/NcAppNavigationSettings-BV34ogWP.mjs";
+import { N as NcAppNavigationSettings } from "./chunks/NcAppNavigationSettings-Do0e5oWy.mjs";
 import NcAppNavigationSpacer from "./Components/NcAppNavigationSpacer.mjs";
 import { N as NcAppSettingsDialog } from "./chunks/NcAppSettingsDialog-BwsIc_QT.mjs";
 import NcAppSettingsSection from "./Components/NcAppSettingsSection.mjs";
-import { N as NcAppSidebar } from "./chunks/NcAppSidebar-BJgPYOcZ.mjs";
+import { N as NcAppSidebar } from "./chunks/NcAppSidebar-AR-D7HSj.mjs";
 import { N as NcAppSidebarHeader } from "./chunks/NcAppSidebarHeader-G2VD8Nfl.mjs";
 import NcAppSidebarTab from "./Components/NcAppSidebarTab.mjs";
-import { N as NcAvatar } from "./chunks/NcAvatar-CgF-MFtU.mjs";
-import { u } from "./chunks/NcAvatar-CgF-MFtU.mjs";
+import { N as NcAssistantButton } from "./chunks/NcAssistantButton-Ck1NUjhl.mjs";
+import NcAssistantContent from "./Components/NcAssistantContent.mjs";
+import { N as NcAssistantIcon } from "./chunks/NcAssistantIcon-tjSguP9N.mjs";
+import { N as NcAvatar } from "./chunks/NcAvatar-BEIBwiA6.mjs";
+import { u } from "./chunks/NcAvatar-BEIBwiA6.mjs";
 import { N as NcBlurHash } from "./chunks/NcBlurHash-do2wxY-0.mjs";
-import { N as NcBreadcrumb } from "./chunks/NcBreadcrumb-DJpYjXCe.mjs";
-import { N as NcBreadcrumbs } from "./chunks/NcBreadcrumbs-B722pBOd.mjs";
+import { N as NcBreadcrumb } from "./chunks/NcBreadcrumb-BYYXWaif.mjs";
+import { N as NcBreadcrumbs } from "./chunks/NcBreadcrumbs-cj5ip2-X.mjs";
 import NcButton from "./Components/NcButton.mjs";
-import { N as NcCheckboxRadioSwitch } from "./chunks/NcCheckboxRadioSwitch-ip_mRd2T.mjs";
-import { N as NcCollectionList } from "./chunks/NcCollectionList-Khg3X3Zq.mjs";
-import { N as NcColorPicker } from "./chunks/NcColorPicker-MXMbRaLk.mjs";
+import { N as NcCheckboxRadioSwitch } from "./chunks/NcCheckboxRadioSwitch-DqdNvkCt.mjs";
+import { N as NcCollectionList } from "./chunks/NcCollectionList-CLv50tJ3.mjs";
+import { N as NcColorPicker } from "./chunks/NcColorPicker-52xaYx9k.mjs";
 import { N as NcContent } from "./chunks/NcContent-BbmqoSY7.mjs";
 import { N as NcCounterBubble } from "./chunks/NcCounterBubble-CDfRYl8B.mjs";
-import { N as NcDashboardWidget } from "./chunks/NcDashboardWidget-D0cFVt4i.mjs";
-import { N as NcDashboardWidgetItem } from "./chunks/NcDashboardWidgetItem-D33MR-DH.mjs";
+import { N as NcDashboardWidget } from "./chunks/NcDashboardWidget-809lybR1.mjs";
+import { N as NcDashboardWidgetItem } from "./chunks/NcDashboardWidgetItem-6JbU9gp1.mjs";
 import { N as NcDateTime } from "./chunks/NcDateTime-kanSdMgW.mjs";
 import NcDateTimePicker from "./Components/NcDateTimePicker.mjs";
 import NcDateTimePickerNative from "./Components/NcDateTimePickerNative.mjs";
 import { N as NcDialog } from "./chunks/NcDialog-C1b3UtA7.mjs";
 import { N as NcDialogButton } from "./chunks/NcDialogButton-Di9tU3e_.mjs";
 import NcEllipsisedOption from "./Components/NcEllipsisedOption.mjs";
-import { N as NcEmojiPicker } from "./chunks/NcEmojiPicker-DJHvkF--.mjs";
+import { N as NcEmojiPicker } from "./chunks/NcEmojiPicker-CyZg0bCF.mjs";
 import NcEmptyContent from "./Components/NcEmptyContent.mjs";
 import NcGuestContent from "./Components/NcGuestContent.mjs";
 import NcHeaderButton from "./Components/NcHeaderButton.mjs";
@@ -55,43 +58,43 @@ import { N as NcHeaderMenu } from "./chunks/NcHeaderMenu-Dq_Avv2T.mjs";
 import { N as NcHighlight } from "./chunks/index-Bz6q9mZw.mjs";
 import { N as NcIconSvgWrapper } from "./chunks/NcIconSvgWrapper-Cb-cPj1R.mjs";
 import { N as NcInputField } from "./chunks/NcInputField-BNSfmQqu.mjs";
-import { N as NcListItem } from "./chunks/NcListItem-CnxZixD_.mjs";
-import { N as NcListItemIcon } from "./chunks/NcListItemIcon-CTfYEjBB.mjs";
+import { N as NcListItem } from "./chunks/NcListItem-CifyXFmv.mjs";
+import { N as NcListItemIcon } from "./chunks/NcListItemIcon-CZrilo88.mjs";
 import NcLoadingIcon from "./Components/NcLoadingIcon.mjs";
 import NcModal from "./Components/NcModal.mjs";
 import NcNoteCard from "./Components/NcNoteCard.mjs";
 import { N as NcPasswordField } from "./chunks/NcPasswordField-DSdrAkZy.mjs";
-import { N as NcPopover } from "./chunks/NcPopover-CAJVK-MR.mjs";
+import { N as NcPopover } from "./chunks/NcPopover-DxTXnL3u.mjs";
 import { N as NcProgressBar } from "./chunks/NcProgressBar-CI_nOrPg.mjs";
 import { N as NcRelatedResourcesPanel } from "./chunks/NcRelatedResourcesPanel-DyvwxDjI.mjs";
 import { N as NcMentionBubble } from "./chunks/index-B8gPNa8c.mjs";
 import { r } from "./chunks/index-B8gPNa8c.mjs";
-import { N as NcAutoCompleteResult, a as NcRichContenteditable } from "./chunks/NcRichContenteditable-cpptFUeI.mjs";
-import { N as NcRichText } from "./chunks/NcRichText-CmuVmSzl.mjs";
-import { N, h, d, i, b, r as r2, c, a } from "./chunks/index-56SXuvlv.mjs";
+import { N as NcAutoCompleteResult, a as NcRichContenteditable } from "./chunks/NcRichContenteditable-CMQnS1Wz.mjs";
+import { N as NcRichText } from "./chunks/NcRichText-MMeidJmP.mjs";
+import { N, h, f, i, b, r as r2, c, a } from "./chunks/customPickerElements-CH9vlHLd.mjs";
 import "@vueuse/core";
 import "vue";
 import "vue-router";
-import { a as a2, g, b as b2, c as c2, d as d2, s } from "./chunks/referencePickerModal-CtMUY45l.mjs";
+import { d, g, a as a2, b as b2, c as c2, s } from "./chunks/referencePickerModal-B2nPzrke.mjs";
 import "unist-util-visit";
 import "unist-builder";
 import "@nextcloud/router";
 import "@nextcloud/axios";
 import "@nextcloud/sharing/public";
 import "@nextcloud/auth";
-import { N as NcSelect } from "./chunks/NcSelect-BUOuXJUQ.mjs";
-import { N as NcTextField } from "./chunks/NcTextField-Do6wBDGH.mjs";
+import { N as NcSelect } from "./chunks/NcSelect-okD5YTJq.mjs";
+import { N as NcTextField } from "./chunks/NcTextField-eKuP0G6I.mjs";
 import "@nextcloud/event-bus";
 import { N as NcSavingIndicatorIcon } from "./chunks/NcSavingIndicatorIcon-U7AIamCl.mjs";
-import { N as NcSelectTags } from "./chunks/NcSelectTags-hP98xYkg.mjs";
-import { N as NcSelectUsers } from "./chunks/NcSelectUsers-DaHVPRPE.mjs";
+import { N as NcSelectTags } from "./chunks/NcSelectTags-BPxmiMto.mjs";
+import { N as NcSelectUsers } from "./chunks/NcSelectUsers-DK3EtvnG.mjs";
 import { N as NcSettingsInputText } from "./chunks/NcSettingsInputText-BKoaCiQU.mjs";
 import { N as NcSettingsSection } from "./chunks/NcSettingsSection-fe_YIg-L.mjs";
-import { N as NcSettingsSelectGroup } from "./chunks/NcSettingsSelectGroup-SuQNKdqU.mjs";
+import { N as NcSettingsSelectGroup } from "./chunks/NcSettingsSelectGroup-CUUKv6lH.mjs";
 import { N as NcTextArea } from "./chunks/NcTextArea-BFLuhsEv.mjs";
 import { N as NcThemeProvider } from "./chunks/NcThemeProvider-25ResoIv.mjs";
-import { N as NcTimezonePicker } from "./chunks/NcTimezonePicker-bIwFQlmV.mjs";
-import { N as NcUserBubble } from "./chunks/NcUserBubble-BmPOx3MW.mjs";
+import { N as NcTimezonePicker } from "./chunks/NcTimezonePicker-BbqblRd7.mjs";
+import { N as NcUserBubble } from "./chunks/NcUserBubble-C7XtYsrf.mjs";
 import { N as NcUserStatusIcon } from "./chunks/NcUserStatusIcon-DQr5EGWZ.mjs";
 import NcVNodes from "./Components/NcVNodes.mjs";
 import { useFormatDateTime, useFormatRelativeTime, useFormatTime } from "./Composables/useFormatDateTime.mjs";
@@ -146,6 +149,9 @@ const NcComponents = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.define
   NcAppSidebar,
   NcAppSidebarHeader,
   NcAppSidebarTab,
+  NcAssistantButton,
+  NcAssistantContent,
+  NcAssistantIcon,
   NcAutoCompleteResult,
   NcAvatar,
   NcBlurHash,
@@ -252,6 +258,9 @@ export {
   NcAppSidebar,
   NcAppSidebarHeader,
   NcAppSidebarTab,
+  NcAssistantButton,
+  NcAssistantContent,
+  NcAssistantIcon,
   NcAutoCompleteResult,
   NcAvatar,
   NcBlurHash,
@@ -308,7 +317,7 @@ export {
   NcVNodes,
   NextcloudVuePlugin,
   VTooltip2 as Tooltip,
-  a2 as anyLinkProviderId,
+  d as anyLinkProviderId,
   checkIfDarkTheme,
   default2 as clickOutsideOptions,
   a3 as emojiAddRecent,
@@ -316,11 +325,11 @@ export {
   g2 as getCurrentSkinTone,
   getEnabledContactsMenuActions,
   g as getLinkWithPicker,
-  b2 as getProvider,
-  c2 as getProviders,
+  a2 as getProvider,
+  b2 as getProviders,
   h as hasInteractiveView,
   isA11yActivation,
-  d as isCustomPickerElementRegistered,
+  f as isCustomPickerElementRegistered,
   isDarkTheme,
   default3 as isFullscreen,
   isFullscreenState,
@@ -334,7 +343,7 @@ export {
   c as renderCustomPickerElement,
   a as renderWidget,
   r as richEditor,
-  d2 as searchProvider,
+  c2 as searchProvider,
   s2 as setCurrentSkinTone,
   s as sortProviders,
   spawnDialog,

package/dist/index.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.mjs","sources":["../src/plugin.ts"],"sourcesContent":["/*\n SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors\n * SPDX-License-Identifier: AGPL-3.0-or-later\n /\n\nimport type { DefineComponent, Directive, PluginObject } from 'vue'\n\nimport as NcComponents from './components/index.js'\nimport * as NcDirectives from './directives/index.js'\n\n/*\n Install all Nextcloud Vue components and directives globally\n * @example\n * ```js\n * import { NextcloudVuePlugin } from '@nextcloud/vue'\n * import Vue from 'vue'\n \n // ...\n \n Vue.use(NextcloudVuePlugin)\n * new Vue({\n * // options\n * })\n * ```\n */\nexport const NextcloudVuePlugin: PluginObject<never> = {\n\tinstall(Vue) {\n\t\t// Install components\n\t\tObject.entries(NcComponents as { [key: string]: DefineComponent }).forEach(([name, component]) => {\n\t\t\tVue.component(component.name \|\| name, component)\n\t\t})\n\n\t\t// Install directives\n\t\tObject.entries(NcDirectives as { [key: string]: Directive }).forEach(([name, directive]) => {\n\t\t\tVue.directive(name, directive)\n\t\t})\n\t},\n}\n"],"names":["directive"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyBO,MAAM,qBAA0C;AAAA,EACtD,QAAQ,KAAK;AAEL,WAAA,QAAQ,YAAkD,EAAE,QAAQ,CAAC,CAAC,MAAM,SAAS,MAAM;AACjG,UAAI,UAAU,UAAU,QAAQ,MAAM,SAAS;AAAA,IAAA,CAC/C;AAGM,WAAA,QAAQ,YAA4C,EAAE,QAAQ,CAAC,CAAC,MAAMA,UAAS,MAAM;AACvF,UAAA,UAAU,MAAMA,UAAS;AAAA,IAAA,CAC7B;AAAA,EAAA;AAEH;"}
1	+ {"version":3,"file":"index.mjs","sources":["../src/plugin.ts"],"sourcesContent":["/*\n SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors\n * SPDX-License-Identifier: AGPL-3.0-or-later\n /\n\nimport type { DefineComponent, Directive, PluginObject } from 'vue'\n\nimport as NcComponents from './components/index.js'\nimport * as NcDirectives from './directives/index.js'\n\n/*\n Install all Nextcloud Vue components and directives globally\n * @example\n * ```js\n * import { NextcloudVuePlugin } from '@nextcloud/vue'\n * import Vue from 'vue'\n \n // ...\n \n Vue.use(NextcloudVuePlugin)\n * new Vue({\n * // options\n * })\n * ```\n */\nexport const NextcloudVuePlugin: PluginObject<never> = {\n\tinstall(Vue) {\n\t\t// Install components\n\t\tObject.entries(NcComponents as { [key: string]: DefineComponent }).forEach(([name, component]) => {\n\t\t\tVue.component(component.name \|\| name, component)\n\t\t})\n\n\t\t// Install directives\n\t\tObject.entries(NcDirectives as { [key: string]: Directive }).forEach(([name, directive]) => {\n\t\t\tVue.directive(name, directive)\n\t\t})\n\t},\n}\n"],"names":["directive"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyBO,MAAM,qBAA0C;AAAA,EACtD,QAAQ,KAAK;AAEL,WAAA,QAAQ,YAAkD,EAAE,QAAQ,CAAC,CAAC,MAAM,SAAS,MAAM;AACjG,UAAI,UAAU,UAAU,QAAQ,MAAM,SAAS;AAAA,IAAA,CAC/C;AAGM,WAAA,QAAQ,YAA4C,EAAE,QAAQ,CAAC,CAAC,MAAMA,UAAS,MAAM;AACvF,UAAA,UAAU,MAAMA,UAAS;AAAA,IAAA,CAC7B;AAAA,EAAA;AAEH;"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@nextcloud/vue",
-  "version": "8.29.2",
+  "version": "8.30.0",
   "description": "Nextcloud vue components",
   "keywords": [
     "vuejs",

package/dist/chunks/NcCheckboxRadioSwitch-ip_mRd2T.mjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"NcCheckboxRadioSwitch-ip_mRd2T.mjs","sources":["../../node_modules/vue-material-design-icons/CheckboxBlankOutline.vue","../../node_modules/vue-material-design-icons/MinusBox.vue","../../node_modules/vue-material-design-icons/CheckboxMarked.vue","../../node_modules/vue-material-design-icons/RadioboxMarked.vue","../../node_modules/vue-material-design-icons/RadioboxBlank.vue","../../node_modules/vue-material-design-icons/ToggleSwitchOff.vue","../../node_modules/vue-material-design-icons/ToggleSwitch.vue","../../src/components/NcCheckboxRadioSwitch/NcCheckboxContent.vue","../../src/components/NcCheckboxRadioSwitch/NcCheckboxRadioSwitch.vue"],"sourcesContent":["<template>\n <span v-bind=\"$attrs\"\n :aria-hidden=\"title ? null : 'true'\"\n :aria-label=\"title\"\n class=\"material-design-icon checkbox-blank-outline-icon\"\n role=\"img\"\n @click=\"$emit('click', $event)\">\n <svg :fill=\"fillColor\"\n class=\"material-design-icon__svg\"\n :width=\"size\"\n :height=\"size\"\n viewBox=\"0 0 24 24\">\n <path d=\"M19,3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3M19,5V19H5V5H19Z\">\n <title v-if=\"title\">{{ title }}</title>\n </path>\n </svg>\n </span>\n</template>\n\n<script>\nexport default {\n name: \"CheckboxBlankOutlineIcon\",\n emits: ['click'],\n props: {\n title: {\n type: String,\n },\n fillColor: {\n type: String,\n default: \"currentColor\"\n },\n size: {\n type: Number,\n default: 24\n }\n }\n}\n</script>","<template>\n <span v-bind=\"$attrs\"\n :aria-hidden=\"title ? null : 'true'\"\n :aria-label=\"title\"\n class=\"material-design-icon minus-box-icon\"\n role=\"img\"\n @click=\"$emit('click', $event)\">\n <svg :fill=\"fillColor\"\n class=\"material-design-icon__svg\"\n :width=\"size\"\n :height=\"size\"\n viewBox=\"0 0 24 24\">\n <path d=\"M17,13H7V11H17M19,3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3Z\">\n <title v-if=\"title\">{{ title }}</title>\n </path>\n </svg>\n </span>\n</template>\n\n<script>\nexport default {\n name: \"MinusBoxIcon\",\n emits: ['click'],\n props: {\n title: {\n type: String,\n },\n fillColor: {\n type: String,\n default: \"currentColor\"\n },\n size: {\n type: Number,\n default: 24\n }\n }\n}\n</script>","<template>\n <span v-bind=\"$attrs\"\n :aria-hidden=\"title ? null : 'true'\"\n :aria-label=\"title\"\n class=\"material-design-icon checkbox-marked-icon\"\n role=\"img\"\n @click=\"$emit('click', $event)\">\n <svg :fill=\"fillColor\"\n class=\"material-design-icon__svg\"\n :width=\"size\"\n :height=\"size\"\n viewBox=\"0 0 24 24\">\n <path d=\"M10,17L5,12L6.41,10.58L10,14.17L17.59,6.58L19,8M19,3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3Z\">\n <title v-if=\"title\">{{ title }}</title>\n </path>\n </svg>\n </span>\n</template>\n\n<script>\nexport default {\n name: \"CheckboxMarkedIcon\",\n emits: ['click'],\n props: {\n title: {\n type: String,\n },\n fillColor: {\n type: String,\n default: \"currentColor\"\n },\n size: {\n type: Number,\n default: 24\n }\n }\n}\n</script>","<template>\n <span v-bind=\"$attrs\"\n :aria-hidden=\"title ? null : 'true'\"\n :aria-label=\"title\"\n class=\"material-design-icon radiobox-marked-icon\"\n role=\"img\"\n @click=\"$emit('click', $event)\">\n <svg :fill=\"fillColor\"\n class=\"material-design-icon__svg\"\n :width=\"size\"\n :height=\"size\"\n viewBox=\"0 0 24 24\">\n <path d=\"M12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4A8,8 0 0,1 20,12A8,8 0 0,1 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M12,7A5,5 0 0,0 7,12A5,5 0 0,0 12,17A5,5 0 0,0 17,12A5,5 0 0,0 12,7Z\">\n <title v-if=\"title\">{{ title }}</title>\n </path>\n </svg>\n </span>\n</template>\n\n<script>\nexport default {\n name: \"RadioboxMarkedIcon\",\n emits: ['click'],\n props: {\n title: {\n type: String,\n },\n fillColor: {\n type: String,\n default: \"currentColor\"\n },\n size: {\n type: Number,\n default: 24\n }\n }\n}\n</script>","<template>\n <span v-bind=\"$attrs\"\n :aria-hidden=\"title ? null : 'true'\"\n :aria-label=\"title\"\n class=\"material-design-icon radiobox-blank-icon\"\n role=\"img\"\n @click=\"$emit('click', $event)\">\n <svg :fill=\"fillColor\"\n class=\"material-design-icon__svg\"\n :width=\"size\"\n :height=\"size\"\n viewBox=\"0 0 24 24\">\n <path d=\"M12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4A8,8 0 0,1 20,12A8,8 0 0,1 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z\">\n <title v-if=\"title\">{{ title }}</title>\n </path>\n </svg>\n </span>\n</template>\n\n<script>\nexport default {\n name: \"RadioboxBlankIcon\",\n emits: ['click'],\n props: {\n title: {\n type: String,\n },\n fillColor: {\n type: String,\n default: \"currentColor\"\n },\n size: {\n type: Number,\n default: 24\n }\n }\n}\n</script>","<template>\n <span v-bind=\"$attrs\"\n :aria-hidden=\"title ? null : 'true'\"\n :aria-label=\"title\"\n class=\"material-design-icon toggle-switch-off-icon\"\n role=\"img\"\n @click=\"$emit('click', $event)\">\n <svg :fill=\"fillColor\"\n class=\"material-design-icon__svg\"\n :width=\"size\"\n :height=\"size\"\n viewBox=\"0 0 24 24\">\n <path d=\"M17,7H7A5,5 0 0,0 2,12A5,5 0 0,0 7,17H17A5,5 0 0,0 22,12A5,5 0 0,0 17,7M7,15A3,3 0 0,1 4,12A3,3 0 0,1 7,9A3,3 0 0,1 10,12A3,3 0 0,1 7,15Z\">\n <title v-if=\"title\">{{ title }}</title>\n </path>\n </svg>\n </span>\n</template>\n\n<script>\nexport default {\n name: \"ToggleSwitchOffIcon\",\n emits: ['click'],\n props: {\n title: {\n type: String,\n },\n fillColor: {\n type: String,\n default: \"currentColor\"\n },\n size: {\n type: Number,\n default: 24\n }\n }\n}\n</script>","<template>\n <span v-bind=\"$attrs\"\n :aria-hidden=\"title ? null : 'true'\"\n :aria-label=\"title\"\n class=\"material-design-icon toggle-switch-icon\"\n role=\"img\"\n @click=\"$emit('click', $event)\">\n <svg :fill=\"fillColor\"\n class=\"material-design-icon__svg\"\n :width=\"size\"\n :height=\"size\"\n viewBox=\"0 0 24 24\">\n <path d=\"M17,7H7A5,5 0 0,0 2,12A5,5 0 0,0 7,17H17A5,5 0 0,0 22,12A5,5 0 0,0 17,7M17,15A3,3 0 0,1 14,12A3,3 0 0,1 17,9A3,3 0 0,1 20,12A3,3 0 0,1 17,15Z\">\n <title v-if=\"title\">{{ title }}</title>\n </path>\n </svg>\n </span>\n</template>\n\n<script>\nexport default {\n name: \"ToggleSwitchIcon\",\n emits: ['click'],\n props: {\n title: {\n type: String,\n },\n fillColor: {\n type: String,\n default: \"currentColor\"\n },\n size: {\n type: Number,\n default: 24\n }\n }\n}\n</script>","\n\n<template>\n\t<span class=\"checkbox-content\"\n\t\t:class=\"{\n\t\t\t['checkbox-content-' + type]: true,\n\t\t\t'checkbox-content--button-variant': buttonVariant,\n\t\t\t'checkbox-content--has-text': !!$slots.default,\n\t\t}\">\n\t\t\n\t\t<span :class=\"{\n\t\t\t\t'checkbox-content__icon': true,\n\t\t\t\t'checkbox-content__icon--checked': isChecked,\n\t\t\t\t[iconClass]: true\n\t\t\t}\"\n\t\t\t:aria-hidden=\"true\"\n\t\t\tinert>\n\t\t\t\n\t\t\t<slot name=\"icon\"\n\t\t\t\t:checked=\"isChecked\"\n\t\t\t\t:loading=\"loading\">\n\t\t\t\t<NcLoadingIcon v-if=\"loading\" />\n\t\t\t\t<component :is=\"checkboxRadioIconElement\"\n\t\t\t\t\tv-else-if=\"!buttonVariant\"\n\t\t\t\t\t:size=\"size\" />\n\t\t\t</slot>\n\t\t</span>\n\n\t\t<span v-if=\"$slots.default\" :class=\"['checkbox-content__text', textClass]\">\n\t\t\t\n\t\t\t<slot />\n\t\t</span>\n\t</span>\n</template>\n\n<script>\nimport CheckboxBlankOutline from 'vue-material-design-icons/CheckboxBlankOutline.vue'\nimport MinusBox from 'vue-material-design-icons/MinusBox.vue'\nimport CheckboxMarked from 'vue-material-design-icons/CheckboxMarked.vue'\nimport RadioboxMarked from 'vue-material-design-icons/RadioboxMarked.vue'\nimport RadioboxBlank from 'vue-material-design-icons/RadioboxBlank.vue'\nimport ToggleSwitchOff from 'vue-material-design-icons/ToggleSwitchOff.vue'\nimport ToggleSwitch from 'vue-material-design-icons/ToggleSwitch.vue'\n\nimport NcLoadingIcon from '../NcLoadingIcon/index.js'\n\nexport const TYPE_CHECKBOX = 'checkbox'\nexport const TYPE_RADIO = 'radio'\nexport const TYPE_SWITCH = 'switch'\nexport const TYPE_BUTTON = 'button'\n\nexport default {\n\tname: 'NcCheckboxContent',\n\n\tcomponents: {\n\t\tNcLoadingIcon,\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * Class for the icon element\n\t\t */\n\t\ticonClass: {\n\t\t\ttype: [String, Object],\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * Class for the text element\n\t\t */\n\t\ttextClass: {\n\t\t\ttype: [String, Object],\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * Type of the input. checkbox, radio, switch, or button.\n\t\t *\n\t\t * Only use button when used in a `tablist` container and the\n\t\t * `tab` role is set.\n\t\t *\n\t\t * @type {'checkbox'|'radio'|'switch'|'button'}\n\t\t */\n\t\ttype: {\n\t\t\ttype: String,\n\t\t\tdefault: 'checkbox',\n\t\t\tvalidator: type => [\n\t\t\t\tTYPE_CHECKBOX,\n\t\t\t\tTYPE_RADIO,\n\t\t\t\tTYPE_SWITCH,\n\t\t\t\tTYPE_BUTTON,\n\t\t\t].includes(type),\n\t\t},\n\n\t\t/**\n\t\t * Toggle the alternative button style\n\t\t */\n\t\tbuttonVariant: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * True if the entry is checked\n\t\t */\n\t\tisChecked: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Indeterminate state\n\t\t */\n\t\tindeterminate: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Loading state\n\t\t */\n\t\tloading: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Icon size\n\t\t */\n\t\tsize: {\n\t\t\ttype: Number,\n\t\t\tdefault: 24,\n\t\t},\n\t},\n\n\tcomputed: {\n\t\tisButtonType() {\n\t\t\treturn this.type === TYPE_BUTTON\n\t\t},\n\n\t\t/**\n\t\t * Returns the proper Material icon depending on the select case\n\t\t *\n\t\t * @return {object}\n\t\t */\n\t\tcheckboxRadioIconElement() {\n\t\t\tif (this.type === TYPE_RADIO) {\n\t\t\t\tif (this.isChecked) {\n\t\t\t\t\treturn RadioboxMarked\n\t\t\t\t}\n\t\t\t\treturn RadioboxBlank\n\t\t\t}\n\n\t\t\t// Switch\n\t\t\tif (this.type === TYPE_SWITCH) {\n\t\t\t\tif (this.isChecked) {\n\t\t\t\t\treturn ToggleSwitch\n\t\t\t\t}\n\t\t\t\treturn ToggleSwitchOff\n\t\t\t}\n\n\t\t\t// Checkbox\n\t\t\tif (this.indeterminate) {\n\t\t\t\treturn MinusBox\n\t\t\t}\n\t\t\tif (this.isChecked) {\n\t\t\t\treturn CheckboxMarked\n\t\t\t}\n\t\t\treturn CheckboxBlankOutline\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.checkbox-content {\n\tdisplay: flex;\n\talign-items: center;\n\tflex-direction: row;\n\tgap: var(--default-grid-baseline);\n\tuser-select: none;\n\tmin-height: var(--default-clickable-area);\n\tborder-radius: var(--checkbox-radio-switch--border-radius);\n\tpadding: var(--default-grid-baseline) calc((var(--default-clickable-area) - var(--icon-height)) / 2);\n\t// Set to 100% to make text overflow work on button style\n\twidth: 100%;\n\t// but restrict to content so plain checkboxes / radio switches do not expand\n\tmax-width: fit-content;\n\n\t&__text {\n\t\tflex: 1 0;\n\n\t\t&:empty {\n\t\t\t// hide text if empty to ensure checkbox outline is a circle instead of oval\n\t\t\tdisplay: none;\n\t\t}\n\t}\n\n\t&-checkbox:not(&--button-variant) &__icon,\n\t&-radio:not(&--button-variant) &__icon,\n\t&-switch:not(&--button-variant) &__icon {\n\t\tmargin-block: calc((var(--default-clickable-area) - 2 * var(--default-grid-baseline) - var(--icon-height)) / 2) auto;\n\t}\n\n\t&__icon > * {\n\t\twidth: var(--icon-size);\n\t\theight: var(--icon-height);\n\t\tcolor: var(--color-primary-element);\n\t}\n\n\t&--button-variant {\n\t\t.checkbox-content__icon:not(.checkbox-content__icon--checked) > * {\n\t\t\tcolor: var(--color-primary-element);\n\t\t}\n\n\t\t.checkbox-content__icon--checked > * {\n\t\t\tcolor: var(--color-primary-element-text);\n\t\t}\n\t}\n\n\t&--has-text {\n\t\tpadding-right: $icon-margin;\n\t}\n\n\t&, * {\n\t\tcursor: pointer;\n\t\tflex-shrink: 0;\n\t}\n}\n</style>\n","\n\n<docs>\n\n### General description\n\nThis is a simple input checkbox, radio and switch design.\nPlease have a look at proper usage and recommendations: https://material.io/components/checkboxes\n\nNote: All attributes on the element are passed to the inner input element - except for the button type.\n\n### Standard checkbox\n```vue\n<template>\n\t<div>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingEnabled\">Enable sharing</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingEnabled\" :disabled=\"true\">Enable sharing (disabled)</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingEnabled\">Enable sharing (v-model)</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch :model-value=\"sharingEnabled\" :loading=\"loading\" @update:modelValue=\"onToggle\">Enable sharing (with request loading)</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingEnabled\">\n\t\t\tEnable sharing. This can contain a long multiline text, that will be wrapped in a second row. It is generally not advised to have such long text inside of an element\n\t\t</NcCheckboxRadioSwitch>\n\t\t<br>\n\t\tsharingEnabled: {{ sharingEnabled }}\n\t</div>\n</template>\n<script>\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\tloading: false,\n\t\t\tsharingEnabled: false,\n\t\t}\n\t},\n\tmethods: {\n\t\tonToggle() {\n\t\t\tthis.loading = true\n\n\t\t\tsetTimeout(() => {\n\t\t\t\tthis.sharingEnabled = !this.sharingEnabled\n\t\t\t\tthis.loading = false\n\t\t\t}, 1000)\n\t\t}\n\t}\n}\n</script>\n```\n\n### Standard radio set\n```vue\n<template>\n\t<div>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingPermission\" value=\"r\" name=\"sharing_permission_radio\" type=\"radio\">Default permission read</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingPermission\" value=\"rw\" name=\"sharing_permission_radio\" type=\"radio\">Default permission read+write</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingPermission\" value=\"rwx\" name=\"sharing_permission_radio\" type=\"radio\">Default permission read+write+execute</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingPermission\" value=\"rws\" name=\"sharing_permission_radio\" type=\"radio\">\n\t\t\tDefault permission read+write+share. This can contain a long multiline text, that will be wrapped in a second row. It is generally not advised to have such long text inside of an element\n\t\t</NcCheckboxRadioSwitch>\n\t\t<br>\n\t\tsharingPermission: {{ sharingPermission }}\n\t</div>\n</template>\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tsharingPermission: 'r',\n\t\t\t}\n\t\t}\n\t}\n</script>\n```\n\n### Standard radio set with alternative button style\n```vue\n<template>\n\t<div>\n\t\t<h4>Horizontal</h4>\n\t\t<div style=\"display: flex\">\n\t\t\t<NcCheckboxRadioSwitch\n\t\t\t\t:button-variant=\"true\"\n\t\t\t\tv-model=\"sharingPermission\"\n\t\t\t\tvalue=\"r\"\n\t\t\t\tname=\"sharing_permission_radio\"\n\t\t\t\ttype=\"radio\"\n\t\t\t\tbutton-variant-grouped=\"horizontal\">\n\t\t\t\tDefault permission read\n\t\t\t</NcCheckboxRadioSwitch>\n\t\t\t<NcCheckboxRadioSwitch\n\t\t\t\t:button-variant=\"true\"\n\t\t\t\tv-model=\"sharingPermission\"\n\t\t\t\tvalue=\"rw\"\n\t\t\t\tname=\"sharing_permission_radio\"\n\t\t\t\ttype=\"radio\"\n\t\t\t\tbutton-variant-grouped=\"horizontal\">\n\t\t\t\tDefault permission read+write\n\t\t\t</NcCheckboxRadioSwitch>\n\t\t</div>\n\t\t<h4>Vertically</h4>\n\t\t<div style=\"width: fit-content\">\n\t\t\t<NcCheckboxRadioSwitch\n\t\t\t\t:button-variant=\"true\"\n\t\t\t\tv-model=\"sharingPermission\"\n\t\t\t\tvalue=\"r\"\n\t\t\t\tname=\"sharing_permission_radio\"\n\t\t\t\ttype=\"radio\"\n\t\t\t\tbutton-variant-grouped=\"vertical\">\n\t\t\t\tDefault permission read\n\t\t\t</NcCheckboxRadioSwitch>\n\t\t\t<NcCheckboxRadioSwitch\n\t\t\t\t:button-variant=\"true\"\n\t\t\t\tv-model=\"sharingPermission\"\n\t\t\t\tvalue=\"rw\"\n\t\t\t\tname=\"sharing_permission_radio\"\n\t\t\t\ttype=\"radio\"\n\t\t\t\tbutton-variant-grouped=\"vertical\">\n\t\t\t\tDefault permission read+write\n\t\t\t</NcCheckboxRadioSwitch>\n\t\t</div>\n\t\tsharingPermission: {{ sharingPermission }}\n\t</div>\n</template>\n<script>\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\tsharingPermission: 'r',\n\t\t}\n\t}\n}\n</script>\n```\n\n### Radio set with button style and icons\n```vue\n<template>\n\t<div>\n\t\t<h4>Horizontal</h4>\n\t\t<div style=\"display: flex\">\n\t\t\t<NcCheckboxRadioSwitch\n\t\t\t\t:button-variant=\"true\"\n\t\t\t\tv-model=\"enableSettings\"\n\t\t\t\tvalue=\"y\"\n\t\t\t\tname=\"sharing_permission_radio\"\n\t\t\t\ttype=\"radio\"\n\t\t\t\tbutton-variant-grouped=\"horizontal\">\n\t\t\t\tEnable settings\n\t\t\t\t<template #icon><CheckIcon :size=\"20\"></template>\n\t\t\t</NcCheckboxRadioSwitch>\n\t\t\t<NcCheckboxRadioSwitch\n\t\t\t\t:button-variant=\"true\"\n\t\t\t\tv-model=\"enableSettings\"\n\t\t\t\tvalue=\"n\"\n\t\t\t\tname=\"sharing_permission_radio\"\n\t\t\t\ttype=\"radio\"\n\t\t\t\tbutton-variant-grouped=\"horizontal\">\n\t\t\t\tDisable settings\n\t\t\t\t<template #icon><CancelIcon :size=\"20\"></template>\n\t\t\t</NcCheckboxRadioSwitch>\n\t\t</div>\n\t\t<h4>Vertically</h4>\n\t\t<div style=\"width: fit-content\">\n\t\t\t<NcCheckboxRadioSwitch\n\t\t\t\t:button-variant=\"true\"\n\t\t\t\tv-model=\"enableSettings\"\n\t\t\t\tvalue=\"y\"\n\t\t\t\tname=\"sharing_permission_radio\"\n\t\t\t\ttype=\"radio\"\n\t\t\t\tbutton-variant-grouped=\"vertical\">\n\t\t\t\tEnable settings\n\t\t\t\t<template #icon><CheckIcon :size=\"20\"></template>\n\t\t\t</NcCheckboxRadioSwitch>\n\t\t\t<NcCheckboxRadioSwitch\n\t\t\t\t:button-variant=\"true\"\n\t\t\t\tv-model=\"enableSettings\"\n\t\t\t\tvalue=\"n\"\n\t\t\t\tname=\"sharing_permission_radio\"\n\t\t\t\ttype=\"radio\"\n\t\t\t\tbutton-variant-grouped=\"vertical\">\n\t\t\t\tDisable settings\n\t\t\t\t<template #icon><CancelIcon :size=\"20\"></template>\n\t\t\t</NcCheckboxRadioSwitch>\n\t\t</div>\n\t\tSettings enabled: {{ enableSettings === 'y' ? 'yes' : 'no' }}\n\t</div>\n</template>\n<script>\nimport CheckIcon from 'vue-material-design-icons/Check.vue'\nimport CancelIcon from 'vue-material-design-icons/Cancel.vue'\nexport default {\n\tcomponents: {\n\t\tCheckIcon,\n\t\tCancelIcon,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tenableSettings: 'n',\n\t\t}\n\t}\n}\n</script>\n```\n\n### Standard checkbox set\n```vue\n<template>\n\t<div>\n\t\t<NcCheckboxRadioSwitch :disabled=\"true\" v-model=\"sharingPermission\" value=\"r\" name=\"sharing_permission\">Permission read</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingPermission\" value=\"w\" name=\"sharing_permission\">Permission write</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingPermission\" value=\"d\" name=\"sharing_permission\">Permission delete</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingPermission\" value=\"x\" name=\"sharing_permission\">Permission execute</NcCheckboxRadioSwitch>\n\t\t<br>\n\t\tsharingPermission: {{ sharingPermission }}\n\t</div>\n</template>\n<script>\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\tsharingPermission: ['r', 'd'],\n\t\t}\n\t}\n}\n</script>\n```\n\n### Standard switch\n```vue\n<template>\n\t<div>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingEnabled\" type=\"switch\">Enable sharing</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingEnabled\" type=\"switch\">Enable sharing (v-model)</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingEnabled\" type=\"switch\" :disabled=\"true\">Enable sharing (disabled)</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingEnabled\" type=\"switch\">\n\t\t\tEnable sharing. This can contain a long multiline text, that will be wrapped in a second row. It is generally not advised to have such long text inside of an element\n\t\t</NcCheckboxRadioSwitch>\n\t\t<br>\n\t\tsharingEnabled: {{ sharingEnabled }}\n\t</div>\n</template>\n<script>\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\tsharingEnabled: true,\n\t\t}\n\t},\n}\n</script>\n```\n\n</docs>\n\n<template>\n\t<component :is=\"computedWrapperElement\"\n\t\t:id=\"wrapperId\"\n\t\t:aria-label=\"isButtonType && ariaLabel ? ariaLabel : undefined\"\n\t\t:class=\"{\n\t\t\t['checkbox-radio-switch-' + type]: type,\n\t\t\t'checkbox-radio-switch--checked': isChecked,\n\t\t\t'checkbox-radio-switch--disabled': disabled,\n\t\t\t'checkbox-radio-switch--indeterminate': hasIndeterminate ? indeterminate : false,\n\t\t\t'checkbox-radio-switch--button-variant': buttonVariant,\n\t\t\t'checkbox-radio-switch--button-variant-v-grouped': buttonVariant && buttonVariantGrouped === 'vertical',\n\t\t\t'checkbox-radio-switch--button-variant-h-grouped': buttonVariant && buttonVariantGrouped === 'horizontal',\n\t\t\t'button-vue': isButtonType,\n\t\t}\"\n\t\tclass=\"checkbox-radio-switch\"\n\t\t:style=\"cssVars\"\n\t\t:type=\"isButtonType ? 'button' : null\"\n\t\tv-bind=\"isButtonType ? $attrs : dataAttrs\"\n\t\tv-on=\"isButtonType ? listeners : null\">\n\t\t<input v-if=\"!isButtonType\"\n\t\t\t:id=\"id\"\n\t\t\t:aria-labelledby=\"!isButtonType && !ariaLabel ? `${id}-label` : null\"\n\t\t\t:aria-label=\"ariaLabel || undefined\"\n\t\t\tclass=\"checkbox-radio-switch__input\"\n\t\t\t:disabled=\"disabled\"\n\t\t\t:type=\"inputType\"\n\t\t\t:value=\"value\"\n\t\t\t:checked=\"isChecked\"\n\t\t\t:indeterminate.prop=\"hasIndeterminate ? indeterminate : null\"\n\t\t\t:required=\"required\"\n\t\t\t:name=\"name\"\n\t\t\tv-bind=\"nonDataAttrs\"\n\t\t\tv-on=\"listeners\">\n\t\t<NcCheckboxContent :id=\"!isButtonType ? `${id}-label` : undefined\"\n\t\t\tclass=\"checkbox-radio-switch__content\"\n\t\t\ticon-class=\"checkbox-radio-switch__icon\"\n\t\t\ttext-class=\"checkbox-radio-switch__text\"\n\t\t\t:type=\"type\"\n\t\t\t:indeterminate=\"hasIndeterminate ? indeterminate : false\"\n\t\t\t:button-variant=\"buttonVariant\"\n\t\t\t:is-checked=\"isChecked\"\n\t\t\t:loading=\"loading\"\n\t\t\t:size=\"size\"\n\t\t\t@click.native=\"onToggle\">\n\t\t\t<template #icon>\n\t\t\t\t\n\t\t\t\t<slot name=\"icon\" />\n\t\t\t</template>\n\n\t\t\t\n\t\t\t<slot />\n\t\t</NcCheckboxContent>\n\t</component>\n</template>\n\n<script>\nimport { n, t } from '../../l10n.js'\nimport GenRandomId from '../../utils/GenRandomId.js'\nimport NcCheckboxContent, { TYPE_BUTTON, TYPE_CHECKBOX, TYPE_RADIO, TYPE_SWITCH } from './NcCheckboxContent.vue'\nimport { useModelMigration } from '../../composables/useModelMigration.ts'\n\nexport default {\n\tname: 'NcCheckboxRadioSwitch',\n\n\tcomponents: {\n\t\tNcCheckboxContent,\n\t},\n\n\t// We need to pass attributes to the input element\n\tinheritAttrs: false,\n\n\tmodel: {\n\t\tprop: 'modelValue',\n\t\tevent: 'update:modelValue',\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * Unique id attribute of the input\n\t\t */\n\t\tid: {\n\t\t\ttype: String,\n\t\t\tdefault: () => 'checkbox-radio-switch-' + GenRandomId(),\n\t\t\tvalidator: id => id.trim() !== '',\n\t\t},\n\n\t\t/**\n\t\t * Unique id attribute of the wrapper element\n\t\t */\n\t\twrapperId: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * Input name. Required for radio, optional for checkbox, and ignored\n\t\t * for button.\n\t\t */\n\t\tname: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * Required if no text is set.\n\t\t * The aria-label is forwarded to the input or button.\n\t\t */\n\t\tariaLabel: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * Type of the input. checkbox, radio, switch, or button.\n\t\t *\n\t\t * Only use button when used in a `tablist` container and the\n\t\t * `tab` role is set.\n\t\t *\n\t\t * @type {'checkbox'|'radio'|'switch'|'button'}\n\t\t */\n\t\ttype: {\n\t\t\ttype: String,\n\t\t\tdefault: 'checkbox',\n\t\t\tvalidator: type => [\n\t\t\t\tTYPE_CHECKBOX,\n\t\t\t\tTYPE_RADIO,\n\t\t\t\tTYPE_SWITCH,\n\t\t\t\tTYPE_BUTTON,\n\t\t\t].includes(type),\n\t\t},\n\n\t\t/**\n\t\t * Toggle the alternative button style\n\t\t */\n\t\tbuttonVariant: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Are the elements are all direct siblings?\n\t\t * If so they will be grouped horizontally or vertically\n\t\t *\n\t\t * @type {'no'|'horizontal'|'vertical'}\n\t\t */\n\t\tbuttonVariantGrouped: {\n\t\t\ttype: String,\n\t\t\tdefault: 'no',\n\t\t\tvalidator: v => ['no', 'vertical', 'horizontal'].includes(v),\n\t\t},\n\n\t\t/**\n\t\t * Removed in v9 - use `modelValue` (`v-model`) instead\n\t\t * @deprecated\n\t\t */\n\t\tchecked: {\n\t\t\ttype: [Boolean, Array, String],\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * Checkbox value\n\t\t */\n\t\tmodelValue: {\n\t\t\ttype: [Boolean, Array, String],\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Value to be synced on check\n\t\t */\n\t\tvalue: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * Disabled state\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 * Indeterminate state\n\t\t */\n\t\tindeterminate: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Required state\n\t\t */\n\t\trequired: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Loading state\n\t\t */\n\t\tloading: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Wrapping element tag\n\t\t *\n\t\t * When `type` is set to `button` this will be ignored\n\t\t *\n\t\t * Defaults to `span`\n\t\t */\n\t\twrapperElement: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t},\n\t},\n\n\temits: [\n\t\t/**\n\t\t * Removed in v9 - use `update:modelValue` (`v-model`) instead\n\t\t * @deprecated\n\t\t */\n\t\t'update:checked',\n\t\t'update:modelValue',\n\t\t/** Same as update:modelValue for Vue 2 compatibility */\n\t\t'update:model-value',\n\t],\n\n\tsetup() {\n\t\tconst model = useModelMigration('checked', 'update:checked')\n\t\treturn {\n\t\t\tmodel,\n\t\t}\n\t},\n\n\tcomputed: {\n\t\tdataAttrs() {\n\t\t\t// filter all data attributes\n\t\t\treturn Object.fromEntries(Object.entries(this.$attrs)\n\t\t\t\t.filter(([key]) => key.startsWith('data-')))\n\t\t},\n\n\t\tnonDataAttrs() {\n\t\t\t// filter all non-data attributes\n\t\t\treturn Object.fromEntries(Object.entries(this.$attrs)\n\t\t\t\t.filter(([key]) => !key.startsWith('data-')))\n\t\t},\n\n\t\tisButtonType() {\n\t\t\treturn this.type === TYPE_BUTTON\n\t\t},\n\n\t\tcomputedWrapperElement() {\n\t\t\tif (this.isButtonType) {\n\t\t\t\treturn 'button'\n\t\t\t}\n\t\t\tif (this.wrapperElement !== null) {\n\t\t\t\treturn this.wrapperElement\n\t\t\t}\n\t\t\treturn 'span'\n\t\t},\n\n\t\tlisteners() {\n\t\t\tif (this.isButtonType) {\n\t\t\t\treturn {\n\t\t\t\t\tclick: this.onToggle,\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn {\n\t\t\t\tchange: this.onToggle,\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Icon size\n\t\t *\n\t\t * @return {number}\n\t\t */\n\t\tsize() {\n\t\t\treturn this.type === TYPE_SWITCH\n\t\t\t\t? 36\n\t\t\t\t: 24\n\t\t},\n\n\t\t/**\n\t\t * Css local variables for this component\n\t\t *\n\t\t * @return {object}\n\t\t */\n\t\tcssVars() {\n\t\t\treturn {\n\t\t\t\t'--icon-size': this.size + 'px',\n\t\t\t\t'--icon-height': (this.type === TYPE_SWITCH ? 16 : this.size) + 'px',\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Return the input type.\n\t\t * Switch is not an official type\n\t\t *\n\t\t * @return {string}\n\t\t */\n\t\tinputType() {\n\t\t\tconst nativeTypes = [\n\t\t\t\tTYPE_CHECKBOX,\n\t\t\t\tTYPE_RADIO,\n\t\t\t\tTYPE_BUTTON,\n\t\t\t]\n\t\t\tif (nativeTypes.includes(this.type)) {\n\t\t\t\treturn this.type\n\t\t\t}\n\t\t\treturn TYPE_CHECKBOX\n\t\t},\n\n\t\t/**\n\t\t * Check if that entry is checked\n\t\t * If value is defined, we use that as the checked value\n\t\t * If not, we expect true/false in checked state\n\t\t *\n\t\t * @return {boolean}\n\t\t */\n\t\tisChecked() {\n\t\t\tif (this.value !== null) {\n\t\t\t\tif (Array.isArray(this.model)) {\n\t\t\t\t\treturn [...this.model].indexOf(this.value) > -1\n\t\t\t\t}\n\t\t\t\treturn this.model === this.value\n\t\t\t}\n\t\t\treturn this.model === true\n\t\t},\n\n\t\thasIndeterminate() {\n\t\t\treturn [\n\t\t\t\tTYPE_CHECKBOX,\n\t\t\t\tTYPE_RADIO,\n\t\t\t].includes(this.inputType)\n\t\t},\n\t},\n\n\tmounted() {\n\t\tif (this.name && this.type === TYPE_CHECKBOX) {\n\t\t\tif (!Array.isArray(this.model)) {\n\t\t\t\tthrow new Error('When using groups of checkboxes, the updated value will be an array.')\n\t\t\t}\n\t\t}\n\n\t\t// https://material.io/components/checkboxes#usage\n\t\tif (this.name && this.type === TYPE_SWITCH) {\n\t\t\tthrow new Error('Switches are not made to be used for data sets. Please use checkboxes instead.')\n\t\t}\n\n\t\t// https://material.io/components/checkboxes#usage\n\t\tif (typeof this.model !== 'boolean' && this.type === TYPE_SWITCH) {\n\t\t\tthrow new Error('Switches can only be used with boolean as checked prop.')\n\t\t}\n\t},\n\n\tmethods: {\n\t\tt,\n\t\tn,\n\n\t\tonToggle(event) {\n\t\t\tif (this.disabled || event.target.tagName.toLowerCase() === 'a') {\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\t// If this is a radio, there can only be one value\n\t\t\tif (this.type === TYPE_RADIO) {\n\t\t\t\tthis.model = this.value\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\t// If this is a radio, there can only be one value\n\t\t\tif (this.type === TYPE_SWITCH) {\n\t\t\t\tthis.model = !this.isChecked\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\t// If the initial value was a boolean, let's keep it that way\n\t\t\tif (typeof this.model === 'boolean') {\n\t\t\t\tthis.model = !this.model\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\t// Dispatch the checked values as an array if multiple, or single value otherwise\n\t\t\tconst values = this.getInputsSet()\n\t\t\t\t.filter(input => input.checked)\n\t\t\t\t.map(input => input.value)\n\n\t\t\tif (values.includes(this.value)) {\n\t\t\t\tthis.model = values.filter((v) => v !== this.value)\n\t\t\t} else {\n\t\t\t\tthis.model = [...values, this.value]\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Get the input set based on this name\n\t\t *\n\t\t * @return {Node[]}\n\t\t */\n\t\tgetInputsSet() {\n\t\t\treturn [...document.getElementsByName(this.name)]\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.checkbox-radio-switch {\n\tdisplay: flex;\n\talign-items: center;\n\tcolor: var(--color-main-text);\n\tbackground-color: transparent;\n\tbox-sizing: border-box;\n\tfont-size: var(--default-font-size);\n\tline-height: var(--default-line-height);\n\tpadding: 0;\n\tposition: relative;\n\n\t* {\n\t\tbox-sizing: border-box;\n\t}\n\n\t&__input {\n\t\tposition: absolute;\n\t\tz-index: -1;\n\t\topacity: 0 !important; // We need !important, or it gets overwritten by server style\n\t\twidth: var(--icon-size);\n\t\theight: var(--icon-size);\n\t\t// Same as label padding\n\t\tmargin: 4px $icon-margin;\n\t}\n\n\t&__input:focus-visible + &__content,\n\t&__input:focus-visible {\n\t\toutline: 2px solid var(--color-main-text);\n\t\tborder-color: var(--color-main-background);\n\t\toutline-offset: -2px;\n\t}\n\n\t&--disabled &__content {\n\t\topacity: $opacity_disabled;\n\t\t:deep(.checkbox-radio-switch__icon) > * {\n\t\t\tcolor: var(--color-main-text)\n\t\t}\n\t\t&.checkbox-content,\n\t\t&.checkbox-content :deep(*:not(a)) {\n\t\t\tcursor: default !important;\n\t\t}\n\t}\n\n\t&:not(&--disabled, &--checked):focus-within &__content,\n\t&:not(&--disabled, &--checked) &__content:hover {\n\t\tbackground-color: var(--color-background-hover);\n\t}\n\n\t&--checked:not(&--disabled):focus-within &__content,\n\t&--checked:not(&--disabled) &__content:hover {\n\t\tbackground-color: var(--color-primary-element-hover);\n\t}\n\n\t&--checked:not(&--button-variant):not(&--disabled):focus-within &__content,\n\t&--checked:not(&--button-variant):not(&--disabled) &__content:hover {\n\t\tbackground-color: var(--color-primary-element-light-hover);\n\t}\n\n\t// Switch specific rules\n\t&-switch:not(&--checked) :deep(.checkbox-radio-switch__icon) > * {\n\t\tcolor: var(--color-text-maxcontrast);\n\t}\n\n\t// If switch is checked AND disabled, use the fade primary colour\n\t&-switch.checkbox-radio-switch--disabled.checkbox-radio-switch--checked :deep(.checkbox-radio-switch__icon) > * {\n\t\tcolor: var(--color-primary-element-light);\n\t}\n\n\t--checkbox-radio-switch--border-radius: var(--border-radius-element, calc(var(--default-clickable-area) / 2));\n\t// keep inner border width in mind\n\t--checkbox-radio-switch--border-radius-outer: calc(var(--checkbox-radio-switch--border-radius) + 2px);\n\n\t&--button-variant.checkbox-radio-switch {\n\t\tbackground-color: var(--color-main-background);\n\t\tborder: 2px solid var(--color-border-maxcontrast);\n\t\toverflow: hidden;\n\n\t\t&--checked {\n\t\t\tfont-weight: bold;\n\n\t\t\t.checkbox-radio-switch__content {\n\t\t\t\tbackground-color: var(--color-primary-element);\n\t\t\t\tcolor: var(--color-primary-element-text);\n\t\t\t}\n\t\t}\n\t}\n\n\t// Text overflow of button style\n\t&--button-variant :deep(.checkbox-radio-switch__text) {\n\t\toverflow: hidden;\n\t\ttext-overflow: ellipsis;\n\t\twhite-space: nowrap;\n\t\twidth: 100%;\n\t}\n\n\t// Set icon color for non active elements to main text color\n\t&--button-variant:not(&--checked) :deep(.checkbox-radio-switch__icon) > * {\n\t\tcolor: var(--color-main-text);\n\t}\n\n\t// Hide icon container if empty to remove virtual padding\n\t&--button-variant :deep(.checkbox-radio-switch__icon:empty) {\n\t\tdisplay: none;\n\t}\n\n\t&--button-variant:not(&--button-variant-v-grouped):not(&--button-variant-h-grouped),\n\t&--button-variant &__content {\n\t\tborder-radius: var(--checkbox-radio-switch--border-radius);\n\t}\n\n\t/* Special rules for vertical button groups */\n\t&--button-variant-v-grouped &__content {\n\t\tflex-basis: 100%;\n\t\t// vertically grouped buttons should all have the same width\n\t\tmax-width: unset;\n\t}\n\t&--button-variant-v-grouped {\n\t\t&:first-of-type {\n\t\t\tborder-start-start-radius: var(--checkbox-radio-switch--border-radius-outer);\n\t\t\tborder-start-end-radius: var(--checkbox-radio-switch--border-radius-outer);\n\t\t}\n\t\t&:last-of-type {\n\t\t\tborder-end-start-radius: var(--checkbox-radio-switch--border-radius-outer);\n\t\t\tborder-end-end-radius: var(--checkbox-radio-switch--border-radius-outer);\n\t\t}\n\n\t\t// remove borders between elements\n\t\t&:not(:last-of-type) {\n\t\t\tborder-bottom: 0!important;\n\t\t\t.checkbox-radio-switch__content {\n\t\t\t\tmargin-bottom: 2px;\n\t\t\t}\n\t\t}\n\t\t&:not(:first-of-type) {\n\t\t\tborder-top: 0!important;\n\t\t}\n\t}\n\n\t/* Special rules for horizontal button groups */\n\t&--button-variant-h-grouped {\n\t\t&:first-of-type {\n\t\t\tborder-start-start-radius: var(--checkbox-radio-switch--border-radius-outer);\n\t\t\tborder-end-start-radius: var(--checkbox-radio-switch--border-radius-outer);\n\t\t}\n\t\t&:last-of-type {\n\t\t\tborder-start-end-radius: var(--checkbox-radio-switch--border-radius-outer);\n\t\t\tborder-end-end-radius: var(--checkbox-radio-switch--border-radius-outer);\n\t\t}\n\n\t\t// remove borders between elements\n\t\t&:not(:last-of-type) {\n\t\t\tborder-inline-end: 0!important;\n\t\t\t.checkbox-radio-switch__content {\n\t\t\t\tmargin-inline-end: 2px;\n\t\t\t}\n\t\t}\n\t\t&:not(:first-of-type) {\n\t\t\tborder-inline-start: 0!important;\n\t\t}\n\t}\n\t&--button-variant-h-grouped :deep(.checkbox-radio-switch__text) {\n\t\ttext-align: center;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n\t&--button-variant-h-grouped &__content {\n\t\tflex-direction: column;\n\t\tjustify-content: center;\n\t\twidth: 100%;\n\t\tmargin: 0;\n\t\tgap: 0;\n\t}\n}\n</style>\n"],"names":["_sfc_main"],"mappings":"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","x_google_ignoreList":[0,1,2,3,4,5,6]}

package/dist/chunks/NcCheckboxRadioSwitch-kdoDmLpF.cjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"NcCheckboxRadioSwitch-kdoDmLpF.cjs","sources":["../../node_modules/vue-material-design-icons/CheckboxBlankOutline.vue","../../node_modules/vue-material-design-icons/MinusBox.vue","../../node_modules/vue-material-design-icons/CheckboxMarked.vue","../../node_modules/vue-material-design-icons/RadioboxMarked.vue","../../node_modules/vue-material-design-icons/RadioboxBlank.vue","../../node_modules/vue-material-design-icons/ToggleSwitchOff.vue","../../node_modules/vue-material-design-icons/ToggleSwitch.vue","../../src/components/NcCheckboxRadioSwitch/NcCheckboxContent.vue","../../src/components/NcCheckboxRadioSwitch/NcCheckboxRadioSwitch.vue"],"sourcesContent":["<template>\n <span v-bind=\"$attrs\"\n :aria-hidden=\"title ? null : 'true'\"\n :aria-label=\"title\"\n class=\"material-design-icon checkbox-blank-outline-icon\"\n role=\"img\"\n @click=\"$emit('click', $event)\">\n <svg :fill=\"fillColor\"\n class=\"material-design-icon__svg\"\n :width=\"size\"\n :height=\"size\"\n viewBox=\"0 0 24 24\">\n <path d=\"M19,3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3M19,5V19H5V5H19Z\">\n <title v-if=\"title\">{{ title }}</title>\n </path>\n </svg>\n </span>\n</template>\n\n<script>\nexport default {\n name: \"CheckboxBlankOutlineIcon\",\n emits: ['click'],\n props: {\n title: {\n type: String,\n },\n fillColor: {\n type: String,\n default: \"currentColor\"\n },\n size: {\n type: Number,\n default: 24\n }\n }\n}\n</script>","<template>\n <span v-bind=\"$attrs\"\n :aria-hidden=\"title ? null : 'true'\"\n :aria-label=\"title\"\n class=\"material-design-icon minus-box-icon\"\n role=\"img\"\n @click=\"$emit('click', $event)\">\n <svg :fill=\"fillColor\"\n class=\"material-design-icon__svg\"\n :width=\"size\"\n :height=\"size\"\n viewBox=\"0 0 24 24\">\n <path d=\"M17,13H7V11H17M19,3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3Z\">\n <title v-if=\"title\">{{ title }}</title>\n </path>\n </svg>\n </span>\n</template>\n\n<script>\nexport default {\n name: \"MinusBoxIcon\",\n emits: ['click'],\n props: {\n title: {\n type: String,\n },\n fillColor: {\n type: String,\n default: \"currentColor\"\n },\n size: {\n type: Number,\n default: 24\n }\n }\n}\n</script>","<template>\n <span v-bind=\"$attrs\"\n :aria-hidden=\"title ? null : 'true'\"\n :aria-label=\"title\"\n class=\"material-design-icon checkbox-marked-icon\"\n role=\"img\"\n @click=\"$emit('click', $event)\">\n <svg :fill=\"fillColor\"\n class=\"material-design-icon__svg\"\n :width=\"size\"\n :height=\"size\"\n viewBox=\"0 0 24 24\">\n <path d=\"M10,17L5,12L6.41,10.58L10,14.17L17.59,6.58L19,8M19,3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3Z\">\n <title v-if=\"title\">{{ title }}</title>\n </path>\n </svg>\n </span>\n</template>\n\n<script>\nexport default {\n name: \"CheckboxMarkedIcon\",\n emits: ['click'],\n props: {\n title: {\n type: String,\n },\n fillColor: {\n type: String,\n default: \"currentColor\"\n },\n size: {\n type: Number,\n default: 24\n }\n }\n}\n</script>","<template>\n <span v-bind=\"$attrs\"\n :aria-hidden=\"title ? null : 'true'\"\n :aria-label=\"title\"\n class=\"material-design-icon radiobox-marked-icon\"\n role=\"img\"\n @click=\"$emit('click', $event)\">\n <svg :fill=\"fillColor\"\n class=\"material-design-icon__svg\"\n :width=\"size\"\n :height=\"size\"\n viewBox=\"0 0 24 24\">\n <path d=\"M12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4A8,8 0 0,1 20,12A8,8 0 0,1 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M12,7A5,5 0 0,0 7,12A5,5 0 0,0 12,17A5,5 0 0,0 17,12A5,5 0 0,0 12,7Z\">\n <title v-if=\"title\">{{ title }}</title>\n </path>\n </svg>\n </span>\n</template>\n\n<script>\nexport default {\n name: \"RadioboxMarkedIcon\",\n emits: ['click'],\n props: {\n title: {\n type: String,\n },\n fillColor: {\n type: String,\n default: \"currentColor\"\n },\n size: {\n type: Number,\n default: 24\n }\n }\n}\n</script>","<template>\n <span v-bind=\"$attrs\"\n :aria-hidden=\"title ? null : 'true'\"\n :aria-label=\"title\"\n class=\"material-design-icon radiobox-blank-icon\"\n role=\"img\"\n @click=\"$emit('click', $event)\">\n <svg :fill=\"fillColor\"\n class=\"material-design-icon__svg\"\n :width=\"size\"\n :height=\"size\"\n viewBox=\"0 0 24 24\">\n <path d=\"M12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4A8,8 0 0,1 20,12A8,8 0 0,1 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z\">\n <title v-if=\"title\">{{ title }}</title>\n </path>\n </svg>\n </span>\n</template>\n\n<script>\nexport default {\n name: \"RadioboxBlankIcon\",\n emits: ['click'],\n props: {\n title: {\n type: String,\n },\n fillColor: {\n type: String,\n default: \"currentColor\"\n },\n size: {\n type: Number,\n default: 24\n }\n }\n}\n</script>","<template>\n <span v-bind=\"$attrs\"\n :aria-hidden=\"title ? null : 'true'\"\n :aria-label=\"title\"\n class=\"material-design-icon toggle-switch-off-icon\"\n role=\"img\"\n @click=\"$emit('click', $event)\">\n <svg :fill=\"fillColor\"\n class=\"material-design-icon__svg\"\n :width=\"size\"\n :height=\"size\"\n viewBox=\"0 0 24 24\">\n <path d=\"M17,7H7A5,5 0 0,0 2,12A5,5 0 0,0 7,17H17A5,5 0 0,0 22,12A5,5 0 0,0 17,7M7,15A3,3 0 0,1 4,12A3,3 0 0,1 7,9A3,3 0 0,1 10,12A3,3 0 0,1 7,15Z\">\n <title v-if=\"title\">{{ title }}</title>\n </path>\n </svg>\n </span>\n</template>\n\n<script>\nexport default {\n name: \"ToggleSwitchOffIcon\",\n emits: ['click'],\n props: {\n title: {\n type: String,\n },\n fillColor: {\n type: String,\n default: \"currentColor\"\n },\n size: {\n type: Number,\n default: 24\n }\n }\n}\n</script>","<template>\n <span v-bind=\"$attrs\"\n :aria-hidden=\"title ? null : 'true'\"\n :aria-label=\"title\"\n class=\"material-design-icon toggle-switch-icon\"\n role=\"img\"\n @click=\"$emit('click', $event)\">\n <svg :fill=\"fillColor\"\n class=\"material-design-icon__svg\"\n :width=\"size\"\n :height=\"size\"\n viewBox=\"0 0 24 24\">\n <path d=\"M17,7H7A5,5 0 0,0 2,12A5,5 0 0,0 7,17H17A5,5 0 0,0 22,12A5,5 0 0,0 17,7M17,15A3,3 0 0,1 14,12A3,3 0 0,1 17,9A3,3 0 0,1 20,12A3,3 0 0,1 17,15Z\">\n <title v-if=\"title\">{{ title }}</title>\n </path>\n </svg>\n </span>\n</template>\n\n<script>\nexport default {\n name: \"ToggleSwitchIcon\",\n emits: ['click'],\n props: {\n title: {\n type: String,\n },\n fillColor: {\n type: String,\n default: \"currentColor\"\n },\n size: {\n type: Number,\n default: 24\n }\n }\n}\n</script>","\n\n<template>\n\t<span class=\"checkbox-content\"\n\t\t:class=\"{\n\t\t\t['checkbox-content-' + type]: true,\n\t\t\t'checkbox-content--button-variant': buttonVariant,\n\t\t\t'checkbox-content--has-text': !!$slots.default,\n\t\t}\">\n\t\t\n\t\t<span :class=\"{\n\t\t\t\t'checkbox-content__icon': true,\n\t\t\t\t'checkbox-content__icon--checked': isChecked,\n\t\t\t\t[iconClass]: true\n\t\t\t}\"\n\t\t\t:aria-hidden=\"true\"\n\t\t\tinert>\n\t\t\t\n\t\t\t<slot name=\"icon\"\n\t\t\t\t:checked=\"isChecked\"\n\t\t\t\t:loading=\"loading\">\n\t\t\t\t<NcLoadingIcon v-if=\"loading\" />\n\t\t\t\t<component :is=\"checkboxRadioIconElement\"\n\t\t\t\t\tv-else-if=\"!buttonVariant\"\n\t\t\t\t\t:size=\"size\" />\n\t\t\t</slot>\n\t\t</span>\n\n\t\t<span v-if=\"$slots.default\" :class=\"['checkbox-content__text', textClass]\">\n\t\t\t\n\t\t\t<slot />\n\t\t</span>\n\t</span>\n</template>\n\n<script>\nimport CheckboxBlankOutline from 'vue-material-design-icons/CheckboxBlankOutline.vue'\nimport MinusBox from 'vue-material-design-icons/MinusBox.vue'\nimport CheckboxMarked from 'vue-material-design-icons/CheckboxMarked.vue'\nimport RadioboxMarked from 'vue-material-design-icons/RadioboxMarked.vue'\nimport RadioboxBlank from 'vue-material-design-icons/RadioboxBlank.vue'\nimport ToggleSwitchOff from 'vue-material-design-icons/ToggleSwitchOff.vue'\nimport ToggleSwitch from 'vue-material-design-icons/ToggleSwitch.vue'\n\nimport NcLoadingIcon from '../NcLoadingIcon/index.js'\n\nexport const TYPE_CHECKBOX = 'checkbox'\nexport const TYPE_RADIO = 'radio'\nexport const TYPE_SWITCH = 'switch'\nexport const TYPE_BUTTON = 'button'\n\nexport default {\n\tname: 'NcCheckboxContent',\n\n\tcomponents: {\n\t\tNcLoadingIcon,\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * Class for the icon element\n\t\t */\n\t\ticonClass: {\n\t\t\ttype: [String, Object],\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * Class for the text element\n\t\t */\n\t\ttextClass: {\n\t\t\ttype: [String, Object],\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * Type of the input. checkbox, radio, switch, or button.\n\t\t *\n\t\t * Only use button when used in a `tablist` container and the\n\t\t * `tab` role is set.\n\t\t *\n\t\t * @type {'checkbox'|'radio'|'switch'|'button'}\n\t\t */\n\t\ttype: {\n\t\t\ttype: String,\n\t\t\tdefault: 'checkbox',\n\t\t\tvalidator: type => [\n\t\t\t\tTYPE_CHECKBOX,\n\t\t\t\tTYPE_RADIO,\n\t\t\t\tTYPE_SWITCH,\n\t\t\t\tTYPE_BUTTON,\n\t\t\t].includes(type),\n\t\t},\n\n\t\t/**\n\t\t * Toggle the alternative button style\n\t\t */\n\t\tbuttonVariant: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * True if the entry is checked\n\t\t */\n\t\tisChecked: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Indeterminate state\n\t\t */\n\t\tindeterminate: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Loading state\n\t\t */\n\t\tloading: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Icon size\n\t\t */\n\t\tsize: {\n\t\t\ttype: Number,\n\t\t\tdefault: 24,\n\t\t},\n\t},\n\n\tcomputed: {\n\t\tisButtonType() {\n\t\t\treturn this.type === TYPE_BUTTON\n\t\t},\n\n\t\t/**\n\t\t * Returns the proper Material icon depending on the select case\n\t\t *\n\t\t * @return {object}\n\t\t */\n\t\tcheckboxRadioIconElement() {\n\t\t\tif (this.type === TYPE_RADIO) {\n\t\t\t\tif (this.isChecked) {\n\t\t\t\t\treturn RadioboxMarked\n\t\t\t\t}\n\t\t\t\treturn RadioboxBlank\n\t\t\t}\n\n\t\t\t// Switch\n\t\t\tif (this.type === TYPE_SWITCH) {\n\t\t\t\tif (this.isChecked) {\n\t\t\t\t\treturn ToggleSwitch\n\t\t\t\t}\n\t\t\t\treturn ToggleSwitchOff\n\t\t\t}\n\n\t\t\t// Checkbox\n\t\t\tif (this.indeterminate) {\n\t\t\t\treturn MinusBox\n\t\t\t}\n\t\t\tif (this.isChecked) {\n\t\t\t\treturn CheckboxMarked\n\t\t\t}\n\t\t\treturn CheckboxBlankOutline\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.checkbox-content {\n\tdisplay: flex;\n\talign-items: center;\n\tflex-direction: row;\n\tgap: var(--default-grid-baseline);\n\tuser-select: none;\n\tmin-height: var(--default-clickable-area);\n\tborder-radius: var(--checkbox-radio-switch--border-radius);\n\tpadding: var(--default-grid-baseline) calc((var(--default-clickable-area) - var(--icon-height)) / 2);\n\t// Set to 100% to make text overflow work on button style\n\twidth: 100%;\n\t// but restrict to content so plain checkboxes / radio switches do not expand\n\tmax-width: fit-content;\n\n\t&__text {\n\t\tflex: 1 0;\n\n\t\t&:empty {\n\t\t\t// hide text if empty to ensure checkbox outline is a circle instead of oval\n\t\t\tdisplay: none;\n\t\t}\n\t}\n\n\t&-checkbox:not(&--button-variant) &__icon,\n\t&-radio:not(&--button-variant) &__icon,\n\t&-switch:not(&--button-variant) &__icon {\n\t\tmargin-block: calc((var(--default-clickable-area) - 2 * var(--default-grid-baseline) - var(--icon-height)) / 2) auto;\n\t}\n\n\t&__icon > * {\n\t\twidth: var(--icon-size);\n\t\theight: var(--icon-height);\n\t\tcolor: var(--color-primary-element);\n\t}\n\n\t&--button-variant {\n\t\t.checkbox-content__icon:not(.checkbox-content__icon--checked) > * {\n\t\t\tcolor: var(--color-primary-element);\n\t\t}\n\n\t\t.checkbox-content__icon--checked > * {\n\t\t\tcolor: var(--color-primary-element-text);\n\t\t}\n\t}\n\n\t&--has-text {\n\t\tpadding-right: $icon-margin;\n\t}\n\n\t&, * {\n\t\tcursor: pointer;\n\t\tflex-shrink: 0;\n\t}\n}\n</style>\n","\n\n<docs>\n\n### General description\n\nThis is a simple input checkbox, radio and switch design.\nPlease have a look at proper usage and recommendations: https://material.io/components/checkboxes\n\nNote: All attributes on the element are passed to the inner input element - except for the button type.\n\n### Standard checkbox\n```vue\n<template>\n\t<div>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingEnabled\">Enable sharing</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingEnabled\" :disabled=\"true\">Enable sharing (disabled)</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingEnabled\">Enable sharing (v-model)</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch :model-value=\"sharingEnabled\" :loading=\"loading\" @update:modelValue=\"onToggle\">Enable sharing (with request loading)</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingEnabled\">\n\t\t\tEnable sharing. This can contain a long multiline text, that will be wrapped in a second row. It is generally not advised to have such long text inside of an element\n\t\t</NcCheckboxRadioSwitch>\n\t\t<br>\n\t\tsharingEnabled: {{ sharingEnabled }}\n\t</div>\n</template>\n<script>\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\tloading: false,\n\t\t\tsharingEnabled: false,\n\t\t}\n\t},\n\tmethods: {\n\t\tonToggle() {\n\t\t\tthis.loading = true\n\n\t\t\tsetTimeout(() => {\n\t\t\t\tthis.sharingEnabled = !this.sharingEnabled\n\t\t\t\tthis.loading = false\n\t\t\t}, 1000)\n\t\t}\n\t}\n}\n</script>\n```\n\n### Standard radio set\n```vue\n<template>\n\t<div>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingPermission\" value=\"r\" name=\"sharing_permission_radio\" type=\"radio\">Default permission read</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingPermission\" value=\"rw\" name=\"sharing_permission_radio\" type=\"radio\">Default permission read+write</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingPermission\" value=\"rwx\" name=\"sharing_permission_radio\" type=\"radio\">Default permission read+write+execute</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingPermission\" value=\"rws\" name=\"sharing_permission_radio\" type=\"radio\">\n\t\t\tDefault permission read+write+share. This can contain a long multiline text, that will be wrapped in a second row. It is generally not advised to have such long text inside of an element\n\t\t</NcCheckboxRadioSwitch>\n\t\t<br>\n\t\tsharingPermission: {{ sharingPermission }}\n\t</div>\n</template>\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tsharingPermission: 'r',\n\t\t\t}\n\t\t}\n\t}\n</script>\n```\n\n### Standard radio set with alternative button style\n```vue\n<template>\n\t<div>\n\t\t<h4>Horizontal</h4>\n\t\t<div style=\"display: flex\">\n\t\t\t<NcCheckboxRadioSwitch\n\t\t\t\t:button-variant=\"true\"\n\t\t\t\tv-model=\"sharingPermission\"\n\t\t\t\tvalue=\"r\"\n\t\t\t\tname=\"sharing_permission_radio\"\n\t\t\t\ttype=\"radio\"\n\t\t\t\tbutton-variant-grouped=\"horizontal\">\n\t\t\t\tDefault permission read\n\t\t\t</NcCheckboxRadioSwitch>\n\t\t\t<NcCheckboxRadioSwitch\n\t\t\t\t:button-variant=\"true\"\n\t\t\t\tv-model=\"sharingPermission\"\n\t\t\t\tvalue=\"rw\"\n\t\t\t\tname=\"sharing_permission_radio\"\n\t\t\t\ttype=\"radio\"\n\t\t\t\tbutton-variant-grouped=\"horizontal\">\n\t\t\t\tDefault permission read+write\n\t\t\t</NcCheckboxRadioSwitch>\n\t\t</div>\n\t\t<h4>Vertically</h4>\n\t\t<div style=\"width: fit-content\">\n\t\t\t<NcCheckboxRadioSwitch\n\t\t\t\t:button-variant=\"true\"\n\t\t\t\tv-model=\"sharingPermission\"\n\t\t\t\tvalue=\"r\"\n\t\t\t\tname=\"sharing_permission_radio\"\n\t\t\t\ttype=\"radio\"\n\t\t\t\tbutton-variant-grouped=\"vertical\">\n\t\t\t\tDefault permission read\n\t\t\t</NcCheckboxRadioSwitch>\n\t\t\t<NcCheckboxRadioSwitch\n\t\t\t\t:button-variant=\"true\"\n\t\t\t\tv-model=\"sharingPermission\"\n\t\t\t\tvalue=\"rw\"\n\t\t\t\tname=\"sharing_permission_radio\"\n\t\t\t\ttype=\"radio\"\n\t\t\t\tbutton-variant-grouped=\"vertical\">\n\t\t\t\tDefault permission read+write\n\t\t\t</NcCheckboxRadioSwitch>\n\t\t</div>\n\t\tsharingPermission: {{ sharingPermission }}\n\t</div>\n</template>\n<script>\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\tsharingPermission: 'r',\n\t\t}\n\t}\n}\n</script>\n```\n\n### Radio set with button style and icons\n```vue\n<template>\n\t<div>\n\t\t<h4>Horizontal</h4>\n\t\t<div style=\"display: flex\">\n\t\t\t<NcCheckboxRadioSwitch\n\t\t\t\t:button-variant=\"true\"\n\t\t\t\tv-model=\"enableSettings\"\n\t\t\t\tvalue=\"y\"\n\t\t\t\tname=\"sharing_permission_radio\"\n\t\t\t\ttype=\"radio\"\n\t\t\t\tbutton-variant-grouped=\"horizontal\">\n\t\t\t\tEnable settings\n\t\t\t\t<template #icon><CheckIcon :size=\"20\"></template>\n\t\t\t</NcCheckboxRadioSwitch>\n\t\t\t<NcCheckboxRadioSwitch\n\t\t\t\t:button-variant=\"true\"\n\t\t\t\tv-model=\"enableSettings\"\n\t\t\t\tvalue=\"n\"\n\t\t\t\tname=\"sharing_permission_radio\"\n\t\t\t\ttype=\"radio\"\n\t\t\t\tbutton-variant-grouped=\"horizontal\">\n\t\t\t\tDisable settings\n\t\t\t\t<template #icon><CancelIcon :size=\"20\"></template>\n\t\t\t</NcCheckboxRadioSwitch>\n\t\t</div>\n\t\t<h4>Vertically</h4>\n\t\t<div style=\"width: fit-content\">\n\t\t\t<NcCheckboxRadioSwitch\n\t\t\t\t:button-variant=\"true\"\n\t\t\t\tv-model=\"enableSettings\"\n\t\t\t\tvalue=\"y\"\n\t\t\t\tname=\"sharing_permission_radio\"\n\t\t\t\ttype=\"radio\"\n\t\t\t\tbutton-variant-grouped=\"vertical\">\n\t\t\t\tEnable settings\n\t\t\t\t<template #icon><CheckIcon :size=\"20\"></template>\n\t\t\t</NcCheckboxRadioSwitch>\n\t\t\t<NcCheckboxRadioSwitch\n\t\t\t\t:button-variant=\"true\"\n\t\t\t\tv-model=\"enableSettings\"\n\t\t\t\tvalue=\"n\"\n\t\t\t\tname=\"sharing_permission_radio\"\n\t\t\t\ttype=\"radio\"\n\t\t\t\tbutton-variant-grouped=\"vertical\">\n\t\t\t\tDisable settings\n\t\t\t\t<template #icon><CancelIcon :size=\"20\"></template>\n\t\t\t</NcCheckboxRadioSwitch>\n\t\t</div>\n\t\tSettings enabled: {{ enableSettings === 'y' ? 'yes' : 'no' }}\n\t</div>\n</template>\n<script>\nimport CheckIcon from 'vue-material-design-icons/Check.vue'\nimport CancelIcon from 'vue-material-design-icons/Cancel.vue'\nexport default {\n\tcomponents: {\n\t\tCheckIcon,\n\t\tCancelIcon,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tenableSettings: 'n',\n\t\t}\n\t}\n}\n</script>\n```\n\n### Standard checkbox set\n```vue\n<template>\n\t<div>\n\t\t<NcCheckboxRadioSwitch :disabled=\"true\" v-model=\"sharingPermission\" value=\"r\" name=\"sharing_permission\">Permission read</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingPermission\" value=\"w\" name=\"sharing_permission\">Permission write</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingPermission\" value=\"d\" name=\"sharing_permission\">Permission delete</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingPermission\" value=\"x\" name=\"sharing_permission\">Permission execute</NcCheckboxRadioSwitch>\n\t\t<br>\n\t\tsharingPermission: {{ sharingPermission }}\n\t</div>\n</template>\n<script>\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\tsharingPermission: ['r', 'd'],\n\t\t}\n\t}\n}\n</script>\n```\n\n### Standard switch\n```vue\n<template>\n\t<div>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingEnabled\" type=\"switch\">Enable sharing</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingEnabled\" type=\"switch\">Enable sharing (v-model)</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingEnabled\" type=\"switch\" :disabled=\"true\">Enable sharing (disabled)</NcCheckboxRadioSwitch>\n\t\t<NcCheckboxRadioSwitch v-model=\"sharingEnabled\" type=\"switch\">\n\t\t\tEnable sharing. This can contain a long multiline text, that will be wrapped in a second row. It is generally not advised to have such long text inside of an element\n\t\t</NcCheckboxRadioSwitch>\n\t\t<br>\n\t\tsharingEnabled: {{ sharingEnabled }}\n\t</div>\n</template>\n<script>\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\tsharingEnabled: true,\n\t\t}\n\t},\n}\n</script>\n```\n\n</docs>\n\n<template>\n\t<component :is=\"computedWrapperElement\"\n\t\t:id=\"wrapperId\"\n\t\t:aria-label=\"isButtonType && ariaLabel ? ariaLabel : undefined\"\n\t\t:class=\"{\n\t\t\t['checkbox-radio-switch-' + type]: type,\n\t\t\t'checkbox-radio-switch--checked': isChecked,\n\t\t\t'checkbox-radio-switch--disabled': disabled,\n\t\t\t'checkbox-radio-switch--indeterminate': hasIndeterminate ? indeterminate : false,\n\t\t\t'checkbox-radio-switch--button-variant': buttonVariant,\n\t\t\t'checkbox-radio-switch--button-variant-v-grouped': buttonVariant && buttonVariantGrouped === 'vertical',\n\t\t\t'checkbox-radio-switch--button-variant-h-grouped': buttonVariant && buttonVariantGrouped === 'horizontal',\n\t\t\t'button-vue': isButtonType,\n\t\t}\"\n\t\tclass=\"checkbox-radio-switch\"\n\t\t:style=\"cssVars\"\n\t\t:type=\"isButtonType ? 'button' : null\"\n\t\tv-bind=\"isButtonType ? $attrs : dataAttrs\"\n\t\tv-on=\"isButtonType ? listeners : null\">\n\t\t<input v-if=\"!isButtonType\"\n\t\t\t:id=\"id\"\n\t\t\t:aria-labelledby=\"!isButtonType && !ariaLabel ? `${id}-label` : null\"\n\t\t\t:aria-label=\"ariaLabel || undefined\"\n\t\t\tclass=\"checkbox-radio-switch__input\"\n\t\t\t:disabled=\"disabled\"\n\t\t\t:type=\"inputType\"\n\t\t\t:value=\"value\"\n\t\t\t:checked=\"isChecked\"\n\t\t\t:indeterminate.prop=\"hasIndeterminate ? indeterminate : null\"\n\t\t\t:required=\"required\"\n\t\t\t:name=\"name\"\n\t\t\tv-bind=\"nonDataAttrs\"\n\t\t\tv-on=\"listeners\">\n\t\t<NcCheckboxContent :id=\"!isButtonType ? `${id}-label` : undefined\"\n\t\t\tclass=\"checkbox-radio-switch__content\"\n\t\t\ticon-class=\"checkbox-radio-switch__icon\"\n\t\t\ttext-class=\"checkbox-radio-switch__text\"\n\t\t\t:type=\"type\"\n\t\t\t:indeterminate=\"hasIndeterminate ? indeterminate : false\"\n\t\t\t:button-variant=\"buttonVariant\"\n\t\t\t:is-checked=\"isChecked\"\n\t\t\t:loading=\"loading\"\n\t\t\t:size=\"size\"\n\t\t\t@click.native=\"onToggle\">\n\t\t\t<template #icon>\n\t\t\t\t\n\t\t\t\t<slot name=\"icon\" />\n\t\t\t</template>\n\n\t\t\t\n\t\t\t<slot />\n\t\t</NcCheckboxContent>\n\t</component>\n</template>\n\n<script>\nimport { n, t } from '../../l10n.js'\nimport GenRandomId from '../../utils/GenRandomId.js'\nimport NcCheckboxContent, { TYPE_BUTTON, TYPE_CHECKBOX, TYPE_RADIO, TYPE_SWITCH } from './NcCheckboxContent.vue'\nimport { useModelMigration } from '../../composables/useModelMigration.ts'\n\nexport default {\n\tname: 'NcCheckboxRadioSwitch',\n\n\tcomponents: {\n\t\tNcCheckboxContent,\n\t},\n\n\t// We need to pass attributes to the input element\n\tinheritAttrs: false,\n\n\tmodel: {\n\t\tprop: 'modelValue',\n\t\tevent: 'update:modelValue',\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * Unique id attribute of the input\n\t\t */\n\t\tid: {\n\t\t\ttype: String,\n\t\t\tdefault: () => 'checkbox-radio-switch-' + GenRandomId(),\n\t\t\tvalidator: id => id.trim() !== '',\n\t\t},\n\n\t\t/**\n\t\t * Unique id attribute of the wrapper element\n\t\t */\n\t\twrapperId: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * Input name. Required for radio, optional for checkbox, and ignored\n\t\t * for button.\n\t\t */\n\t\tname: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * Required if no text is set.\n\t\t * The aria-label is forwarded to the input or button.\n\t\t */\n\t\tariaLabel: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * Type of the input. checkbox, radio, switch, or button.\n\t\t *\n\t\t * Only use button when used in a `tablist` container and the\n\t\t * `tab` role is set.\n\t\t *\n\t\t * @type {'checkbox'|'radio'|'switch'|'button'}\n\t\t */\n\t\ttype: {\n\t\t\ttype: String,\n\t\t\tdefault: 'checkbox',\n\t\t\tvalidator: type => [\n\t\t\t\tTYPE_CHECKBOX,\n\t\t\t\tTYPE_RADIO,\n\t\t\t\tTYPE_SWITCH,\n\t\t\t\tTYPE_BUTTON,\n\t\t\t].includes(type),\n\t\t},\n\n\t\t/**\n\t\t * Toggle the alternative button style\n\t\t */\n\t\tbuttonVariant: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Are the elements are all direct siblings?\n\t\t * If so they will be grouped horizontally or vertically\n\t\t *\n\t\t * @type {'no'|'horizontal'|'vertical'}\n\t\t */\n\t\tbuttonVariantGrouped: {\n\t\t\ttype: String,\n\t\t\tdefault: 'no',\n\t\t\tvalidator: v => ['no', 'vertical', 'horizontal'].includes(v),\n\t\t},\n\n\t\t/**\n\t\t * Removed in v9 - use `modelValue` (`v-model`) instead\n\t\t * @deprecated\n\t\t */\n\t\tchecked: {\n\t\t\ttype: [Boolean, Array, String],\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * Checkbox value\n\t\t */\n\t\tmodelValue: {\n\t\t\ttype: [Boolean, Array, String],\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Value to be synced on check\n\t\t */\n\t\tvalue: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * Disabled state\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 * Indeterminate state\n\t\t */\n\t\tindeterminate: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Required state\n\t\t */\n\t\trequired: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Loading state\n\t\t */\n\t\tloading: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Wrapping element tag\n\t\t *\n\t\t * When `type` is set to `button` this will be ignored\n\t\t *\n\t\t * Defaults to `span`\n\t\t */\n\t\twrapperElement: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t},\n\t},\n\n\temits: [\n\t\t/**\n\t\t * Removed in v9 - use `update:modelValue` (`v-model`) instead\n\t\t * @deprecated\n\t\t */\n\t\t'update:checked',\n\t\t'update:modelValue',\n\t\t/** Same as update:modelValue for Vue 2 compatibility */\n\t\t'update:model-value',\n\t],\n\n\tsetup() {\n\t\tconst model = useModelMigration('checked', 'update:checked')\n\t\treturn {\n\t\t\tmodel,\n\t\t}\n\t},\n\n\tcomputed: {\n\t\tdataAttrs() {\n\t\t\t// filter all data attributes\n\t\t\treturn Object.fromEntries(Object.entries(this.$attrs)\n\t\t\t\t.filter(([key]) => key.startsWith('data-')))\n\t\t},\n\n\t\tnonDataAttrs() {\n\t\t\t// filter all non-data attributes\n\t\t\treturn Object.fromEntries(Object.entries(this.$attrs)\n\t\t\t\t.filter(([key]) => !key.startsWith('data-')))\n\t\t},\n\n\t\tisButtonType() {\n\t\t\treturn this.type === TYPE_BUTTON\n\t\t},\n\n\t\tcomputedWrapperElement() {\n\t\t\tif (this.isButtonType) {\n\t\t\t\treturn 'button'\n\t\t\t}\n\t\t\tif (this.wrapperElement !== null) {\n\t\t\t\treturn this.wrapperElement\n\t\t\t}\n\t\t\treturn 'span'\n\t\t},\n\n\t\tlisteners() {\n\t\t\tif (this.isButtonType) {\n\t\t\t\treturn {\n\t\t\t\t\tclick: this.onToggle,\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn {\n\t\t\t\tchange: this.onToggle,\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Icon size\n\t\t *\n\t\t * @return {number}\n\t\t */\n\t\tsize() {\n\t\t\treturn this.type === TYPE_SWITCH\n\t\t\t\t? 36\n\t\t\t\t: 24\n\t\t},\n\n\t\t/**\n\t\t * Css local variables for this component\n\t\t *\n\t\t * @return {object}\n\t\t */\n\t\tcssVars() {\n\t\t\treturn {\n\t\t\t\t'--icon-size': this.size + 'px',\n\t\t\t\t'--icon-height': (this.type === TYPE_SWITCH ? 16 : this.size) + 'px',\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Return the input type.\n\t\t * Switch is not an official type\n\t\t *\n\t\t * @return {string}\n\t\t */\n\t\tinputType() {\n\t\t\tconst nativeTypes = [\n\t\t\t\tTYPE_CHECKBOX,\n\t\t\t\tTYPE_RADIO,\n\t\t\t\tTYPE_BUTTON,\n\t\t\t]\n\t\t\tif (nativeTypes.includes(this.type)) {\n\t\t\t\treturn this.type\n\t\t\t}\n\t\t\treturn TYPE_CHECKBOX\n\t\t},\n\n\t\t/**\n\t\t * Check if that entry is checked\n\t\t * If value is defined, we use that as the checked value\n\t\t * If not, we expect true/false in checked state\n\t\t *\n\t\t * @return {boolean}\n\t\t */\n\t\tisChecked() {\n\t\t\tif (this.value !== null) {\n\t\t\t\tif (Array.isArray(this.model)) {\n\t\t\t\t\treturn [...this.model].indexOf(this.value) > -1\n\t\t\t\t}\n\t\t\t\treturn this.model === this.value\n\t\t\t}\n\t\t\treturn this.model === true\n\t\t},\n\n\t\thasIndeterminate() {\n\t\t\treturn [\n\t\t\t\tTYPE_CHECKBOX,\n\t\t\t\tTYPE_RADIO,\n\t\t\t].includes(this.inputType)\n\t\t},\n\t},\n\n\tmounted() {\n\t\tif (this.name && this.type === TYPE_CHECKBOX) {\n\t\t\tif (!Array.isArray(this.model)) {\n\t\t\t\tthrow new Error('When using groups of checkboxes, the updated value will be an array.')\n\t\t\t}\n\t\t}\n\n\t\t// https://material.io/components/checkboxes#usage\n\t\tif (this.name && this.type === TYPE_SWITCH) {\n\t\t\tthrow new Error('Switches are not made to be used for data sets. Please use checkboxes instead.')\n\t\t}\n\n\t\t// https://material.io/components/checkboxes#usage\n\t\tif (typeof this.model !== 'boolean' && this.type === TYPE_SWITCH) {\n\t\t\tthrow new Error('Switches can only be used with boolean as checked prop.')\n\t\t}\n\t},\n\n\tmethods: {\n\t\tt,\n\t\tn,\n\n\t\tonToggle(event) {\n\t\t\tif (this.disabled || event.target.tagName.toLowerCase() === 'a') {\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\t// If this is a radio, there can only be one value\n\t\t\tif (this.type === TYPE_RADIO) {\n\t\t\t\tthis.model = this.value\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\t// If this is a radio, there can only be one value\n\t\t\tif (this.type === TYPE_SWITCH) {\n\t\t\t\tthis.model = !this.isChecked\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\t// If the initial value was a boolean, let's keep it that way\n\t\t\tif (typeof this.model === 'boolean') {\n\t\t\t\tthis.model = !this.model\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\t// Dispatch the checked values as an array if multiple, or single value otherwise\n\t\t\tconst values = this.getInputsSet()\n\t\t\t\t.filter(input => input.checked)\n\t\t\t\t.map(input => input.value)\n\n\t\t\tif (values.includes(this.value)) {\n\t\t\t\tthis.model = values.filter((v) => v !== this.value)\n\t\t\t} else {\n\t\t\t\tthis.model = [...values, this.value]\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Get the input set based on this name\n\t\t *\n\t\t * @return {Node[]}\n\t\t */\n\t\tgetInputsSet() {\n\t\t\treturn [...document.getElementsByName(this.name)]\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.checkbox-radio-switch {\n\tdisplay: flex;\n\talign-items: center;\n\tcolor: var(--color-main-text);\n\tbackground-color: transparent;\n\tbox-sizing: border-box;\n\tfont-size: var(--default-font-size);\n\tline-height: var(--default-line-height);\n\tpadding: 0;\n\tposition: relative;\n\n\t* {\n\t\tbox-sizing: border-box;\n\t}\n\n\t&__input {\n\t\tposition: absolute;\n\t\tz-index: -1;\n\t\topacity: 0 !important; // We need !important, or it gets overwritten by server style\n\t\twidth: var(--icon-size);\n\t\theight: var(--icon-size);\n\t\t// Same as label padding\n\t\tmargin: 4px $icon-margin;\n\t}\n\n\t&__input:focus-visible + &__content,\n\t&__input:focus-visible {\n\t\toutline: 2px solid var(--color-main-text);\n\t\tborder-color: var(--color-main-background);\n\t\toutline-offset: -2px;\n\t}\n\n\t&--disabled &__content {\n\t\topacity: $opacity_disabled;\n\t\t:deep(.checkbox-radio-switch__icon) > * {\n\t\t\tcolor: var(--color-main-text)\n\t\t}\n\t\t&.checkbox-content,\n\t\t&.checkbox-content :deep(*:not(a)) {\n\t\t\tcursor: default !important;\n\t\t}\n\t}\n\n\t&:not(&--disabled, &--checked):focus-within &__content,\n\t&:not(&--disabled, &--checked) &__content:hover {\n\t\tbackground-color: var(--color-background-hover);\n\t}\n\n\t&--checked:not(&--disabled):focus-within &__content,\n\t&--checked:not(&--disabled) &__content:hover {\n\t\tbackground-color: var(--color-primary-element-hover);\n\t}\n\n\t&--checked:not(&--button-variant):not(&--disabled):focus-within &__content,\n\t&--checked:not(&--button-variant):not(&--disabled) &__content:hover {\n\t\tbackground-color: var(--color-primary-element-light-hover);\n\t}\n\n\t// Switch specific rules\n\t&-switch:not(&--checked) :deep(.checkbox-radio-switch__icon) > * {\n\t\tcolor: var(--color-text-maxcontrast);\n\t}\n\n\t// If switch is checked AND disabled, use the fade primary colour\n\t&-switch.checkbox-radio-switch--disabled.checkbox-radio-switch--checked :deep(.checkbox-radio-switch__icon) > * {\n\t\tcolor: var(--color-primary-element-light);\n\t}\n\n\t--checkbox-radio-switch--border-radius: var(--border-radius-element, calc(var(--default-clickable-area) / 2));\n\t// keep inner border width in mind\n\t--checkbox-radio-switch--border-radius-outer: calc(var(--checkbox-radio-switch--border-radius) + 2px);\n\n\t&--button-variant.checkbox-radio-switch {\n\t\tbackground-color: var(--color-main-background);\n\t\tborder: 2px solid var(--color-border-maxcontrast);\n\t\toverflow: hidden;\n\n\t\t&--checked {\n\t\t\tfont-weight: bold;\n\n\t\t\t.checkbox-radio-switch__content {\n\t\t\t\tbackground-color: var(--color-primary-element);\n\t\t\t\tcolor: var(--color-primary-element-text);\n\t\t\t}\n\t\t}\n\t}\n\n\t// Text overflow of button style\n\t&--button-variant :deep(.checkbox-radio-switch__text) {\n\t\toverflow: hidden;\n\t\ttext-overflow: ellipsis;\n\t\twhite-space: nowrap;\n\t\twidth: 100%;\n\t}\n\n\t// Set icon color for non active elements to main text color\n\t&--button-variant:not(&--checked) :deep(.checkbox-radio-switch__icon) > * {\n\t\tcolor: var(--color-main-text);\n\t}\n\n\t// Hide icon container if empty to remove virtual padding\n\t&--button-variant :deep(.checkbox-radio-switch__icon:empty) {\n\t\tdisplay: none;\n\t}\n\n\t&--button-variant:not(&--button-variant-v-grouped):not(&--button-variant-h-grouped),\n\t&--button-variant &__content {\n\t\tborder-radius: var(--checkbox-radio-switch--border-radius);\n\t}\n\n\t/* Special rules for vertical button groups */\n\t&--button-variant-v-grouped &__content {\n\t\tflex-basis: 100%;\n\t\t// vertically grouped buttons should all have the same width\n\t\tmax-width: unset;\n\t}\n\t&--button-variant-v-grouped {\n\t\t&:first-of-type {\n\t\t\tborder-start-start-radius: var(--checkbox-radio-switch--border-radius-outer);\n\t\t\tborder-start-end-radius: var(--checkbox-radio-switch--border-radius-outer);\n\t\t}\n\t\t&:last-of-type {\n\t\t\tborder-end-start-radius: var(--checkbox-radio-switch--border-radius-outer);\n\t\t\tborder-end-end-radius: var(--checkbox-radio-switch--border-radius-outer);\n\t\t}\n\n\t\t// remove borders between elements\n\t\t&:not(:last-of-type) {\n\t\t\tborder-bottom: 0!important;\n\t\t\t.checkbox-radio-switch__content {\n\t\t\t\tmargin-bottom: 2px;\n\t\t\t}\n\t\t}\n\t\t&:not(:first-of-type) {\n\t\t\tborder-top: 0!important;\n\t\t}\n\t}\n\n\t/* Special rules for horizontal button groups */\n\t&--button-variant-h-grouped {\n\t\t&:first-of-type {\n\t\t\tborder-start-start-radius: var(--checkbox-radio-switch--border-radius-outer);\n\t\t\tborder-end-start-radius: var(--checkbox-radio-switch--border-radius-outer);\n\t\t}\n\t\t&:last-of-type {\n\t\t\tborder-start-end-radius: var(--checkbox-radio-switch--border-radius-outer);\n\t\t\tborder-end-end-radius: var(--checkbox-radio-switch--border-radius-outer);\n\t\t}\n\n\t\t// remove borders between elements\n\t\t&:not(:last-of-type) {\n\t\t\tborder-inline-end: 0!important;\n\t\t\t.checkbox-radio-switch__content {\n\t\t\t\tmargin-inline-end: 2px;\n\t\t\t}\n\t\t}\n\t\t&:not(:first-of-type) {\n\t\t\tborder-inline-start: 0!important;\n\t\t}\n\t}\n\t&--button-variant-h-grouped :deep(.checkbox-radio-switch__text) {\n\t\ttext-align: center;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n\t&--button-variant-h-grouped &__content {\n\t\tflex-direction: column;\n\t\tjustify-content: center;\n\t\twidth: 100%;\n\t\tmargin: 0;\n\t\tgap: 0;\n\t}\n}\n</style>\n"],"names":["_sfc_main","NcLoadingIcon","GenRandomId","useModelMigration","t","n"],"mappings":"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","x_google_ignoreList":[0,1,2,3,4,5,6]}

package/dist/chunks/NcPopover-CAJVK-MR.mjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"NcPopover-CAJVK-MR.mjs","sources":["../../src/components/NcPopover/NcPopoverTriggerProvider.vue","../../src/components/NcPopover/NcPopover.vue"],"sourcesContent":["\n\n<script>\nimport { defineComponent } from 'vue'\n\nexport default defineComponent({\n\tname: 'NcPopoverTriggerProvider',\n\n\tprovide() {\n\t\treturn {\n\t\t\t'NcPopover:trigger:shown': () => this.shown,\n\t\t\t'NcPopover:trigger:attrs': () => this.triggerAttrs,\n\t\t}\n\t},\n\n\tprops: {\n\t\tshown: {\n\t\t\ttype: Boolean,\n\t\t\trequired: true,\n\t\t},\n\t\tpopupRole: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\t},\n\n\tcomputed: {\n\t\ttriggerAttrs() {\n\t\t\treturn {\n\t\t\t\t'aria-haspopup': this.popupRole,\n\t\t\t\t'aria-expanded': this.shown.toString(),\n\t\t\t}\n\t\t},\n\t},\n\n\trender() {\n\t\t// TODO: Vue 3 - replace with $slots\n\t\treturn this.$scopedSlots.default?.({\n\t\t\tattrs: this.triggerAttrs,\n\t\t})\n\t},\n})\n</script>\n","\n\n<docs>\n\n### General description\n\nThis component is just a wrapper for the floating-vue plugin by Akryum,\nplease refer to this documentation for customization:\nhttps://github.com/Akryum/floating-vue\n\nThis components has two slots:\n* 'trigger' which can be any html element and it will trigger the popover\nthis slot is optional since you can toggle the popover also by updating the\nopen prop on this component;\n\n* a default slot that is for the content of the popover.\n\n### Examples\n\n#### With a `<NcButton>` as a trigger:\n\n```vue\n<template>\n\t<div style=\"display: flex\">\n\t\t<NcPopover popup-role=\"dialog\">\n\t\t\t<template #trigger>\n\t\t\t\t<NcButton>I am the trigger</NcButton>\n\t\t\t</template>\n\t\t\t<template>\n\t\t\t\t<form tabindex=\"0\" role=\"dialog\" aria-labelledby=\"popover-example-dialog-header-1\" @submit.prevent>\n\t\t\t\t\t<h2 id=\"popover-example-dialog-header-1\">this is some content</h2>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. <br/>\n\t\t\t\t\t\tVestibulum eget placerat velit.\n\t\t\t\t\t</p>\n\t\t\t\t\t<label>\n\t\t\t\t\t\tLabel element\n\t\t\t\t\t\t<input type=\"text\" placeholder=\"input element\"/>\n\t\t\t\t\t</label>\n\t\t\t\t</form>\n\t\t\t</template>\n\t\t</NcPopover>\n\t</div>\n</template>\n```\n\n#### Without focus trap:\n\nThe [`focus-trap`](https://github.com/focus-trap/focus-trap) emits an error when used in a non-focusable element tree.\n\nThe prop `:focus-trap=\"false\"` help to prevent it when the default behavior is not relevant.\n\n```vue\n<template>\n\t<div style=\"display: flex\">\n\t\t<NcPopover :focus-trap=\"false\">\n\t\t\t<template #trigger>\n\t\t\t\t<NcButton>Click me!</NcButton>\n\t\t\t</template>\n\t\t\t<template>\n\t\t\t\tHi! 🚀\n\t\t\t</template>\n\t\t</NcPopover>\n\t</div>\n</template>\n```\n\n#### With passing props to `floating-vue`'s `Dropdown`:\n\n```vue\n<template>\n\t<div style=\"display: flex\">\n\t\t<NcPopover container=\"body\" :popper-hide-triggers=\"(triggers) => [...triggers, 'click']\" popup-role=\"dialog\">\n\t\t\t<template #trigger>\n\t\t\t\t<NcButton>I am the trigger</NcButton>\n\t\t\t</template>\n\t\t\t<template #default>\n\t\t\t\t<NcButton>Click on the button will close NcPopover</NcButton>\n\t\t\t</template>\n\t\t</NcPopover>\n\t</div>\n</template>\n```\n\n#### With a custom button in as a trigger:\n\nWhen `<NcButton>` is used as a `<NcPopover>` trigger, it injects required for a11y attributes to the button.\n\nIf you are using your own custom button as a trigger make sure to bind `attrs` from the trigger slot props.\nSee code example below.\n\n```vue\n<template>\n\t<div style=\"display: flex\">\n\t\t<NcPopover>\n\t\t\t\n\t\t\t<template #trigger=\"{ attrs }\">\n\t\t\t\t\n\t\t\t\t<button v-bind=\"attrs\">\n\t\t\t\t\tI am a custom button in the trigger\n\t\t\t\t</button>\n\t\t\t</template>\n\n\t\t\tHi! 🚀\n\t\t</NcPopover>\n\t</div>\n</template>\n```\n\n#### Provide role for the popover content\n\nFor accessibility reasons, popover should have a role. Provide it to the `popup-role` and make sure that the popover content is an element with the same role.\n\nSee: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-haspopup\n\n```vue\n<template>\n\t<div style=\"display: flex\">\n\t\t\n\t\t<NcPopover popup-role=\"dialog\">\n\t\t\t<template #trigger>\n\t\t\t\t<NcButton>Delete</NcButton>\n\t\t\t</template>\n\n\t\t\t\n\t\t\t<div role=\"dialog\" aria-labelledby=\"popover-example-custom-role-1\" aria-modal=\"true\">\n\t\t\t\t\n\t\t\t\t<header id=\"popover-example-custom-role-1\">\n\t\t\t\t\t<strong>Confirm remove</strong>\n\t\t\t\t</header>\n\t\t\t\t<NcButton type=\"danger\">Delete</NcButton>\n\t\t\t</div>\n\t\t</NcPopover>\n\t</div>\n</template>\n```\n</docs>\n\n<template>\n\t<Dropdown ref=\"popover\"\n\t\t:distance=\"10\"\n\t\t:arrow-padding=\"10\"\n\t\tv-bind=\"$attrs\"\n\t\t:no-auto-focus=\"true /* Handled by the focus trap */\"\n\t\t:popper-class=\"[$style.ncPopover, popoverBaseClass]\"\n\t\t:theme=\"THEME\"\n\t\t:shown=\"internalShown\"\n\t\tv-on=\"$listeners\"\n\t\t@update:shown=\"internalShown = $event\"\n\t\t@apply-show=\"afterShow\"\n\t\t@apply-hide=\"afterHide\">\n\t\t<NcPopoverTriggerProvider v-slot=\"slotProps\" :shown=\"internalShown\" :popup-role=\"popupRole\">\n\t\t\t\n\t\t\t<slot name=\"trigger\" v-bind=\"slotProps\" />\n\t\t</NcPopoverTriggerProvider>\n\n\t\t\n\t\t<template #popper=\"slotProps\">\n\t\t\t<slot name=\"default\" v-bind=\"slotProps\" />\n\t\t</template>\n\t</Dropdown>\n</template>\n\n<script>\nimport Vue from 'vue'\nimport { options, Dropdown } from 'floating-vue'\nimport { createFocusTrap } from 'focus-trap'\nimport { getTrapStack } from '../../utils/focusTrap.ts'\nimport NcPopoverTriggerProvider from './NcPopoverTriggerProvider.vue'\n\nconst THEME = 'nc-popover-8'\n\n// NcPopover has a custom theme to have a custom name but same as the default \"dropdown\" theme\noptions.themes[THEME] = structuredClone(options.themes.dropdown)\n\n/**\n * @typedef {import('focus-trap').FocusTargetValueOrFalse} FocusTargetValueOrFalse\n * @typedef {FocusTargetValueOrFalse|() => FocusTargetValueOrFalse} SetReturnFocus\n */\nexport default {\n\tname: 'NcPopover',\n\n\tcomponents: {\n\t\tDropdown,\n\t\tNcPopoverTriggerProvider,\n\t},\n\n\tinheritAttrs: false,\n\n\tprops: {\n\t\t/**\n\t\t * Show or hide the popper\n\t\t * @see https://floating-vue.starpad.dev/api/#shown\n\t\t */\n\t\tshown: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Popup role\n\t\t * @see https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-haspopup#values\n\t\t */\n\t\tpopupRole: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t\tvalidator: (value) => ['menu', 'listbox', 'tree', 'grid', 'dialog', 'true'].includes(value),\n\t\t},\n\n\t\tpopoverBaseClass: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * Enable popover focus trap\n\t\t *\n\t\t * @deprecated use noFocusTrap instead\n\t\t */\n\t\tfocusTrap: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: true,\n\t\t},\n\n\t\t/**\n\t\t * Disable the popover focus trap.\n\t\t */\n\t\tnoFocusTrap: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Set element to return focus to after focus trap deactivation\n\t\t *\n\t\t * @type {SetReturnFocus}\n\t\t */\n\t\tsetReturnFocus: {\n\t\t\tdefault: undefined,\n\t\t\ttype: [HTMLElement, SVGElement, String, Boolean, Function],\n\t\t},\n\t},\n\n\temits: [\n\t\t'after-show',\n\t\t'after-hide',\n\t\t/**\n\t\t * @see https://floating-vue.starpad.dev/api/#update-shown\n\t\t */\n\t\t'update:shown',\n\t],\n\n\tsetup() {\n\t\treturn {\n\t\t\tTHEME,\n\t\t}\n\t},\n\n\tdata() {\n\t\treturn {\n\t\t\tinternalShown: this.shown,\n\t\t}\n\t},\n\n\twatch: {\n\t\tshown(value) {\n\t\t\tthis.internalShown = value\n\t\t},\n\n\t\tinternalShown(value) {\n\t\t\tthis.$emit('update:shown', value)\n\t\t},\n\t},\n\n\tmounted() {\n\t\tthis.checkTriggerA11y()\n\t},\n\n\tbeforeDestroy() {\n\t\tthis.clearFocusTrap()\n\t\tthis.clearEscapeStopPropagation()\n\t},\n\n\tmethods: {\n\t\t/**\n\t\t * Check if the trigger has all required a11y attributes.\n\t\t * Important to check custom trigger button.\n\t\t */\n\t\tcheckTriggerA11y() {\n\t\t\tif (window.OC?.debug) {\n\t\t\t\tconst triggerContainer = this.getPopoverTriggerContainerElement()\n\t\t\t\tconst requiredTriggerButton = triggerContainer.querySelector('[aria-expanded]')\n\t\t\t\tif (!requiredTriggerButton) {\n\t\t\t\t\tVue.util.warn('It looks like you are using a custom button as a <NcPopover> or other popover #trigger. If you are not using <NcButton> as a trigger, you need to bind attrs from the #trigger slot props to your custom button. See <NcPopover> docs for an example.')\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Remove incorrect aria-describedby attribute from the trigger.\n\t\t * @see https://github.com/Akryum/floating-vue/blob/8d4f7125aae0e3ea00ba4093d6d2001ab15058f1/packages/floating-vue/src/components/Popper.ts#L734\n\t\t */\n\t\tremoveFloatingVueAriaDescribedBy() {\n\t\t\t// When the popover is shown, floating-vue mutates the root elements of the trigger adding data-popper-shown and incorrect aria-describedby attributes.\n\t\t\tconst triggerContainer = this.getPopoverTriggerContainerElement()\n\t\t\tconst triggerElements = triggerContainer.querySelectorAll('[data-popper-shown]')\n\t\t\tfor (const el of triggerElements) {\n\t\t\t\tel.removeAttribute('aria-describedby')\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * @return {HTMLElement|undefined}\n\t\t */\n\t\tgetPopoverContentElement() {\n\t\t\treturn this.$refs.popover?.$refs.popperContent?.$el\n\t\t},\n\n\t\t/**\n\t\t * @return {HTMLElement|undefined}\n\t\t */\n\t\tgetPopoverTriggerContainerElement() {\n\t\t\t// TODO: Vue 3: should be\n\t\t\t// this.$refs.popover.$refs.popper.$refs.reference\n\t\t\treturn this.$refs.popover.$refs.reference\n\t\t},\n\n\t\t/**\n\t\t * Add focus trap for accessibility.\n\t\t */\n\t\tasync useFocusTrap() {\n\t\t\tawait this.$nextTick()\n\n\t\t\tif (this.noFocusTrap || !this.focusTrap) {\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\tconst el = this.getPopoverContentElement()\n\t\t\tel.tabIndex = -1\n\n\t\t\tif (!el) {\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\t// Init focus trap\n\t\t\tthis.$focusTrap = createFocusTrap(el, {\n\t\t\t\t// Prevents to lose focus using esc key\n\t\t\t\t// Focus will be release when popover be hide\n\t\t\t\tescapeDeactivates: false,\n\t\t\t\tallowOutsideClick: true,\n\t\t\t\tsetReturnFocus: this.setReturnFocus,\n\t\t\t\ttrapStack: getTrapStack(),\n\t\t\t\tfallBackFocus: el,\n\t\t\t})\n\t\t\tthis.$focusTrap.activate()\n\t\t},\n\n\t\t/**\n\t\t * Remove focus trap\n\t\t *\n\t\t * @param {object} options The configuration options for focusTrap\n\t\t */\n\t\tclearFocusTrap(options = {}) {\n\t\t\ttry {\n\t\t\t\tthis.$focusTrap?.deactivate(options)\n\t\t\t\tthis.$focusTrap = null\n\t\t\t} catch (err) {\n\t\t\t\tconsole.warn(err)\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Add stopPropagation for Escape.\n\t\t * It prevents global Escape handling after closing popover.\n\t\t *\n\t\t * Manual event handling is used here instead of v-on because there is no direct access to the node.\n\t\t * Alternative - wrap <template #popover> in a div wrapper.\n\t\t */\n\t\taddEscapeStopPropagation() {\n\t\t\tconst el = this.getPopoverContentElement()\n\t\t\tel?.addEventListener('keydown', this.stopKeydownEscapeHandler)\n\t\t},\n\n\t\t/**\n\t\t * Remove stop Escape handler\n\t\t */\n\t\tclearEscapeStopPropagation() {\n\t\t\tconst el = this.getPopoverContentElement()\n\t\t\tel?.removeEventListener('keydown', this.stopKeydownEscapeHandler)\n\t\t},\n\n\t\t/**\n\t\t * @param {KeyboardEvent} event - native keydown event\n\t\t */\n\t\tstopKeydownEscapeHandler(event) {\n\t\t\tif (event.type === 'keydown' && event.key === 'Escape') {\n\t\t\t\tevent.stopPropagation()\n\t\t\t}\n\t\t},\n\n\t\tasync afterShow() {\n\t\t\tthis.getPopoverContentElement().addEventListener('transitionend', () => {\n\t\t\t\t/**\n\t\t\t\t * Triggered after the tooltip was visually displayed.\n\t\t\t\t *\n\t\t\t\t * This is different from the 'show' and 'apply-show' which\n\t\t\t\t * run earlier than this where there is no guarantee that the\n\t\t\t\t * tooltip is already visible and in the DOM.\n\t\t\t\t */\n\t\t\t\tthis.$emit('after-show')\n\t\t\t}, { once: true, passive: true })\n\n\t\t\tthis.removeFloatingVueAriaDescribedBy()\n\n\t\t\tawait this.$nextTick()\n\t\t\tawait this.useFocusTrap()\n\t\t\tthis.addEscapeStopPropagation()\n\t\t},\n\t\tafterHide() {\n\t\t\tthis.getPopoverContentElement().addEventListener('transitionend', () => {\n\t\t\t\t/**\n\t\t\t\t * Triggered after the tooltip was visually hidden.\n\t\t\t\t *\n\t\t\t\t * This is different from the 'hide' and 'apply-hide' which\n\t\t\t\t * run earlier than this where there is no guarantee that the\n\t\t\t\t * tooltip is already visible and in the DOM.\n\t\t\t\t */\n\t\t\t\tthis.$emit('after-hide')\n\t\t\t}, { once: true, passive: true })\n\n\t\t\tthis.clearFocusTrap()\n\t\t\tthis.clearEscapeStopPropagation()\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" module>\n$arrow-width: 10px;\n// Move the arrow just slightly inside the popover\n// To prevent a visual gap on page scaling\n$arrow-position: $arrow-width - 1px;\n\n// Class is built by floating-vue as \"v-popper--theme-{THEME}\"\n.ncPopover:global(.v-popper--theme-nc-popover-8) {\n\t// Size class comes from the floating-vue library we use\n\t:global(.resize-observer) {\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\tleft: 0;\n\t\tz-index: -1;\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tborder: none;\n\t\tbackground-color: transparent;\n\t\tpointer-events: none;\n\t\tdisplay: block;\n\t\toverflow: hidden;\n\t\topacity: 0;\n\n\t\tobject {\n\t\t\tdisplay: block;\n\t\t\tposition: absolute;\n\t\t\ttop: 0;\n\t\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\t\tleft: 0;\n\t\t\theight: 100%;\n\t\t\twidth: 100%;\n\t\t\toverflow: hidden;\n\t\t\tpointer-events: none;\n\t\t\tz-index: -1;\n\t\t}\n\t}\n\n\t&:global(.v-popper__popper) {\n\t\tz-index: 100000;\n\t\ttop: 0;\n\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\tleft: 0;\n\t\tdisplay: block !important;\n\n\t\t:global(.v-popper__wrapper) {\n\t\t\t/*\n\t\t\t * In theory, \"filter: drop-shadow\" would look better here with arrow shadow.\n\t\t\t * In fact, in results in a blurry popover in Chromium on scaling.\n\t\t\t * The hypothesis is that \"filter\" creates a new composition layer,\n\t\t\t * and with GPU acceleration requires the previous layers content to be rasterized.\n\t\t\t * In combination with translate3d from floating-vue, it makes Chromium to first render and rasterize the popover\n\t\t\t * and then apply scaling, which results in a blurry popover.\n\t\t\t */\n\t\t\tbox-shadow: 0 1px 10px var(--color-box-shadow);\n\t\t\tborder-radius: var(--border-radius-large);\n\t\t}\n\n\t\t:global(.v-popper__inner) {\n\t\t\tpadding: 0;\n\t\t\tcolor: var(--color-main-text);\n\t\t\tborder-radius: var(--border-radius-large);\n\t\t\toverflow: hidden;\n\t\t\tbackground: var(--color-main-background);\n\t\t}\n\n\t\t:global(.v-popper__arrow-container) {\n\t\t\tposition: absolute;\n\t\t\tz-index: 1;\n\t\t\twidth: 0;\n\t\t\theight: 0;\n\t\t\tborder-style: solid;\n\t\t\tborder-color: transparent;\n\t\t\tborder-width: $arrow-width;\n\t\t}\n\n\t\t&[data-popper-placement^='top'] :global(.v-popper__arrow-container) {\n\t\t\tbottom: -$arrow-position;\n\t\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\t\tborder-bottom-width: 0;\n\t\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\t\tborder-top-color: var(--color-main-background);\n\t\t}\n\n\t\t&[data-popper-placement^='bottom'] :global(.v-popper__arrow-container) {\n\t\t\ttop: -$arrow-position;\n\t\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\t\tborder-top-width: 0;\n\t\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\t\tborder-bottom-color: var(--color-main-background);\n\t\t}\n\n\t\t&[data-popper-placement^='right'] :global(.v-popper__arrow-container) {\n\t\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\t\tleft: -$arrow-position;\n\t\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\t\tborder-left-width: 0;\n\t\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\t\tborder-right-color: var(--color-main-background);\n\t\t}\n\n\t\t&[data-popper-placement^='left'] :global(.v-popper__arrow-container) {\n\t\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\t\tright: -$arrow-position;\n\t\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\t\tborder-right-width: 0;\n\t\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\t\tborder-left-color: var(--color-main-background);\n\t\t}\n\n\t\t&[aria-hidden='true'] {\n\t\t\tvisibility: hidden;\n\t\t\ttransition: opacity var(--animation-quick), visibility var(--animation-quick);\n\t\t\topacity: 0;\n\t\t}\n\n\t\t&[aria-hidden='false'] {\n\t\t\tvisibility: visible;\n\t\t\ttransition: opacity var(--animation-quick);\n\t\t\topacity: 1;\n\t\t}\n\t}\n}\n\n</style>\n"],"names":["_sfc_main","options"],"mappings":"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"}

package/dist/chunks/NcPopover-QGSKWhSP.cjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"NcPopover-QGSKWhSP.cjs","sources":["../../src/components/NcPopover/NcPopoverTriggerProvider.vue","../../src/components/NcPopover/NcPopover.vue"],"sourcesContent":["\n\n<script>\nimport { defineComponent } from 'vue'\n\nexport default defineComponent({\n\tname: 'NcPopoverTriggerProvider',\n\n\tprovide() {\n\t\treturn {\n\t\t\t'NcPopover:trigger:shown': () => this.shown,\n\t\t\t'NcPopover:trigger:attrs': () => this.triggerAttrs,\n\t\t}\n\t},\n\n\tprops: {\n\t\tshown: {\n\t\t\ttype: Boolean,\n\t\t\trequired: true,\n\t\t},\n\t\tpopupRole: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\t},\n\n\tcomputed: {\n\t\ttriggerAttrs() {\n\t\t\treturn {\n\t\t\t\t'aria-haspopup': this.popupRole,\n\t\t\t\t'aria-expanded': this.shown.toString(),\n\t\t\t}\n\t\t},\n\t},\n\n\trender() {\n\t\t// TODO: Vue 3 - replace with $slots\n\t\treturn this.$scopedSlots.default?.({\n\t\t\tattrs: this.triggerAttrs,\n\t\t})\n\t},\n})\n</script>\n","\n\n<docs>\n\n### General description\n\nThis component is just a wrapper for the floating-vue plugin by Akryum,\nplease refer to this documentation for customization:\nhttps://github.com/Akryum/floating-vue\n\nThis components has two slots:\n* 'trigger' which can be any html element and it will trigger the popover\nthis slot is optional since you can toggle the popover also by updating the\nopen prop on this component;\n\n* a default slot that is for the content of the popover.\n\n### Examples\n\n#### With a `<NcButton>` as a trigger:\n\n```vue\n<template>\n\t<div style=\"display: flex\">\n\t\t<NcPopover popup-role=\"dialog\">\n\t\t\t<template #trigger>\n\t\t\t\t<NcButton>I am the trigger</NcButton>\n\t\t\t</template>\n\t\t\t<template>\n\t\t\t\t<form tabindex=\"0\" role=\"dialog\" aria-labelledby=\"popover-example-dialog-header-1\" @submit.prevent>\n\t\t\t\t\t<h2 id=\"popover-example-dialog-header-1\">this is some content</h2>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. <br/>\n\t\t\t\t\t\tVestibulum eget placerat velit.\n\t\t\t\t\t</p>\n\t\t\t\t\t<label>\n\t\t\t\t\t\tLabel element\n\t\t\t\t\t\t<input type=\"text\" placeholder=\"input element\"/>\n\t\t\t\t\t</label>\n\t\t\t\t</form>\n\t\t\t</template>\n\t\t</NcPopover>\n\t</div>\n</template>\n```\n\n#### Without focus trap:\n\nThe [`focus-trap`](https://github.com/focus-trap/focus-trap) emits an error when used in a non-focusable element tree.\n\nThe prop `:focus-trap=\"false\"` help to prevent it when the default behavior is not relevant.\n\n```vue\n<template>\n\t<div style=\"display: flex\">\n\t\t<NcPopover :focus-trap=\"false\">\n\t\t\t<template #trigger>\n\t\t\t\t<NcButton>Click me!</NcButton>\n\t\t\t</template>\n\t\t\t<template>\n\t\t\t\tHi! 🚀\n\t\t\t</template>\n\t\t</NcPopover>\n\t</div>\n</template>\n```\n\n#### With passing props to `floating-vue`'s `Dropdown`:\n\n```vue\n<template>\n\t<div style=\"display: flex\">\n\t\t<NcPopover container=\"body\" :popper-hide-triggers=\"(triggers) => [...triggers, 'click']\" popup-role=\"dialog\">\n\t\t\t<template #trigger>\n\t\t\t\t<NcButton>I am the trigger</NcButton>\n\t\t\t</template>\n\t\t\t<template #default>\n\t\t\t\t<NcButton>Click on the button will close NcPopover</NcButton>\n\t\t\t</template>\n\t\t</NcPopover>\n\t</div>\n</template>\n```\n\n#### With a custom button in as a trigger:\n\nWhen `<NcButton>` is used as a `<NcPopover>` trigger, it injects required for a11y attributes to the button.\n\nIf you are using your own custom button as a trigger make sure to bind `attrs` from the trigger slot props.\nSee code example below.\n\n```vue\n<template>\n\t<div style=\"display: flex\">\n\t\t<NcPopover>\n\t\t\t\n\t\t\t<template #trigger=\"{ attrs }\">\n\t\t\t\t\n\t\t\t\t<button v-bind=\"attrs\">\n\t\t\t\t\tI am a custom button in the trigger\n\t\t\t\t</button>\n\t\t\t</template>\n\n\t\t\tHi! 🚀\n\t\t</NcPopover>\n\t</div>\n</template>\n```\n\n#### Provide role for the popover content\n\nFor accessibility reasons, popover should have a role. Provide it to the `popup-role` and make sure that the popover content is an element with the same role.\n\nSee: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-haspopup\n\n```vue\n<template>\n\t<div style=\"display: flex\">\n\t\t\n\t\t<NcPopover popup-role=\"dialog\">\n\t\t\t<template #trigger>\n\t\t\t\t<NcButton>Delete</NcButton>\n\t\t\t</template>\n\n\t\t\t\n\t\t\t<div role=\"dialog\" aria-labelledby=\"popover-example-custom-role-1\" aria-modal=\"true\">\n\t\t\t\t\n\t\t\t\t<header id=\"popover-example-custom-role-1\">\n\t\t\t\t\t<strong>Confirm remove</strong>\n\t\t\t\t</header>\n\t\t\t\t<NcButton type=\"danger\">Delete</NcButton>\n\t\t\t</div>\n\t\t</NcPopover>\n\t</div>\n</template>\n```\n</docs>\n\n<template>\n\t<Dropdown ref=\"popover\"\n\t\t:distance=\"10\"\n\t\t:arrow-padding=\"10\"\n\t\tv-bind=\"$attrs\"\n\t\t:no-auto-focus=\"true /* Handled by the focus trap */\"\n\t\t:popper-class=\"[$style.ncPopover, popoverBaseClass]\"\n\t\t:theme=\"THEME\"\n\t\t:shown=\"internalShown\"\n\t\tv-on=\"$listeners\"\n\t\t@update:shown=\"internalShown = $event\"\n\t\t@apply-show=\"afterShow\"\n\t\t@apply-hide=\"afterHide\">\n\t\t<NcPopoverTriggerProvider v-slot=\"slotProps\" :shown=\"internalShown\" :popup-role=\"popupRole\">\n\t\t\t\n\t\t\t<slot name=\"trigger\" v-bind=\"slotProps\" />\n\t\t</NcPopoverTriggerProvider>\n\n\t\t\n\t\t<template #popper=\"slotProps\">\n\t\t\t<slot name=\"default\" v-bind=\"slotProps\" />\n\t\t</template>\n\t</Dropdown>\n</template>\n\n<script>\nimport Vue from 'vue'\nimport { options, Dropdown } from 'floating-vue'\nimport { createFocusTrap } from 'focus-trap'\nimport { getTrapStack } from '../../utils/focusTrap.ts'\nimport NcPopoverTriggerProvider from './NcPopoverTriggerProvider.vue'\n\nconst THEME = 'nc-popover-8'\n\n// NcPopover has a custom theme to have a custom name but same as the default \"dropdown\" theme\noptions.themes[THEME] = structuredClone(options.themes.dropdown)\n\n/**\n * @typedef {import('focus-trap').FocusTargetValueOrFalse} FocusTargetValueOrFalse\n * @typedef {FocusTargetValueOrFalse|() => FocusTargetValueOrFalse} SetReturnFocus\n */\nexport default {\n\tname: 'NcPopover',\n\n\tcomponents: {\n\t\tDropdown,\n\t\tNcPopoverTriggerProvider,\n\t},\n\n\tinheritAttrs: false,\n\n\tprops: {\n\t\t/**\n\t\t * Show or hide the popper\n\t\t * @see https://floating-vue.starpad.dev/api/#shown\n\t\t */\n\t\tshown: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Popup role\n\t\t * @see https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-haspopup#values\n\t\t */\n\t\tpopupRole: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t\tvalidator: (value) => ['menu', 'listbox', 'tree', 'grid', 'dialog', 'true'].includes(value),\n\t\t},\n\n\t\tpopoverBaseClass: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * Enable popover focus trap\n\t\t *\n\t\t * @deprecated use noFocusTrap instead\n\t\t */\n\t\tfocusTrap: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: true,\n\t\t},\n\n\t\t/**\n\t\t * Disable the popover focus trap.\n\t\t */\n\t\tnoFocusTrap: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Set element to return focus to after focus trap deactivation\n\t\t *\n\t\t * @type {SetReturnFocus}\n\t\t */\n\t\tsetReturnFocus: {\n\t\t\tdefault: undefined,\n\t\t\ttype: [HTMLElement, SVGElement, String, Boolean, Function],\n\t\t},\n\t},\n\n\temits: [\n\t\t'after-show',\n\t\t'after-hide',\n\t\t/**\n\t\t * @see https://floating-vue.starpad.dev/api/#update-shown\n\t\t */\n\t\t'update:shown',\n\t],\n\n\tsetup() {\n\t\treturn {\n\t\t\tTHEME,\n\t\t}\n\t},\n\n\tdata() {\n\t\treturn {\n\t\t\tinternalShown: this.shown,\n\t\t}\n\t},\n\n\twatch: {\n\t\tshown(value) {\n\t\t\tthis.internalShown = value\n\t\t},\n\n\t\tinternalShown(value) {\n\t\t\tthis.$emit('update:shown', value)\n\t\t},\n\t},\n\n\tmounted() {\n\t\tthis.checkTriggerA11y()\n\t},\n\n\tbeforeDestroy() {\n\t\tthis.clearFocusTrap()\n\t\tthis.clearEscapeStopPropagation()\n\t},\n\n\tmethods: {\n\t\t/**\n\t\t * Check if the trigger has all required a11y attributes.\n\t\t * Important to check custom trigger button.\n\t\t */\n\t\tcheckTriggerA11y() {\n\t\t\tif (window.OC?.debug) {\n\t\t\t\tconst triggerContainer = this.getPopoverTriggerContainerElement()\n\t\t\t\tconst requiredTriggerButton = triggerContainer.querySelector('[aria-expanded]')\n\t\t\t\tif (!requiredTriggerButton) {\n\t\t\t\t\tVue.util.warn('It looks like you are using a custom button as a <NcPopover> or other popover #trigger. If you are not using <NcButton> as a trigger, you need to bind attrs from the #trigger slot props to your custom button. See <NcPopover> docs for an example.')\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Remove incorrect aria-describedby attribute from the trigger.\n\t\t * @see https://github.com/Akryum/floating-vue/blob/8d4f7125aae0e3ea00ba4093d6d2001ab15058f1/packages/floating-vue/src/components/Popper.ts#L734\n\t\t */\n\t\tremoveFloatingVueAriaDescribedBy() {\n\t\t\t// When the popover is shown, floating-vue mutates the root elements of the trigger adding data-popper-shown and incorrect aria-describedby attributes.\n\t\t\tconst triggerContainer = this.getPopoverTriggerContainerElement()\n\t\t\tconst triggerElements = triggerContainer.querySelectorAll('[data-popper-shown]')\n\t\t\tfor (const el of triggerElements) {\n\t\t\t\tel.removeAttribute('aria-describedby')\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * @return {HTMLElement|undefined}\n\t\t */\n\t\tgetPopoverContentElement() {\n\t\t\treturn this.$refs.popover?.$refs.popperContent?.$el\n\t\t},\n\n\t\t/**\n\t\t * @return {HTMLElement|undefined}\n\t\t */\n\t\tgetPopoverTriggerContainerElement() {\n\t\t\t// TODO: Vue 3: should be\n\t\t\t// this.$refs.popover.$refs.popper.$refs.reference\n\t\t\treturn this.$refs.popover.$refs.reference\n\t\t},\n\n\t\t/**\n\t\t * Add focus trap for accessibility.\n\t\t */\n\t\tasync useFocusTrap() {\n\t\t\tawait this.$nextTick()\n\n\t\t\tif (this.noFocusTrap || !this.focusTrap) {\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\tconst el = this.getPopoverContentElement()\n\t\t\tel.tabIndex = -1\n\n\t\t\tif (!el) {\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\t// Init focus trap\n\t\t\tthis.$focusTrap = createFocusTrap(el, {\n\t\t\t\t// Prevents to lose focus using esc key\n\t\t\t\t// Focus will be release when popover be hide\n\t\t\t\tescapeDeactivates: false,\n\t\t\t\tallowOutsideClick: true,\n\t\t\t\tsetReturnFocus: this.setReturnFocus,\n\t\t\t\ttrapStack: getTrapStack(),\n\t\t\t\tfallBackFocus: el,\n\t\t\t})\n\t\t\tthis.$focusTrap.activate()\n\t\t},\n\n\t\t/**\n\t\t * Remove focus trap\n\t\t *\n\t\t * @param {object} options The configuration options for focusTrap\n\t\t */\n\t\tclearFocusTrap(options = {}) {\n\t\t\ttry {\n\t\t\t\tthis.$focusTrap?.deactivate(options)\n\t\t\t\tthis.$focusTrap = null\n\t\t\t} catch (err) {\n\t\t\t\tconsole.warn(err)\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Add stopPropagation for Escape.\n\t\t * It prevents global Escape handling after closing popover.\n\t\t *\n\t\t * Manual event handling is used here instead of v-on because there is no direct access to the node.\n\t\t * Alternative - wrap <template #popover> in a div wrapper.\n\t\t */\n\t\taddEscapeStopPropagation() {\n\t\t\tconst el = this.getPopoverContentElement()\n\t\t\tel?.addEventListener('keydown', this.stopKeydownEscapeHandler)\n\t\t},\n\n\t\t/**\n\t\t * Remove stop Escape handler\n\t\t */\n\t\tclearEscapeStopPropagation() {\n\t\t\tconst el = this.getPopoverContentElement()\n\t\t\tel?.removeEventListener('keydown', this.stopKeydownEscapeHandler)\n\t\t},\n\n\t\t/**\n\t\t * @param {KeyboardEvent} event - native keydown event\n\t\t */\n\t\tstopKeydownEscapeHandler(event) {\n\t\t\tif (event.type === 'keydown' && event.key === 'Escape') {\n\t\t\t\tevent.stopPropagation()\n\t\t\t}\n\t\t},\n\n\t\tasync afterShow() {\n\t\t\tthis.getPopoverContentElement().addEventListener('transitionend', () => {\n\t\t\t\t/**\n\t\t\t\t * Triggered after the tooltip was visually displayed.\n\t\t\t\t *\n\t\t\t\t * This is different from the 'show' and 'apply-show' which\n\t\t\t\t * run earlier than this where there is no guarantee that the\n\t\t\t\t * tooltip is already visible and in the DOM.\n\t\t\t\t */\n\t\t\t\tthis.$emit('after-show')\n\t\t\t}, { once: true, passive: true })\n\n\t\t\tthis.removeFloatingVueAriaDescribedBy()\n\n\t\t\tawait this.$nextTick()\n\t\t\tawait this.useFocusTrap()\n\t\t\tthis.addEscapeStopPropagation()\n\t\t},\n\t\tafterHide() {\n\t\t\tthis.getPopoverContentElement().addEventListener('transitionend', () => {\n\t\t\t\t/**\n\t\t\t\t * Triggered after the tooltip was visually hidden.\n\t\t\t\t *\n\t\t\t\t * This is different from the 'hide' and 'apply-hide' which\n\t\t\t\t * run earlier than this where there is no guarantee that the\n\t\t\t\t * tooltip is already visible and in the DOM.\n\t\t\t\t */\n\t\t\t\tthis.$emit('after-hide')\n\t\t\t}, { once: true, passive: true })\n\n\t\t\tthis.clearFocusTrap()\n\t\t\tthis.clearEscapeStopPropagation()\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" module>\n$arrow-width: 10px;\n// Move the arrow just slightly inside the popover\n// To prevent a visual gap on page scaling\n$arrow-position: $arrow-width - 1px;\n\n// Class is built by floating-vue as \"v-popper--theme-{THEME}\"\n.ncPopover:global(.v-popper--theme-nc-popover-8) {\n\t// Size class comes from the floating-vue library we use\n\t:global(.resize-observer) {\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\tleft: 0;\n\t\tz-index: -1;\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tborder: none;\n\t\tbackground-color: transparent;\n\t\tpointer-events: none;\n\t\tdisplay: block;\n\t\toverflow: hidden;\n\t\topacity: 0;\n\n\t\tobject {\n\t\t\tdisplay: block;\n\t\t\tposition: absolute;\n\t\t\ttop: 0;\n\t\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\t\tleft: 0;\n\t\t\theight: 100%;\n\t\t\twidth: 100%;\n\t\t\toverflow: hidden;\n\t\t\tpointer-events: none;\n\t\t\tz-index: -1;\n\t\t}\n\t}\n\n\t&:global(.v-popper__popper) {\n\t\tz-index: 100000;\n\t\ttop: 0;\n\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\tleft: 0;\n\t\tdisplay: block !important;\n\n\t\t:global(.v-popper__wrapper) {\n\t\t\t/*\n\t\t\t * In theory, \"filter: drop-shadow\" would look better here with arrow shadow.\n\t\t\t * In fact, in results in a blurry popover in Chromium on scaling.\n\t\t\t * The hypothesis is that \"filter\" creates a new composition layer,\n\t\t\t * and with GPU acceleration requires the previous layers content to be rasterized.\n\t\t\t * In combination with translate3d from floating-vue, it makes Chromium to first render and rasterize the popover\n\t\t\t * and then apply scaling, which results in a blurry popover.\n\t\t\t */\n\t\t\tbox-shadow: 0 1px 10px var(--color-box-shadow);\n\t\t\tborder-radius: var(--border-radius-large);\n\t\t}\n\n\t\t:global(.v-popper__inner) {\n\t\t\tpadding: 0;\n\t\t\tcolor: var(--color-main-text);\n\t\t\tborder-radius: var(--border-radius-large);\n\t\t\toverflow: hidden;\n\t\t\tbackground: var(--color-main-background);\n\t\t}\n\n\t\t:global(.v-popper__arrow-container) {\n\t\t\tposition: absolute;\n\t\t\tz-index: 1;\n\t\t\twidth: 0;\n\t\t\theight: 0;\n\t\t\tborder-style: solid;\n\t\t\tborder-color: transparent;\n\t\t\tborder-width: $arrow-width;\n\t\t}\n\n\t\t&[data-popper-placement^='top'] :global(.v-popper__arrow-container) {\n\t\t\tbottom: -$arrow-position;\n\t\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\t\tborder-bottom-width: 0;\n\t\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\t\tborder-top-color: var(--color-main-background);\n\t\t}\n\n\t\t&[data-popper-placement^='bottom'] :global(.v-popper__arrow-container) {\n\t\t\ttop: -$arrow-position;\n\t\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\t\tborder-top-width: 0;\n\t\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\t\tborder-bottom-color: var(--color-main-background);\n\t\t}\n\n\t\t&[data-popper-placement^='right'] :global(.v-popper__arrow-container) {\n\t\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\t\tleft: -$arrow-position;\n\t\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\t\tborder-left-width: 0;\n\t\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\t\tborder-right-color: var(--color-main-background);\n\t\t}\n\n\t\t&[data-popper-placement^='left'] :global(.v-popper__arrow-container) {\n\t\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\t\tright: -$arrow-position;\n\t\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\t\tborder-right-width: 0;\n\t\t\t/* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */\n\t\t\tborder-left-color: var(--color-main-background);\n\t\t}\n\n\t\t&[aria-hidden='true'] {\n\t\t\tvisibility: hidden;\n\t\t\ttransition: opacity var(--animation-quick), visibility var(--animation-quick);\n\t\t\topacity: 0;\n\t\t}\n\n\t\t&[aria-hidden='false'] {\n\t\t\tvisibility: visible;\n\t\t\ttransition: opacity var(--animation-quick);\n\t\t\topacity: 1;\n\t\t}\n\t}\n}\n\n</style>\n"],"names":["_sfc_main","defineComponent","options","Dropdown","Vue","createFocusTrap","getTrapStack"],"mappings":"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"}

package/dist/chunks/index-56SXuvlv.mjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"index-56SXuvlv.mjs","sources":["../../src/functions/reference/widgets.ts","../../src/functions/reference/customPickerElements.js"],"sourcesContent":["/**\n * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\n\ninterface WidgetRenderProperties {\n\trichObjectType: string;\n\trichObject: object;\n\taccessible: boolean;\n\tinteractive: boolean;\n}\n\ntype widgetRenderCallback = (el: HTMLElement, properties: WidgetRenderProperties) => void;\ntype widgetDestroyCallback = (el: HTMLElement) => void;\n\ninterface WidgetProps {\n\tid: string;\n\thasInteractiveView: boolean;\n\tfullWidth: boolean;\n\tcallback: widgetRenderCallback;\n\tonDestroy: widgetDestroyCallback;\n}\n\ninterface WidgetPropsOptional {\n\thasInteractiveView?: boolean;\n\tfullWidth?: boolean;\n}\n\ndeclare global {\n\tinterface Window {\n\t\t_vue_richtext_widgets: Record<string, WidgetProps>;\n\t\t_registerWidget: (id: string, callback: widgetRenderCallback, onDestroy: widgetDestroyCallback, props: WidgetPropsOptional) => void;\n\t}\n}\n\nif (!window._vue_richtext_widgets) {\n\twindow._vue_richtext_widgets = {}\n}\n\nconst isWidgetRegistered = (id: string) => {\n\treturn !!window._vue_richtext_widgets[id]\n}\n\nconst hasInteractiveView = (id: string) => {\n\treturn !!window._vue_richtext_widgets[id]?.hasInteractiveView\n}\n\nexport const hasFullWidth = (id: string) => {\n\treturn !!window._vue_richtext_widgets[id]?.fullWidth\n}\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nconst registerWidget = (id: string, callback: widgetRenderCallback, onDestroy = (el: HTMLElement) => {}, props: WidgetPropsOptional) => {\n\tconst propsWithDefaults = {\n\t\thasInteractiveView: true,\n\t\tfullWidth: false,\n\t\t...props,\n\t}\n\n\tif (window._vue_richtext_widgets[id]) {\n\t\tconsole.error('Widget for id ' + id + ' already registered')\n\t\treturn\n\t}\n\n\twindow._vue_richtext_widgets[id] = {\n\t\tid,\n\t\tcallback,\n\t\tonDestroy,\n\t\t...propsWithDefaults,\n\t}\n}\n\nconst renderWidget = (el: HTMLElement, { richObjectType, richObject, accessible, interactive }) => {\n\tif (richObjectType === 'open-graph') {\n\t\treturn\n\t}\n\n\tif (!window._vue_richtext_widgets[richObjectType]) {\n\t\tconsole.error('Widget for rich object type ' + richObjectType + ' not registered')\n\t\treturn\n\t}\n\n\twindow._vue_richtext_widgets[richObjectType].callback(el, { richObjectType, richObject, accessible, interactive })\n}\n\nconst destroyWidget = (richObjectType: string, el: HTMLElement) => {\n\tif (richObjectType === 'open-graph') {\n\t\treturn\n\t}\n\n\tif (!window._vue_richtext_widgets[richObjectType]) {\n\t\treturn\n\t}\n\n\twindow._vue_richtext_widgets[richObjectType].onDestroy(el)\n}\n\nwindow._registerWidget = (id: string, callback: widgetRenderCallback, onDestroy: widgetDestroyCallback, props: WidgetPropsOptional) => {\n\tregisterWidget(id, callback, onDestroy, props)\n}\n\nexport {\n\tregisterWidget,\n\trenderWidget,\n\tdestroyWidget,\n\tisWidgetRegistered,\n\thasInteractiveView,\n}\n","/**\n * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\n\nif (!window._vue_richtext_custom_picker_elements) {\n\twindow._vue_richtext_custom_picker_elements = {}\n}\n\n/**\n * Representation of the render callback result\n * It contains a dom element and an object (Vue instance or other fancy things)\n */\nclass NcCustomPickerRenderResult {\n\n\t/**\n\t * @param {HTMLElement} element The HTML element\n\t * @param {object} object The object\n\t */\n\tconstructor(element, object) {\n\t\tthis.element = element\n\t\tthis.object = object\n\t}\n\n}\n\nconst isCustomPickerElementRegistered = (id) => {\n\treturn !!window._vue_richtext_custom_picker_elements[id]\n}\n\nconst getCustomPickerElementSize = (id) => {\n\tconst size = window._vue_richtext_custom_picker_elements[id]?.size\n\tif (['small', 'normal', 'large', 'full'].includes(size)) {\n\t\treturn size\n\t}\n\treturn null\n}\n\nconst registerCustomPickerElement = (id, callback, onDestroy = (el) => {}, size = 'large') => {\n\tif (window._vue_richtext_custom_picker_elements[id]) {\n\t\tconsole.error('Custom reference picker element for id ' + id + ' already registered')\n\t\treturn\n\t}\n\n\twindow._vue_richtext_custom_picker_elements[id] = {\n\t\tid,\n\t\tcallback,\n\t\tonDestroy,\n\t\tsize,\n\t}\n}\n\nconst renderCustomPickerElement = (el, { providerId, accessible }) => {\n\tif (!window._vue_richtext_custom_picker_elements[providerId]) {\n\t\tconsole.error('Custom reference picker element for reference provider ID ' + providerId + ' not registered')\n\t\treturn\n\t}\n\n\treturn window._vue_richtext_custom_picker_elements[providerId].callback(el, { providerId, accessible })\n}\n\nconst destroyCustomPickerElement = (providerId, el, renderResult) => {\n\tif (!window._vue_richtext_custom_picker_elements[providerId]) {\n\t\treturn\n\t}\n\n\twindow._vue_richtext_custom_picker_elements[providerId].onDestroy(el, renderResult)\n}\n\nwindow._registerCustomPickerElement = registerCustomPickerElement\n\nexport {\n\tNcCustomPickerRenderResult,\n\tregisterCustomPickerElement,\n\trenderCustomPickerElement,\n\tdestroyCustomPickerElement,\n\tisCustomPickerElementRegistered,\n\tgetCustomPickerElementSize,\n}\n"],"names":[],"mappings":"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"}