@nextcloud/vue 9.8.2 → 9.10.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextcloud/vue",
-  "version": "9.8.2",
+  "version": "9.10.0",
   "description": "Nextcloud vue components",
   "keywords": [
     "vuejs",
@@ -76,7 +76,7 @@
   },
   "dependencies": {
     "@ckpack/vue-color": "^1.6.0",
-    "@floating-ui/dom": "^1.7.6",
+    "@floating-ui/dom": "^1.8.0",
     "@nextcloud/auth": "^2.6.0",
     "@nextcloud/axios": "^2.6.0",
     "@nextcloud/browser-storage": "^0.5.0",
@@ -89,19 +89,19 @@
     "@nextcloud/sharing": "^0.4.0",
     "@nextcloud/vue-select": "^4.1.0",
     "@vuepic/vue-datepicker": "^11.0.3",
-    "@vueuse/components": "^14.3.0",
-    "@vueuse/core": "^14.3.0",
+    "@vueuse/components": "^14.4.0",
+    "@vueuse/core": "^14.4.0",
     "blurhash": "^2.0.5",
     "clone": "^2.1.2",
     "debounce": "^3.0.0",
-    "dompurify": "^3.4.7",
+    "dompurify": "^3.4.14",
     "emoji-mart-vue-fast": "^15.0.5",
     "escape-html": "^1.0.3",
     "floating-vue": "^5.2.2",
-    "focus-trap": "^8.2.1",
+    "focus-trap": "^8.2.2",
     "linkifyjs": "^4.3.3",
     "mdast-util-to-string": "^4.0.0",
-    "p-queue": "^9.3.0",
+    "p-queue": "^9.3.3",
     "rehype-external-links": "^3.0.0",
     "rehype-highlight": "^7.0.2",
     "rehype-react": "^8.0.0",
@@ -118,49 +118,50 @@
     "unist-builder": "^4.0.0",
     "unist-util-visit-parents": "^6.0.2",
     "vue": "^3.5.18",
-    "vue-router": "^5.0.7"
+    "vue-router": "^5.2.0"
   },
   "devDependencies": {
     "@babel/plugin-syntax-import-assertions": "^7.29.7",
     "@babel/plugin-transform-typescript": "^7.29.7",
     "@babel/preset-typescript": "^7.29.7",
-    "@fontsource/roboto": "^5.2.10",
+    "@fontsource/roboto": "^5.3.0",
     "@mdi/js": "^7.4.47",
     "@mdi/svg": "^7.4.47",
     "@nextcloud/babel-config": "^1.3.0",
     "@nextcloud/browserslist-config": "^3.1.2",
-    "@nextcloud/eslint-config": "^9.0.0-rc.9",
+    "@nextcloud/eslint-config": "^9.0.1",
     "@nextcloud/stylelint-config": "^3.2.2",
     "@nextcloud/vite-config": "^2.5.0",
     "@nextcloud/webpack-vue-config": "github:nextcloud/webpack-vue-config#vue3",
-    "@playwright/experimental-ct-vue": "^1.60.0",
-    "@playwright/test": "^1.60.0",
+    "@playwright/experimental-ct-vue": "^1.62.1",
+    "@playwright/test": "^1.62.1",
     "@types/gettext-parser": "^9.0.0",
-    "@types/node": "^24.12.4",
-    "@vitest/coverage-v8": "^4.1.8",
+    "@types/node": "^26.2.0",
+    "@types/webpack-env": "^1.18.8",
+    "@vitest/coverage-v8": "^4.1.11",
     "@vue/test-utils": "^2.4.6",
     "@vue/tsconfig": "^0.9.1",
     "babel-loader-exclude-node-modules-except": "^1.2.4",
-    "core-js": "^3.49.0",
-    "eslint": "^10.4.1",
+    "core-js": "^3.50.0",
+    "eslint": "^10.9.0",
     "file-loader": "^6.2.0",
     "gettext-extractor": "^4.0.6",
-    "gettext-parser": "^9.0.2",
+    "gettext-parser": "^9.1.1",
     "glob": "^13.0.6",
-    "jsdom": "^29.1.1",
+    "jsdom": "^30.0.1",
     "remark-gfm": "^4.0.1",
     "resolve-url-loader": "^5.0.0",
-    "sass": "^1.100.0",
-    "stylelint": "^17.11.1",
+    "sass": "^1.103.1",
+    "stylelint": "^17.14.1",
     "ts-node": "^10.9.2",
     "typescript": "^5.9.3",
     "url-loader": "^4.1.1",
-    "vite": "^7.3.2",
+    "vite": "^7.3.6",
     "vitest": "^4.0.14",
     "vue-material-design-icons": "^5.3.1",
     "vue-styleguidist": "^4.72.4",
-    "vue-tsc": "^3.3.3",
-    "webpack": "^5.106.2",
+    "vue-tsc": "^3.3.11",
+    "webpack": "^5.109.2",
     "webpack-merge": "^6.0.1"
   },
   "engines": {

package/dist/assets/NcAppNavigationList--36j6Acm.css

@@ -1,28 +0,0 @@
-/**
- * SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors
- * SPDX-License-Identifier: AGPL-3.0-or-later
- */
-/**
- * SPDX-FileCopyrightText: 2021 Nextcloud GmbH and Nextcloud contributors
- * SPDX-License-Identifier: AGPL-3.0-or-later
- */
-/*
-* Ensure proper alignment of the vue material icons
-*/
-.material-design-icon[data-v-d72957ed] {
-  display: flex;
-  align-self: center;
-  justify-self: center;
-  align-items: center;
-  justify-content: center;
-}
-.app-navigation-list[data-v-d72957ed] {
-  position: relative;
-  width: 100%;
-  overflow-x: hidden;
-  overflow-y: auto;
-  display: flex;
-  flex-direction: column;
-  gap: var(--default-grid-baseline, 4px);
-  padding: var(--app-navigation-padding);
-}

package/dist/assets/NcDateTimePickerNative-BP6eg8aU.css

@@ -1,60 +0,0 @@
-/**
- * SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors
- * SPDX-License-Identifier: AGPL-3.0-or-later
- */
-/**
- * SPDX-FileCopyrightText: 2021 Nextcloud GmbH and Nextcloud contributors
- * SPDX-License-Identifier: AGPL-3.0-or-later
- */
-/*
-* Ensure proper alignment of the vue material icons
-*/
-.material-design-icon[data-v-b97e1f7a] {
-  display: flex;
-  align-self: center;
-  justify-self: center;
-  align-items: center;
-  justify-content: center;
-}
-.native-datetime-picker[data-v-b97e1f7a] {
-  display: flex;
-  flex-direction: column;
-}
-.native-datetime-picker .native-datetime-picker__label[data-v-b97e1f7a] {
-  margin-block-end: 2px;
-}
-.native-datetime-picker .native-datetime-picker__input[data-v-b97e1f7a] {
-  --input-border-width-offset: calc(var(--border-width-input-focused, 2px) - var(--border-width-input, 2px));
-  width: 100%;
-  flex: 0 0 auto;
-  margin: 0;
-  padding-inline-start: calc(var(--border-radius-element) + var(--input-border-width-offset));
-  padding-inline-end: calc(var(--default-grid-baseline) + var(--input-border-width-offset));
-  border: var(--border-width-input, 2px) solid var(--color-border-maxcontrast);
-}
-.native-datetime-picker .native-datetime-picker__input[data-v-b97e1f7a]:active:not([disabled]), .native-datetime-picker .native-datetime-picker__input[data-v-b97e1f7a]:hover:not([disabled]), .native-datetime-picker .native-datetime-picker__input[data-v-b97e1f7a]:focus:not([disabled]), .native-datetime-picker .native-datetime-picker__input[data-v-b97e1f7a]:focus-within:not([disabled]) {
-  border-color: var(--color-main-text);
-  border-width: var(--border-width-input-focused, 2px);
-  box-shadow: 0 0 0 2px var(--color-main-background) !important;
-  --input-border-width-offset: 0px;
-}
-[data-theme-light] .native-datetime-picker__input[data-v-b97e1f7a],
-[data-themes*=light] .native-datetime-picker__input[data-v-b97e1f7a] {
-  color-scheme: light;
-}
-[data-theme-dark] .native-datetime-picker__input[data-v-b97e1f7a],
-[data-themes*=dark] .native-datetime-picker__input[data-v-b97e1f7a] {
-  color-scheme: dark;
-}
-@media (prefers-color-scheme: light) {
-[data-theme-default] .native-datetime-picker__input[data-v-b97e1f7a],
-  [data-themes*=default] .native-datetime-picker__input[data-v-b97e1f7a] {
-    color-scheme: light;
-}
-}
-@media (prefers-color-scheme: dark) {
-[data-theme-default] .native-datetime-picker__input[data-v-b97e1f7a],
-  [data-themes*=default] .native-datetime-picker__input[data-v-b97e1f7a] {
-    color-scheme: dark;
-}
-}

package/dist/assets/NcPopover-C7YEE_vn.css

@@ -1,123 +0,0 @@
-/**
- * SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors
- * SPDX-License-Identifier: AGPL-3.0-or-later
- */
-/**
- * SPDX-FileCopyrightText: 2021 Nextcloud GmbH and Nextcloud contributors
- * SPDX-License-Identifier: AGPL-3.0-or-later
- */
-/*
-* Ensure proper alignment of the vue material icons
-*/
-._material-design-icon_Sit4G {
-  display: flex;
-  align-self: center;
-  justify-self: center;
-  align-items: center;
-  justify-content: center;
-}
-._ncPopover_SapAL.v-popper--theme-nc-popover-9, ._ncPopover_SapAL.v-popper--theme-nc-popover-9 * {
-  box-sizing: border-box;
-}
-._ncPopover_SapAL.v-popper--theme-nc-popover-9 .resize-observer {
-  position: absolute;
-  top: 0;
-  /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */
-  left: 0;
-  z-index: -1;
-  width: 100%;
-  height: 100%;
-  border: none;
-  background-color: transparent;
-  pointer-events: none;
-  display: block;
-  overflow: hidden;
-  opacity: 0;
-}
-._ncPopover_SapAL.v-popper--theme-nc-popover-9 .resize-observer object {
-  display: block;
-  position: absolute;
-  top: 0;
-  /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */
-  left: 0;
-  height: 100%;
-  width: 100%;
-  overflow: hidden;
-  pointer-events: none;
-  z-index: -1;
-}
-._ncPopover_SapAL.v-popper--theme-nc-popover-9.v-popper__popper {
-  z-index: 100000;
-  top: 0;
-  /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */
-  left: 0;
-  display: block !important;
-}
-._ncPopover_SapAL.v-popper--theme-nc-popover-9.v-popper__popper .v-popper__wrapper {
-  /*
-   * In theory, "filter: drop-shadow" would look better here with arrow shadow.
-   * In fact, in results in a blurry popover in Chromium on scaling.
-   * The hypothesis is that "filter" creates a new composition layer,
-   * and with GPU acceleration requires the previous layers content to be rasterized.
-   * In combination with translate3d from floating-vue, it makes Chromium to first render and rasterize the popover
-   * and then apply scaling, which results in a blurry popover.
-   */
-  box-shadow: 0 1px 10px var(--color-box-shadow);
-  border-radius: var(--border-radius-element);
-}
-._ncPopover_SapAL.v-popper--theme-nc-popover-9.v-popper__popper .v-popper__inner {
-  padding: 0;
-  color: var(--color-main-text);
-  border-radius: var(--border-radius-element);
-  overflow: hidden;
-  background: var(--color-main-background);
-}
-._ncPopover_SapAL.v-popper--theme-nc-popover-9.v-popper__popper .v-popper__arrow-container {
-  position: absolute;
-  z-index: 1;
-  width: 0;
-  height: 0;
-  border-style: solid;
-  border-color: transparent;
-  border-width: 10px;
-}
-._ncPopover_SapAL.v-popper--theme-nc-popover-9.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-container {
-  bottom: -9px;
-  /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */
-  border-bottom-width: 0;
-  /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */
-  border-top-color: var(--color-main-background);
-}
-._ncPopover_SapAL.v-popper--theme-nc-popover-9.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-container {
-  top: -9px;
-  /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */
-  border-top-width: 0;
-  /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */
-  border-bottom-color: var(--color-main-background);
-}
-._ncPopover_SapAL.v-popper--theme-nc-popover-9.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-container {
-  /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */
-  left: -9px;
-  /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */
-  border-left-width: 0;
-  /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */
-  border-right-color: var(--color-main-background);
-}
-._ncPopover_SapAL.v-popper--theme-nc-popover-9.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-container {
-  /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */
-  right: -9px;
-  /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */
-  border-right-width: 0;
-  /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */
-  border-left-color: var(--color-main-background);
-}
-._ncPopover_SapAL.v-popper--theme-nc-popover-9.v-popper__popper[aria-hidden=true] {
-  visibility: hidden;
-  transition: opacity var(--animation-quick), visibility var(--animation-quick);
-  opacity: 0;
-}
-._ncPopover_SapAL.v-popper--theme-nc-popover-9.v-popper__popper[aria-hidden=false] {
-  visibility: visible;
-  transition: opacity var(--animation-quick);
-  opacity: 1;
-}

package/dist/assets/NcSelect-CvDEQAjD.css

@@ -1,245 +0,0 @@
-/**
- * SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors
- * SPDX-License-Identifier: AGPL-3.0-or-later
- */
-/**
- * SPDX-FileCopyrightText: 2021 Nextcloud GmbH and Nextcloud contributors
- * SPDX-License-Identifier: AGPL-3.0-or-later
- */
-/*
-* Ensure proper alignment of the vue material icons
-*/
-.material-design-icon {
-  display: flex;
-  align-self: center;
-  justify-self: center;
-  align-items: center;
-  justify-content: center;
-}
-
-/*!
- * SPDX-FileCopyrightText: 2025 Nextcloud GmbH and Nextcloud contributors
- * SPDX-License-Identifier: AGPL-3.0-or-later
- */
-/**
- * Similar as inputBorder but without active styles.
- */
-/**
- * Create a consistent border for an input element.
- * With Nextcloud 32+ there is no real border anymore but we use a box-shadow.
- */
-body {
-  /**
-   * Set custom vue-select CSS variables.
-   * Needs to be on the body (not :root) for theming to apply (see nextcloud/server#36462)
-   */
-  /* Search Input */
-  --vs-search-input-color: var(--color-main-text);
-  --vs-search-input-bg: var(--color-main-background);
-  --vs-search-input-placeholder-color: var(--color-text-maxcontrast);
-  /* Font */
-  --vs-font-size: var(--default-font-size);
-  --vs-line-height: var(--default-line-height);
-  /* Disabled State */
-  --vs-state-disabled-bg: var(--color-background-hover);
-  --vs-state-disabled-color: var(--color-text-maxcontrast);
-  --vs-state-disabled-controls-color: var(--color-text-maxcontrast);
-  --vs-state-disabled-cursor: not-allowed;
-  --vs-disabled-bg: var(--color-background-hover);
-  --vs-disabled-color: var(--color-text-maxcontrast);
-  --vs-disabled-cursor: not-allowed;
-  /* Borders */
-  --vs-border-color: var(--color-border-maxcontrast);
-  --vs-border-width: var(--border-width-input, 2px) !important;
-  --vs-border-style: solid;
-  --vs-border-radius: var(--border-radius-element);
-  /* Component Controls: Clear, Open Indicator */
-  --vs-controls-color: var(--color-main-text);
-  /* Selected */
-  --vs-selected-bg: var(--color-background-hover);
-  --vs-selected-color: var(--color-main-text);
-  --vs-selected-border-color: var(--vs-border-color);
-  --vs-selected-border-style: var(--vs-border-style);
-  --vs-selected-border-width: var(--vs-border-width);
-  /* Dropdown */
-  --vs-dropdown-bg: var(--color-main-background);
-  --vs-dropdown-color: var(--color-main-text);
-  --vs-dropdown-z-index: 9999;
-  --vs-dropdown-box-shadow: 0px 2px 2px 0px var(--color-box-shadow);
-  /* Options */
-  --vs-dropdown-option-padding: 8px 20px;
-  /* Active State */
-  --vs-dropdown-option--active-bg: var(--color-background-hover);
-  --vs-dropdown-option--active-color: var(--color-main-text);
-  /* Keyboard Focus State */
-  --vs-dropdown-option--kb-focus-box-shadow: inset 0px 0px 0px 2px var(--vs-border-color);
-  /* Deselect State */
-  --vs-dropdown-option--deselect-bg: var(--color-error);
-  --vs-dropdown-option--deselect-color: #fff;
-  /* Transitions */
-  --vs-transition-duration: 0ms;
-  /* Actions */
-  --vs-actions-padding: 0 8px 0 4px;
-}
-.v-select.select {
-  /* Override default vue-select styles */
-  min-height: calc(var(--default-clickable-area) - 2 * var(--border-width-input));
-  min-width: 260px;
-  margin: 0 0 var(--default-grid-baseline);
-}
-.v-select.select.vs--open {
-  --vs-border-width: var(--border-width-input-focused, 2px);
-}
-.v-select.select .select__label {
-  display: block;
-  margin-bottom: 2px;
-}
-.v-select.select .vs__selected {
-  height: calc(var(--default-clickable-area) - 2 * var(--vs-border-width) - var(--default-grid-baseline));
-  margin: calc(var(--default-grid-baseline) / 2);
-  padding-block: 0;
-  padding-inline: 12px 8px;
-  border-radius: 16px !important;
-  background: var(--color-primary-element-light);
-  border: none;
-}
-.v-select.select.vs--open .vs__selected:first-of-type {
-  margin-inline-start: calc(var(--default-grid-baseline) / 2 - (var(--border-width-input-focused, 2px) - var(--border-width-input, 2px))) !important;
-}
-.v-select.select .vs__search {
-  text-overflow: ellipsis;
-  color: var(--color-main-text);
-  min-height: unset !important;
-  height: calc(var(--default-clickable-area) - 2 * var(--vs-border-width)) !important;
-}
-.v-select.select .vs__search::placeholder {
-  color: var(--color-text-maxcontrast);
-}
-.v-select.select .vs__search, .v-select.select .vs__search:focus {
-  margin: 0;
-}
-.v-select.select .vs__dropdown-toggle {
-  position: relative;
-  max-height: 100px;
-  padding: var(--border-width-input);
-  overflow-y: auto;
-}
-.v-select.select .vs__actions {
-  position: sticky;
-  top: 0;
-}
-.v-select.select .vs__clear {
-  margin-inline-end: 2px;
-}
-.v-select.select.vs--open .vs__dropdown-toggle {
-  border-color: var(--color-main-text);
-  border-bottom-color: transparent;
-  border-bottom-left-radius: 0;
-  border-bottom-right-radius: 0;
-  border-style: solid;
-  border-width: var(--border-width-input-focused);
-  outline: 2px solid var(--color-main-background);
-  padding: 0;
-}
-.v-select.select:not(.vs--disabled, .vs--open) .vs__dropdown-toggle:active,
-.v-select.select:not(.vs--disabled, .vs--open) .vs__dropdown-toggle:focus-within {
-  outline: 2px solid var(--color-main-background);
-  border-color: var(--color-main-text);
-}
-.v-select.select.vs--disabled .vs__search,
-.v-select.select.vs--disabled .vs__selected {
-  color: var(--color-text-maxcontrast);
-}
-.v-select.select.vs--disabled .vs__clear,
-.v-select.select.vs--disabled .vs__deselect {
-  display: none;
-}
-.v-select.select--no-wrap .vs__selected-options {
-  flex-wrap: nowrap;
-  overflow: auto;
-  min-width: unset;
-}
-.v-select.select--no-wrap .vs__selected-options .vs__selected {
-  min-width: unset;
-}
-.v-select.select--drop-up.vs--open .vs__dropdown-toggle {
-  border-radius: 0 0 var(--vs-border-radius) var(--vs-border-radius);
-  border-top-color: transparent;
-  border-bottom-color: var(--color-main-text);
-}
-.v-select.select .vs__selected-options {
-  min-height: calc(var(--default-clickable-area) - 2 * var(--vs-border-width));
-}
-.v-select.select .vs__selected-options .vs__selected ~ .vs__search[readonly] {
-  position: absolute;
-}
-.v-select.select .vs__selected-options {
-  padding: 0 5px;
-}
-.v-select.select.vs--single.vs--loading .vs__selected, .v-select.select.vs--single.vs--open .vs__selected {
-  max-width: 100%;
-  opacity: 1;
-  color: var(--color-text-maxcontrast);
-}
-.v-select.select.vs--single .vs__selected-options {
-  flex-wrap: nowrap;
-}
-.v-select.select.vs--single .vs__selected {
-  background: unset !important;
-}
-.vs__dropdown-toggle {
-  --input-border-box-shadow-light: 0 -1px var(--vs-border-color),
-  	0 0 0 1px color-mix(in srgb, var(--vs-border-color), 65% transparent);
-  --input-border-box-shadow-dark: 0 1px var(--vs-border-color),
-  	0 0 0 1px color-mix(in srgb, var(--vs-border-color), 65% transparent);
-  --input-border-box-shadow: var(--input-border-box-shadow-light);
-  border: none;
-  border-radius: var(--border-radius-element);
-  box-shadow: var(--input-border-box-shadow);
-}
-.vs__dropdown-toggle:hover:not([disabled]) {
-  box-shadow: 0 0 0 1px var(--vs-border-color);
-}
-@media (prefers-color-scheme: dark) {
-.vs__dropdown-toggle .vs__dropdown-toggle {
-    --input-border-box-shadow: var(--input-border-box-shadow-dark);
-}
-}
-[data-theme-dark] .vs__dropdown-toggle {
-  --input-border-box-shadow: var(--input-border-box-shadow-dark);
-}
-[data-theme-light] .vs__dropdown-toggle {
-  --input-border-box-shadow: var(--input-border-box-shadow-light);
-}
-.select--legacy .vs__dropdown-toggle {
-  box-shadow: 0 0 0 1px var(--vs-border-color);
-}
-.select--legacy .vs__dropdown-toggle:hover:not([disabled]) {
-  box-shadow: 0 0 0 2px var(--vs-border-color);
-}
-.vs__dropdown-menu {
-  border-width: var(--border-width-input-focused) !important;
-  border-color: var(--color-main-text) !important;
-  outline: none !important;
-  box-shadow: -2px 0 0 var(--color-main-background), 0 2px 0 var(--color-main-background), 2px 0 0 var(--color-main-background), !important;
-  padding: 4px !important;
-}
-.vs__dropdown-menu--floating {
-  /* Fallback styles overidden by programmatically set inline styles */
-  width: max-content;
-  position: absolute;
-  top: 0;
-  inset-inline-start: 0;
-}
-.vs__dropdown-menu--floating-placement-top {
-  border-radius: var(--vs-border-radius) var(--vs-border-radius) 0 0 !important;
-  border-top-style: var(--vs-border-style) !important;
-  border-bottom-style: none !important;
-  box-shadow: 0 -2px 0 var(--color-main-background), -2px 0 0 var(--color-main-background), 2px 0 0 var(--color-main-background), !important;
-}
-.vs__dropdown-menu .vs__dropdown-option {
-  border-radius: 6px !important;
-}
-.vs__dropdown-menu .vs__no-options {
-  color: var(--color-text-maxcontrast) !important;
-}

package/dist/assets/NcSelectUsers-YF5729PJ.css

@@ -1,4 +0,0 @@
-
-.nc-select-users[data-v-e8e18fd3] .vs__selected {
-	padding-inline: 0 5px !important;
-}

package/dist/chunks/ArrowRight-B1ncAhus.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"ArrowRight-B1ncAhus.mjs","sources":["../../node_modules/vue-material-design-icons/ArrowRight.vue"],"sourcesContent":["<template>\n  <span v-bind=\"$attrs\"\n        :aria-hidden=\"title ? null : 'true'\"\n        :aria-label=\"title\"\n        class=\"material-design-icon arrow-right-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=\"M4,11V13H16L10.5,18.5L11.92,19.92L19.84,12L11.92,4.08L10.5,5.5L16,11H4Z\">\n        <title v-if=\"title\">{{ title }}</title>\n      </path>\n    </svg>\n  </span>\n</template>\n\n<script>\nexport default {\n  name: \"ArrowRightIcon\",\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>"],"names":["_createElementBlock","_mergeProps","_createElementVNode","_openBlock"],"mappings":";;AAoBA,MAAK,YAAU;AAAA,EACb,MAAM;AAAA,EACN,OAAO,CAAC,OAAO;AAAA,EACf,OAAO;AAAA,IACL,OAAO;AAAA,MACL,MAAM;AAAA;IAER,WAAW;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA;IAEX,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,EACF;AACF;;;AAxBY,MAAA,aAAA,EAAA,GAAE,0EAAyE;;;sBAXrFA,mBAeO,QAfPC,WAAc,KAAA,QAAM;AAAA,IACb,eAAa,OAAA,QAAK,OAAA;AAAA,IAClB,cAAY,OAAA;AAAA,IACb,OAAM;AAAA,IACN,MAAK;AAAA,IACJ,SAAK,OAAA,CAAA,MAAA,OAAA,CAAA,IAAA,YAAE,KAAA,MAAK,SAAU,MAAM;AAAA;kBACjCD,mBAQM,OAAA;AAAA,MARA,MAAM,OAAA;AAAA,MACP,OAAM;AAAA,MACL,OAAO,OAAA;AAAA,MACP,QAAQ,OAAA;AAAA,MACT,SAAQ;AAAA;MACXE,mBAEO,QAFP,YAEO;AAAA,QADQ,OAAA,SAAbC,UAAA,GAAAH,mBAAuC,qCAAhB,OAAA,KAAK,GAAA,CAAA;;;;;;","x_google_ignoreList":[0]}

