@nextcloud/vue 8.0.0-beta.6 → 8.0.0-beta.8

package/CHANGELOG.md

@@ -24,6 +24,8 @@ All notable changes to this project will be documented in this file.
 - `NcInputField`: The `labelVisible` property was removed for accessibility it is required to always show a label.
   You can still use the `labelOutside` property to remove the inner label from the component.
 - feat(NcEmptyContent)!: make empty content centered by default instead of 20vh margin [\#4506](https://github.com/nextcloud-libraries/nextcloud-vue/pull/4506) ([ShGKme](https://github.com/ShGKme))
+- chore!: Rename `Datetime` to `DateTime` in component names [\#4560](https://github.com/nextcloud-libraries/nextcloud-vue/pull/4560) ([susnux](https://github.com/susnux))
+- feat(NcIconSvgWrapper)!: remove ID from svg [\#4607](https://github.com/nextcloud-libraries/nextcloud-vue/pull/4607) ([ShGKme](https://github.com/ShGKme))
 
 ### :rocket: Enhancements
 - enh\(NcDatetime\): New component for displaying timestamps as time relative from now [\#4219](https://github.com/nextcloud-libraries/nextcloud-vue/pull/4219) ([susnux](https://github.com/susnux))
@@ -108,6 +110,21 @@ All notable changes to this project will be documented in this file.
 - fix(NcRichContenteditable): make the default placeholder short [\#4408](https://github.com/nextcloud-libraries/nextcloud-vue/pull/4408) ([ShGKme](https://github.com/ShGKme))
 - Stop propagation of keyboard navigation in a number of components [\#4501](https://github.com/nextcloud-libraries/nextcloud-vue/pull/4501) ([ShGKme](https://github.com/ShGKme))
 - fix(NcRichText) - don't strip `<tag>`-like content when parsing markdown [\#4486](https://github.com/nextcloud-libraries/nextcloud-vue/pull/4486) ([Antreesy](https://github.com/Antreesy))
+- fix(NcAppNavigation): Make the navigation toggle accessible again when closed [\#4546](https://github.com/nextcloud-libraries/nextcloud-vue/pull/4546) ([susnux](https://github.com/susnux))
+- fix: Replace sanitize-svg with dompurify [\#4557](https://github.com/nextcloud-libraries/nextcloud-vue/pull/4557) ([raimund-schluessler](https://github.com/raimund-schluessler))
+- fix(NcEmojiPicker): Do not set padding for the search input label [\#4577](https://github.com/nextcloud-libraries/nextcloud-vue/pull/4577) ([susnux](https://github.com/susnux))
+- fix(NcEmojiPicker): Set type to `native` for selected emoji [\#4575](https://github.com/nextcloud-libraries/nextcloud-vue/pull/4575) ([mejo-](https://github.com/mejo-))
+- fix: also export NcSettings* components [\#4586](https://github.com/nextcloud-libraries/nextcloud-vue/pull/4586) ([raimund-schluessler](https://github.com/raimund-schluessler))
+- fix(NcSettingsSection): remove incorrect role=note on doc link [\#4594](https://github.com/nextcloud-libraries/nextcloud-vue/pull/4594) ([ShGKme](https://github.com/ShGKme))
+- fix(utils): Make `isMobileState` PURE so it can be treeshaken if not used [\#4595](https://github.com/nextcloud-libraries/nextcloud-vue/pull/4595) ([susnux](https://github.com/susnux))
+- allow type property for NcAppNavigationNew [\#4555](https://github.com/nextcloud-libraries/nextcloud-vue/pull/4555) ([dartcafe](https://github.com/dartcafe))
+- fix(EmptyContent): ensure proper custom icon size [\#4584](https://github.com/nextcloud-libraries/nextcloud-vue/pull/4584) ([raimund-schluessler](https://github.com/raimund-schluessler))
+- Properly align AppNavigationToggle with first navigation item [\#3278](https://github.com/nextcloud-libraries/nextcloud-vue/pull/3278) ([susnux](https://github.com/susnux))
+- fix: Remove unused id from trigger [\#4602](https://github.com/nextcloud-libraries/nextcloud-vue/pull/4602) ([Pytal](https://github.com/Pytal))
+- fix(NcSelect): make id truly uniqual [\#4606](https://github.com/nextcloud-libraries/nextcloud-vue/pull/4606) ([ShGKme](https://github.com/ShGKme))
+- fix: handling of empty values in NcDateTimePickerNative [\#4540](https://github.com/nextcloud-libraries/nextcloud-vue/pull/4540) ([st3iny](https://github.com/st3iny))
+- fix(NcIconSvgWrapper): remove new keepId prop [\#4609](https://github.com/nextcloud-libraries/nextcloud-vue/pull/4609) ([ShGKme](https://github.com/ShGKme))
+- fix(NcInputField): Adjust styling of the internal label [\#4578](https://github.com/nextcloud-libraries/nextcloud-vue/pull/4578) ([susnux](https://github.com/susnux))
 
 ## [v7.11.2](https://github.com/nextcloud-libraries/nextcloud-vue/tree/v7.11.2) (2023-05-05)
 

package/dist/Components/NcActionButton.cjs

@@ -1 +1,49 @@
-var r=require("../assets/index53.css");const a=require("../chunks/actionText-bef01778.cjs"),s=require("../chunks/_plugin-vue2_normalizer-764a4c12.cjs");const o={name:"NcActionButton",mixins:[a.ActionTextMixin],props:{disabled:{type:Boolean,default:!1},ariaHidden:{type:Boolean,default:null}},computed:{isFocusable(){return!this.disabled}}};var e=function(){var t=this,n=t._self._c;return n("li",{staticClass:"action",class:{"action--disabled":t.disabled},attrs:{role:"presentation"}},[n("button",{staticClass:"action-button",class:{focusable:t.isFocusable},attrs:{"aria-label":t.ariaLabel,title:t.title,role:"menuitem",type:"button"},on:{click:t.onClick}},[t._t("icon",function(){return[n("span",{staticClass:"action-button__icon",class:[t.isIconUrl?"action-button__icon--url":t.icon],style:{backgroundImage:t.isIconUrl?`url(${t.icon})`:null},attrs:{"aria-hidden":t.ariaHidden}})]}),t.name?n("p",[n("strong",{staticClass:"action-button__name"},[t._v(" "+t._s(t.name)+" ")]),n("br"),n("span",{staticClass:"action-button__longtext",domProps:{textContent:t._s(t.text)}})]):t.isLongText?n("p",{staticClass:"action-button__longtext",domProps:{textContent:t._s(t.text)}}):n("span",{staticClass:"action-button__text"},[t._v(t._s(t.text))]),t._e()],2)])},i=[],l=s.normalizeComponent(o,e,i,!1,null,"7ad61f44",null,null);const c=l.exports;module.exports=c;
+var _ = require("../assets/index-becfbea7.css");
+const e = require("../chunks/actionText-b0bd6eb7.cjs"), s = require("../chunks/_plugin-vue2_normalizer-7f9efb60.cjs");
+const a = {
+  name: "NcActionButton",
+  mixins: [e.ActionTextMixin],
+  props: {
+    /**
+     * disabled state of the action button
+     */
+    disabled: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * aria-hidden attribute for the icon slot
+     */
+    ariaHidden: {
+      type: Boolean,
+      default: null
+    }
+  },
+  computed: {
+    /**
+     * determines if the action is focusable
+     *
+     * @return {boolean} is the action focusable ?
+     */
+    isFocusable() {
+      return !this.disabled;
+    }
+  }
+};
+var o = function() {
+  var t = this, n = t._self._c;
+  return n("li", { staticClass: "action", class: { "action--disabled": t.disabled }, attrs: { role: "presentation" } }, [n("button", { staticClass: "action-button", class: { focusable: t.isFocusable }, attrs: { "aria-label": t.ariaLabel, title: t.title, role: "menuitem", type: "button" }, on: { click: t.onClick } }, [t._t("icon", function() {
+    return [n("span", { staticClass: "action-button__icon", class: [t.isIconUrl ? "action-button__icon--url" : t.icon], style: { backgroundImage: t.isIconUrl ? `url(${t.icon})` : null }, attrs: { "aria-hidden": t.ariaHidden } })];
+  }), t.name ? n("p", [n("strong", { staticClass: "action-button__name" }, [t._v(" " + t._s(t.name) + " ")]), n("br"), n("span", { staticClass: "action-button__longtext", domProps: { textContent: t._s(t.text) } })]) : t.isLongText ? n("p", { staticClass: "action-button__longtext", domProps: { textContent: t._s(t.text) } }) : n("span", { staticClass: "action-button__text" }, [t._v(t._s(t.text))]), t._e()], 2)]);
+}, i = [], c = /* @__PURE__ */ s.normalizeComponent(
+  a,
+  o,
+  i,
+  !1,
+  null,
+  "7ad61f44",
+  null,
+  null
+);
+const l = c.exports;
+module.exports = l;

package/dist/Components/NcActionButton.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"NcActionButton.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}
+{"version":3,"file":"NcActionButton.cjs","sources":["../../src/components/NcActionButton/NcActionButton.vue"],"sourcesContent":["<!--\n  - @copyright Copyright (c) 2019 John Molakvoæ <skjnldsv@protonmail.com>\n  -\n  - @author John Molakvoæ <skjnldsv@protonmail.com>\n  - @author Marco Ambrosini <marcoambrosini@icloud.com>\n  -\n  - @license GNU AGPL version 3 or any later version\n  -\n  - This program is free software: you can redistribute it and/or modify\n  - it under the terms of the GNU Affero General Public License as\n  - published by the Free Software Foundation, either version 3 of the\n  - License, or (at your option) any later version.\n  -\n  - This program is distributed in the hope that it will be useful,\n  - but WITHOUT ANY WARRANTY; without even the implied warranty of\n  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n  - GNU Affero General Public License for more details.\n  -\n  - You should have received a copy of the GNU Affero General Public License\n  - along with this program. If not, see <http://www.gnu.org/licenses/>.\n  -\n  -->\n\n<docs>\nThis component is made to be used inside of the [NcActions](#NcActions) component slots.\n\n```vue\n\t<template>\n\t\t<div style=\"display: flex; align-items: center;\">\n\t\t\t<NcActions>\n\t\t\t\t<NcActionButton @click=\"showMessage('Delete')\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<Delete :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tDelete\n\t\t\t\t</NcActionButton>\n\t\t\t\t<NcActionButton :close-after-click=\"true\" @click=\"showMessage('Delete and close menu')\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<Delete :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tDelete and close\n\t\t\t\t</NcActionButton>\n\t\t\t\t<NcActionButton :close-after-click=\"true\" @click=\"focusInput\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<Plus :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tCreate\n\t\t\t\t</NcActionButton>\n\t\t\t\t<NcActionButton :disabled=\"true\" @click=\"showMessage('Disabled')\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<Delete :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tDisabled button\n\t\t\t\t</NcActionButton>\n\t\t\t</NcActions>\n\t\t\t<input ref=\"input\" />\n\t\t</div>\n\t</template>\n\t<script>\n\timport Delete from 'vue-material-design-icons/Delete'\n\timport Plus from 'vue-material-design-icons/Plus'\n\n\texport default {\n\t\tcomponents: {\n\t\t\tDelete,\n\t\t\tPlus,\n\t\t},\n\t\tmethods: {\n\t\t\tshowMessage(msg) {\n\t\t\t\talert(msg)\n\t\t\t},\n\t\t\tfocusInput() {\n\t\t\t\tthis.$nextTick(() => this.$refs.input.focus())\n\t\t\t},\n\t\t},\n\t}\n\t</script>\n```\n\nIf you're using a long text you can specify a name\n\n```vue\n\t<template>\n\t\t<NcActions>\n\t\t\t<NcActionButton @click=\"showMessage('Add')\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Plus :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tAdd new\n\t\t\t</NcActionButton>\n\t\t\t<NcActionButton name=\"Long button\" @click=\"showMessage('Delete')\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Delete :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tThis button is associated with a very long text.\\nAnd with new lines too.\n\t\t\t</NcActionButton>\n\t\t</NcActions>\n\t</template>\n\t<script>\n\timport Delete from 'vue-material-design-icons/Delete'\n\timport Plus from 'vue-material-design-icons/Plus'\n\n\texport default {\n\t\tcomponents: {\n\t\t\tDelete,\n\t\t\tPlus,\n\t\t},\n\t\tmethods: {\n\t\t\tshowMessage(msg) {\n\t\t\t\talert(msg)\n\t\t\t},\n\t\t},\n\t}\n\t</script>\n\n```\n\nAction icon attribute with a single action\n\n```vue\n\t<template>\n\t\t<NcActions>\n\t\t\t<NcActionButton @click=\"showMessage('Add')\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Plus :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tAdd new\n\t\t\t</NcActionButton>\n\t\t</NcActions>\n\t</template>\n\t<script>\n\timport Plus from 'vue-material-design-icons/Plus'\n\n\texport default {\n\t\tcomponents: {\n\t\t\tPlus,\n\t\t},\n\t\tmethods: {\n\t\t\tshowMessage(msg) {\n\t\t\t\talert(msg)\n\t\t\t},\n\t\t},\n\t}\n\t</script>\n\n```\n\nYou can also use a custom icon, for example from the vue-material-design-icons library:\n\n```vue\n<template>\n\t<NcActions>\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<HandBackLeft :size=\"20\" />\n\t\t\t</template>\n\t\t\tRaise left hand\n\t\t</NcActionButton>\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<HandBackRight :size=\"20\" />\n\t\t\t</template>\n\t\t\tRaise right hand\n\t\t</NcActionButton>\n\t</NcActions>\n</template>\n<script>\nimport HandBackLeft from 'vue-material-design-icons/HandBackLeft'\nimport HandBackRight from 'vue-material-design-icons/HandBackRight'\n\nexport default {\n\tcomponents: {\n\t\tHandBackLeft,\n\t\tHandBackRight,\n\t},\n}\n</script>\n```\n</docs>\n\n<template>\n\t<li class=\"action\" role=\"presentation\" :class=\"{ 'action--disabled': disabled }\">\n\t\t<button class=\"action-button\"\n\t\t\t:class=\"{ focusable: isFocusable }\"\n\t\t\t:aria-label=\"ariaLabel\"\n\t\t\t:title=\"title\"\n\t\t\trole=\"menuitem\"\n\t\t\ttype=\"button\"\n\t\t\t@click=\"onClick\">\n\t\t\t<!-- @slot Manually provide icon -->\n\t\t\t<slot name=\"icon\">\n\t\t\t\t<span :class=\"[isIconUrl ? 'action-button__icon--url' : icon]\"\n\t\t\t\t\t:style=\"{ backgroundImage: isIconUrl ? `url(${icon})` : null }\"\n\t\t\t\t\t:aria-hidden=\"ariaHidden\"\n\t\t\t\t\tclass=\"action-button__icon\" />\n\t\t\t</slot>\n\n\t\t\t<!-- long text with name -->\n\t\t\t<p v-if=\"name\">\n\t\t\t\t<strong class=\"action-button__name\">\n\t\t\t\t\t{{ name }}\n\t\t\t\t</strong>\n\t\t\t\t<br>\n\t\t\t\t<!-- white space is shown on longtext, so we can't\n\t\t\t\t\tput {{ text }} on a new line for code readability -->\n\t\t\t\t<span class=\"action-button__longtext\" v-text=\"text\" />\n\t\t\t</p>\n\n\t\t\t<!-- long text only -->\n\t\t\t<!-- white space is shown on longtext, so we can't\n\t\t\t\tput {{ text }} on a new line for code readability -->\n\t\t\t<p v-else-if=\"isLongText\"\n\t\t\t\tclass=\"action-button__longtext\"\n\t\t\t\tv-text=\"text\" />\n\n\t\t\t<!-- default text display -->\n\t\t\t<span v-else class=\"action-button__text\">{{ text }}</span>\n\n\t\t\t<!-- fake slot to gather inner text -->\n\t\t\t<slot v-if=\"false\" />\n\t\t</button>\n\t</li>\n</template>\n\n<script>\nimport ActionTextMixin from '../../mixins/actionText.js'\n\n/**\n * Button component to be used in Actions\n */\nexport default {\n\tname: 'NcActionButton',\n\n\tmixins: [ActionTextMixin],\n\n\tprops: {\n\t\t/**\n\t\t * disabled state of the action button\n\t\t */\n\t\tdisabled: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * aria-hidden attribute for the icon slot\n\t\t */\n\t\tariaHidden: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: null,\n\t\t},\n\t},\n\tcomputed: {\n\t\t/**\n\t\t * determines if the action is focusable\n\t\t *\n\t\t * @return {boolean} is the action focusable ?\n\t\t */\n\t\tisFocusable() {\n\t\t\treturn !this.disabled\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n@import '../../assets/action';\n@include action-active;\n@include action--disabled;\n@include action-item('button');\n</style>\n"],"names":["_sfc_main","actionText"],"mappings":";;AAsOA,MAAAA,IAAA;AAAA,EACA,MAAA;AAAA,EAEA,QAAA,CAAAC,EAAA,eAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAIA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EACA,UAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,cAAA;AACA,aAAA,CAAA,KAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;"}

package/dist/Components/NcActionButton.mjs

@@ -1,15 +1,51 @@
-import "../assets/index37.css";
-import { A as n } from "../chunks/actionText-6c35d3fc.mjs";
-import { n as s } from "../chunks/_plugin-vue2_normalizer-5b4c43a4.mjs";
-const o = { name: "NcActionButton", mixins: [n], props: { disabled: { type: Boolean, default: !1 }, ariaHidden: { type: Boolean, default: null } }, computed: { isFocusable() {
-  return !this.disabled;
-} } };
-var i = function() {
-  var t = this, a = t._self._c;
-  return a("li", { staticClass: "action", class: { "action--disabled": t.disabled }, attrs: { role: "presentation" } }, [a("button", { staticClass: "action-button", class: { focusable: t.isFocusable }, attrs: { "aria-label": t.ariaLabel, title: t.title, role: "menuitem", type: "button" }, on: { click: t.onClick } }, [t._t("icon", function() {
-    return [a("span", { staticClass: "action-button__icon", class: [t.isIconUrl ? "action-button__icon--url" : t.icon], style: { backgroundImage: t.isIconUrl ? `url(${t.icon})` : null }, attrs: { "aria-hidden": t.ariaHidden } })];
-  }), t.name ? a("p", [a("strong", { staticClass: "action-button__name" }, [t._v(" " + t._s(t.name) + " ")]), a("br"), a("span", { staticClass: "action-button__longtext", domProps: { textContent: t._s(t.text) } })]) : t.isLongText ? a("p", { staticClass: "action-button__longtext", domProps: { textContent: t._s(t.text) } }) : a("span", { staticClass: "action-button__text" }, [t._v(t._s(t.text))]), t._e()], 2)]);
-}, e = [], l = s(o, i, e, !1, null, "7ad61f44", null, null);
+import "../assets/index-becfbea7.css";
+import { A as a } from "../chunks/actionText-9f5c55bd.mjs";
+import { n as o } from "../chunks/_plugin-vue2_normalizer-71e2aa87.mjs";
+const s = {
+  name: "NcActionButton",
+  mixins: [a],
+  props: {
+    /**
+     * disabled state of the action button
+     */
+    disabled: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * aria-hidden attribute for the icon slot
+     */
+    ariaHidden: {
+      type: Boolean,
+      default: null
+    }
+  },
+  computed: {
+    /**
+     * determines if the action is focusable
+     *
+     * @return {boolean} is the action focusable ?
+     */
+    isFocusable() {
+      return !this.disabled;
+    }
+  }
+};
+var e = function() {
+  var t = this, n = t._self._c;
+  return n("li", { staticClass: "action", class: { "action--disabled": t.disabled }, attrs: { role: "presentation" } }, [n("button", { staticClass: "action-button", class: { focusable: t.isFocusable }, attrs: { "aria-label": t.ariaLabel, title: t.title, role: "menuitem", type: "button" }, on: { click: t.onClick } }, [t._t("icon", function() {
+    return [n("span", { staticClass: "action-button__icon", class: [t.isIconUrl ? "action-button__icon--url" : t.icon], style: { backgroundImage: t.isIconUrl ? `url(${t.icon})` : null }, attrs: { "aria-hidden": t.ariaHidden } })];
+  }), t.name ? n("p", [n("strong", { staticClass: "action-button__name" }, [t._v(" " + t._s(t.name) + " ")]), n("br"), n("span", { staticClass: "action-button__longtext", domProps: { textContent: t._s(t.text) } })]) : t.isLongText ? n("p", { staticClass: "action-button__longtext", domProps: { textContent: t._s(t.text) } }) : n("span", { staticClass: "action-button__text" }, [t._v(t._s(t.text))]), t._e()], 2)]);
+}, i = [], l = /* @__PURE__ */ o(
+  s,
+  e,
+  i,
+  !1,
+  null,
+  "7ad61f44",
+  null,
+  null
+);
 const d = l.exports;
 export {
   d as default

package/dist/Components/NcActionButton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"NcActionButton.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;"}
+{"version":3,"file":"NcActionButton.mjs","sources":["../../src/components/NcActionButton/NcActionButton.vue"],"sourcesContent":["<!--\n  - @copyright Copyright (c) 2019 John Molakvoæ <skjnldsv@protonmail.com>\n  -\n  - @author John Molakvoæ <skjnldsv@protonmail.com>\n  - @author Marco Ambrosini <marcoambrosini@icloud.com>\n  -\n  - @license GNU AGPL version 3 or any later version\n  -\n  - This program is free software: you can redistribute it and/or modify\n  - it under the terms of the GNU Affero General Public License as\n  - published by the Free Software Foundation, either version 3 of the\n  - License, or (at your option) any later version.\n  -\n  - This program is distributed in the hope that it will be useful,\n  - but WITHOUT ANY WARRANTY; without even the implied warranty of\n  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n  - GNU Affero General Public License for more details.\n  -\n  - You should have received a copy of the GNU Affero General Public License\n  - along with this program. If not, see <http://www.gnu.org/licenses/>.\n  -\n  -->\n\n<docs>\nThis component is made to be used inside of the [NcActions](#NcActions) component slots.\n\n```vue\n\t<template>\n\t\t<div style=\"display: flex; align-items: center;\">\n\t\t\t<NcActions>\n\t\t\t\t<NcActionButton @click=\"showMessage('Delete')\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<Delete :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tDelete\n\t\t\t\t</NcActionButton>\n\t\t\t\t<NcActionButton :close-after-click=\"true\" @click=\"showMessage('Delete and close menu')\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<Delete :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tDelete and close\n\t\t\t\t</NcActionButton>\n\t\t\t\t<NcActionButton :close-after-click=\"true\" @click=\"focusInput\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<Plus :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tCreate\n\t\t\t\t</NcActionButton>\n\t\t\t\t<NcActionButton :disabled=\"true\" @click=\"showMessage('Disabled')\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<Delete :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tDisabled button\n\t\t\t\t</NcActionButton>\n\t\t\t</NcActions>\n\t\t\t<input ref=\"input\" />\n\t\t</div>\n\t</template>\n\t<script>\n\timport Delete from 'vue-material-design-icons/Delete'\n\timport Plus from 'vue-material-design-icons/Plus'\n\n\texport default {\n\t\tcomponents: {\n\t\t\tDelete,\n\t\t\tPlus,\n\t\t},\n\t\tmethods: {\n\t\t\tshowMessage(msg) {\n\t\t\t\talert(msg)\n\t\t\t},\n\t\t\tfocusInput() {\n\t\t\t\tthis.$nextTick(() => this.$refs.input.focus())\n\t\t\t},\n\t\t},\n\t}\n\t</script>\n```\n\nIf you're using a long text you can specify a name\n\n```vue\n\t<template>\n\t\t<NcActions>\n\t\t\t<NcActionButton @click=\"showMessage('Add')\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Plus :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tAdd new\n\t\t\t</NcActionButton>\n\t\t\t<NcActionButton name=\"Long button\" @click=\"showMessage('Delete')\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Delete :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tThis button is associated with a very long text.\\nAnd with new lines too.\n\t\t\t</NcActionButton>\n\t\t</NcActions>\n\t</template>\n\t<script>\n\timport Delete from 'vue-material-design-icons/Delete'\n\timport Plus from 'vue-material-design-icons/Plus'\n\n\texport default {\n\t\tcomponents: {\n\t\t\tDelete,\n\t\t\tPlus,\n\t\t},\n\t\tmethods: {\n\t\t\tshowMessage(msg) {\n\t\t\t\talert(msg)\n\t\t\t},\n\t\t},\n\t}\n\t</script>\n\n```\n\nAction icon attribute with a single action\n\n```vue\n\t<template>\n\t\t<NcActions>\n\t\t\t<NcActionButton @click=\"showMessage('Add')\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Plus :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tAdd new\n\t\t\t</NcActionButton>\n\t\t</NcActions>\n\t</template>\n\t<script>\n\timport Plus from 'vue-material-design-icons/Plus'\n\n\texport default {\n\t\tcomponents: {\n\t\t\tPlus,\n\t\t},\n\t\tmethods: {\n\t\t\tshowMessage(msg) {\n\t\t\t\talert(msg)\n\t\t\t},\n\t\t},\n\t}\n\t</script>\n\n```\n\nYou can also use a custom icon, for example from the vue-material-design-icons library:\n\n```vue\n<template>\n\t<NcActions>\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<HandBackLeft :size=\"20\" />\n\t\t\t</template>\n\t\t\tRaise left hand\n\t\t</NcActionButton>\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<HandBackRight :size=\"20\" />\n\t\t\t</template>\n\t\t\tRaise right hand\n\t\t</NcActionButton>\n\t</NcActions>\n</template>\n<script>\nimport HandBackLeft from 'vue-material-design-icons/HandBackLeft'\nimport HandBackRight from 'vue-material-design-icons/HandBackRight'\n\nexport default {\n\tcomponents: {\n\t\tHandBackLeft,\n\t\tHandBackRight,\n\t},\n}\n</script>\n```\n</docs>\n\n<template>\n\t<li class=\"action\" role=\"presentation\" :class=\"{ 'action--disabled': disabled }\">\n\t\t<button class=\"action-button\"\n\t\t\t:class=\"{ focusable: isFocusable }\"\n\t\t\t:aria-label=\"ariaLabel\"\n\t\t\t:title=\"title\"\n\t\t\trole=\"menuitem\"\n\t\t\ttype=\"button\"\n\t\t\t@click=\"onClick\">\n\t\t\t<!-- @slot Manually provide icon -->\n\t\t\t<slot name=\"icon\">\n\t\t\t\t<span :class=\"[isIconUrl ? 'action-button__icon--url' : icon]\"\n\t\t\t\t\t:style=\"{ backgroundImage: isIconUrl ? `url(${icon})` : null }\"\n\t\t\t\t\t:aria-hidden=\"ariaHidden\"\n\t\t\t\t\tclass=\"action-button__icon\" />\n\t\t\t</slot>\n\n\t\t\t<!-- long text with name -->\n\t\t\t<p v-if=\"name\">\n\t\t\t\t<strong class=\"action-button__name\">\n\t\t\t\t\t{{ name }}\n\t\t\t\t</strong>\n\t\t\t\t<br>\n\t\t\t\t<!-- white space is shown on longtext, so we can't\n\t\t\t\t\tput {{ text }} on a new line for code readability -->\n\t\t\t\t<span class=\"action-button__longtext\" v-text=\"text\" />\n\t\t\t</p>\n\n\t\t\t<!-- long text only -->\n\t\t\t<!-- white space is shown on longtext, so we can't\n\t\t\t\tput {{ text }} on a new line for code readability -->\n\t\t\t<p v-else-if=\"isLongText\"\n\t\t\t\tclass=\"action-button__longtext\"\n\t\t\t\tv-text=\"text\" />\n\n\t\t\t<!-- default text display -->\n\t\t\t<span v-else class=\"action-button__text\">{{ text }}</span>\n\n\t\t\t<!-- fake slot to gather inner text -->\n\t\t\t<slot v-if=\"false\" />\n\t\t</button>\n\t</li>\n</template>\n\n<script>\nimport ActionTextMixin from '../../mixins/actionText.js'\n\n/**\n * Button component to be used in Actions\n */\nexport default {\n\tname: 'NcActionButton',\n\n\tmixins: [ActionTextMixin],\n\n\tprops: {\n\t\t/**\n\t\t * disabled state of the action button\n\t\t */\n\t\tdisabled: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * aria-hidden attribute for the icon slot\n\t\t */\n\t\tariaHidden: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: null,\n\t\t},\n\t},\n\tcomputed: {\n\t\t/**\n\t\t * determines if the action is focusable\n\t\t *\n\t\t * @return {boolean} is the action focusable ?\n\t\t */\n\t\tisFocusable() {\n\t\t\treturn !this.disabled\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n@import '../../assets/action';\n@include action-active;\n@include action--disabled;\n@include action-item('button');\n</style>\n"],"names":["_sfc_main","ActionTextMixin"],"mappings":";;;AAsOA,MAAAA,IAAA;AAAA,EACA,MAAA;AAAA,EAEA,QAAA,CAAAC,CAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAIA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EACA,UAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,cAAA;AACA,aAAA,CAAA,KAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;"}

package/dist/Components/NcActionButtonGroup.cjs

@@ -1 +1,30 @@
-var a=require("../assets/index52.css");const n=require("vue"),o=require("../chunks/_plugin-vue2_normalizer-764a4c12.cjs");const r=n.defineComponent({name:"NcActionButtonGroup",props:{name:{required:!1,default:void 0,type:String}}});var u=function(){var t=this,e=t._self._c;return t._self._setupProxy,e("li",{staticClass:"nc-button-group-base"},[t.name?e("div",[t._v(" "+t._s(t.name)+" ")]):t._e(),e("ul",{staticClass:"nc-button-group-content"},[t._t("default")],2)])},s=[],l=o.normalizeComponent(r,u,s,!1,null,null,null,null);const i=l.exports;module.exports=i;
+var l = require("../assets/index-5fa0ac5a.css");
+const t = require("vue"), o = require("../chunks/_plugin-vue2_normalizer-7f9efb60.cjs");
+const r = t.defineComponent({
+  name: "NcActionButtonGroup",
+  props: {
+    /**
+     * Optional text shown below the button group
+     */
+    name: {
+      required: !1,
+      default: void 0,
+      type: String
+    }
+  }
+});
+var s = function() {
+  var n = this, e = n._self._c;
+  return n._self._setupProxy, e("li", { staticClass: "nc-button-group-base" }, [n.name ? e("div", [n._v(" " + n._s(n.name) + " ")]) : n._e(), e("ul", { staticClass: "nc-button-group-content" }, [n._t("default")], 2)]);
+}, u = [], _ = /* @__PURE__ */ o.normalizeComponent(
+  r,
+  s,
+  u,
+  !1,
+  null,
+  null,
+  null,
+  null
+);
+const c = _.exports;
+module.exports = c;

package/dist/Components/NcActionButtonGroup.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"NcActionButtonGroup.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}
+{"version":3,"file":"NcActionButtonGroup.cjs","sources":["../../src/components/NcActionButtonGroup/NcActionButtonGroup.vue"],"sourcesContent":["<!--\n  - @copyright Copyright (c) 2022\n  -\n  - @license AGPL-3.0-or-later\n  -\n  - This program is free software: you can redistribute it and/or modify\n  - it under the terms of the GNU Affero General Public License as\n  - published by the Free Software Foundation, either version 3 of the\n  - License, or (at your option) any later version.\n  -\n  - This program is distributed in the hope that it will be useful,\n  - but WITHOUT ANY WARRANTY; without even the implied warranty of\n  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n  - GNU Affero General Public License for more details.\n  -\n  - You should have received a copy of the GNU Affero General Public License\n  - along with this program. If not, see <http://www.gnu.org/licenses/>.\n  -\n  -->\n\n<docs>\nThis component is made to be used inside of the [NcActions](#NcActions) component slots,\nto group buttons as one visual action, like for text alignment.\nThis should be used sparingly for accessibility.\n\n```vue\n<template>\n\t<div style=\"display: flex; align-items: center;\">\n\t\t<NcActions>\n\t\t\t<NcActionButtonGroup name=\"Text alignment\">\n\t\t\t\t<NcActionButton aria-label=\"Align left\"\n\t\t\t\t\t@click=\"showMessage('Align left')\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<AlignLeft :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t</NcActionButton>\n\t\t\t\t<NcActionButton aria-label=\"Align center\"\n\t\t\t\t\t@click=\"showMessage('Align center')\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<AlignCenter :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t</NcActionButton>\n\t\t\t\t<NcActionButton aria-label=\"Align right\"\n\t\t\t\t\t@click=\"showMessage('Align Right')\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<AlignRight :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t</NcActionButton>\n\t\t\t</NcActionButtonGroup>\n\t\t\t<NcActionButton :close-after-click=\"true\"\n\t\t\t\t@click=\"showMessage('Some other action')\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Plus :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tSome other action\n\t\t\t</NcActionButton>\n\t\t</NcActions>\n\t</div>\n</template>\n<script>\nimport AlignLeft from 'vue-material-design-icons/AlignHorizontalLeft'\nimport AlignRight from 'vue-material-design-icons/AlignHorizontalRight'\nimport AlignCenter from 'vue-material-design-icons/AlignHorizontalCenter'\nimport Plus from 'vue-material-design-icons/Plus'\n\nexport default {\n\tcomponents: {\n\t\tAlignLeft,\n\t\tAlignRight,\n\t\tAlignCenter,\n\t\tPlus,\n\t},\n\tmethods: {\n\t\tshowMessage(msg) {\n\t\t\talert(msg)\n\t\t},\n\t},\n}\n</script>\n```\n</docs>\n\n<template>\n\t<li class=\"nc-button-group-base\">\n\t\t<div v-if=\"name\">\n\t\t\t{{ name }}\n\t\t</div>\n\t\t<ul class=\"nc-button-group-content\">\n\t\t\t<slot />\n\t\t</ul>\n\t</li>\n</template>\n\n<script>\nimport { defineComponent } from 'vue'\n\n/**\n * A wrapper for allowing inlining NcAction components within the action menu\n */\nexport default defineComponent({\n\tname: 'NcActionButtonGroup',\n\tprops: {\n\t\t/**\n\t\t * Optional text shown below the button group\n\t\t */\n\t\tname: {\n\t\t\trequired: false,\n\t\t\tdefault: undefined,\n\t\t\ttype: String,\n\t\t},\n\t},\n})\n</script>\n\n<style lang=\"scss\">\n.nc-button-group-base {\n\t>div {\n\t\ttext-align: center;\n\t\tcolor: var(--color-text-maxcontrast);\n\t}\n\n\tul.nc-button-group-content {\n\t\tdisplay: flex;\n\t\tjustify-content: space-between;\n\t\tli {\n\t\t\tflex: 1 1;\n\t\t}\n\n\t\t.action-button {\n\t\t\t// Fix action buttons beeing shifted to the left (right padding)\n\t\t\tpadding: 0 !important;\n\t\t\twidth: 100%;\n\t\t\tdisplay: flex;\n\t\t\tjustify-content: center;\n\t\t}\n\t}\n}\n</style>\n"],"names":["_sfc_main","Vue"],"mappings":";;AAmGA,MAAAA,IAAAC,EAAA,gBAAA;AAAA,EACA,MAAA;AAAA,EACA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,MAAA;AAAA,MACA,UAAA;AAAA,MACA,SAAA;AAAA,MACA,MAAA;AAAA,IACA;AAAA,EACA;AACA,CAAA;;;;;;;;;;;;;;;;"}

package/dist/Components/NcActionButtonGroup.mjs

@@ -1,12 +1,33 @@
-import "../assets/index42.css";
-import { defineComponent as o } from "vue";
-import { n as e } from "../chunks/_plugin-vue2_normalizer-5b4c43a4.mjs";
-const r = o({ name: "NcActionButtonGroup", props: { name: { required: !1, default: void 0, type: String } } });
+import "../assets/index-5fa0ac5a.css";
+import { defineComponent as e } from "vue";
+import { n as o } from "../chunks/_plugin-vue2_normalizer-71e2aa87.mjs";
+const r = e({
+  name: "NcActionButtonGroup",
+  props: {
+    /**
+     * Optional text shown below the button group
+     */
+    name: {
+      required: !1,
+      default: void 0,
+      type: String
+    }
+  }
+});
 var s = function() {
-  var t = this, n = t._self._c;
-  return t._self._setupProxy, n("li", { staticClass: "nc-button-group-base" }, [t.name ? n("div", [t._v(" " + t._s(t.name) + " ")]) : t._e(), n("ul", { staticClass: "nc-button-group-content" }, [t._t("default")], 2)]);
-}, u = [], a = e(r, s, u, !1, null, null, null, null);
-const c = a.exports;
+  var n = this, t = n._self._c;
+  return n._self._setupProxy, t("li", { staticClass: "nc-button-group-base" }, [n.name ? t("div", [n._v(" " + n._s(n.name) + " ")]) : n._e(), t("ul", { staticClass: "nc-button-group-content" }, [n._t("default")], 2)]);
+}, _ = [], u = /* @__PURE__ */ o(
+  r,
+  s,
+  _,
+  !1,
+  null,
+  null,
+  null,
+  null
+);
+const p = u.exports;
 export {
-  c as default
+  p as default
 };

package/dist/Components/NcActionButtonGroup.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"NcActionButtonGroup.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}
+{"version":3,"file":"NcActionButtonGroup.mjs","sources":["../../src/components/NcActionButtonGroup/NcActionButtonGroup.vue"],"sourcesContent":["<!--\n  - @copyright Copyright (c) 2022\n  -\n  - @license AGPL-3.0-or-later\n  -\n  - This program is free software: you can redistribute it and/or modify\n  - it under the terms of the GNU Affero General Public License as\n  - published by the Free Software Foundation, either version 3 of the\n  - License, or (at your option) any later version.\n  -\n  - This program is distributed in the hope that it will be useful,\n  - but WITHOUT ANY WARRANTY; without even the implied warranty of\n  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n  - GNU Affero General Public License for more details.\n  -\n  - You should have received a copy of the GNU Affero General Public License\n  - along with this program. If not, see <http://www.gnu.org/licenses/>.\n  -\n  -->\n\n<docs>\nThis component is made to be used inside of the [NcActions](#NcActions) component slots,\nto group buttons as one visual action, like for text alignment.\nThis should be used sparingly for accessibility.\n\n```vue\n<template>\n\t<div style=\"display: flex; align-items: center;\">\n\t\t<NcActions>\n\t\t\t<NcActionButtonGroup name=\"Text alignment\">\n\t\t\t\t<NcActionButton aria-label=\"Align left\"\n\t\t\t\t\t@click=\"showMessage('Align left')\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<AlignLeft :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t</NcActionButton>\n\t\t\t\t<NcActionButton aria-label=\"Align center\"\n\t\t\t\t\t@click=\"showMessage('Align center')\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<AlignCenter :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t</NcActionButton>\n\t\t\t\t<NcActionButton aria-label=\"Align right\"\n\t\t\t\t\t@click=\"showMessage('Align Right')\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<AlignRight :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t</NcActionButton>\n\t\t\t</NcActionButtonGroup>\n\t\t\t<NcActionButton :close-after-click=\"true\"\n\t\t\t\t@click=\"showMessage('Some other action')\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Plus :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tSome other action\n\t\t\t</NcActionButton>\n\t\t</NcActions>\n\t</div>\n</template>\n<script>\nimport AlignLeft from 'vue-material-design-icons/AlignHorizontalLeft'\nimport AlignRight from 'vue-material-design-icons/AlignHorizontalRight'\nimport AlignCenter from 'vue-material-design-icons/AlignHorizontalCenter'\nimport Plus from 'vue-material-design-icons/Plus'\n\nexport default {\n\tcomponents: {\n\t\tAlignLeft,\n\t\tAlignRight,\n\t\tAlignCenter,\n\t\tPlus,\n\t},\n\tmethods: {\n\t\tshowMessage(msg) {\n\t\t\talert(msg)\n\t\t},\n\t},\n}\n</script>\n```\n</docs>\n\n<template>\n\t<li class=\"nc-button-group-base\">\n\t\t<div v-if=\"name\">\n\t\t\t{{ name }}\n\t\t</div>\n\t\t<ul class=\"nc-button-group-content\">\n\t\t\t<slot />\n\t\t</ul>\n\t</li>\n</template>\n\n<script>\nimport { defineComponent } from 'vue'\n\n/**\n * A wrapper for allowing inlining NcAction components within the action menu\n */\nexport default defineComponent({\n\tname: 'NcActionButtonGroup',\n\tprops: {\n\t\t/**\n\t\t * Optional text shown below the button group\n\t\t */\n\t\tname: {\n\t\t\trequired: false,\n\t\t\tdefault: undefined,\n\t\t\ttype: String,\n\t\t},\n\t},\n})\n</script>\n\n<style lang=\"scss\">\n.nc-button-group-base {\n\t>div {\n\t\ttext-align: center;\n\t\tcolor: var(--color-text-maxcontrast);\n\t}\n\n\tul.nc-button-group-content {\n\t\tdisplay: flex;\n\t\tjustify-content: space-between;\n\t\tli {\n\t\t\tflex: 1 1;\n\t\t}\n\n\t\t.action-button {\n\t\t\t// Fix action buttons beeing shifted to the left (right padding)\n\t\t\tpadding: 0 !important;\n\t\t\twidth: 100%;\n\t\t\tdisplay: flex;\n\t\t\tjustify-content: center;\n\t\t}\n\t}\n}\n</style>\n"],"names":["_sfc_main","defineComponent"],"mappings":";;;AAmGA,MAAAA,IAAAC,EAAA;AAAA,EACA,MAAA;AAAA,EACA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,MAAA;AAAA,MACA,UAAA;AAAA,MACA,SAAA;AAAA,MACA,MAAA;AAAA,IACA;AAAA,EACA;AACA,CAAA;;;;;;;;;;;;;;;"}

package/dist/Components/NcActionCaption.cjs

@@ -1 +1,29 @@
-var p=require("../assets/index51.css");const e=require("../chunks/_plugin-vue2_normalizer-764a4c12.cjs");const a={name:"NcActionCaption",props:{name:{type:String,required:!0}}};var i=function(){var n=this,t=n._self._c;return t("li",{staticClass:"app-navigation-caption"},[n._v(" "+n._s(n.name)+" ")])},r=[],o=e.normalizeComponent(a,i,r,!1,null,"325a2ae8",null,null);const s=o.exports;module.exports=s;
+var c = require("../assets/index-441b6552.css");
+const t = require("../chunks/_plugin-vue2_normalizer-7f9efb60.cjs");
+const _ = {
+  name: "NcActionCaption",
+  props: {
+    /**
+     * The caption's text
+     */
+    name: {
+      type: String,
+      required: !0
+    }
+  }
+};
+var a = function() {
+  var n = this, e = n._self._c;
+  return e("li", { staticClass: "app-navigation-caption" }, [n._v(" " + n._s(n.name) + " ")]);
+}, r = [], i = /* @__PURE__ */ t.normalizeComponent(
+  _,
+  a,
+  r,
+  !1,
+  null,
+  "325a2ae8",
+  null,
+  null
+);
+const o = i.exports;
+module.exports = o;

package/dist/Components/NcActionCaption.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"NcActionCaption.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}
+{"version":3,"file":"NcActionCaption.cjs","sources":["../../src/components/NcActionCaption/NcActionCaption.vue"],"sourcesContent":["<!--\n  - @copyright Copyright (c) 2021 Marco Ambrosini <marcoambrosini@icloud.com>\n  -\n  - @author Marco Ambrosini <marcoambrosini@icloud.com>\n  -\n  - @license GNU AGPL version 3 or any later version\n  -\n  - This program is free software: you can redistribute it and/or modify\n  - it under the terms of the GNU Affero General Public License as\n  - published by the Free Software Foundation, either version 3 of the\n  - License, or (at your option) any later version.\n  -\n  - This program is distributed in the hope that it will be useful,\n  - but WITHOUT ANY WARRANTY; without even the implied warranty of\n  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n  - GNU Affero General Public License for more details.\n  -\n  - You should have received a copy of the GNU Affero General Public License\n  - along with this program. If not, see <http://www.gnu.org/licenses/>.\n-->\n<docs>\nThis component is made to be used inside of the [NcActions](#NcActions) component slots.\n\n```vue\n\t<NcActions>\n\t\t<NcActionCaption name=\"Test caption\" />\n\t\t<NcActionCaption name=\"Test caption 2\" />\n\t</NcActions>\n```\n</docs>\n\n<template>\n\t<li class=\"app-navigation-caption\">\n\t\t{{ name }}\n\t</li>\n</template>\n\n<script>\nexport default {\n\tname: 'NcActionCaption',\n\tprops: {\n\t\t/**\n\t\t * The caption's text\n\t\t */\n\t\tname: {\n\t\t\ttype: String,\n\t\t\trequired: true,\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n\t.app-navigation-caption {\n\t\tcolor: var(--color-text-maxcontrast);\n\t\tline-height: $clickable-area;\n\t\twhite-space: nowrap;\n\t\ttext-overflow: ellipsis;\n\t\tbox-shadow: none !important;\n\t\tuser-select: none;\n\t\tpointer-events: none;\n\t\tmargin-left: 12px;\n\t\tpadding-right: 14px;\n\t\theight: $clickable-area;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n</style>\n"],"names":["_sfc_main"],"mappings":";;AAsCA,MAAAA,IAAA;AAAA,EACA,MAAA;AAAA,EACA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;"}

package/dist/Components/NcActionCaption.mjs

@@ -1,11 +1,31 @@
-import "../assets/index56.css";
-import { n as a } from "../chunks/_plugin-vue2_normalizer-5b4c43a4.mjs";
-const o = { name: "NcActionCaption", props: { name: { type: String, required: !0 } } };
-var r = function() {
-  var n = this, t = n._self._c;
-  return t("li", { staticClass: "app-navigation-caption" }, [n._v(" " + n._s(n.name) + " ")]);
-}, e = [], i = a(o, r, e, !1, null, "325a2ae8", null, null);
-const l = i.exports;
+import "../assets/index-441b6552.css";
+import { n as t } from "../chunks/_plugin-vue2_normalizer-71e2aa87.mjs";
+const a = {
+  name: "NcActionCaption",
+  props: {
+    /**
+     * The caption's text
+     */
+    name: {
+      type: String,
+      required: !0
+    }
+  }
+};
+var _ = function() {
+  var n = this, e = n._self._c;
+  return e("li", { staticClass: "app-navigation-caption" }, [n._v(" " + n._s(n.name) + " ")]);
+}, o = [], r = /* @__PURE__ */ t(
+  a,
+  _,
+  o,
+  !1,
+  null,
+  "325a2ae8",
+  null,
+  null
+);
+const p = r.exports;
 export {
-  l as default
+  p as default
 };

package/dist/Components/NcActionCaption.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"NcActionCaption.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
+{"version":3,"file":"NcActionCaption.mjs","sources":["../../src/components/NcActionCaption/NcActionCaption.vue"],"sourcesContent":["<!--\n  - @copyright Copyright (c) 2021 Marco Ambrosini <marcoambrosini@icloud.com>\n  -\n  - @author Marco Ambrosini <marcoambrosini@icloud.com>\n  -\n  - @license GNU AGPL version 3 or any later version\n  -\n  - This program is free software: you can redistribute it and/or modify\n  - it under the terms of the GNU Affero General Public License as\n  - published by the Free Software Foundation, either version 3 of the\n  - License, or (at your option) any later version.\n  -\n  - This program is distributed in the hope that it will be useful,\n  - but WITHOUT ANY WARRANTY; without even the implied warranty of\n  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n  - GNU Affero General Public License for more details.\n  -\n  - You should have received a copy of the GNU Affero General Public License\n  - along with this program. If not, see <http://www.gnu.org/licenses/>.\n-->\n<docs>\nThis component is made to be used inside of the [NcActions](#NcActions) component slots.\n\n```vue\n\t<NcActions>\n\t\t<NcActionCaption name=\"Test caption\" />\n\t\t<NcActionCaption name=\"Test caption 2\" />\n\t</NcActions>\n```\n</docs>\n\n<template>\n\t<li class=\"app-navigation-caption\">\n\t\t{{ name }}\n\t</li>\n</template>\n\n<script>\nexport default {\n\tname: 'NcActionCaption',\n\tprops: {\n\t\t/**\n\t\t * The caption's text\n\t\t */\n\t\tname: {\n\t\t\ttype: String,\n\t\t\trequired: true,\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n\t.app-navigation-caption {\n\t\tcolor: var(--color-text-maxcontrast);\n\t\tline-height: $clickable-area;\n\t\twhite-space: nowrap;\n\t\ttext-overflow: ellipsis;\n\t\tbox-shadow: none !important;\n\t\tuser-select: none;\n\t\tpointer-events: none;\n\t\tmargin-left: 12px;\n\t\tpadding-right: 14px;\n\t\theight: $clickable-area;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n</style>\n"],"names":["_sfc_main"],"mappings":";;AAsCA,MAAAA,IAAA;AAAA,EACA,MAAA;AAAA,EACA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;"}

package/dist/Components/NcActionCheckbox.cjs

@@ -1 +1,78 @@
-var d=require("../assets/index50.css");const a=require("../chunks/actionGlobal-ec7003e8.cjs"),i=require("../chunks/GenRandomId-67df40eb.cjs"),s=require("../chunks/_plugin-vue2_normalizer-764a4c12.cjs");const n={name:"NcActionCheckbox",mixins:[a.ActionGlobalMixin],props:{id:{type:String,default:()=>"action-"+i.GenRandomId(),validator:e=>e.trim()!==""},checked:{type:Boolean,default:!1},value:{type:[String,Number],default:""},disabled:{type:Boolean,default:!1}},emits:["change","check","uncheck","update:checked"],computed:{isFocusable(){return!this.disabled}},methods:{checkInput(e){this.$refs.label.click()},onChange(e){this.$emit("update:checked",this.$refs.checkbox.checked),this.$emit("change",e),this.$refs.checkbox.checked?this.$emit("check"):this.$emit("uncheck")}}};var l=function(){var e=this,c=e._self._c;return c("li",{staticClass:"action",class:{"action--disabled":e.disabled}},[c("span",{staticClass:"action-checkbox"},[c("input",{ref:"checkbox",staticClass:"checkbox action-checkbox__checkbox",class:{focusable:e.isFocusable},attrs:{id:e.id,disabled:e.disabled,type:"checkbox"},domProps:{checked:e.checked,value:e.value},on:{keydown:function(t){return!t.type.indexOf("key")&&e._k(t.keyCode,"enter",13,t.key,"Enter")||t.ctrlKey||t.shiftKey||t.altKey||t.metaKey?null:(t.preventDefault(),e.checkInput.apply(null,arguments))},change:e.onChange}}),c("label",{ref:"label",staticClass:"action-checkbox__label",attrs:{for:e.id}},[e._v(e._s(e.text))]),e._e()],2)])},o=[],h=s.normalizeComponent(n,l,o,!1,null,"1aa9466c",null,null);const r=h.exports;module.exports=r;
+var h = require("../assets/index-baf8711a.css");
+const s = require("../chunks/actionGlobal-9e29e11b.cjs"), n = require("../chunks/GenRandomId-c214d235.cjs"), i = require("../chunks/_plugin-vue2_normalizer-7f9efb60.cjs");
+const l = {
+  name: "NcActionCheckbox",
+  mixins: [s.ActionGlobalMixin],
+  props: {
+    /**
+     * id attribute of the checkbox element
+     */
+    id: {
+      type: String,
+      default: () => "action-" + n.GenRandomId(),
+      validator: (t) => t.trim() !== ""
+    },
+    /**
+     * checked state of the the checkbox element
+     */
+    checked: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * value of the checkbox input
+     */
+    value: {
+      type: [String, Number],
+      default: ""
+    },
+    /**
+     * disabled state of the checkbox element
+     */
+    disabled: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: [
+    "change",
+    "check",
+    "uncheck",
+    "update:checked"
+  ],
+  computed: {
+    /**
+     * determines if the action is focusable
+     *
+     * @return {boolean} is the action focusable ?
+     */
+    isFocusable() {
+      return !this.disabled;
+    }
+  },
+  methods: {
+    checkInput(t) {
+      this.$refs.label.click();
+    },
+    onChange(t) {
+      this.$emit("update:checked", this.$refs.checkbox.checked), this.$emit("change", t), this.$refs.checkbox.checked ? this.$emit("check") : this.$emit("uncheck");
+    }
+  }
+};
+var o = function() {
+  var e = this, a = e._self._c;
+  return a("li", { staticClass: "action", class: { "action--disabled": e.disabled } }, [a("span", { staticClass: "action-checkbox" }, [a("input", { ref: "checkbox", staticClass: "checkbox action-checkbox__checkbox", class: { focusable: e.isFocusable }, attrs: { id: e.id, disabled: e.disabled, type: "checkbox" }, domProps: { checked: e.checked, value: e.value }, on: { keydown: function(c) {
+    return !c.type.indexOf("key") && e._k(c.keyCode, "enter", 13, c.key, "Enter") || c.ctrlKey || c.shiftKey || c.altKey || c.metaKey ? null : (c.preventDefault(), e.checkInput.apply(null, arguments));
+  }, change: e.onChange } }), a("label", { ref: "label", staticClass: "action-checkbox__label", attrs: { for: e.id } }, [e._v(e._s(e.text))]), e._e()], 2)]);
+}, r = [], d = /* @__PURE__ */ i.normalizeComponent(
+  l,
+  o,
+  r,
+  !1,
+  null,
+  "1aa9466c",
+  null,
+  null
+);
+const u = d.exports;
+module.exports = u;

package/dist/Components/NcActionCheckbox.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"NcActionCheckbox.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}
+{"version":3,"file":"NcActionCheckbox.cjs","sources":["../../src/components/NcActionCheckbox/NcActionCheckbox.vue"],"sourcesContent":["<!--\n  - @copyright Copyright (c) 2019 John Molakvoæ <skjnldsv@protonmail.com>\n  -\n  - @author John Molakvoæ <skjnldsv@protonmail.com>\n  - @author Marco Ambrosini <marcoambrosini@icloud.com>\n  -\n  - @license GNU AGPL version 3 or any later version\n  -\n  - This program is free software: you can redistribute it and/or modify\n  - it under the terms of the GNU Affero General Public License as\n  - published by the Free Software Foundation, either version 3 of the\n  - License, or (at your option) any later version.\n  -\n  - This program is distributed in the hope that it will be useful,\n  - but WITHOUT ANY WARRANTY; without even the implied warranty of\n  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n  - GNU Affero General Public License for more details.\n  -\n  - You should have received a copy of the GNU Affero General Public License\n  - along with this program. If not, see <http://www.gnu.org/licenses/>.\n  -\n  -->\n\n<docs>\nThis component is made to be used inside of the [NcActions](#NcActions) component slots.\n\n```vue\n\t<NcActions>\n\t\t<NcActionCheckbox @change=\"alert('(un)checked !')\">First choice</NcActionCheckbox>\n\t\t<NcActionCheckbox value=\"second\" @change=\"alert('(un)checked !')\">Second choice</NcActionCheckbox>\n\t\t<NcActionCheckbox :checked=\"true\" @change=\"alert('(un)checked !')\">Third choice (checked)</NcActionCheckbox>\n\t\t<NcActionCheckbox :disabled=\"true\" @change=\"alert('(un)checked !')\">Second choice (disabled)</NcActionCheckbox>\n\t</NcActions>\n```\n</docs>\n\n<template>\n\t<li class=\"action\" :class=\"{ 'action--disabled': disabled }\">\n\t\t<span class=\"action-checkbox\">\n\t\t\t<input :id=\"id\"\n\t\t\t\tref=\"checkbox\"\n\t\t\t\t:disabled=\"disabled\"\n\t\t\t\t:checked=\"checked\"\n\t\t\t\t:value=\"value\"\n\t\t\t\t:class=\"{ focusable: isFocusable }\"\n\t\t\t\ttype=\"checkbox\"\n\t\t\t\tclass=\"checkbox action-checkbox__checkbox\"\n\t\t\t\t@keydown.enter.exact.prevent=\"checkInput\"\n\t\t\t\t@change=\"onChange\">\n\t\t\t<label ref=\"label\" :for=\"id\" class=\"action-checkbox__label\">{{ text }}</label>\n\n\t\t\t<!-- fake slot to gather inner text -->\n\t\t\t<slot v-if=\"false\" />\n\t\t</span>\n\t</li>\n</template>\n\n<script>\nimport ActionGlobalMixin from '../../mixins/actionGlobal.js'\nimport GenRandomId from '../../utils/GenRandomId.js'\n\nexport default {\n\tname: 'NcActionCheckbox',\n\n\tmixins: [ActionGlobalMixin],\n\n\tprops: {\n\t\t/**\n\t\t * id attribute of the checkbox element\n\t\t */\n\t\tid: {\n\t\t\ttype: String,\n\t\t\tdefault: () => 'action-' + GenRandomId(),\n\t\t\tvalidator: id => id.trim() !== '',\n\t\t},\n\n\t\t/**\n\t\t * checked state of the the checkbox element\n\t\t */\n\t\tchecked: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * value of the checkbox input\n\t\t */\n\t\tvalue: {\n\t\t\ttype: [String, Number],\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * disabled state of the checkbox element\n\t\t */\n\t\tdisabled: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t},\n\n\temits: [\n\t\t'change',\n\t\t'check',\n\t\t'uncheck',\n\t\t'update:checked',\n\t],\n\n\tcomputed: {\n\t\t/**\n\t\t * determines if the action is focusable\n\t\t *\n\t\t * @return {boolean} is the action focusable ?\n\t\t */\n\t\tisFocusable() {\n\t\t\treturn !this.disabled\n\t\t},\n\t},\n\n\tmethods: {\n\t\tcheckInput(event) {\n\t\t\t// by clicking we also trigger the change event\n\t\t\tthis.$refs.label.click()\n\t\t},\n\t\tonChange(event) {\n\t\t\t/**\n\t\t\t * Emitted when the checkbox state is changed\n\t\t\t *\n\t\t\t * @type {boolean}\n\t\t\t */\n\t\t\tthis.$emit('update:checked', this.$refs.checkbox.checked)\n\n\t\t\t/**\n\t\t\t * Emitted when the checkbox state is changed\n\t\t\t *\n\t\t\t * @type {Event}\n\t\t\t */\n\t\t\tthis.$emit('change', event)\n\n\t\t\tif (this.$refs.checkbox.checked) {\n\t\t\t\t/**\n\t\t\t\t * Emitted when the checkbox is checked\n\t\t\t\t *\n\t\t\t\t * @type {Event}\n\t\t\t\t */\n\t\t\t\tthis.$emit('check')\n\t\t\t} else {\n\t\t\t\t/**\n\t\t\t\t * Emitted when the checkbox is unchecked\n\t\t\t\t *\n\t\t\t\t * @type {Event}\n\t\t\t\t */\n\t\t\t\tthis.$emit('uncheck')\n\t\t\t}\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n@import '../../assets/action';\n@include action-active;\n@include action--disabled;\n\n.action-checkbox {\n\tdisplay: flex;\n\talign-items: flex-start;\n\n\twidth: 100%;\n\theight: auto;\n\tmargin: 0;\n\tpadding: 0;\n\n\tcursor: pointer;\n\twhite-space: nowrap;\n\n\tcolor: var(--color-main-text);\n\tborder: 0;\n\tborder-radius: 0; // otherwise Safari will cut the border-radius area\n\tbackground-color: transparent;\n\tbox-shadow: none;\n\n\tfont-weight: normal;\n\tline-height: $clickable-area;\n\n\t/* checkbox/radio fixes */\n\t&__checkbox {\n\t\tposition: absolute;\n\t\ttop: auto;\n\t\tleft: -10000px;\n\n\t\toverflow: hidden;\n\n\t\twidth: 1px;\n\t\theight: 1px;\n\t}\n\n\t&__label {\n\t\tdisplay: flex;\n\t\talign-items: center; // align checkbox to text\n\n\t\twidth: 100%;\n\t\tpadding: 0 !important;\n\t\tpadding-right: $icon-margin !important;\n\n\t\t// checkbox-width is 12px, border is 2\n\t\t// (44 - 14 - 2) / 2 = 14\n\t\t&::before {\n\t\t\tmargin: 0 14px 0 !important;\n\t\t}\n\t}\n\n\t&--disabled {\n\t\t&,\n\t\t.action-checkbox__label {\n\t\t\tcursor: pointer;\n\t\t}\n\t}\n}\n\n</style>\n"],"names":["_sfc_main","actionGlobal","GenRandomId","id","event"],"mappings":";;AA6DA,MAAAA,IAAA;AAAA,EACA,MAAA;AAAA,EAEA,QAAA,CAAAC,EAAA,iBAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,IAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA,MAAA,YAAAC,EAAA,YAAA;AAAA,MACA,WAAA,CAAAC,MAAAA,EAAA,KAAA,MAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,SAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,OAAA;AAAA,MACA,MAAA,CAAA,QAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,cAAA;AACA,aAAA,CAAA,KAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,SAAA;AAAA,IACA,WAAAC,GAAA;AAEA,WAAA,MAAA,MAAA,MAAA;AAAA,IACA;AAAA,IACA,SAAAA,GAAA;AAMA,WAAA,MAAA,kBAAA,KAAA,MAAA,SAAA,OAAA,GAOA,KAAA,MAAA,UAAAA,CAAA,GAEA,KAAA,MAAA,SAAA,UAMA,KAAA,MAAA,OAAA,IAOA,KAAA,MAAA,SAAA;AAAA,IAEA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;"}

package/dist/Components/NcActionCheckbox.mjs

@@ -1,21 +1,82 @@
-import "../assets/index38.css";
-import { A as a } from "../chunks/actionGlobal-cda46023.mjs";
-import { G as s } from "../chunks/GenRandomId-1e1b509a.mjs";
-import { n as i } from "../chunks/_plugin-vue2_normalizer-5b4c43a4.mjs";
-const l = { name: "NcActionCheckbox", mixins: [a], props: { id: { type: String, default: () => "action-" + s(), validator: (e) => e.trim() !== "" }, checked: { type: Boolean, default: !1 }, value: { type: [String, Number], default: "" }, disabled: { type: Boolean, default: !1 } }, emits: ["change", "check", "uncheck", "update:checked"], computed: { isFocusable() {
-  return !this.disabled;
-} }, methods: { checkInput(e) {
-  this.$refs.label.click();
-}, onChange(e) {
-  this.$emit("update:checked", this.$refs.checkbox.checked), this.$emit("change", e), this.$refs.checkbox.checked ? this.$emit("check") : this.$emit("uncheck");
-} } };
-var o = function() {
-  var e = this, c = e._self._c;
-  return c("li", { staticClass: "action", class: { "action--disabled": e.disabled } }, [c("span", { staticClass: "action-checkbox" }, [c("input", { ref: "checkbox", staticClass: "checkbox action-checkbox__checkbox", class: { focusable: e.isFocusable }, attrs: { id: e.id, disabled: e.disabled, type: "checkbox" }, domProps: { checked: e.checked, value: e.value }, on: { keydown: function(t) {
-    return !t.type.indexOf("key") && e._k(t.keyCode, "enter", 13, t.key, "Enter") || t.ctrlKey || t.shiftKey || t.altKey || t.metaKey ? null : (t.preventDefault(), e.checkInput.apply(null, arguments));
-  }, change: e.onChange } }), c("label", { ref: "label", staticClass: "action-checkbox__label", attrs: { for: e.id } }, [e._v(e._s(e.text))]), e._e()], 2)]);
-}, n = [], h = i(l, o, n, !1, null, "1aa9466c", null, null);
-const p = h.exports;
+import "../assets/index-baf8711a.css";
+import { A as s } from "../chunks/actionGlobal-8c1c28c9.mjs";
+import { G as i } from "../chunks/GenRandomId-cb9ccebe.mjs";
+import { n } from "../chunks/_plugin-vue2_normalizer-71e2aa87.mjs";
+const o = {
+  name: "NcActionCheckbox",
+  mixins: [s],
+  props: {
+    /**
+     * id attribute of the checkbox element
+     */
+    id: {
+      type: String,
+      default: () => "action-" + i(),
+      validator: (t) => t.trim() !== ""
+    },
+    /**
+     * checked state of the the checkbox element
+     */
+    checked: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * value of the checkbox input
+     */
+    value: {
+      type: [String, Number],
+      default: ""
+    },
+    /**
+     * disabled state of the checkbox element
+     */
+    disabled: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: [
+    "change",
+    "check",
+    "uncheck",
+    "update:checked"
+  ],
+  computed: {
+    /**
+     * determines if the action is focusable
+     *
+     * @return {boolean} is the action focusable ?
+     */
+    isFocusable() {
+      return !this.disabled;
+    }
+  },
+  methods: {
+    checkInput(t) {
+      this.$refs.label.click();
+    },
+    onChange(t) {
+      this.$emit("update:checked", this.$refs.checkbox.checked), this.$emit("change", t), this.$refs.checkbox.checked ? this.$emit("check") : this.$emit("uncheck");
+    }
+  }
+};
+var l = function() {
+  var e = this, a = e._self._c;
+  return a("li", { staticClass: "action", class: { "action--disabled": e.disabled } }, [a("span", { staticClass: "action-checkbox" }, [a("input", { ref: "checkbox", staticClass: "checkbox action-checkbox__checkbox", class: { focusable: e.isFocusable }, attrs: { id: e.id, disabled: e.disabled, type: "checkbox" }, domProps: { checked: e.checked, value: e.value }, on: { keydown: function(c) {
+    return !c.type.indexOf("key") && e._k(c.keyCode, "enter", 13, c.key, "Enter") || c.ctrlKey || c.shiftKey || c.altKey || c.metaKey ? null : (c.preventDefault(), e.checkInput.apply(null, arguments));
+  }, change: e.onChange } }), a("label", { ref: "label", staticClass: "action-checkbox__label", attrs: { for: e.id } }, [e._v(e._s(e.text))]), e._e()], 2)]);
+}, r = [], d = /* @__PURE__ */ n(
+  o,
+  l,
+  r,
+  !1,
+  null,
+  "1aa9466c",
+  null,
+  null
+);
+const f = d.exports;
 export {
-  p as default
+  f as default
 };