package/dist/chunks/ChevronDown-C6gc637b.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"ChevronDown-C6gc637b.mjs","sources":["../../node_modules/vue-material-design-icons/ChevronDown.vue"],"sourcesContent":["<template>\n  <span v-bind=\"$attrs\"\n        :aria-hidden=\"title ? null : 'true'\"\n        :aria-label=\"title\"\n        class=\"material-design-icon chevron-down-icon\"\n        role=\"img\"\n        @click=\"$emit('click', $event)\">\n    <svg :fill=\"fillColor\"\n         class=\"material-design-icon__svg\"\n         :width=\"size\"\n         :height=\"size\"\n         viewBox=\"0 0 24 24\">\n      <path d=\"M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z\">\n        <title v-if=\"title\">{{ title }}</title>\n      </path>\n    </svg>\n  </span>\n</template>\n\n<script>\nexport default {\n  name: \"ChevronDownIcon\",\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>"],"names":["_createElementBlock","_mergeProps","_createElementVNode","_openBlock"],"mappings":";;AAoBA,MAAK,YAAU;AAAA,EACb,MAAM;AAAA,EACN,OAAO,CAAC,OAAO;AAAA,EACf,OAAO;AAAA,IACL,OAAO;AAAA,MACL,MAAM;AAAA;IAER,WAAW;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA;IAEX,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,EACF;AACF;;;AAxBY,MAAA,aAAA,EAAA,GAAE,6DAA4D;;;sBAXxEA,mBAeO,QAfPC,WAAc,KAAA,QAAM;AAAA,IACb,eAAa,OAAA,QAAK,OAAA;AAAA,IAClB,cAAY,OAAA;AAAA,IACb,OAAM;AAAA,IACN,MAAK;AAAA,IACJ,SAAK,OAAA,CAAA,MAAA,OAAA,CAAA,IAAA,YAAE,KAAA,MAAK,SAAU,MAAM;AAAA;kBACjCD,mBAQM,OAAA;AAAA,MARA,MAAM,OAAA;AAAA,MACP,OAAM;AAAA,MACL,OAAO,OAAA;AAAA,MACP,QAAQ,OAAA;AAAA,MACT,SAAQ;AAAA;MACXE,mBAEO,QAFP,YAEO;AAAA,QADQ,OAAA,SAAbC,UAAA,GAAAH,mBAAuC,qCAAhB,OAAA,KAAK,GAAA,CAAA;;;;;;","x_google_ignoreList":[0]}

package/dist/chunks/ChevronUp-ChH8oB7p.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"ChevronUp-ChH8oB7p.mjs","sources":["../../node_modules/vue-material-design-icons/ChevronUp.vue"],"sourcesContent":["<template>\n  <span v-bind=\"$attrs\"\n        :aria-hidden=\"title ? null : 'true'\"\n        :aria-label=\"title\"\n        class=\"material-design-icon chevron-up-icon\"\n        role=\"img\"\n        @click=\"$emit('click', $event)\">\n    <svg :fill=\"fillColor\"\n         class=\"material-design-icon__svg\"\n         :width=\"size\"\n         :height=\"size\"\n         viewBox=\"0 0 24 24\">\n      <path d=\"M7.41,15.41L12,10.83L16.59,15.41L18,14L12,8L6,14L7.41,15.41Z\">\n        <title v-if=\"title\">{{ title }}</title>\n      </path>\n    </svg>\n  </span>\n</template>\n\n<script>\nexport default {\n  name: \"ChevronUpIcon\",\n  emits: ['click'],\n  props: {\n    title: {\n      type: String,\n    },\n    fillColor: {\n      type: String,\n      default: \"currentColor\"\n    },\n    size: {\n      type: Number,\n      default: 24\n    }\n  }\n}\n</script>"],"names":["_createElementBlock","_mergeProps","_createElementVNode","_openBlock"],"mappings":";;AAoBA,MAAK,YAAU;AAAA,EACb,MAAM;AAAA,EACN,OAAO,CAAC,OAAO;AAAA,EACf,OAAO;AAAA,IACL,OAAO;AAAA,MACL,MAAM;AAAA;IAER,WAAW;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA;IAEX,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,EACF;AACF;;;AAxBY,MAAA,aAAA,EAAA,GAAE,+DAA8D;;;sBAX1EA,mBAeO,QAfPC,WAAc,KAAA,QAAM;AAAA,IACb,eAAa,OAAA,QAAK,OAAA;AAAA,IAClB,cAAY,OAAA;AAAA,IACb,OAAM;AAAA,IACN,MAAK;AAAA,IACJ,SAAK,OAAA,CAAA,MAAA,OAAA,CAAA,IAAA,YAAE,KAAA,MAAK,SAAU,MAAM;AAAA;kBACjCD,mBAQM,OAAA;AAAA,MARA,MAAM,OAAA;AAAA,MACP,OAAM;AAAA,MACL,OAAO,OAAA;AAAA,MACP,QAAQ,OAAA;AAAA,MACT,SAAQ;AAAA;MACXE,mBAEO,QAFP,YAEO;AAAA,QADQ,OAAA,SAAbC,UAAA,GAAAH,mBAAuC,qCAAhB,OAAA,KAAK,GAAA,CAAA;;;;;;","x_google_ignoreList":[0]}

package/dist/chunks/Close-CuhcJnX2.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"Close-CuhcJnX2.mjs","sources":["../../node_modules/vue-material-design-icons/Close.vue"],"sourcesContent":["<template>\n  <span v-bind=\"$attrs\"\n        :aria-hidden=\"title ? null : 'true'\"\n        :aria-label=\"title\"\n        class=\"material-design-icon close-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,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z\">\n        <title v-if=\"title\">{{ title }}</title>\n      </path>\n    </svg>\n  </span>\n</template>\n\n<script>\nexport default {\n  name: \"CloseIcon\",\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>"],"names":["_createElementBlock","_mergeProps","_createElementVNode","_openBlock"],"mappings":";;AAoBA,MAAK,YAAU;AAAA,EACb,MAAM;AAAA,EACN,OAAO,CAAC,OAAO;AAAA,EACf,OAAO;AAAA,IACL,OAAO;AAAA,MACL,MAAM;AAAA;IAER,WAAW;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA;IAEX,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,EACF;AACF;;;AAxBY,MAAA,aAAA,EAAA,GAAE,gHAA+G;;;sBAX3HA,mBAeO,QAfPC,WAAc,KAAA,QAAM;AAAA,IACb,eAAa,OAAA,QAAK,OAAA;AAAA,IAClB,cAAY,OAAA;AAAA,IACb,OAAM;AAAA,IACN,MAAK;AAAA,IACJ,SAAK,OAAA,CAAA,MAAA,OAAA,CAAA,IAAA,YAAE,KAAA,MAAK,SAAU,MAAM;AAAA;kBACjCD,mBAQM,OAAA;AAAA,MARA,MAAM,OAAA;AAAA,MACP,OAAM;AAAA,MACL,OAAO,OAAA;AAAA,MACP,QAAQ,OAAA;AAAA,MACT,SAAQ;AAAA;MACXE,mBAEO,QAFP,YAEO;AAAA,QADQ,OAAA,SAAbC,UAAA,GAAAH,mBAAuC,qCAAhB,OAAA,KAAK,GAAA,CAAA;;;;;;","x_google_ignoreList":[0]}

package/dist/chunks/NcActionButton-BO5T5ePT.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NcActionButton-BO5T5ePT.mjs","sources":["../../src/components/NcActionButton/NcActionButton.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\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<NcActions>\n\t\t\t<NcActionButton @click=\"showMessage('Delete')\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconTrashCanOutline :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tDelete\n\t\t\t</NcActionButton>\n\t\t\t<NcActionButton :close-after-click=\"true\" @click=\"showMessage('Delete and close menu')\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconTrashCanOutline :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tDelete and close\n\t\t\t</NcActionButton>\n\t\t\t<NcActionButton :is-menu=\"true\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconPlus :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tCreate\n\t\t\t</NcActionButton>\n\t\t\t<NcActionButton :disabled=\"true\" @click=\"showMessage('Disabled')\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconTrashCanOutline :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tDisabled button\n\t\t\t</NcActionButton>\n\t\t</NcActions>\n\t</template>\n\t<script>\n\timport IconTrashCanOutline from 'vue-material-design-icons/TrashCanOutline.vue'\n\timport IconPlus from 'vue-material-design-icons/Plus.vue'\n\n\texport default {\n\t\tcomponents: {\n\t\t\tIconTrashCanOutline,\n\t\t\tIconPlus,\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\nIf you're using a long text, you can specify a `name` prop.\n\nFor the same purpose, but in a more compact way, `description` prop can be used.\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<IconPlus :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<IconTrashCanOutline :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\t<NcActionButton description=\"Subline description for the button\" @click=\"showMessage('Edit')\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconPencilOutline :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tEdit\n\t\t\t</NcActionButton>\n\t\t</NcActions>\n\t</template>\n\t<script>\n\timport IconTrashCanOutline from 'vue-material-design-icons/TrashCanOutline.vue'\n\timport IconPencilOutline from 'vue-material-design-icons/PencilOutline.vue'\n\timport IconPlus from 'vue-material-design-icons/Plus.vue'\n\n\texport default {\n\t\tcomponents: {\n\t\t\tIconTrashCanOutline,\n\t\t\tIconPencilOutline,\n\t\t\tIconPlus,\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<IconPlus :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 IconPlus from 'vue-material-design-icons/Plus.vue'\n\n\texport default {\n\t\tcomponents: {\n\t\t\tIconPlus,\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<IconHandBackLeftOutline :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<IconHandBackRightOutline :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 IconHandBackLeftOutline from 'vue-material-design-icons/HandBackLeftOutline.vue'\nimport IconHandBackRightOutline from 'vue-material-design-icons/HandBackRightOutline.vue'\n\nexport default {\n\tcomponents: {\n\t\tIconHandBackLeftOutline,\n\t\tIconHandBackRightOutline,\n\t},\n}\n</script>\n```\n\n### With different model behavior\nBy default the button will act like a normal button, but it is also possible to change the behavior to a toggle button, checkbox button or radio button.\n\nFor example to have the button act like a toggle button just set the `modelValue` property to the toggle state:\n\n```vue\n<template>\n\t<NcActions>\n\t\t<NcActionButton v-model=\"fullscreen\">\n\t\t\t<template #icon>\n\t\t\t\t<IconFullscreen :size=\"20\" />\n\t\t\t</template>\n\t\t\tFullscreen\n\t\t</NcActionButton>\n\t</NcActions>\n</template>\n<script>\nimport IconFullscreen from 'vue-material-design-icons/Fullscreen.vue'\n\nexport default {\n\tcomponents: {\n\t\tIconFullscreen,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tfullscreen: true,\n\t\t}\n\t},\n}\n</script>\n```\n\nAnother example would be using it with checkbox semantics, to enable or disable features.\nThis also allows tri-state behavior (`true`, `false`, `null`) in which case `aria-checked` will be either `true`, `false` or `mixed`.\n\n```vue\n<template>\n\t<NcActions>\n\t\t<NcActionButton v-model=\"handRaised\" type=\"checkbox\">\n\t\t\t<template #icon>\n\t\t\t\t<IconHandBackLeftOutline :size=\"20\" />\n\t\t\t</template>\n\t\t\tRaise hand\n\t\t</NcActionButton>\n\t\t<NcActionButton v-model=\"fullscreen\" type=\"checkbox\">\n\t\t\t<template #icon>\n\t\t\t\t<IconFullscreen :size=\"20\" />\n\t\t\t</template>\n\t\t\tFullscreen\n\t\t</NcActionButton>\n\t</NcActions>\n</template>\n<script>\nimport IconHandBackLeftOutline from 'vue-material-design-icons/HandBackLeftOutline.vue'\nimport IconFullscreen from 'vue-material-design-icons/Fullscreen.vue'\n\nexport default {\n\tcomponents: {\n\t\tIconHandBackLeftOutline,\n\t\tIconFullscreen,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tfullscreen: true,\n\t\t\thandRaised: false,\n\t\t}\n\t},\n}\n</script>\n```\n\nIt is also possible to use the button with radio semantics, this is only possible in menus and not for inline actions!\n\nWith a string `modelValue`, checked state is determined by the `value` property and updates `modelValue` with the new `value` string.\n\nWith a boolean `modelValue`, checked state is determined by `modelValue` and updates to `true` on check.\n\nNote: unlike native radio buttons, `NcActionButton` are not grouped by name, so you need to connect them by bind correct `modelValue``.\n\n```vue\n<template>\n\t<div>\n\t\t<NcActions>\n\t\t\t<NcActionButton v-model=\"payment\" type=\"radio\" value=\"cash\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconCash :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tPay with cash\n\t\t\t</NcActionButton>\n\t\t\t<NcActionButton v-model=\"payment\" type=\"radio\" value=\"card\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconCreditCardOutline :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tPay by card\n\t\t\t</NcActionButton>\n\t\t\t<NcActionSeparator />\n\t\t\t<NcActionButton type=\"radio\" :model-value=\"align.isLeft\" @update:modelValue=\"setAlign('Left', $event)\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconFormatAlignLeft :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tLeft\n\t\t\t</NcActionButton>\n\t\t\t<NcActionButton type=\"radio\" :model-value=\"align.isCenter\" @update:modelValue=\"setAlign('Center', $event)\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconFormatAlignCenter :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tCenter\n\t\t\t</NcActionButton>\n\t\t\t<NcActionButton type=\"radio\" :model-value=\"align.isRight\" @update:modelValue=\"setAlign('Right', $event)\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconFormatAlignRight :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tRight\n\t\t\t</NcActionButton>\n\t\t</NcActions>\n\t\t<p>payment = \"{{ payment }}\"</p>\n\t\t<p>align.isLeft = {{ align.isLeft }}</p>\n\t\t<p>align.isCenter = {{ align.isCenter }}</p>\n\t\t<p>align.isRight = {{ align.isRight }}</p>\n\t</div>\n</template>\n<script>\nimport IconCash from 'vue-material-design-icons/Cash.vue'\nimport IconCreditCardOutline from 'vue-material-design-icons/CreditCardOutline.vue'\nimport IconFormatAlignLeft from 'vue-material-design-icons/FormatAlignLeft.vue'\nimport IconFormatAlignCenter from 'vue-material-design-icons/FormatAlignCenter.vue'\nimport IconFormatAlignRight from 'vue-material-design-icons/FormatAlignRight.vue'\n\nexport default {\n\tcomponents: {\n\t\tIconCash,\n\t\tIconCreditCardOutline,\n\t\tIconFormatAlignLeft,\n\t\tIconFormatAlignCenter,\n\t\tIconFormatAlignRight,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tpayment: 'card',\n\t\t\talign: {\n\t\t\t\tisLeft: false,\n\t\t\t\tisCenter: true,\n\t\t\t\tisRight: false,\n\t\t\t},\n\t\t}\n\t},\n\tmethods: {\n\t\tsetAlign(direction, value) {\n\t\t\tthis.align.isLeft = false\n\t\t\tthis.align.isCenter = false\n\t\t\tthis.align.isRight = false\n\t\t\tthis.align[`is${direction}`] = value\n\t\t},\n\t}\n}\n</script>\n```\n</docs>\n\n<template>\n\t<li class=\"action\" :class=\"{ 'action--disabled': disabled }\" :role=\"isInSemanticMenu && 'presentation'\">\n\t\t<button\n\t\t\t:aria-label=\"ariaLabel\"\n\t\t\tclass=\"action-button button-vue\"\n\t\t\t:class=\"{\n\t\t\t\t'action-button--active': isChecked,\n\t\t\t\tfocusable: isFocusable,\n\t\t\t}\"\n\t\t\t:disabled=\"disabled\"\n\t\t\t:title=\"title\"\n\t\t\t:type=\"nativeType\"\n\t\t\tv-bind=\"buttonAttributes\"\n\t\t\t@click=\"handleClick\">\n\t\t\t<!-- @slot Manually provide icon -->\n\t\t\t<slot name=\"icon\">\n\t\t\t\t<span\n\t\t\t\t\t:class=\"[isIconUrl ? 'action-button__icon--url' : icon]\"\n\t\t\t\t\t:style=\"{ backgroundImage: isIconUrl ? `url(${icon})` : null }\"\n\t\t\t\t\taria-hidden=\"true\"\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<span class=\"action-button__longtext-wrapper\">\n\t\t\t\t<strong\n\t\t\t\t\tv-if=\"name\"\n\t\t\t\t\tclass=\"action-button__name\">\n\t\t\t\t\t{{ name }}\n\t\t\t\t</strong>\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\n\t\t\t\t\tv-if=\"isLongText\"\n\t\t\t\t\tclass=\"action-button__longtext\"\n\t\t\t\t\tv-text=\"text\" />\n\t\t\t\t<!-- default text display -->\n\t\t\t\t<span\n\t\t\t\t\tv-else\n\t\t\t\t\tclass=\"action-button__text\">\n\t\t\t\t\t{{ text }}\n\t\t\t\t</span>\n\t\t\t\t<span\n\t\t\t\t\tv-if=\"description\"\n\t\t\t\t\tclass=\"action-button__description\"\n\t\t\t\t\tv-text=\"description\" />\n\t\t\t</span>\n\n\t\t\t<!-- right(in LTR) or left(in RTL) arrow icon when there is a sub-menu -->\n\t\t\t<NcIconSvgWrapper\n\t\t\t\tv-if=\"isMenu\"\n\t\t\t\tclass=\"action-button__menu-icon\"\n\t\t\t\tdirectional\n\t\t\t\t:path=\"mdiChevronRight\" />\n\t\t\t<NcIconSvgWrapper v-else-if=\"isChecked\" :path=\"mdiCheck\" class=\"action-button__pressed-icon\" />\n\n\t\t\t<span v-else-if=\"isChecked === false\" class=\"action-button__pressed-icon material-design-icon\" />\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 { mdiCheck, mdiChevronRight } from '@mdi/js'\nimport NcIconSvgWrapper from '../NcIconSvgWrapper/NcIconSvgWrapper.vue'\nimport ActionTextMixin from '../../mixins/actionText.js'\nimport { NC_ACTIONS_IS_SEMANTIC_MENU } from '../NcActions/useNcActions.ts'\n\n/**\n * Button component to be used in Actions\n */\nexport default {\n\tname: 'NcActionButton',\n\n\tcomponents: {\n\t\tNcIconSvgWrapper,\n\t},\n\n\tmixins: [ActionTextMixin],\n\n\tinject: {\n\t\tisInSemanticMenu: {\n\t\t\tfrom: NC_ACTIONS_IS_SEMANTIC_MENU,\n\t\t\tdefault: false,\n\t\t},\n\t},\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\n\t\t/**\n\t\t * If this is a menu, a chevron icon will\n\t\t * be added at the end of the line\n\t\t */\n\t\tisMenu: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * The button's behavior, by default the button acts like a normal button with optional toggle button behavior if `modelValue` is `true` or `false`.\n\t\t * But you can also set to checkbox button behavior with tri-state or radio button like behavior.\n\t\t * This extends the native HTML button type attribute.\n\t\t */\n\t\ttype: {\n\t\t\ttype: String,\n\t\t\tdefault: 'button',\n\t\t\tvalidator: (behavior) => ['button', 'checkbox', 'radio', 'reset', 'submit'].includes(behavior),\n\t\t},\n\n\t\t/**\n\t\t * The buttons state if `type` is 'checkbox' or 'radio' (meaning if it is pressed / selected).\n\t\t * For checkbox and toggle button behavior - boolean value.\n\t\t * For radio button behavior - could be a boolean checked or a string with the value of the button.\n\t\t * Note: Unlike native radio buttons, NcActionButton are not grouped by name, so you need to connect them by bind correct modelValue.\n\t\t *\n\t\t *  **This is not availabe for `type='submit'` or `type='reset'`**\n\t\t *\n\t\t * If using `type='checkbox'` a `model-value` of `true` means checked, `false` means unchecked and `null` means indeterminate (tri-state)\n\t\t * For `type='radio'` `null` is equal to `false`\n\t\t */\n\t\tmodelValue: {\n\t\t\ttype: [Boolean, String],\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * The value used for the `modelValue` when this component is used with radio behavior\n\t\t * Similar to the `value` attribute of `<input type=\"radio\">`\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 * Small underlying text content of the entry\n\t\t */\n\t\tdescription: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\t},\n\n\temits: ['update:modelValue'],\n\n\tsetup() {\n\t\treturn {\n\t\t\tmdiCheck,\n\t\t\tmdiChevronRight,\n\t\t}\n\t},\n\n\tcomputed: {\n\t\t/**\n\t\t * determines if the action is focusable\n\t\t *\n\t\t * @return {boolean} is the action focusable ?\n\t\t */\n\t\tisFocusable() {\n\t\t\treturn !this.disabled\n\t\t},\n\n\t\t/**\n\t\t * The current \"checked\" or \"pressed\" state for the model behavior\n\t\t */\n\t\tisChecked() {\n\t\t\tif (this.type === 'radio' && typeof this.modelValue !== 'boolean') {\n\t\t\t\treturn this.modelValue === this.value\n\t\t\t}\n\t\t\treturn this.modelValue\n\t\t},\n\n\t\t/**\n\t\t * The native HTML type to set on the button\n\t\t */\n\t\tnativeType() {\n\t\t\tif (this.type === 'submit' || this.type === 'reset') {\n\t\t\t\treturn this.type\n\t\t\t}\n\t\t\treturn 'button'\n\t\t},\n\n\t\t/**\n\t\t * HTML attributes to bind to the <button>\n\t\t */\n\t\tbuttonAttributes() {\n\t\t\tconst attributes = {}\n\n\t\t\tif (this.isInSemanticMenu) {\n\t\t\t\t// By default it needs to be a menu item in semantic menus\n\t\t\t\tattributes.role = 'menuitem'\n\n\t\t\t\tif (this.type === 'radio') {\n\t\t\t\t\tattributes.role = 'menuitemradio'\n\t\t\t\t\tattributes['aria-checked'] = this.isChecked ? 'true' : 'false'\n\t\t\t\t} else if (this.type === 'checkbox' || (this.nativeType === 'button' && this.modelValue !== null)) {\n\t\t\t\t\t// either if checkbox behavior was set or the model value is not unset\n\t\t\t\t\tattributes.role = 'menuitemcheckbox'\n\t\t\t\t\tattributes['aria-checked'] = this.modelValue === null ? 'mixed' : (this.modelValue ? 'true' : 'false')\n\t\t\t\t}\n\t\t\t} else if (this.modelValue !== null && this.nativeType === 'button') {\n\t\t\t\t// In case this has a modelValue it is considered a toggle button, so we need to set the aria-pressed\n\t\t\t\tattributes['aria-pressed'] = this.modelValue ? 'true' : 'false'\n\t\t\t}\n\n\t\t\treturn attributes\n\t\t},\n\t},\n\n\tmethods: {\n\t\t/**\n\t\t * Forward click event, let mixin handle the close-after-click and emit new modelValue if needed\n\t\t *\n\t\t * @param {MouseEvent} event - The click event\n\t\t */\n\t\thandleClick(event) {\n\t\t\tthis.onClick(event)\n\t\t\t// If modelValue or type is set (so modelValue might be null for tri-state) we need to update it\n\t\t\tif (this.modelValue !== null || this.type !== 'button') {\n\t\t\t\tif (this.type === 'radio') {\n\t\t\t\t\tif (typeof this.modelValue !== 'boolean') {\n\t\t\t\t\t\t// String-value radios behavior is similar to native - click on checked radio does nothing\n\t\t\t\t\t\tif (!this.isChecked) {\n\t\t\t\t\t\t\tthis.$emit('update:modelValue', this.value)\n\t\t\t\t\t\t}\n\t\t\t\t\t} else {\n\t\t\t\t\t\t// Boolean radio allows to uncheck\n\t\t\t\t\t\tthis.$emit('update:modelValue', !this.isChecked)\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\t// Checkbox toggles value\n\t\t\t\t\tthis.$emit('update:modelValue', !this.isChecked)\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n@use '../../assets/action.scss' as *;\n@include action-active;\n@include action--disabled;\n@include action-item('button');\n\n.action-button {\n\t&__pressed-icon {\n\t\tmargin-inline: auto calc($icon-margin * -1);\n\t}\n\n\t* {\n\t\tcursor: pointer;\n\t}\n}\n</style>\n"],"names":["_createElementBlock","_normalizeClass","_createElementVNode","_mergeProps","_renderSlot","_normalizeStyle","_toDisplayString","_createBlock","_openBlock"],"mappings":"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"}