@nextcloud/vue 9.0.0-alpha.7 → 9.0.0-rc.0

package/dist/chunks/{NcSettingsSelectGroup-CKIbxms2.mjs → NcSettingsSelectGroup-B8uq0KIw.mjs}

@@ -1,13 +1,13 @@
-import '../assets/NcSettingsSelectGroup-DhyosmOr.css';
-import { N as NcSelect } from "./NcSelect-B61ik8an.mjs";
-import { r as register, f as t46, a as t } from "./_l10n-BEP_UzXI.mjs";
-import { G as GenRandomId } from "./GenRandomId-CMooMQt0.mjs";
+import '../assets/NcSettingsSelectGroup-DZcNr_Dq.css';
+import { N as NcSelect } from "./NcSelect-BkTH-Yqm.mjs";
+import { r as register, f as t45, a as t } from "./_l10n-BNGeEX3W.mjs";
+import { c as createElementId } from "./createElementId-DhjFt1I9.mjs";
 import axios from "@nextcloud/axios";
 import debounce from "debounce";
 import { generateOcsUrl } from "@nextcloud/router";
 import { resolveComponent, createElementBlock, openBlock, createCommentVNode, createVNode, withDirectives, toDisplayString, createElementVNode, vShow } from "vue";
 import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
-register(t46);
+register(t45);
 const _sfc_main = {
   name: "NcSettingsSelectGroup",
   components: {
@@ -34,7 +34,7 @@ const _sfc_main = {
      */
     id: {
       type: String,
-      default: () => "action-" + GenRandomId(),
+      default: () => "action-" + createElementId(),
       validator: (id) => id.trim() !== ""
     },
     /**
@@ -62,7 +62,7 @@ const _sfc_main = {
     return {
       /** Temporary store to cache groups */
       groups: {},
-      randId: GenRandomId(),
+      randId: createElementId(),
       errorMessage: ""
     };
   },
@@ -220,7 +220,8 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     ])
   ]);
 }
-const NcSettingsSelectGroup = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-e1833700"]]);
+const NcSettingsSelectGroup = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-073ed277"]]);
 export {
   NcSettingsSelectGroup as N
 };
+//# sourceMappingURL=NcSettingsSelectGroup-B8uq0KIw.mjs.map

package/dist/chunks/NcSettingsSelectGroup-B8uq0KIw.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"NcSettingsSelectGroup-B8uq0KIw.mjs","sources":["../../src/components/NcSettingsSelectGroup/NcSettingsSelectGroup.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n```vue\n<template>\n\t<section>\n\t\t<NcSettingsSelectGroup v-model=\"groups\" placeholder=\"Select user groups\" label=\"The hidden label\" />\n\t\t<NcSettingsSelectGroup v-model=\"otherGroups\" :disabled=\"true\" label=\"Also a fallback for the placeholder\" />\n\t\t<div>You have selected: <code>{{ groups }}</code> and <code>{{ otherGroups }}</code></div>\n\t</section>\n</template>\n<script>\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\tgroups: [],\n\t\t\totherGroups: ['admin']\n\t\t}\n\t}\n}\n</script>\n<style scoped>\nsection * {\n\tpadding: 6px 0px;\n}\n</style>\n```\n</docs>\n\n<template>\n\t<div>\n\t\t<label v-if=\"label\" :for=\"id\" class=\"hidden-visually\">{{ label }}</label>\n\t\t<NcSelect :model-value=\"inputValue\"\n\t\t\t:options=\"groupsArray\"\n\t\t\t:placeholder=\"placeholder || label\"\n\t\t\t:filter-by=\"filterGroups\"\n\t\t\t:input-id=\"id\"\n\t\t\t:limit=\"5\"\n\t\t\tlabel=\"displayname\"\n\t\t\t:multiple=\"true\"\n\t\t\t:close-on-select=\"false\"\n\t\t\t:disabled=\"disabled\"\n\t\t\t@update:model-value=\"update\"\n\t\t\t@search=\"onSearch\" />\n\t\t<div v-show=\"hasError\" class=\"select-group-error\">\n\t\t\t{{ errorMessage }}\n\t\t</div>\n\t</div>\n</template>\n\n<script>\nimport NcSelect from '../../components/NcSelect/index.js'\nimport { t } from '../../l10n.js'\nimport { createElementId } from '../../utils/createElementId.ts'\n\nimport axios from '@nextcloud/axios'\nimport debounce from 'debounce'\nimport { generateOcsUrl } from '@nextcloud/router'\n\nexport default {\n\tname: 'NcSettingsSelectGroup',\n\tcomponents: {\n\t\tNcSelect,\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * The text of the label element of the select group input\n\t\t */\n\t\tlabel: {\n\t\t\ttype: String,\n\t\t\trequired: true,\n\t\t},\n\n\t\t/**\n\t\t * Placeholder for the input element\n\t\t * For backwards compatibility it falls back to the `label` value\n\t\t */\n\t\tplaceholder: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * id attribute of the select group element\n\t\t */\n\t\tid: {\n\t\t\ttype: String,\n\t\t\tdefault: () => 'action-' + createElementId(),\n\t\t\tvalidator: id => id.trim() !== '',\n\t\t},\n\n\t\t/**\n\t\t * value of the select group input\n\t\t * A list of group IDs can be provided\n\t\t */\n\t\tmodelValue: {\n\t\t\ttype: Array,\n\t\t\tdefault: () => [],\n\t\t},\n\n\t\t/**\n\t\t * disabled state of the settings select group input\n\t\t */\n\t\tdisabled: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t},\n\temits: [\n\t\t'error',\n\t\t'input',\n\t\t'update:modelValue',\n\t],\n\tdata() {\n\t\treturn {\n\t\t\t/** Temporary store to cache groups */\n\t\t\tgroups: {},\n\t\t\trandId: createElementId(),\n\t\t\terrorMessage: '',\n\t\t}\n\t},\n\tcomputed: {\n\t\t/**\n\t\t * If the error message should be shown\n\t\t */\n\t\thasError() {\n\t\t\treturn this.errorMessage !== ''\n\t\t},\n\n\t\t/**\n\t\t * Validate input value and only return valid strings (group IDs)\n\t\t *\n\t\t * @return {string[]}\n\t\t */\n\t\tfilteredValue() {\n\t\t\treturn this.modelValue.filter((group) => group !== '' && typeof group === 'string')\n\t\t},\n\n\t\t/**\n\t\t * value property converted to an array of group objects used as input for the NcSelect\n\t\t */\n\t\tinputValue() {\n\t\t\treturn this.filteredValue.map(\n\t\t\t\t(id) => {\n\t\t\t\t\tif (typeof this.groups[id] === 'undefined') {\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\tid,\n\t\t\t\t\t\t\tdisplayname: id,\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\treturn this.groups[id]\n\t\t\t\t},\n\t\t\t)\n\t\t},\n\n\t\t/**\n\t\t * Convert groups object to array of groups required for NcSelect.options\n\t\t * Filter out currently selected values\n\t\t *\n\t\t * @return {object[]}\n\t\t */\n\t\tgroupsArray() {\n\t\t\treturn Object.values(this.groups).filter(g => !this.modelValue.includes(g.id))\n\t\t},\n\t},\n\twatch: {\n\t\t/**\n\t\t * If the value is changed, check that all groups are loaded so we show the correct display name\n\t\t */\n\t\tmodelValue: {\n\t\t\thandler() {\n\t\t\t\tconst loadedGroupIds = Object.keys(this.groups)\n\t\t\t\tconst missing = this.filteredValue.filter(group => !loadedGroupIds.includes(group))\n\t\t\t\tmissing.forEach((groupId) => {\n\t\t\t\t\tthis.loadGroup(groupId)\n\t\t\t\t})\n\t\t\t},\n\t\t\t// Run the watch handler also when the component is initially mounted\n\t\t\timmediate: true,\n\t\t},\n\t},\n\t/**\n\t * Load groups matching the empty query to reduce API calls\n\t */\n\tasync mounted() {\n\t\t// version scoped to prevent issues with different library versions\n\t\tconst storageName = `${appName}:${appVersion}/initialGroups`\n\n\t\tlet savedGroups = window.sessionStorage.getItem(storageName)\n\t\tif (savedGroups) {\n\t\t\tsavedGroups = Object.fromEntries(JSON.parse(savedGroups).map(group => [group.id, group]))\n\t\t\tthis.groups = { ...this.groups, ...savedGroups }\n\t\t} else {\n\t\t\tawait this.loadGroup('')\n\t\t\twindow.sessionStorage.setItem(storageName, JSON.stringify(Object.values(this.groups)))\n\t\t}\n\t},\n\tmethods: {\n\t\tt,\n\n\t\t/**\n\t\t * Called when a new group is selected or previous group is deselected to emit the update event\n\t\t *\n\t\t * @param {object[]} updatedValue Array of selected groups\n\t\t */\n\t\tupdate(updatedValue) {\n\t\t\tconst value = updatedValue.map((element) => element.id)\n\t\t\t/** Emitted when the groups selection changes<br />**Payload:** `value` (`Array`) - *Ids of selected groups */\n\t\t\tthis.$emit('update:modelValue', value)\n\t\t},\n\n\t\t/**\n\t\t * Use provisioning API to search for given group and save it in the groups object\n\t\t *\n\t\t * @param {string} query The query like parts of the id oder display name\n\t\t * @return {boolean}\n\t\t */\n\t\tasync loadGroup(query) {\n\t\t\ttry {\n\t\t\t\tquery = typeof query === 'string' ? encodeURI(query) : ''\n\t\t\t\tconst response = await axios.get(generateOcsUrl(`cloud/groups/details?search=${query}&limit=10`, 2))\n\n\t\t\t\t// No network error, so reset any error after 5 seconds\n\t\t\t\tif (this.errorMessage !== '') {\n\t\t\t\t\twindow.setTimeout(() => {\n\t\t\t\t\t\tthis.errorMessage = ''\n\t\t\t\t\t}, 5000)\n\t\t\t\t}\n\n\t\t\t\tif (Object.keys(response.data.ocs.data.groups).length > 0) {\n\t\t\t\t\tconst newGroups = Object.fromEntries(response.data.ocs.data.groups.map((element) => [element.id, element]))\n\t\t\t\t\tthis.groups = { ...this.groups, ...newGroups }\n\t\t\t\t\treturn true\n\t\t\t\t}\n\t\t\t} catch (error) {\n\t\t\t\t/** Emitted if groups could not be queried.<br />**Payload:** `error` (`object`) - The Axios error */\n\t\t\t\tthis.$emit('error', error)\n\t\t\t\tthis.errorMessage = t('Unable to search the group')\n\t\t\t}\n\t\t\treturn false\n\t\t},\n\n\t\t/**\n\t\t * Custom filter function for `NcSelect` to filter by ID *and* display name\n\t\t *\n\t\t * @param {object} option One of the groups\n\t\t * @param {string} label The label property of the group\n\t\t * @param {string} search The current search string\n\t\t */\n\t\tfilterGroups(option, label, search) {\n\t\t\treturn `${label || ''} ${option.id}`.toLocaleLowerCase().indexOf(search.toLocaleLowerCase()) > -1\n\t\t},\n\n\t\t/**\n\t\t * Debounce the group search (reduce API calls)\n\t\t */\n\t\tonSearch: debounce(function(query) {\n\t\t\tthis.loadGroup(query)\n\t\t}, 200),\n\t},\n}\n</script>\n\n<style scoped lang=\"scss\">\n.select-group-error {\n\tcolor: var(--color-error);\n\tfont-size: 13px;\n\tpadding-inline-start: var(--border-radius-large);\n}\n</style>\n"],"names":["_createElementBlock","_toDisplayString","_createCommentVNode","_createVNode","_withDirectives","_createElementVNode"],"mappings":"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"}

package/dist/chunks/{NcTextArea-C-PMlEbl.mjs → NcTextArea-DKHjCur8.mjs}

@@ -1,5 +1,5 @@
-import '../assets/NcTextArea-BfSGN55r.css';
-import { G as GenRandomId } from "./GenRandomId-CMooMQt0.mjs";
+import '../assets/NcTextArea-DHr9DPOJ.css';
+import { c as createElementId } from "./createElementId-DhjFt1I9.mjs";
 import { A as AlertCircle } from "./AlertCircleOutline-DVzpKQVu.mjs";
 import { C as Check } from "./Check-5i4xKnkl.mjs";
 import { resolveComponent, createElementBlock, openBlock, normalizeClass, createElementVNode, createCommentVNode, mergeProps, toDisplayString, createBlock, createTextVNode } from "vue";
@@ -105,7 +105,7 @@ const _sfc_main = {
       return this.$attrs.id && this.$attrs.id !== "" ? this.$attrs.id : this.inputName;
     },
     inputName() {
-      return "input" + GenRandomId();
+      return "input" + createElementId();
     },
     hasPlaceholder() {
       return this.placeholder !== "" && this.placeholder !== void 0;
@@ -210,7 +210,8 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     ], 10, _hoisted_4)) : createCommentVNode("", true)
   ], 2);
 }
-const NcTextArea = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-e0199889"]]);
+const NcTextArea = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-cc8bbaa7"]]);
 export {
   NcTextArea as N
 };
+//# sourceMappingURL=NcTextArea-DKHjCur8.mjs.map

package/dist/chunks/NcTextArea-DKHjCur8.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"NcTextArea-DKHjCur8.mjs","sources":["../../src/components/NcTextArea/NcTextArea.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n### Description\n\nThis component is a textarea field.\nIt extends and styles an HTMLTextAreaElement.\n\n```\n<template>\n\t<div class=\"wrapper\">\n\t\t<NcTextArea v-model=\"text\"\n\t\t\tlabel=\"Text area\"\n\t\t\tplaceholder=\"Placeholders are possible\"\n\t\t\thelper-text=\"This is a regular helper text.\" />\n\t\t<NcTextArea label=\"Success state\"\n\t\t\t:success=\"true\" />\n\t\t<NcTextArea label=\"Error state\"\n\t\t\tplaceholder=\"Enter something valid\"\n\t\t\thelper-text=\"Helper texts will be styled accordingly.\"\n\t\t\t:error=\"true\" />\n\t\t<NcTextArea label=\"Disabled\"\n\t\t\t:disabled=\"true\" />\n\t\t<NcTextArea label=\"Disabled + Success\"\n\t\t\t:success=\"true\"\n\t\t\t:disabled=\"true\" />\n\t\t<div class=\"external-label\">\n\t\t\t<label for=\"textField\">External label</label>\n\t\t\t<NcTextArea id=\"textField\"\n\t\t\t\t:label-outside=\"true\"\n\t\t\t\tplaceholder=\"Text area with external label\" />\n\t\t</div>\n\t\t<NcTextArea label=\"Custom size and no resize\"\n\t\t\tresize=\"none\"\n\t\t\trows=\"5\" />\n\t</div>\n</template>\n\n<script>\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\ttext: 'This is text.',\n\t\t}\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.wrapper {\n\tdisplay: flex;\n\tgap: 4px;\n\talign-items: flex-end;\n\tflex-wrap: wrap;\n}\n\n.external-label {\n\tdisplay: flex;\n\twidth: 100%;\n\talign-items: center;\n\tgap: 14px;\n\n\t> label {\n\t\tflex-shrink: 0;\n\t}\n}\n</style>\n```\n</docs>\n\n<template>\n\t<div class=\"textarea\" :class=\"{ 'textarea--disabled': disabled }\">\n\t\t<div class=\"textarea__main-wrapper\">\n\t\t\t<textarea v-bind=\"$attrs\"\n\t\t\t\t:id=\"computedId\"\n\t\t\t\tref=\"input\"\n\t\t\t\tclass=\"textarea__input\"\n\t\t\t\t:disabled=\"disabled\"\n\t\t\t\t:placeholder=\"computedPlaceholder\"\n\t\t\t\t:aria-describedby=\"ariaDescribedby\"\n\t\t\t\taria-live=\"polite\"\n\t\t\t\t:class=\"[inputClass,\n\t\t\t\t\t{\n\t\t\t\t\t\t'textarea__input--label-outside': labelOutside,\n\t\t\t\t\t\t'textarea__input--success': success,\n\t\t\t\t\t\t'textarea__input--error': error,\n\t\t\t\t\t}]\"\n\t\t\t\t:style=\"{ resize: resize }\"\n\t\t\t\t:value=\"modelValue\"\n\t\t\t\t@input=\"handleInput\" />\n\t\t\t<!-- Label -->\n\t\t\t<label v-if=\"!labelOutside && isValidLabel\"\n\t\t\t\tclass=\"textarea__label\"\n\t\t\t\t:for=\"computedId\">\n\t\t\t\t{{ label }}\n\t\t\t</label>\n\t\t</div>\n\t\t<p v-if=\"helperText.length > 0\"\n\t\t\t:id=\"`${inputName}-helper-text`\"\n\t\t\tclass=\"textarea__helper-text-message\"\n\t\t\t:class=\"{\n\t\t\t\t'textarea__helper-text-message--error': error,\n\t\t\t\t'textarea__helper-text-message--success': success,\n\t\t\t}\">\n\t\t\t<Check v-if=\"success\" class=\"textarea__helper-text-message__icon\" :size=\"18\" />\n\t\t\t<AlertCircle v-else-if=\"error\" class=\"textarea__helper-text-message__icon\" :size=\"18\" />\n\t\t\t{{ helperText }}\n\t\t</p>\n\t</div>\n</template>\n\n<script>\nimport { createElementId } from '../../utils/createElementId.ts'\n\nimport AlertCircle from 'vue-material-design-icons/AlertCircleOutline.vue'\nimport Check from 'vue-material-design-icons/Check.vue'\n\nexport default {\n\tname: 'NcTextArea',\n\n\tcomponents: {\n\t\tAlertCircle,\n\t\tCheck,\n\t},\n\n\tinheritAttrs: false,\n\n\tprops: {\n\t\t/**\n\t\t * The value of the input field\n\t\t */\n\t\tmodelValue: {\n\t\t\ttype: String,\n\t\t\trequired: true,\n\t\t},\n\n\t\t/**\n\t\t * The input label, always provide one for accessibility purposes.\n\t\t * This will also be used as a placeholder unless the placeholder\n\t\t * prop is populated with a different string.\n\t\t */\n\t\tlabel: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * Pass in true if you want to use an external label. This is useful\n\t\t * if you need a label that looks different from the one provided by\n\t\t * this component\n\t\t */\n\t\tlabelOutside: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * The placeholder of the input. This defaults as the string that's\n\t\t * passed into the label prop. In order to remove the placeholder,\n\t\t * pass in an empty string.\n\t\t */\n\t\tplaceholder: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * Toggles the success state of the component. Adds a checkmark icon.\n\t\t * this cannot be used together with canClear.\n\t\t */\n\t\tsuccess: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Toggles the error state of the component. Adds an error icon.\n\t\t * this cannot be used together with canClear.\n\t\t */\n\t\terror: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Additional helper text message\n\t\t *\n\t\t * This will be displayed beneath the input field. In case the field is\n\t\t * also marked as having an error, the text will be displayed in red.\n\t\t */\n\t\thelperText: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * Disable the input field\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 * Class to add to the input field.\n\t\t * Necessary to use NcInputField in the NcActionInput component.\n\t\t */\n\t\tinputClass: {\n\t\t\ttype: [Object, String],\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * The resize CSS property sets whether an element is resizable, and if\n\t\t * so, in which directions.\n\t\t */\n\t\tresize: {\n\t\t\ttype: String,\n\t\t\tdefault: 'both',\n\t\t\tvalidator: (value) => ['both', 'vertical', 'horizontal', 'none'].includes(value),\n\t\t},\n\t},\n\n\temits: [\n\t\t'update:modelValue',\n\t],\n\n\tcomputed: {\n\t\tcomputedId() {\n\t\t\treturn this.$attrs.id && this.$attrs.id !== '' ? this.$attrs.id : this.inputName\n\t\t},\n\n\t\tinputName() {\n\t\t\treturn 'input' + createElementId()\n\t\t},\n\n\t\thasPlaceholder() {\n\t\t\treturn this.placeholder !== '' && this.placeholder !== undefined\n\t\t},\n\n\t\tcomputedPlaceholder() {\n\t\t\treturn this.hasPlaceholder ? this.placeholder : this.label\n\t\t},\n\n\t\tisValidLabel() {\n\t\t\tconst isValidLabel = this.label || this.labelOutside\n\t\t\tif (!isValidLabel) {\n\t\t\t\tconsole.warn('You need to add a label to the NcInputField component. Either use the prop label or use an external one, as per the example in the documentation.')\n\t\t\t}\n\t\t\treturn isValidLabel\n\t\t},\n\n\t\tariaDescribedby() {\n\t\t\tconst ariaDescribedby = []\n\t\t\tif (this.helperText.length > 0) {\n\t\t\t\tariaDescribedby.push(`${this.inputName}-helper-text`)\n\t\t\t}\n\t\t\tif (this.$attrs['aria-describedby']) {\n\t\t\t\tariaDescribedby.push(this.$attrs['aria-describedby'])\n\t\t\t}\n\t\t\treturn ariaDescribedby.join(' ') || null\n\t\t},\n\t},\n\n\tmethods: {\n\t\t/**\n\t\t * Focus the input element\n\t\t *\n\t\t * @public\n\t\t */\n\t\tfocus() {\n\t\t\tthis.$refs.input.focus()\n\t\t},\n\n\t\t/**\n\t\t * Select all the text in the input\n\t\t *\n\t\t * @public\n\t\t */\n\t\tselect() {\n\t\t\tthis.$refs.input.select()\n\t\t},\n\n\t\thandleInput(event) {\n\t\t\tthis.$emit('update:modelValue', event.target.value)\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n\n.textarea {\n\tposition: relative;\n\twidth: 100%;\n\tborder-radius: var(--border-radius-large);\n\tmargin-block-start: 6px; // for the label in active state\n\tresize: vertical;\n\n\t&__main-wrapper {\n\t\tposition: relative;\n\t}\n\n\t&--disabled {\n\t\topacity: 0.7;\n\t\tfilter: saturate(0.7);\n\t}\n\n\t&__input {\n\t\tmargin: 0;\n\t\tpadding-inline: 10px 6px; // align with label 8px margin label + 4px padding label - 2px border input\n\t\twidth: 100%;\n\t\theight: calc(var(--default-clickable-area) * 2);\n\t\tfont-size: var(--default-font-size);\n\t\ttext-overflow: ellipsis;\n\n\t\tbackground-color: var(--color-main-background);\n\t\tcolor: var(--color-main-text);\n\t\tborder: var(--border-width-input, 2px) solid var(--color-border-maxcontrast);\n\t\tborder-radius: var(--border-radius-large);\n\n\t\tcursor: pointer;\n\n\t\t&:active:not([disabled]),\n\t\t&:hover:not([disabled]),\n\t\t&:focus:not([disabled]) {\n\t\t\tborder-width: var(--border-width-input-focused, 2px);\n\t\t\tborder-color: var(--color-main-text);\n\t\t\tbox-shadow: 0 0 0 2px var(--color-main-background) !important;\n\t\t}\n\n\t\t// Hide placeholder while not focussed -> show label instead (only if internal label is used)\n\t\t&:not(:focus,&--label-outside)::placeholder {\n\t\t\topacity: 0;\n\t\t}\n\n\t\t&:focus {\n\t\t\tcursor: text;\n\t\t}\n\n\t\t&:disabled {\n\t\t\tcursor: default;\n\t\t}\n\n\t\t&:focus-visible {\n\t\t\tbox-shadow: unset !important; // Override server rules\n\t\t}\n\n\t\t&--success {\n\t\t\tborder-color: var(--color-success) !important; //Override hover border color\n\t\t\t&:focus-visible {\n\t\t\t\tbox-shadow: rgb(248, 250, 252) 0px 0px 0px 2px, var(--color-primary-element) 0px 0px 0px 4px, rgba(0, 0, 0, 0.05) 0px 1px 2px 0px\n\t\t\t}\n\t\t}\n\n\t\t&--error {\n\t\t\tborder-color: var(--color-error) !important; //Override hover border color\n\t\t\t&:focus-visible {\n\t\t\t\tbox-shadow: rgb(248, 250, 252) 0px 0px 0px 2px, var(--color-primary-element) 0px 0px 0px 4px, rgba(0, 0, 0, 0.05) 0px 1px 2px 0px\n\t\t\t}\n\t\t}\n\t}\n\n\t&__label {\n\t\tposition: absolute;\n\t\tmargin-inline: 12px 0;\n\t\tmax-width: fit-content;\n\t\tinset-block-start: 11px;\n\t\tinset-inline: 0;\n\t\t// Fix color so that users do not think the input already has content\n\t\tcolor: var(--color-text-maxcontrast);\n\t\t// only one line labels are allowed\n\t\twhite-space: nowrap;\n\t\toverflow: hidden;\n\t\ttext-overflow: ellipsis;\n\t\t// forward events to input\n\t\tpointer-events: none;\n\t\t// Position transition\n\t\ttransition: height var(--animation-quick), inset-block-start var(--animation-quick), font-size var(--animation-quick), color var(--animation-quick), background-color var(--animation-quick) var(--animation-slow);\n\t}\n\n\t&__input:focus + &__label,\n\t&__input:not(:placeholder-shown) + &__label {\n\t\tinset-block-start: -10px;\n\t\tline-height: 1.5; // minimum allowed line height for accessibility\n\t\tfont-size: 13px; // minimum allowed font size for accessibility\n\t\tfont-weight: 500;\n\t\tcolor: var(--color-main-text);\n\t\tbackground-color: var(--color-main-background);\n\t\tpadding-inline: 4px;\n\t\tmargin-inline-start: 8px;\n\n\t\ttransition: height var(--animation-quick), inset-block-start var(--animation-quick), font-size var(--animation-quick), color var(--animation-quick);\n\t}\n\n\t&__helper-text-message {\n\t\tpadding-block: 4px;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\n\t\t&__icon {\n\t\t\tmargin-inline-end: 8px;\n\t\t}\n\n\t\t&--error {\n\t\t\tcolor: var(--color-error-text);\n\t\t}\n\n\t\t&--success {\n\t\t\tcolor: var(--color-success-text);\n\t\t}\n\t}\n}\n</style>\n"],"names":["_createElementBlock","_normalizeClass","_createElementVNode","_mergeProps","_toDisplayString","_createCommentVNode","_createBlock","_createTextVNode"],"mappings":";;;;;AAwHA,MAAK,YAAU;AAAA,EACd,MAAM;AAAA,EAEN,YAAY;AAAA,IACX;AAAA,IACA;AAAA,EACA;AAAA,EAED,cAAc;AAAA,EAEd,OAAO;AAAA;AAAA;AAAA;AAAA,IAIN,YAAY;AAAA,MACX,MAAM;AAAA,MACN,UAAU;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOD,OAAO;AAAA,MACN,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOD,cAAc;AAAA,MACb,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOD,aAAa;AAAA,MACZ,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,SAAS;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,OAAO;AAAA,MACN,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQD,YAAY;AAAA,MACX,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA,IAKD,UAAU;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,YAAY;AAAA,MACX,MAAM,CAAC,QAAQ,MAAM;AAAA,MACrB,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,QAAQ;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,MACT,WAAW,CAAC,UAAU,CAAC,QAAQ,YAAY,cAAc,MAAM,EAAE,SAAS,KAAK;AAAA,IAC/E;AAAA,EACD;AAAA,EAED,OAAO;AAAA,IACN;AAAA,EACA;AAAA,EAED,UAAU;AAAA,IACT,aAAa;AACZ,aAAO,KAAK,OAAO,MAAM,KAAK,OAAO,OAAO,KAAK,KAAK,OAAO,KAAK,KAAK;AAAA,IACvE;AAAA,IAED,YAAY;AACX,aAAO,UAAU,gBAAe;AAAA,IAChC;AAAA,IAED,iBAAiB;AAChB,aAAO,KAAK,gBAAgB,MAAM,KAAK,gBAAgB;AAAA,IACvD;AAAA,IAED,sBAAsB;AACrB,aAAO,KAAK,iBAAiB,KAAK,cAAc,KAAK;AAAA,IACrD;AAAA,IAED,eAAe;AACd,YAAM,eAAe,KAAK,SAAS,KAAK;AACxC,UAAI,CAAC,cAAc;AAClB,gBAAQ,KAAK,mJAAmJ;AAAA,MACjK;AACA,aAAO;AAAA,IACP;AAAA,IAED,kBAAkB;AACjB,YAAM,kBAAkB,CAAA;AACxB,UAAI,KAAK,WAAW,SAAS,GAAG;AAC/B,wBAAgB,KAAK,GAAG,KAAK,SAAS,cAAc;AAAA,MACrD;AACA,UAAI,KAAK,OAAO,kBAAkB,GAAG;AACpC,wBAAgB,KAAK,KAAK,OAAO,kBAAkB,CAAC;AAAA,MACrD;AACA,aAAO,gBAAgB,KAAK,GAAG,KAAK;AAAA,IACpC;AAAA,EACD;AAAA,EAED,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMR,QAAQ;AACP,WAAK,MAAM,MAAM,MAAK;AAAA,IACtB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOD,SAAS;AACR,WAAK,MAAM,MAAM,OAAM;AAAA,IACvB;AAAA,IAED,YAAY,OAAO;AAClB,WAAK,MAAM,qBAAqB,MAAM,OAAO,KAAK;AAAA,IAClD;AAAA,EACD;AACF;AAvNO,MAAA,aAAA,EAAA,OAAM,yBAAwB;AA3ErC,MAAA,aAAA,CAAA,MAAA,YAAA,eAAA,oBAAA,OAAA;AAAA,MAAA,aAAA,CAAA,KAAA;AAAA,MAAA,aAAA,CAAA,IAAA;;;;sBA0ECA,mBAqCM,OAAA;AAAA,IArCD,OA1ENC,eAAA,CA0EY,YAAU,EAAA,sBAAiC,OAAQ,UAAA,CAAA;AAAA;IAC7DC,mBAwBM,OAxBN,YAwBM;AAAA,MAvBLA,mBAgBwB,YAhBxBC,WAAkB,KAAM,QAAA;AAAA,QACtB,IAAI,SAAU;AAAA,QACf,KAAI;AAAA,QACJ,OAAK,CAAC,mBAAiB;AAAA,UAKd,OAAU;AAAA;8CAAiD,OAAY;AAAA,wCAAoC,OAAO;AAAA,sCAAkC,OAAK;AAAA;;QAJjK,UAAU,OAAQ;AAAA,QAClB,aAAa,SAAmB;AAAA,QAChC,oBAAkB,SAAe;AAAA,QAClC,aAAU;AAAA,QAOT,iBAAiB,OAAM,OAAA;AAAA,QACvB,OAAO,OAAU;AAAA,QACjB,gDAAO,SAAW,eAAA,SAAA,YAAA,GAAA,IAAA;AAAA,MA5FvB,CAAA,GAAA,MAAA,IAAA,UAAA;AAAA,MA8FiB,CAAA,OAAA,gBAAgB,SAAY,6BAA1CH,mBAIQ,SAAA;AAAA,QAlGX,KAAA;AAAA,QA+FI,OAAM;AAAA,QACL,KAAK,SAAU;AAAA,MACb,GAAAI,gBAAA,OAAA,KAAK,GAjGZ,GAAA,UAAA,KAAAC,mBAAA,IAAA,IAAA;AAAA;IAoGW,OAAA,WAAW,SAAM,kBAA1BL,mBAUI,KAAA;AAAA,MA9GN,KAAA;AAAA,MAqGI,OAAO,SAAS,SAAA;AAAA,MACjB,OAtGHC,gBAsGS,iCAA+B;AAAA,gDACiB,OAAK;AAAA,kDAAgD,OAAO;AAAA;;MAIrG,OAAO,wBAApBK,YAA+E,kBAAA;AAAA,QA3GlF,KAAA;AAAA,QA2GyB,OAAM;AAAA,QAAuC,MAAM;AAAA,YACjD,OAAK,sBAA7BA,YAAwF,wBAAA;AAAA,QA5G3F,KAAA;AAAA,QA4GkC,OAAM;AAAA,QAAuC,MAAM;AAAA,YA5GrFD,mBAAA,IAAA,IAAA;AAAA,MAAAE,gBA4G2F,sBACrF,OAAU,UAAA,GAAA,CAAA;AAAA,IA7GhB,GAAA,IAAA,UAAA,KAAAF,mBAAA,IAAA,IAAA;AAAA;;;"}

package/dist/chunks/{NcTextField-CNV42Zey.mjs → NcTextField-KGXtf7Y6.mjs}

@@ -1,9 +1,9 @@
-import { N as NcInputField } from "./NcInputField-CzC820tG.mjs";
-import { C as Close } from "./Close-idsVwGrC.mjs";
+import { N as NcInputField } from "./NcInputField-BBS1E7r-.mjs";
+import { I as IconClose } from "./Close-D6ngJ4t9.mjs";
 import { A as ArrowRight } from "./ArrowRight-DQT24Cb-.mjs";
 import { createElementBlock, openBlock, mergeProps, createElementVNode, createCommentVNode, toDisplayString, resolveComponent, createBlock, createSlots, withCtx, renderSlot } from "vue";
 import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
-import { r as register, d as t47, e as t16, a as t } from "./_l10n-BEP_UzXI.mjs";
+import { r as register, d as t46, e as t17, a as t } from "./_l10n-BNGeEX3W.mjs";
 const _sfc_main$1 = {
   name: "UndoVariantIcon",
   emits: ["click"],
@@ -47,13 +47,13 @@ function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
   ], 16, _hoisted_1);
 }
 const Undo = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render$1]]);
-register(t16, t47);
+register(t17, t46);
 const NcInputFieldProps = new Set(Object.keys(NcInputField.props));
 const _sfc_main = {
   name: "NcTextField",
   components: {
     NcInputField,
-    Close,
+    Close: IconClose,
     ArrowRight,
     Undo
   },
@@ -171,3 +171,4 @@ const NcTextField = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_rend
 export {
   NcTextField as N
 };
+//# sourceMappingURL=NcTextField-KGXtf7Y6.mjs.map

package/dist/chunks/{NcTextField-CNV42Zey.mjs.map → NcTextField-KGXtf7Y6.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"NcTextField-CNV42Zey.mjs","sources":["../../node_modules/vue-material-design-icons/UndoVariant.vue","../../src/components/NcTextField/NcTextField.vue"],"sourcesContent":["<template>\n  <span v-bind=\"$attrs\"\n        :aria-hidden=\"title ? null : 'true'\"\n        :aria-label=\"title\"\n        class=\"material-design-icon undo-variant-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=\"M13.5,7A6.5,6.5 0 0,1 20,13.5A6.5,6.5 0 0,1 13.5,20H10V18H13.5C16,18 18,16 18,13.5C18,11 16,9 13.5,9H7.83L10.91,12.09L9.5,13.5L4,8L9.5,2.5L10.92,3.91L7.83,7H13.5M6,18H8V20H6V18Z\">\n        <title v-if=\"title\">{{ title }}</title>\n      </path>\n    </svg>\n  </span>\n</template>\n\n<script>\nexport default {\n  name: \"UndoVariantIcon\",\n  emits: ['click'],\n  props: {\n    title: {\n      type: String,\n    },\n    fillColor: {\n      type: String,\n      default: \"currentColor\"\n    },\n    size: {\n      type: Number,\n      default: 24\n    }\n  }\n}\n</script>","<!--\n  - SPDX-FileCopyrightText: 2022 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n### Description\nSee [NcInputField](#/Components/NcFields?id=ncinputfield) for a list of all available props.\n\nGeneral purpose text field component.\nIt is recommended to not only provide a placeholder, but also a label.\nThe label should describe what input is expected and the placehold what format the input should have.\n\nNote: the inner html `input` element inherits all the attributes from the\nNcTextField component so you can add things like `autocomplete`, `maxlength`\nand `minlength`.\n\n```\n<template>\n\t<div class=\"wrapper\">\n\t\t<NcTextField v-model=\"text1\"\n\t\t\tlabel=\"Leading icon and clear trailing button\"\n\t\t\ttrailing-button-icon=\"close\"\n\t\t\t:show-trailing-button=\"text1 !== ''\"\n\t\t\t@trailing-button-click=\"clearText\">\n\t\t\t<template #icon>\n\t\t\t\t<Magnify :size=\"20\" />\n\t\t\t</template>\n\t\t</NcTextField>\n\t\t<NcTextField v-model=\"text4\"\n\t\t\tlabel=\"Internal label\"\n\t\t\tplaceholder=\"That can be used together with placeholder\"\n\t\t\ttrailing-button-icon=\"close\"\n\t\t\t:show-trailing-button=\"text4 !== ''\"\n\t\t\t@trailing-button-click=\"clearText\">\n\t\t\t<template #icon>\n\t\t\t\t<Lock :size=\"20\" />\n\t\t\t</template>\n\t\t</NcTextField>\n\t\t<NcTextField v-model=\"text2\"\n\t\t\tlabel=\"With helper text\"\n\t\t\thelper-text=\"This is an optional message to show e.g. validation errors.\"\n\t\t\t@trailing-button-click=\"clearText\">\n\t\t</NcTextField>\n\t\t<NcTextField v-model=\"text2\"\n\t\t\tlabel=\"Success state\"\n\t\t\tplaceholder=\"Placeholders are possible\"\n\t\t\t:success=\"true\"\n\t\t\t@trailing-button-click=\"clearText\">\n\t\t</NcTextField>\n\t\t<NcTextField v-model=\"text3\"\n\t\t\tlabel=\"Error state\"\n\t\t\tplaceholder=\"Enter something valid\"\n\t\t\t:error=\"true\"\n\t\t\t@trailing-button-click=\"clearText\">\n\t\t</NcTextField>\n\t\t<NcTextField :model-value=\"\"\n\t\t\tlabel=\"Disabled\"\n\t\t\t:disabled=\"true\" />\n\t\t<NcTextField :model-value=\"\"\n\t\t\tlabel=\"Disabled + Success\"\n\t\t\t:success=\"true\"\n\t\t\t:disabled=\"true\" />\n\t\t<div class=\"external-label\">\n\t\t\t<label for=\"textField\">External label</label>\n\t\t\t<NcTextField v-model=\"text5\"\n\t\t\t\tid=\"textField\"\n\t\t\t\t:label-outside=\"true\"\n\t\t\t\tplaceholder=\"Input with external label\"\n\t\t\t\t@trailing-button-click=\"clearText\" />\n\t\t</div>\n\t</div>\n</template>\n<script>\nimport Magnify from 'vue-material-design-icons/Magnify'\nimport Lock from 'vue-material-design-icons/Lock'\nimport Close from 'vue-material-design-icons/Close'\n\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\ttext1: '',\n\t\t\ttext2: '',\n\t\t\ttext3: '',\n\t\t\ttext4: '',\n\t\t\ttext5: '',\n\t\t}\n\t},\n\n\tcomponents: {\n\t\tMagnify,\n\t\tLock,\n\t\tClose,\n\t},\n\n\tmethods: {\n\t\tclearText() {\n\t\t\tthis.text1 = ''\n\t\t\tthis.text3 = ''\n\t\t}\n\t}\n}\n</script>\n<style lang=\"scss\" scoped>\n.wrapper {\n\tdisplay: flex;\n\tgap: 4px;\n\talign-items: flex-end;\n\tflex-wrap: wrap;\n}\n\n.external-label {\n\tdisplay: flex;\n\tgap: 14px;\n\twidth: 100%;\n\tmargin-top: 1rem;\n}\n\n.external-label label {\n\tpadding-top: 7px;\n\twhite-space: nowrap;\n}\n</style>\n```\n</docs>\n\n<template>\n\t<NcInputField v-bind=\"propsToForward\"\n\t\tref=\"inputField\"\n\t\t@update:model-value=\"handleInput\">\n\t\t<template v-if=\"!!$slots.icon\" #icon>\n\t\t\t<!-- @slot Leading icon -->\n\t\t\t<slot name=\"icon\" />\n\t\t</template>\n\n\t\t<!-- Trailing icon slot, except for search type input as the browser already adds a trailing close icon -->\n\t\t<template v-if=\"type !== 'search'\" #trailing-button-icon>\n\t\t\t<Close v-if=\"trailingButtonIcon === 'close'\" :size=\"20\" />\n\t\t\t<ArrowRight v-else-if=\"trailingButtonIcon === 'arrowRight'\" :size=\"20\" />\n\t\t\t<Undo v-else-if=\"trailingButtonIcon === 'undo'\" :size=\"20\" />\n\t\t</template>\n\t</NcInputField>\n</template>\n\n<script>\n\nimport NcInputField from '../NcInputField/NcInputField.vue'\n\nimport Close from 'vue-material-design-icons/Close.vue'\nimport ArrowRight from 'vue-material-design-icons/ArrowRight.vue'\nimport Undo from 'vue-material-design-icons/UndoVariant.vue'\n\nimport { t } from '../../l10n.js'\n\nconst NcInputFieldProps = new Set(Object.keys(NcInputField.props))\n\nexport default {\n\tname: 'NcTextField',\n\n\tcomponents: {\n\t\tNcInputField,\n\t\tClose,\n\t\tArrowRight,\n\t\tUndo,\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * Any [NcInputField](#/Components/NcFields?id=ncinputfield) props\n\t\t */\n\t\t// Not an actual prop but needed to show in vue-styleguidist docs\n\t\t// eslint-disable-next-line\n\t\t' ': {},\n\n\t\t// Reuse all the props from NcInputField for better typing and documentation\n\t\t...NcInputField.props,\n\n\t\t/**\n\t\t * The `aria-label` to set on the trailing button\n\t\t * If no explicit value is set it will default to the one matching the `trailingButtonIcon`:\n\t\t * @default 'Clear text'|'Save changes'|'Undo changes'\n\t\t */\n\t\ttrailingButtonLabel: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t// Custom props\n\n\t\t/**\n\t\t * Specifies which material design icon should be used for the trailing\n\t\t * button.\n\t\t * @type {'close'|'arrowRight'|'undo'}\n\t\t */\n\t\ttrailingButtonIcon: {\n\t\t\ttype: String,\n\t\t\tdefault: 'close',\n\t\t\tvalidator: (value) => [\n\t\t\t\t'close',\n\t\t\t\t'arrowRight',\n\t\t\t\t'undo',\n\t\t\t].includes(value),\n\t\t},\n\t},\n\n\temits: [\n\t\t'update:modelValue',\n\t],\n\n\tcomputed: {\n\t\tpropsToForward() {\n\t\t\tconst predefinedLabels = {\n\t\t\t\tundo: t('Undo changes'),\n\t\t\t\tclose: t('Clear text'),\n\t\t\t\tarrowRight: t('Save changes'),\n\t\t\t}\n\n\t\t\treturn {\n\t\t\t\t// Proxy original NcInputField's props\n\t\t\t\t...Object.fromEntries(\n\t\t\t\t\tObject.entries(this.$props).filter(([key]) => NcInputFieldProps.has(key)),\n\t\t\t\t),\n\t\t\t\t// Adjust aria-label for predefined trailing buttons\n\t\t\t\ttrailingButtonLabel: this.trailingButtonLabel || predefinedLabels[this.trailingButtonIcon],\n\t\t\t}\n\t\t},\n\t},\n\n\tmethods: {\n\t\t/**\n\t\t * Focus the input element\n\t\t *\n\t\t * @public\n\t\t */\n\t\tfocus() {\n\t\t\tthis.$refs.inputField.focus()\n\t\t},\n\n\t\t/**\n\t\t * Select all the text in the input\n\t\t *\n\t\t * @public\n\t\t */\n\t\tselect() {\n\t\t\tthis.$refs.inputField.select()\n\t\t},\n\n\t\thandleInput(event) {\n\t\t\tthis.$emit('update:modelValue', event)\n\t\t},\n\t},\n}\n</script>\n"],"names":["_sfc_main","_createElementBlock","_mergeProps","_createElementVNode","_createCommentVNode","_createBlock","_createSlots","_withCtx","_renderSlot"],"mappings":"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","x_google_ignoreList":[0]}
+{"version":3,"file":"NcTextField-KGXtf7Y6.mjs","sources":["../../node_modules/vue-material-design-icons/UndoVariant.vue","../../src/components/NcTextField/NcTextField.vue"],"sourcesContent":["<template>\n  <span v-bind=\"$attrs\"\n        :aria-hidden=\"title ? null : 'true'\"\n        :aria-label=\"title\"\n        class=\"material-design-icon undo-variant-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=\"M13.5,7A6.5,6.5 0 0,1 20,13.5A6.5,6.5 0 0,1 13.5,20H10V18H13.5C16,18 18,16 18,13.5C18,11 16,9 13.5,9H7.83L10.91,12.09L9.5,13.5L4,8L9.5,2.5L10.92,3.91L7.83,7H13.5M6,18H8V20H6V18Z\">\n        <title v-if=\"title\">{{ title }}</title>\n      </path>\n    </svg>\n  </span>\n</template>\n\n<script>\nexport default {\n  name: \"UndoVariantIcon\",\n  emits: ['click'],\n  props: {\n    title: {\n      type: String,\n    },\n    fillColor: {\n      type: String,\n      default: \"currentColor\"\n    },\n    size: {\n      type: Number,\n      default: 24\n    }\n  }\n}\n</script>","<!--\n  - SPDX-FileCopyrightText: 2022 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n### Description\nSee [NcInputField](#/Components/NcFields?id=ncinputfield) for a list of all available props.\n\nGeneral purpose text field component.\nIt is recommended to not only provide a placeholder, but also a label.\nThe label should describe what input is expected and the placehold what format the input should have.\n\nNote: the inner html `input` element inherits all the attributes from the\nNcTextField component so you can add things like `autocomplete`, `maxlength`\nand `minlength`.\n\n```\n<template>\n\t<div class=\"wrapper\">\n\t\t<NcTextField v-model=\"text1\"\n\t\t\tlabel=\"Leading icon and clear trailing button\"\n\t\t\ttrailing-button-icon=\"close\"\n\t\t\t:show-trailing-button=\"text1 !== ''\"\n\t\t\t@trailing-button-click=\"clearText\">\n\t\t\t<template #icon>\n\t\t\t\t<Magnify :size=\"20\" />\n\t\t\t</template>\n\t\t</NcTextField>\n\t\t<NcTextField v-model=\"text4\"\n\t\t\tlabel=\"Internal label\"\n\t\t\tplaceholder=\"That can be used together with placeholder\"\n\t\t\ttrailing-button-icon=\"close\"\n\t\t\t:show-trailing-button=\"text4 !== ''\"\n\t\t\t@trailing-button-click=\"clearText\">\n\t\t\t<template #icon>\n\t\t\t\t<Lock :size=\"20\" />\n\t\t\t</template>\n\t\t</NcTextField>\n\t\t<NcTextField v-model=\"text2\"\n\t\t\tlabel=\"With helper text\"\n\t\t\thelper-text=\"This is an optional message to show e.g. validation errors.\"\n\t\t\t@trailing-button-click=\"clearText\">\n\t\t</NcTextField>\n\t\t<NcTextField v-model=\"text2\"\n\t\t\tlabel=\"Success state\"\n\t\t\tplaceholder=\"Placeholders are possible\"\n\t\t\t:success=\"true\"\n\t\t\t@trailing-button-click=\"clearText\">\n\t\t</NcTextField>\n\t\t<NcTextField v-model=\"text3\"\n\t\t\tlabel=\"Error state\"\n\t\t\tplaceholder=\"Enter something valid\"\n\t\t\t:error=\"true\"\n\t\t\t@trailing-button-click=\"clearText\">\n\t\t</NcTextField>\n\t\t<NcTextField :model-value=\"\"\n\t\t\tlabel=\"Disabled\"\n\t\t\t:disabled=\"true\" />\n\t\t<NcTextField :model-value=\"\"\n\t\t\tlabel=\"Disabled + Success\"\n\t\t\t:success=\"true\"\n\t\t\t:disabled=\"true\" />\n\t\t<div class=\"external-label\">\n\t\t\t<label for=\"textField\">External label</label>\n\t\t\t<NcTextField v-model=\"text5\"\n\t\t\t\tid=\"textField\"\n\t\t\t\t:label-outside=\"true\"\n\t\t\t\tplaceholder=\"Input with external label\"\n\t\t\t\t@trailing-button-click=\"clearText\" />\n\t\t</div>\n\t</div>\n</template>\n<script>\nimport Magnify from 'vue-material-design-icons/Magnify'\nimport Lock from 'vue-material-design-icons/Lock'\nimport Close from 'vue-material-design-icons/Close'\n\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\ttext1: '',\n\t\t\ttext2: '',\n\t\t\ttext3: '',\n\t\t\ttext4: '',\n\t\t\ttext5: '',\n\t\t}\n\t},\n\n\tcomponents: {\n\t\tMagnify,\n\t\tLock,\n\t\tClose,\n\t},\n\n\tmethods: {\n\t\tclearText() {\n\t\t\tthis.text1 = ''\n\t\t\tthis.text3 = ''\n\t\t}\n\t}\n}\n</script>\n<style lang=\"scss\" scoped>\n.wrapper {\n\tdisplay: flex;\n\tgap: 4px;\n\talign-items: flex-end;\n\tflex-wrap: wrap;\n}\n\n.external-label {\n\tdisplay: flex;\n\tgap: 14px;\n\twidth: 100%;\n\tmargin-top: 1rem;\n}\n\n.external-label label {\n\tpadding-top: 7px;\n\twhite-space: nowrap;\n}\n</style>\n```\n</docs>\n\n<template>\n\t<NcInputField v-bind=\"propsToForward\"\n\t\tref=\"inputField\"\n\t\t@update:model-value=\"handleInput\">\n\t\t<template v-if=\"!!$slots.icon\" #icon>\n\t\t\t<!-- @slot Leading icon -->\n\t\t\t<slot name=\"icon\" />\n\t\t</template>\n\n\t\t<!-- Trailing icon slot, except for search type input as the browser already adds a trailing close icon -->\n\t\t<template v-if=\"type !== 'search'\" #trailing-button-icon>\n\t\t\t<Close v-if=\"trailingButtonIcon === 'close'\" :size=\"20\" />\n\t\t\t<ArrowRight v-else-if=\"trailingButtonIcon === 'arrowRight'\" :size=\"20\" />\n\t\t\t<Undo v-else-if=\"trailingButtonIcon === 'undo'\" :size=\"20\" />\n\t\t</template>\n\t</NcInputField>\n</template>\n\n<script>\n\nimport NcInputField from '../NcInputField/NcInputField.vue'\n\nimport Close from 'vue-material-design-icons/Close.vue'\nimport ArrowRight from 'vue-material-design-icons/ArrowRight.vue'\nimport Undo from 'vue-material-design-icons/UndoVariant.vue'\n\nimport { t } from '../../l10n.js'\n\nconst NcInputFieldProps = new Set(Object.keys(NcInputField.props))\n\nexport default {\n\tname: 'NcTextField',\n\n\tcomponents: {\n\t\tNcInputField,\n\t\tClose,\n\t\tArrowRight,\n\t\tUndo,\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * Any [NcInputField](#/Components/NcFields?id=ncinputfield) props\n\t\t */\n\t\t// Not an actual prop but needed to show in vue-styleguidist docs\n\t\t// eslint-disable-next-line\n\t\t' ': {},\n\n\t\t// Reuse all the props from NcInputField for better typing and documentation\n\t\t...NcInputField.props,\n\n\t\t/**\n\t\t * The `aria-label` to set on the trailing button\n\t\t * If no explicit value is set it will default to the one matching the `trailingButtonIcon`:\n\t\t * @default 'Clear text'|'Save changes'|'Undo changes'\n\t\t */\n\t\ttrailingButtonLabel: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t// Custom props\n\n\t\t/**\n\t\t * Specifies which material design icon should be used for the trailing\n\t\t * button.\n\t\t * @type {'close'|'arrowRight'|'undo'}\n\t\t */\n\t\ttrailingButtonIcon: {\n\t\t\ttype: String,\n\t\t\tdefault: 'close',\n\t\t\tvalidator: (value) => [\n\t\t\t\t'close',\n\t\t\t\t'arrowRight',\n\t\t\t\t'undo',\n\t\t\t].includes(value),\n\t\t},\n\t},\n\n\temits: [\n\t\t'update:modelValue',\n\t],\n\n\tcomputed: {\n\t\tpropsToForward() {\n\t\t\tconst predefinedLabels = {\n\t\t\t\tundo: t('Undo changes'),\n\t\t\t\tclose: t('Clear text'),\n\t\t\t\tarrowRight: t('Save changes'),\n\t\t\t}\n\n\t\t\treturn {\n\t\t\t\t// Proxy original NcInputField's props\n\t\t\t\t...Object.fromEntries(\n\t\t\t\t\tObject.entries(this.$props).filter(([key]) => NcInputFieldProps.has(key)),\n\t\t\t\t),\n\t\t\t\t// Adjust aria-label for predefined trailing buttons\n\t\t\t\ttrailingButtonLabel: this.trailingButtonLabel || predefinedLabels[this.trailingButtonIcon],\n\t\t\t}\n\t\t},\n\t},\n\n\tmethods: {\n\t\t/**\n\t\t * Focus the input element\n\t\t *\n\t\t * @public\n\t\t */\n\t\tfocus() {\n\t\t\tthis.$refs.inputField.focus()\n\t\t},\n\n\t\t/**\n\t\t * Select all the text in the input\n\t\t *\n\t\t * @public\n\t\t */\n\t\tselect() {\n\t\t\tthis.$refs.inputField.select()\n\t\t},\n\n\t\thandleInput(event) {\n\t\t\tthis.$emit('update:modelValue', event)\n\t\t},\n\t},\n}\n</script>\n"],"names":["_sfc_main","_createElementBlock","_mergeProps","_createElementVNode","_createCommentVNode","Close","_createBlock","_createSlots","_withCtx","_renderSlot"],"mappings":"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","x_google_ignoreList":[0]}

package/dist/chunks/NcTimezonePicker.vue_vue_type_script_setup_true_lang-DxoB-jLa.mjs

@@ -0,0 +1,98 @@
+import { defineComponent, mergeModels, useModel, computed, createBlock, openBlock, unref } from "vue";
+import { getTimezoneManager as getTimezoneManager$1, getReadableTimezoneName, getSortedTimezoneList } from "@nextcloud/timezones";
+import { c as createElementId } from "./createElementId-DhjFt1I9.mjs";
+import { r as register, a as t } from "./_l10n-BNGeEX3W.mjs";
+import { N as NcSelect } from "./NcSelect-BkTH-Yqm.mjs";
+register();
+const timezoneManager = getTimezoneManager$1();
+let initialized = false;
+function getTimezoneManager() {
+  if (!initialized) {
+    timezoneManager.registerDefaultTimezones();
+    initialized = true;
+  }
+  return timezoneManager;
+}
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "NcTimezonePicker",
+  props: /* @__PURE__ */ mergeModels({
+    additionalTimezones: { default: () => [] },
+    uid: { default: createElementId() }
+  }, {
+    "modelValue": { default: "floating" },
+    "modelModifiers": {}
+  }),
+  emits: ["update:modelValue"],
+  setup(__props) {
+    const props = __props;
+    const modelValue = useModel(__props, "modelValue");
+    const selectedTimezone = computed({
+      set(timezone) {
+        modelValue.value = timezone.timezoneId;
+      },
+      get() {
+        for (const additionalTimezone of props.additionalTimezones) {
+          if (additionalTimezone.timezoneId === modelValue.value) {
+            return {
+              cities: [],
+              ...additionalTimezone
+            };
+          }
+        }
+        return {
+          label: getReadableTimezoneName(modelValue.value),
+          timezoneId: modelValue.value,
+          cities: []
+        };
+      }
+    });
+    const options = computed(() => {
+      const timezoneManager2 = getTimezoneManager();
+      const timezoneList = getSortedTimezoneList(
+        timezoneManager2.listAllTimezones(),
+        props.additionalTimezones,
+        t("Global")
+        // TRANSLATORS: This refers to global timezones in the timezone picker
+      );
+      const timezonesGrouped = [];
+      for (const group of Object.values(timezoneList)) {
+        timezonesGrouped.push(...group.regions);
+      }
+      return timezonesGrouped;
+    });
+    function isSelectable(option) {
+      return !option.timezoneId.startsWith("tz-group__");
+    }
+    function filterBy(option, label, search) {
+      const terms = search.trim().split(" ");
+      if ("continent" in option) {
+        return option.regions.some((region) => {
+          return matchTimezoneId(region.timezoneId, terms);
+        });
+      }
+      return matchTimezoneId(option.timezoneId, terms);
+    }
+    function matchTimezoneId(timezoneId, terms) {
+      return terms.every((term) => timezoneId.toLowerCase().includes(term.toLowerCase()));
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(NcSelect), {
+        modelValue: selectedTimezone.value,
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => selectedTimezone.value = $event),
+        "aria-label-combobox": unref(t)("Search for timezone"),
+        clearable: false,
+        "filter-by": filterBy,
+        multiple: false,
+        options: options.value,
+        placeholder: unref(t)("Type to search time zone"),
+        selectable: isSelectable,
+        uid: _ctx.uid,
+        label: "label"
+      }, null, 8, ["modelValue", "aria-label-combobox", "options", "placeholder", "uid"]);
+    };
+  }
+});
+export {
+  _sfc_main as _
+};
+//# sourceMappingURL=NcTimezonePicker.vue_vue_type_script_setup_true_lang-DxoB-jLa.mjs.map

package/dist/chunks/NcTimezonePicker.vue_vue_type_script_setup_true_lang-DxoB-jLa.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"NcTimezonePicker.vue_vue_type_script_setup_true_lang-DxoB-jLa.mjs","sources":["../../src/components/NcTimezonePicker/timezoneDataProviderService.ts","../../src/components/NcTimezonePicker/NcTimezonePicker.vue"],"sourcesContent":["/**\n * SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\n\nimport { getTimezoneManager } from '@nextcloud/timezones'\n\nconst timezoneManager = getTimezoneManager()\nlet initialized = false\n\n/**\n * Gets the timezone-manager\n * initializes it if necessary\n *\n * @return {object}\n */\nexport default function() {\n\tif (!initialized) {\n\t\ttimezoneManager.registerDefaultTimezones()\n\t\tinitialized = true\n\t}\n\n\treturn timezoneManager\n}\n","<!--\n  - SPDX-FileCopyrightText: 2021 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n### Example\n```vue\n<template>\n\t<span>\n\t\t<NcTimezonePicker v-model=\"tz\" />\n\t\t{{ tz }}\n\t</span>\n</template>\n<script>\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\ttz: 'Hawaiian Standard Time',\n\t\t}\n\t},\n}\n</script>\n```\n</docs>\n\n<script setup lang=\"ts\">\nimport type {\n\tIContinent,\n\tITimezone,\n\tIRegion,\n} from '@nextcloud/timezones'\n\nimport {\n\tgetReadableTimezoneName,\n\tgetSortedTimezoneList,\n} from '@nextcloud/timezones'\nimport { computed } from 'vue'\nimport { createElementId } from '../../utils/createElementId.ts'\nimport { t } from '../../l10n.js'\nimport getTimezoneManager from './timezoneDataProviderService.js'\nimport NcSelect from '../NcSelect/index.js'\n\nconst props = withDefaults(defineProps<{\n\t/**\n\t * An array of additional timezones to include with the standard database. Useful if there is a custom timezone, e.g. read from user data\n\t */\n\tadditionalTimezones?: ITimezone[]\n\n\t/**\n\t * ID of the inner vue-select element, can be used for labels like: `vs-${uid}__combobox`\n\t */\n\tuid?: string\n}>(), {\n\tadditionalTimezones: () => [],\n\tuid: createElementId(),\n})\n\n/**\n * The selected timezone.\n * Use v-model for two-way binding.\n * The default timezone is floating, which means a time independent of timezone. See https://icalendar.org/CalDAV-Access-RFC-4791/7-3-date-and-floating-time.html for details.\n */\nconst modelValue = defineModel<string>({ default: 'floating' })\n\nconst selectedTimezone = computed({\n\tset(timezone: IRegion) {\n\t\tmodelValue.value = timezone.timezoneId\n\t},\n\tget(): IRegion {\n\t\tfor (const additionalTimezone of props.additionalTimezones) {\n\t\t\tif (additionalTimezone.timezoneId === modelValue.value) {\n\t\t\t\treturn {\n\t\t\t\t\tcities: [],\n\t\t\t\t\t...additionalTimezone,\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\treturn {\n\t\t\tlabel: getReadableTimezoneName(modelValue.value),\n\t\t\ttimezoneId: modelValue.value,\n\t\t\tcities: [],\n\t\t}\n\t},\n})\n\nconst options = computed(() => {\n\tconst timezoneManager = getTimezoneManager()\n\tconst timezoneList: IContinent[] = getSortedTimezoneList(\n\t\ttimezoneManager.listAllTimezones(),\n\t\tprops.additionalTimezones,\n\t\tt('Global'), // TRANSLATORS: This refers to global timezones in the timezone picker\n\t)\n\t/**\n\t * Since NcSelect does not support groups,\n\t * we create an object with the grouped timezones and continent labels.\n\t *\n\t * NOTE for now we are removing the grouping from the fields to fix an accessibility issue\n\t * in the future, other options can be introduced to better display the different areas\n\t */\n\tconst timezonesGrouped: IRegion[] = []\n\tfor (const group of Object.values(timezoneList)) {\n\t\t// Add an entry as group label\n\t\t// const continent = `tz-group__${group.continent}`\n\t\t// timezonesGrouped.push({\n\t\t// label: group.continent,\n\t\t// continent,\n\t\t// timezoneId: continent,\n\t\t// regions: group.regions,\n\t\t// })\n\t\ttimezonesGrouped.push(...group.regions)\n\t}\n\treturn timezonesGrouped\n})\n\n/**\n * Returns whether this is a continent label,\n * or an actual timezone. Continent labels are not selectable.\n *\n * @param option The option\n */\nfunction isSelectable(option: IRegion): boolean {\n\treturn !option.timezoneId.startsWith('tz-group__')\n}\n\n/**\n * Function to filter the timezone list.\n * We search in the timezoneId, so both continent and region names can be matched.\n *\n * @param option - The timezone option\n * @param label - The label of the timezone\n * @param search - The search string\n */\nfunction filterBy(option: IContinent | IRegion, label: string, search: string): boolean {\n\t// We split the search term in case one searches \"<continent> <region>\".\n\tconst terms = search.trim().split(' ')\n\n\t// For the continent labels, we have to check if one region matches every search term.\n\tif ('continent' in option) {\n\t\treturn option.regions.some(region => {\n\t\t\treturn matchTimezoneId(region.timezoneId, terms)\n\t\t})\n\t}\n\n\t// For a region, every search term must be found.\n\treturn matchTimezoneId(option.timezoneId, terms)\n}\n\n/**\n * @param timezoneId - The timezone id to check\n * @param terms - Terms to validate\n */\nfunction matchTimezoneId(timezoneId: string, terms: string[]): boolean {\n\treturn terms.every((term) => timezoneId.toLowerCase().includes(term.toLowerCase()))\n}\n</script>\n\n<template>\n\t<NcSelect v-model=\"selectedTimezone\"\n\t\t:aria-label-combobox=\"t('Search for timezone')\"\n\t\t:clearable=\"false\"\n\t\t:filter-by\n\t\t:multiple=\"false\"\n\t\t:options\n\t\t:placeholder=\"t('Type to search time zone')\"\n\t\t:selectable=\"isSelectable\"\n\t\t:uid\n\t\tlabel=\"label\" />\n</template>\n"],"names":["getTimezoneManager","_useModel","timezoneManager"],"mappings":";;;;;;AAOA,MAAM,kBAAkBA,qBAAmB;AAC3C,IAAI,cAAc;AAQQ,SAAA,qBAAA;AACzB,MAAI,CAAC,aAAa;AACjB,oBAAgB,yBAAyB;AAC3B,kBAAA;AAAA,EAAA;AAGR,SAAA;AACR;;;;;;;;;;;;ACoBA,UAAM,QAAQ;AAoBR,UAAA,aAAaC,SAA2C,SAAA,YAAA;AAE9D,UAAM,mBAAmB,SAAS;AAAA,MACjC,IAAI,UAAmB;AACtB,mBAAW,QAAQ,SAAS;AAAA,MAC7B;AAAA,MACA,MAAe;AACH,mBAAA,sBAAsB,MAAM,qBAAqB;AACvD,cAAA,mBAAmB,eAAe,WAAW,OAAO;AAChD,mBAAA;AAAA,cACN,QAAQ,CAAC;AAAA,cACT,GAAG;AAAA,YACJ;AAAA,UAAA;AAAA,QACD;AAGM,eAAA;AAAA,UACN,OAAO,wBAAwB,WAAW,KAAK;AAAA,UAC/C,YAAY,WAAW;AAAA,UACvB,QAAQ,CAAA;AAAA,QACT;AAAA,MAAA;AAAA,IACD,CACA;AAEK,UAAA,UAAU,SAAS,MAAM;AAC9B,YAAMC,mBAAkB,mBAAmB;AAC3C,YAAM,eAA6B;AAAA,QAClCA,iBAAgB,iBAAiB;AAAA,QACjC,MAAM;AAAA,QACN,EAAE,QAAQ;AAAA;AAAA,MACX;AAQA,YAAM,mBAA8B,CAAC;AACrC,iBAAW,SAAS,OAAO,OAAO,YAAY,GAAG;AAS/B,yBAAA,KAAK,GAAG,MAAM,OAAO;AAAA,MAAA;AAEhC,aAAA;AAAA,IAAA,CACP;AAQD,aAAS,aAAa,QAA0B;AAC/C,aAAO,CAAC,OAAO,WAAW,WAAW,YAAY;AAAA,IAAA;AAWzC,aAAA,SAAS,QAA8B,OAAe,QAAyB;AAEvF,YAAM,QAAQ,OAAO,KAAK,EAAE,MAAM,GAAG;AAGrC,UAAI,eAAe,QAAQ;AACnB,eAAA,OAAO,QAAQ,KAAK,CAAU,WAAA;AAC7B,iBAAA,gBAAgB,OAAO,YAAY,KAAK;AAAA,QAAA,CAC/C;AAAA,MAAA;AAIK,aAAA,gBAAgB,OAAO,YAAY,KAAK;AAAA,IAAA;AAOvC,aAAA,gBAAgB,YAAoB,OAA0B;AAC/D,aAAA,MAAM,MAAM,CAAC,SAAS,WAAW,YAAY,EAAE,SAAS,KAAK,YAAY,CAAC,CAAC;AAAA,IAAA;;;;;;;;;;;;;;;;;;"}

package/dist/chunks/{NcUserBubble-MfDc1YR2.mjs → NcUserBubble-qqRewR9C.mjs}

@@ -1,8 +1,8 @@
 import '../assets/NcUserBubble-tSs2XTDQ.css';
 import { createElementBlock, openBlock, renderSlot, resolveComponent, createBlock, resolveDynamicComponent, withCtx, mergeProps, createVNode, createElementVNode, createCommentVNode, normalizeStyle, toDisplayString, warn } from "vue";
 import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
-import { N as NcAvatar } from "./NcAvatar-A1YnlIoN.mjs";
-import { N as NcPopover } from "./NcPopover-D4D97Y3j.mjs";
+import { N as NcAvatar } from "./NcAvatar-CvPCBukb.mjs";
+import { N as NcPopover } from "./NcPopover-EPnt2iHh.mjs";
 import { RouterLink } from "vue-router";
 const _sfc_main$1 = {
   name: "NcUserBubbleDiv"
@@ -225,3 +225,4 @@ const NcUserBubble = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_ren
 export {
   NcUserBubble as N
 };
+//# sourceMappingURL=NcUserBubble-qqRewR9C.mjs.map

package/dist/chunks/{NcUserBubble-MfDc1YR2.mjs.map → NcUserBubble-qqRewR9C.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"NcUserBubble-MfDc1YR2.mjs","sources":["../../src/components/NcUserBubble/NcUserBubbleDiv.vue","../../src/components/NcUserBubble/NcUserBubble.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2021 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<template>\n\t<div>\n\t\t<slot name=\"trigger\" />\n\t</div>\n</template>\n\n<script>\nexport default {\n\tname: 'NcUserBubbleDiv',\n}\n</script>\n","<!--\n  - SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n\n### General description\n\nThis component displays a user together with a small avatar in a grey bubble.\nIt's possible to use an actual user's avatar, just an image/icon as a url or an icon-class,\nto link the bubble to e.g. a users profile\nand to show a popover on hover with e.g. the full user name handle / email address or something else.\n\nThis component has the following slot:\n* a default slot which is for the content of the popover (this is passed to the popover component directly).\n\n### Examples\n\n```vue\n<p>\n\tSome text before <NcUserBubble user=\"admin\" display-name=\"Admin Example\" url=\"/test\">@admin@foreign-host.com</NcUserBubble> and after the bubble.\n\t<NcUserBubble avatar-image=\"icon-group\" display-name=\"test group xyz\" :primary=\"true\">Hey there!</NcUserBubble>\n</p>\n```\n\n### Example with name slot\n\n```vue\n<template>\n<NcUserBubble\n\t:margin=\"4\"\n\t:size=\"30\"\n\tdisplay-name=\"Administrator\"\n\tuser=\"admin\">\n\t<template #name>\n\t\t<a href=\"#\"\n\t\t\ttitle=\"Remove user\"\n\t\t\tclass=\"icon-close\"\n\t\t\t@click=\"alert\" />\n\t</template>\n</NcUserBubble>\n</template>\n<script>\nexport default {\n\tmethods: {\n\t\talert() {\n\t\t\talert('Removed')\n\t\t},\n\t},\n}\n</script>\n<style>\n.icon-close {\n\tdisplay: block;\n\theight: 100%;\n}\n</style>\n```\n\n</docs>\n<template>\n\t<component :is=\"!!$slots.default ? 'NcPopover' : 'NcUserBubbleDiv'\"\n\t\ttrigger=\"hover focus\"\n\t\t:shown=\"open\"\n\t\tclass=\"user-bubble__wrapper\"\n\t\t@update:open=\"onOpenChange\">\n\t\t<!-- Main userbubble structure -->\n\t\t<template #trigger=\"{ attrs }\">\n\t\t\t<component :is=\"isLinkComponent\"\n\t\t\t\tclass=\"user-bubble__content\"\n\t\t\t\t:style=\"styles.content\"\n\t\t\t\t:to=\"to\"\n\t\t\t\t:href=\"hasUrl ? url : null\"\n\t\t\t\t:class=\"{ 'user-bubble__content--primary': primary }\"\n\t\t\t\tv-bind=\"attrs\"\n\t\t\t\t@click=\"onClick\">\n\t\t\t\t<!-- NcAvatar -->\n\t\t\t\t<NcAvatar :url=\"isCustomAvatar && isAvatarUrl ? avatarImage : undefined\"\n\t\t\t\t\t:icon-class=\"isCustomAvatar && !isAvatarUrl ? avatarImage : undefined\"\n\t\t\t\t\t:user=\"user\"\n\t\t\t\t\t:display-name=\"displayName\"\n\t\t\t\t\t:size=\"size - (margin * 2)\"\n\t\t\t\t\t:style=\"styles.avatar\"\n\t\t\t\t\t:disable-tooltip=\"true\"\n\t\t\t\t\t:disable-menu=\"true\"\n\t\t\t\t\t:show-user-status=\"showUserStatus\"\n\t\t\t\t\tclass=\"user-bubble__avatar\" />\n\n\t\t\t\t<!-- Name -->\n\t\t\t\t<span class=\"user-bubble__name\">\n\t\t\t\t\t{{ displayName || user }}\n\t\t\t\t</span>\n\n\t\t\t\t<!-- @slot Optional slot just after the name -->\n\t\t\t\t<span v-if=\"!!$slots.name\" class=\"user-bubble__secondary\">\n\t\t\t\t\t<slot name=\"name\" />\n\t\t\t\t</span>\n\t\t\t</component>\n\t\t</template>\n\n\t\t<!-- @slot Main Popover content on userbubble hover/focus -->\n\t\t<slot />\n\t</component>\n</template>\n\n<script>\nimport NcUserBubbleDiv from './NcUserBubbleDiv.vue'\nimport NcAvatar from '../NcAvatar/index.js'\nimport NcPopover from '../NcPopover/index.js'\nimport { warn } from 'vue'\nimport { RouterLink } from 'vue-router'\n\nexport default {\n\tname: 'NcUserBubble',\n\tcomponents: {\n\t\tNcAvatar,\n\t\tNcPopover,\n\t\tNcUserBubbleDiv,\n\t},\n\tprops: {\n\t\t/**\n\t\t * Override generated avatar, can be an url or an icon class\n\t\t */\n\t\tavatarImage: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\t\t/**\n\t\t * Provide the user id if this is a user\n\t\t */\n\t\tuser: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\t\t/**\n\t\t * Displayed label\n\t\t */\n\t\tdisplayName: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\t\t/**\n\t\t * Whether or not to display the user-status\n\t\t */\n\t\tshowUserStatus: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * Define the whole bubble as a link\n\t\t */\n\t\turl: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t\tvalidator: (url) => {\n\t\t\t\ttry {\n\t\t\t\t\turl = new URL(url, url?.startsWith?.('/') ? window.location.href : undefined)\n\t\t\t\t\treturn !!url\n\t\t\t\t} catch (error) {\n\t\t\t\t\treturn false\n\t\t\t\t}\n\t\t\t},\n\t\t},\n\t\t/**\n\t\t * Use bubble as a router-link for in-app navigation\n\t\t */\n\t\tto: {\n\t\t\ttype: [String, Object],\n\t\t\tdefault: undefined,\n\t\t},\n\t\t/**\n\t\t * Default popover state. Requires the UserBubble\n\t\t * to have some content to render inside the popover\n\t\t */\n\t\topen: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * Use the primary colour\n\t\t */\n\t\tprimary: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * This is the height of the component\n\t\t */\n\t\tsize: {\n\t\t\ttype: Number,\n\t\t\tdefault: 20,\n\t\t},\n\t\t/**\n\t\t * This is the margin of the avatar (size - margin = avatar size)\n\t\t */\n\t\tmargin: {\n\t\t\ttype: Number,\n\t\t\tdefault: 2,\n\t\t},\n\t},\n\temits: [\n\t\t'click',\n\t\t'update:open',\n\t],\n\tcomputed: {\n\t\t/**\n\t\t * Is the provided avatar url valid or not\n\t\t *\n\t\t * @return {boolean}\n\t\t */\n\t\tisAvatarUrl() {\n\t\t\tif (!this.avatarImage) {\n\t\t\t\treturn false\n\t\t\t}\n\n\t\t\ttry {\n\t\t\t\tconst url = new URL(this.avatarImage)\n\t\t\t\treturn !!url\n\t\t\t} catch (error) {\n\t\t\t\treturn false\n\t\t\t}\n\t\t},\n\t\t/**\n\t\t * Do we have a custom avatar or not\n\t\t *\n\t\t * @return {boolean}\n\t\t */\n\t\tisCustomAvatar() {\n\t\t\treturn !!this.avatarImage\n\t\t},\n\n\t\thasUrl() {\n\t\t\treturn this.url && this.url.trim() !== ''\n\t\t},\n\n\t\tisLinkComponent() {\n\t\t\tif (this.hasUrl) {\n\t\t\t\treturn 'a'\n\t\t\t} else if (this.to) {\n\t\t\t\treturn RouterLink\n\t\t\t} else {\n\t\t\t\treturn 'div'\n\t\t\t}\n\t\t},\n\n\t\tstyles() {\n\t\t\treturn {\n\t\t\t\tcontent: {\n\t\t\t\t\theight: this.size + 'px',\n\t\t\t\t\tlineHeight: this.size + 'px',\n\t\t\t\t\tborderRadius: this.size / 2 + 'px',\n\t\t\t\t},\n\t\t\t\tavatar: {\n\t\t\t\t\tmarginInlineStart: this.margin + 'px',\n\t\t\t\t},\n\t\t\t}\n\t\t},\n\t},\n\tmounted() {\n\t\tif (!this.displayName && !this.user) {\n\t\t\twarn('[NcUserBubble] At least `displayName` or `user` property should be set.')\n\t\t}\n\t},\n\tmethods: {\n\t\tonOpenChange(state) {\n\t\t\tthis.$emit('update:open', state)\n\t\t},\n\t\t/**\n\t\t * Catch and forward click event to parent\n\t\t *\n\t\t * @param {Event} event the click event\n\t\t */\n\t\tonClick(event) {\n\t\t\tthis.$emit('click', event)\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.user-bubble {\n\t&__wrapper {\n\t\t// align inline with text\n\t\tdisplay: inline-block;\n\t\tvertical-align: middle;\n\t\t// shrink and allow grow to fit\n\t\tmin-width: 0;\n\t\tmax-width: 100%;\n\t}\n\n\t&__content {\n\t\tdisplay: inline-flex;\n\t\tmax-width: 100%;\n\t\tbackground-color: var(--color-background-dark);\n\n\t\t&--primary {\n\t\t\tcolor: var(--color-primary-element-text);\n\t\t\tbackground-color: var(--color-primary-element);\n\t\t}\n\n\t\t> :last-child {\n\t\t\t// border radius end padding\n\t\t\tpadding-inline-end: 8px;\n\t\t}\n\t}\n\n\t&__avatar {\n\t\talign-self: center;\n\t}\n\n\t&__name {\n\t\toverflow: hidden;\n\t\twhite-space: nowrap;\n\t\ttext-overflow: ellipsis;\n\t}\n\n\t&__name,\n\t&__secondary {\n\t\t// proper spacing between avatar, name & slot\n\t\tpadding-block: 0;\n\t\tpadding-inline: 4px 0;\n\t}\n}\n</style>\n"],"names":["_sfc_main","_createElementBlock","_renderSlot","_openBlock","_createBlock","_resolveDynamicComponent","_withCtx","_mergeProps","_createVNode","_normalizeStyle","_createElementVNode","_toDisplayString","_createCommentVNode"],"mappings":"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"}
+{"version":3,"file":"NcUserBubble-qqRewR9C.mjs","sources":["../../src/components/NcUserBubble/NcUserBubbleDiv.vue","../../src/components/NcUserBubble/NcUserBubble.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2021 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<template>\n\t<div>\n\t\t<slot name=\"trigger\" />\n\t</div>\n</template>\n\n<script>\nexport default {\n\tname: 'NcUserBubbleDiv',\n}\n</script>\n","<!--\n  - SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n\n### General description\n\nThis component displays a user together with a small avatar in a grey bubble.\nIt's possible to use an actual user's avatar, just an image/icon as a url or an icon-class,\nto link the bubble to e.g. a users profile\nand to show a popover on hover with e.g. the full user name handle / email address or something else.\n\nThis component has the following slot:\n* a default slot which is for the content of the popover (this is passed to the popover component directly).\n\n### Examples\n\n```vue\n<p>\n\tSome text before <NcUserBubble user=\"admin\" display-name=\"Admin Example\" url=\"/test\">@admin@foreign-host.com</NcUserBubble> and after the bubble.\n\t<NcUserBubble avatar-image=\"icon-group\" display-name=\"test group xyz\" :primary=\"true\">Hey there!</NcUserBubble>\n</p>\n```\n\n### Example with name slot\n\n```vue\n<template>\n<NcUserBubble\n\t:margin=\"4\"\n\t:size=\"30\"\n\tdisplay-name=\"Administrator\"\n\tuser=\"admin\">\n\t<template #name>\n\t\t<a href=\"#\"\n\t\t\ttitle=\"Remove user\"\n\t\t\tclass=\"icon-close\"\n\t\t\t@click=\"alert\" />\n\t</template>\n</NcUserBubble>\n</template>\n<script>\nexport default {\n\tmethods: {\n\t\talert() {\n\t\t\talert('Removed')\n\t\t},\n\t},\n}\n</script>\n<style>\n.icon-close {\n\tdisplay: block;\n\theight: 100%;\n}\n</style>\n```\n\n</docs>\n<template>\n\t<component :is=\"!!$slots.default ? 'NcPopover' : 'NcUserBubbleDiv'\"\n\t\ttrigger=\"hover focus\"\n\t\t:shown=\"open\"\n\t\tclass=\"user-bubble__wrapper\"\n\t\t@update:open=\"onOpenChange\">\n\t\t<!-- Main userbubble structure -->\n\t\t<template #trigger=\"{ attrs }\">\n\t\t\t<component :is=\"isLinkComponent\"\n\t\t\t\tclass=\"user-bubble__content\"\n\t\t\t\t:style=\"styles.content\"\n\t\t\t\t:to=\"to\"\n\t\t\t\t:href=\"hasUrl ? url : null\"\n\t\t\t\t:class=\"{ 'user-bubble__content--primary': primary }\"\n\t\t\t\tv-bind=\"attrs\"\n\t\t\t\t@click=\"onClick\">\n\t\t\t\t<!-- NcAvatar -->\n\t\t\t\t<NcAvatar :url=\"isCustomAvatar && isAvatarUrl ? avatarImage : undefined\"\n\t\t\t\t\t:icon-class=\"isCustomAvatar && !isAvatarUrl ? avatarImage : undefined\"\n\t\t\t\t\t:user=\"user\"\n\t\t\t\t\t:display-name=\"displayName\"\n\t\t\t\t\t:size=\"size - (margin * 2)\"\n\t\t\t\t\t:style=\"styles.avatar\"\n\t\t\t\t\t:disable-tooltip=\"true\"\n\t\t\t\t\t:disable-menu=\"true\"\n\t\t\t\t\t:show-user-status=\"showUserStatus\"\n\t\t\t\t\tclass=\"user-bubble__avatar\" />\n\n\t\t\t\t<!-- Name -->\n\t\t\t\t<span class=\"user-bubble__name\">\n\t\t\t\t\t{{ displayName || user }}\n\t\t\t\t</span>\n\n\t\t\t\t<!-- @slot Optional slot just after the name -->\n\t\t\t\t<span v-if=\"!!$slots.name\" class=\"user-bubble__secondary\">\n\t\t\t\t\t<slot name=\"name\" />\n\t\t\t\t</span>\n\t\t\t</component>\n\t\t</template>\n\n\t\t<!-- @slot Main Popover content on userbubble hover/focus -->\n\t\t<slot />\n\t</component>\n</template>\n\n<script>\nimport NcUserBubbleDiv from './NcUserBubbleDiv.vue'\nimport NcAvatar from '../NcAvatar/index.js'\nimport NcPopover from '../NcPopover/index.js'\nimport { warn } from 'vue'\nimport { RouterLink } from 'vue-router'\n\nexport default {\n\tname: 'NcUserBubble',\n\tcomponents: {\n\t\tNcAvatar,\n\t\tNcPopover,\n\t\tNcUserBubbleDiv,\n\t},\n\tprops: {\n\t\t/**\n\t\t * Override generated avatar, can be an url or an icon class\n\t\t */\n\t\tavatarImage: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\t\t/**\n\t\t * Provide the user id if this is a user\n\t\t */\n\t\tuser: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\t\t/**\n\t\t * Displayed label\n\t\t */\n\t\tdisplayName: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\t\t/**\n\t\t * Whether or not to display the user-status\n\t\t */\n\t\tshowUserStatus: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * Define the whole bubble as a link\n\t\t */\n\t\turl: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t\tvalidator: (url) => {\n\t\t\t\ttry {\n\t\t\t\t\turl = new URL(url, url?.startsWith?.('/') ? window.location.href : undefined)\n\t\t\t\t\treturn !!url\n\t\t\t\t} catch (error) {\n\t\t\t\t\treturn false\n\t\t\t\t}\n\t\t\t},\n\t\t},\n\t\t/**\n\t\t * Use bubble as a router-link for in-app navigation\n\t\t */\n\t\tto: {\n\t\t\ttype: [String, Object],\n\t\t\tdefault: undefined,\n\t\t},\n\t\t/**\n\t\t * Default popover state. Requires the UserBubble\n\t\t * to have some content to render inside the popover\n\t\t */\n\t\topen: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * Use the primary colour\n\t\t */\n\t\tprimary: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * This is the height of the component\n\t\t */\n\t\tsize: {\n\t\t\ttype: Number,\n\t\t\tdefault: 20,\n\t\t},\n\t\t/**\n\t\t * This is the margin of the avatar (size - margin = avatar size)\n\t\t */\n\t\tmargin: {\n\t\t\ttype: Number,\n\t\t\tdefault: 2,\n\t\t},\n\t},\n\temits: [\n\t\t'click',\n\t\t'update:open',\n\t],\n\tcomputed: {\n\t\t/**\n\t\t * Is the provided avatar url valid or not\n\t\t *\n\t\t * @return {boolean}\n\t\t */\n\t\tisAvatarUrl() {\n\t\t\tif (!this.avatarImage) {\n\t\t\t\treturn false\n\t\t\t}\n\n\t\t\ttry {\n\t\t\t\tconst url = new URL(this.avatarImage)\n\t\t\t\treturn !!url\n\t\t\t} catch (error) {\n\t\t\t\treturn false\n\t\t\t}\n\t\t},\n\t\t/**\n\t\t * Do we have a custom avatar or not\n\t\t *\n\t\t * @return {boolean}\n\t\t */\n\t\tisCustomAvatar() {\n\t\t\treturn !!this.avatarImage\n\t\t},\n\n\t\thasUrl() {\n\t\t\treturn this.url && this.url.trim() !== ''\n\t\t},\n\n\t\tisLinkComponent() {\n\t\t\tif (this.hasUrl) {\n\t\t\t\treturn 'a'\n\t\t\t} else if (this.to) {\n\t\t\t\treturn RouterLink\n\t\t\t} else {\n\t\t\t\treturn 'div'\n\t\t\t}\n\t\t},\n\n\t\tstyles() {\n\t\t\treturn {\n\t\t\t\tcontent: {\n\t\t\t\t\theight: this.size + 'px',\n\t\t\t\t\tlineHeight: this.size + 'px',\n\t\t\t\t\tborderRadius: this.size / 2 + 'px',\n\t\t\t\t},\n\t\t\t\tavatar: {\n\t\t\t\t\tmarginInlineStart: this.margin + 'px',\n\t\t\t\t},\n\t\t\t}\n\t\t},\n\t},\n\tmounted() {\n\t\tif (!this.displayName && !this.user) {\n\t\t\twarn('[NcUserBubble] At least `displayName` or `user` property should be set.')\n\t\t}\n\t},\n\tmethods: {\n\t\tonOpenChange(state) {\n\t\t\tthis.$emit('update:open', state)\n\t\t},\n\t\t/**\n\t\t * Catch and forward click event to parent\n\t\t *\n\t\t * @param {Event} event the click event\n\t\t */\n\t\tonClick(event) {\n\t\t\tthis.$emit('click', event)\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.user-bubble {\n\t&__wrapper {\n\t\t// align inline with text\n\t\tdisplay: inline-block;\n\t\tvertical-align: middle;\n\t\t// shrink and allow grow to fit\n\t\tmin-width: 0;\n\t\tmax-width: 100%;\n\t}\n\n\t&__content {\n\t\tdisplay: inline-flex;\n\t\tmax-width: 100%;\n\t\tbackground-color: var(--color-background-dark);\n\n\t\t&--primary {\n\t\t\tcolor: var(--color-primary-element-text);\n\t\t\tbackground-color: var(--color-primary-element);\n\t\t}\n\n\t\t> :last-child {\n\t\t\t// border radius end padding\n\t\t\tpadding-inline-end: 8px;\n\t\t}\n\t}\n\n\t&__avatar {\n\t\talign-self: center;\n\t}\n\n\t&__name {\n\t\toverflow: hidden;\n\t\twhite-space: nowrap;\n\t\ttext-overflow: ellipsis;\n\t}\n\n\t&__name,\n\t&__secondary {\n\t\t// proper spacing between avatar, name & slot\n\t\tpadding-block: 0;\n\t\tpadding-inline: 4px 0;\n\t}\n}\n</style>\n"],"names":["_sfc_main","_createElementBlock","_renderSlot","_openBlock","_createBlock","_resolveDynamicComponent","_withCtx","_mergeProps","_createVNode","_normalizeStyle","_createElementVNode","_toDisplayString","_createCommentVNode"],"mappings":"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"}

package/dist/chunks/{NcUserStatusIcon-vtnkNASH.mjs → NcUserStatusIcon-DpZVD4HJ.mjs}

@@ -2,7 +2,7 @@ import '../assets/NcUserStatusIcon-Du-BEPk_.css';
 import axios from "@nextcloud/axios";
 import { generateOcsUrl } from "@nextcloud/router";
 import { getCapabilities } from "@nextcloud/capabilities";
-import { r as register, J as t10, a as t, K as t48 } from "./_l10n-BEP_UzXI.mjs";
+import { r as register, H as t10, a as t, I as t47 } from "./_l10n-BNGeEX3W.mjs";
 import { createElementBlock, createCommentVNode, openBlock, normalizeClass } from "vue";
 import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
 const onlineSvg = '<!--\n  - SPDX-FileCopyrightText: 2020 Google Inc.\n  - SPDX-License-Identifier: Apache-2.0\n-->\n<svg viewBox="0 0 16 16" width="16" height="16" xmlns="http://www.w3.org/2000/svg">\n	<path fill="var(--color-success)" d="M4.8 11.2h6.4V4.8H4.8v6.4zM8 0C3.6 0 0 3.6 0 8s3.6 8 8 8 8-3.6 8-8-3.6-8-8-8z" />\n</svg>\n';
@@ -29,7 +29,7 @@ const getUserStatusText = (status) => {
       return status;
   }
 };
-register(t48);
+register(t47);
 const _sfc_main = {
   name: "NcUserStatusIcon",
   props: {
@@ -134,3 +134,4 @@ export {
   NcUserStatusIcon as N,
   getUserStatusText as g
 };
+//# sourceMappingURL=NcUserStatusIcon-DpZVD4HJ.mjs.map

package/dist/chunks/{NcUserStatusIcon-vtnkNASH.mjs.map → NcUserStatusIcon-DpZVD4HJ.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"NcUserStatusIcon-vtnkNASH.mjs","sources":["../../src/assets/status-icons/user-status-online.svg?raw","../../src/assets/status-icons/user-status-away.svg?raw","../../src/assets/status-icons/user-status-dnd.svg?raw","../../src/assets/status-icons/user-status-invisible.svg?raw","../../src/utils/UserStatus.ts","../../src/components/NcUserStatusIcon/NcUserStatusIcon.vue"],"sourcesContent":["export default \"<!--\\n  - SPDX-FileCopyrightText: 2020 Google Inc.\\n  - SPDX-License-Identifier: Apache-2.0\\n-->\\n<svg viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\" height=\\\"16\\\" xmlns=\\\"http://www.w3.org/2000/svg\\\">\\n\\t<path fill=\\\"var(--color-success)\\\" d=\\\"M4.8 11.2h6.4V4.8H4.8v6.4zM8 0C3.6 0 0 3.6 0 8s3.6 8 8 8 8-3.6 8-8-3.6-8-8-8z\\\" />\\n</svg>\\n\"","export default \"<!--\\n  - SPDX-FileCopyrightText: 2020 Google Inc.\\n  - SPDX-License-Identifier: Apache-2.0\\n-->\\n<svg viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\" height=\\\"16\\\" xmlns=\\\"http://www.w3.org/2000/svg\\\">\\n\\t<path fill=\\\"none\\\" d=\\\"M-4-4h24v24H-4z\\\" />\\n\\t<path fill=\\\"var(--color-warning)\\\" d=\\\"M6.9.1C3 .6-.1 4-.1 8c0 4.4 3.6 8 8 8 4 0 7.4-3 8-6.9-1.2 1.3-2.9 2.1-4.7 2.1-3.5 0-6.4-2.9-6.4-6.4 0-1.9.8-3.6 2.1-4.7z\\\" />\\n</svg>\\n\"","export default \"<!--\\n  - SPDX-FileCopyrightText: 2020 Google Inc.\\n  - SPDX-License-Identifier: Apache-2.0\\n-->\\n<svg viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\" height=\\\"16\\\" xmlns=\\\"http://www.w3.org/2000/svg\\\">\\n\\t<path fill=\\\"none\\\" d=\\\"M-4-4h24v24H-4V-4z\\\" />\\n\\t<path fill=\\\"var(--color-error)\\\" d=\\\"M8 0C3.6 0 0 3.6 0 8s3.6 8 8 8 8-3.6 8-8-3.6-8-8-8z\\\" />\\n\\t<path fill=\\\"#fdffff\\\" d=\\\"M5 6.5h6c.8 0 1.5.7 1.5 1.5s-.7 1.5-1.5 1.5H5c-.8 0-1.5-.7-1.5-1.5S4.2 6.5 5 6.5z\\\" />\\n</svg>\\n\"","export default \"<!--\\n  - SPDX-FileCopyrightText: 2020 Google Inc.\\n  - SPDX-License-Identifier: Apache-2.0\\n-->\\n<svg viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\" height=\\\"16\\\" xmlns=\\\"http://www.w3.org/2000/svg\\\">\\n\\t<path fill=\\\"none\\\" d=\\\"M-4-4h24v24H-4V-4z\\\" />\\n\\t<path d=\\\"M8 0C3.6 0 0 3.6 0 8s3.6 8 8 8 8-3.6 8-8-3.6-8-8-8zm0 3.2c2.7 0 4.8 2.1 4.8 4.8s-2.1 4.8-4.8 4.8S3.2 10.7 3.2 8 5.3 3.2 8 3.2z\\\" />\\n</svg>\\n\"","/**\n * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\n\nimport { t } from '../l10n.js'\n\ntype Status = 'online' | 'away' | 'busy' | 'dnd' | 'invisible' | 'offline'\n\nexport const getUserStatusText = (status: Status): string => {\n\tswitch (status) {\n\tcase 'away': return t('away') // TRANSLATORS: User status if the user is currently away from keyboard\n\tcase 'busy': return t('busy')\n\tcase 'dnd': return t('do not disturb')\n\tcase 'online': return t('online')\n\tcase 'invisible': return t('invisible')\n\tcase 'offline': return t('offline')\n\tdefault: return status\n\t}\n}\n","<!--\n  - SPDX-FileCopyrightText: 2024 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n### Description\n\nThis component displays a user status icon.\n\n### Example\n\n```vue\n<template>\n\t<div class=\"row\">\n\t\t<NcUserStatusIcon status=\"online\" />\n\t\t<NcUserStatusIcon status=\"away\" />\n\t\t<NcUserStatusIcon status=\"dnd\" />\n\t\t<NcUserStatusIcon status=\"invisible\" />\n\t</div>\n</template>\n\n<style>\n.row {\n\tdisplay: flex;\n\tgap: 10px;\n}\n</style>\n```\n</docs>\n\n<template>\n\t<span v-if=\"activeStatus\"\n\t\tclass=\"user-status-icon\"\n\t\t:class=\"{\n\t\t\t'user-status-icon--invisible': ['invisible', 'offline'].includes(status),\n\t\t}\"\n\t\trole=\"img\"\n\t\t:aria-hidden=\"ariaHidden\"\n\t\t:aria-label=\"ariaLabel\"\n\t\tv-html=\"activeSvg\" /> <!-- eslint-disable-line vue/no-v-html -->\n</template>\n\n<script>\nimport axios from '@nextcloud/axios'\nimport { generateOcsUrl } from '@nextcloud/router'\nimport { getCapabilities } from '@nextcloud/capabilities'\n\nimport onlineSvg from '../../assets/status-icons/user-status-online.svg?raw'\nimport awaySvg from '../../assets/status-icons/user-status-away.svg?raw'\nimport dndSvg from '../../assets/status-icons/user-status-dnd.svg?raw'\nimport invisibleSvg from '../../assets/status-icons/user-status-invisible.svg?raw'\n\nimport { getUserStatusText } from '../../utils/UserStatus.ts'\nimport { t } from '../../l10n.js'\n\nexport default {\n\tname: 'NcUserStatusIcon',\n\n\tprops: {\n\t\t/**\n\t\t * Set the user id to fetch the status\n\t\t */\n\t\tuser: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * Set the status\n\t\t *\n\t\t * @type {'online' | 'away' | 'busy' | 'dnd' | 'invisible' | 'offline'}\n\t\t */\n\t\tstatus: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t\tvalidator: (value) => [\n\t\t\t\t'online',\n\t\t\t\t'away',\n\t\t\t\t'busy',\n\t\t\t\t'dnd',\n\t\t\t\t'invisible',\n\t\t\t\t'offline',\n\t\t\t].includes(value),\n\t\t},\n\n\t\t/**\n\t\t * Set the `aria-hidden` attribute\n\t\t *\n\t\t * @type {'true' | 'false'}\n\t\t */\n\t\tariaHidden: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t\tvalidator: (value) => [\n\t\t\t\t'true',\n\t\t\t\t'false',\n\t\t\t].includes(value),\n\t\t},\n\t},\n\n\tdata() {\n\t\treturn {\n\t\t\tfetchedUserStatus: null,\n\t\t}\n\t},\n\n\tcomputed: {\n\t\tactiveStatus() {\n\t\t\treturn this.status ?? this.fetchedUserStatus\n\t\t},\n\n\t\tactiveSvg() {\n\t\t\tconst matchSvg = {\n\t\t\t\tonline: onlineSvg,\n\t\t\t\taway: awaySvg,\n\t\t\t\tbusy: awaySvg,\n\t\t\t\tdnd: dndSvg,\n\t\t\t\tinvisible: invisibleSvg,\n\t\t\t\toffline: invisibleSvg,\n\t\t\t}\n\t\t\treturn matchSvg[this.activeStatus] ?? null\n\t\t},\n\n\t\tariaLabel() {\n\t\t\tif (this.ariaHidden === 'true') {\n\t\t\t\treturn null\n\t\t\t}\n\t\t\treturn t('User status: {status}', { status: getUserStatusText(this.activeStatus) })\n\t\t},\n\t},\n\n\twatch: {\n\t\tuser: {\n\t\t\timmediate: true,\n\t\t\tasync handler(user) {\n\t\t\t\tif (!user || !getCapabilities()?.user_status?.enabled) {\n\t\t\t\t\tthis.fetchedUserStatus = null\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t\ttry {\n\t\t\t\t\tconst { data } = await axios.get(generateOcsUrl('/apps/user_status/api/v1/statuses/{user}', { user }))\n\t\t\t\t\tthis.fetchedUserStatus = data.ocs?.data?.status\n\t\t\t\t} catch (error) {\n\t\t\t\t\tthis.fetchedUserStatus = null\n\t\t\t\t}\n\t\t\t},\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.user-status-icon {\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tmin-width: 16px;\n\tmin-height: 16px;\n\tmax-width: 20px;\n\tmax-height: 20px;\n\n\t&--invisible {\n\t\tfilter: var(--background-invert-if-dark);\n\t}\n}\n</style>\n"],"names":["_createElementBlock","_normalizeClass","_createCommentVNode"],"mappings":";;;;;;AAAA,MAAe,YAAA;ACAf,MAAe,UAAA;ACAf,MAAe,SAAA;ACAf,MAAe,eAAA;;ACSF,MAAA,oBAAoB,CAAC,WAA2B;AAC5D,UAAQ,QAAQ;AAAA,IAChB,KAAK;AAAQ,aAAO,EAAE,MAAM;AAAA;AAAA,IAC5B,KAAK;AAAQ,aAAO,EAAE,MAAM;AAAA,IAC5B,KAAK;AAAO,aAAO,EAAE,gBAAgB;AAAA,IACrC,KAAK;AAAU,aAAO,EAAE,QAAQ;AAAA,IAChC,KAAK;AAAa,aAAO,EAAE,WAAW;AAAA,IACtC,KAAK;AAAW,aAAO,EAAE,SAAS;AAAA,IAClC;AAAgB,aAAA;AAAA,EAAA;AAEjB;;ACqCA,MAAK,YAAU;AAAA,EACd,MAAM;AAAA,EAEN,OAAO;AAAA;AAAA;AAAA;AAAA,IAIN,MAAM;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOD,QAAQ;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,MACT,WAAW,CAAC,UAAU;AAAA,QACrB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACD,EAAE,SAAS,KAAK;AAAA,IAChB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOD,YAAY;AAAA,MACX,MAAM;AAAA,MACN,SAAS;AAAA,MACT,WAAW,CAAC,UAAU;AAAA,QACrB;AAAA,QACA;AAAA,MACD,EAAE,SAAS,KAAK;AAAA,IAChB;AAAA,EACD;AAAA,EAED,OAAO;AACN,WAAO;AAAA,MACN,mBAAmB;AAAA,IACpB;AAAA,EACA;AAAA,EAED,UAAU;AAAA,IACT,eAAe;AACd,aAAO,KAAK,UAAU,KAAK;AAAA,IAC3B;AAAA,IAED,YAAY;AACX,YAAM,WAAW;AAAA,QAChB,QAAQ;AAAA,QACR,MAAM;AAAA,QACN,MAAM;AAAA,QACN,KAAK;AAAA,QACL,WAAW;AAAA,QACX,SAAS;AAAA,MACV;AACA,aAAO,SAAS,KAAK,YAAY,KAAK;AAAA,IACtC;AAAA,IAED,YAAY;AACX,UAAI,KAAK,eAAe,QAAQ;AAC/B,eAAO;AAAA,MACR;AACA,aAAO,EAAE,yBAAyB,EAAE,QAAQ,kBAAkB,KAAK,YAAY,EAAG,CAAA;AAAA,IAClF;AAAA,EACD;AAAA,EAED,OAAO;AAAA,IACN,MAAM;AAAA,MACL,WAAW;AAAA,MACX,MAAM,QAAQ,MAAM;AACnB,YAAI,CAAC,QAAQ,CAAC,gBAAe,GAAI,aAAa,SAAS;AACtD,eAAK,oBAAoB;AACzB;AAAA,QACD;AACA,YAAI;AACH,gBAAM,EAAE,SAAS,MAAM,MAAM,IAAI,eAAe,4CAA4C,EAAE,MAAM,CAAC;AACrG,eAAK,oBAAoB,KAAK,KAAK,MAAM;AAAA,QACxC,SAAO,OAAO;AACf,eAAK,oBAAoB;AAAA,QAC1B;AAAA,MACA;AAAA,IACD;AAAA,EACD;AACF;AArJA,MAAA,aAAA,CAAA,eAAA,cAAA,WAAA;;SAgCa,SAAY,6BAAxBA,mBAQsB,QAAA;AAAA,IAxCvB,KAAA;AAAA,IAiCE,OAjCFC,gBAiCQ,oBAAkB;AAAA,MAC6C,+BAAA,CAAA,aAAA,SAAA,EAAA,SAAS,OAAM,MAAA;AAAA;IAGpF,MAAK;AAAA,IACJ,eAAa,OAAU;AAAA,IACvB,cAAY,SAAS;AAAA,IACtB,WAAQ,SAAS;AAAA,EAxCnB,GAAA,MAAA,IAAA,UAAA,KAAAC,mBAAA,IAAA,IAAA;;;"}
+{"version":3,"file":"NcUserStatusIcon-DpZVD4HJ.mjs","sources":["../../src/assets/status-icons/user-status-online.svg?raw","../../src/assets/status-icons/user-status-away.svg?raw","../../src/assets/status-icons/user-status-dnd.svg?raw","../../src/assets/status-icons/user-status-invisible.svg?raw","../../src/utils/UserStatus.ts","../../src/components/NcUserStatusIcon/NcUserStatusIcon.vue"],"sourcesContent":["export default \"<!--\\n  - SPDX-FileCopyrightText: 2020 Google Inc.\\n  - SPDX-License-Identifier: Apache-2.0\\n-->\\n<svg viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\" height=\\\"16\\\" xmlns=\\\"http://www.w3.org/2000/svg\\\">\\n\\t<path fill=\\\"var(--color-success)\\\" d=\\\"M4.8 11.2h6.4V4.8H4.8v6.4zM8 0C3.6 0 0 3.6 0 8s3.6 8 8 8 8-3.6 8-8-3.6-8-8-8z\\\" />\\n</svg>\\n\"","export default \"<!--\\n  - SPDX-FileCopyrightText: 2020 Google Inc.\\n  - SPDX-License-Identifier: Apache-2.0\\n-->\\n<svg viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\" height=\\\"16\\\" xmlns=\\\"http://www.w3.org/2000/svg\\\">\\n\\t<path fill=\\\"none\\\" d=\\\"M-4-4h24v24H-4z\\\" />\\n\\t<path fill=\\\"var(--color-warning)\\\" d=\\\"M6.9.1C3 .6-.1 4-.1 8c0 4.4 3.6 8 8 8 4 0 7.4-3 8-6.9-1.2 1.3-2.9 2.1-4.7 2.1-3.5 0-6.4-2.9-6.4-6.4 0-1.9.8-3.6 2.1-4.7z\\\" />\\n</svg>\\n\"","export default \"<!--\\n  - SPDX-FileCopyrightText: 2020 Google Inc.\\n  - SPDX-License-Identifier: Apache-2.0\\n-->\\n<svg viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\" height=\\\"16\\\" xmlns=\\\"http://www.w3.org/2000/svg\\\">\\n\\t<path fill=\\\"none\\\" d=\\\"M-4-4h24v24H-4V-4z\\\" />\\n\\t<path fill=\\\"var(--color-error)\\\" d=\\\"M8 0C3.6 0 0 3.6 0 8s3.6 8 8 8 8-3.6 8-8-3.6-8-8-8z\\\" />\\n\\t<path fill=\\\"#fdffff\\\" d=\\\"M5 6.5h6c.8 0 1.5.7 1.5 1.5s-.7 1.5-1.5 1.5H5c-.8 0-1.5-.7-1.5-1.5S4.2 6.5 5 6.5z\\\" />\\n</svg>\\n\"","export default \"<!--\\n  - SPDX-FileCopyrightText: 2020 Google Inc.\\n  - SPDX-License-Identifier: Apache-2.0\\n-->\\n<svg viewBox=\\\"0 0 16 16\\\" width=\\\"16\\\" height=\\\"16\\\" xmlns=\\\"http://www.w3.org/2000/svg\\\">\\n\\t<path fill=\\\"none\\\" d=\\\"M-4-4h24v24H-4V-4z\\\" />\\n\\t<path d=\\\"M8 0C3.6 0 0 3.6 0 8s3.6 8 8 8 8-3.6 8-8-3.6-8-8-8zm0 3.2c2.7 0 4.8 2.1 4.8 4.8s-2.1 4.8-4.8 4.8S3.2 10.7 3.2 8 5.3 3.2 8 3.2z\\\" />\\n</svg>\\n\"","/**\n * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\n\nimport { t } from '../l10n.js'\n\ntype Status = 'online' | 'away' | 'busy' | 'dnd' | 'invisible' | 'offline'\n\nexport const getUserStatusText = (status: Status): string => {\n\tswitch (status) {\n\tcase 'away': return t('away') // TRANSLATORS: User status if the user is currently away from keyboard\n\tcase 'busy': return t('busy')\n\tcase 'dnd': return t('do not disturb')\n\tcase 'online': return t('online')\n\tcase 'invisible': return t('invisible')\n\tcase 'offline': return t('offline')\n\tdefault: return status\n\t}\n}\n","<!--\n  - SPDX-FileCopyrightText: 2024 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n### Description\n\nThis component displays a user status icon.\n\n### Example\n\n```vue\n<template>\n\t<div class=\"row\">\n\t\t<NcUserStatusIcon status=\"online\" />\n\t\t<NcUserStatusIcon status=\"away\" />\n\t\t<NcUserStatusIcon status=\"dnd\" />\n\t\t<NcUserStatusIcon status=\"invisible\" />\n\t</div>\n</template>\n\n<style>\n.row {\n\tdisplay: flex;\n\tgap: 10px;\n}\n</style>\n```\n</docs>\n\n<template>\n\t<span v-if=\"activeStatus\"\n\t\tclass=\"user-status-icon\"\n\t\t:class=\"{\n\t\t\t'user-status-icon--invisible': ['invisible', 'offline'].includes(status),\n\t\t}\"\n\t\trole=\"img\"\n\t\t:aria-hidden=\"ariaHidden\"\n\t\t:aria-label=\"ariaLabel\"\n\t\tv-html=\"activeSvg\" /> <!-- eslint-disable-line vue/no-v-html -->\n</template>\n\n<script>\nimport axios from '@nextcloud/axios'\nimport { generateOcsUrl } from '@nextcloud/router'\nimport { getCapabilities } from '@nextcloud/capabilities'\n\nimport onlineSvg from '../../assets/status-icons/user-status-online.svg?raw'\nimport awaySvg from '../../assets/status-icons/user-status-away.svg?raw'\nimport dndSvg from '../../assets/status-icons/user-status-dnd.svg?raw'\nimport invisibleSvg from '../../assets/status-icons/user-status-invisible.svg?raw'\n\nimport { getUserStatusText } from '../../utils/UserStatus.ts'\nimport { t } from '../../l10n.js'\n\nexport default {\n\tname: 'NcUserStatusIcon',\n\n\tprops: {\n\t\t/**\n\t\t * Set the user id to fetch the status\n\t\t */\n\t\tuser: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * Set the status\n\t\t *\n\t\t * @type {'online' | 'away' | 'busy' | 'dnd' | 'invisible' | 'offline'}\n\t\t */\n\t\tstatus: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t\tvalidator: (value) => [\n\t\t\t\t'online',\n\t\t\t\t'away',\n\t\t\t\t'busy',\n\t\t\t\t'dnd',\n\t\t\t\t'invisible',\n\t\t\t\t'offline',\n\t\t\t].includes(value),\n\t\t},\n\n\t\t/**\n\t\t * Set the `aria-hidden` attribute\n\t\t *\n\t\t * @type {'true' | 'false'}\n\t\t */\n\t\tariaHidden: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t\tvalidator: (value) => [\n\t\t\t\t'true',\n\t\t\t\t'false',\n\t\t\t].includes(value),\n\t\t},\n\t},\n\n\tdata() {\n\t\treturn {\n\t\t\tfetchedUserStatus: null,\n\t\t}\n\t},\n\n\tcomputed: {\n\t\tactiveStatus() {\n\t\t\treturn this.status ?? this.fetchedUserStatus\n\t\t},\n\n\t\tactiveSvg() {\n\t\t\tconst matchSvg = {\n\t\t\t\tonline: onlineSvg,\n\t\t\t\taway: awaySvg,\n\t\t\t\tbusy: awaySvg,\n\t\t\t\tdnd: dndSvg,\n\t\t\t\tinvisible: invisibleSvg,\n\t\t\t\toffline: invisibleSvg,\n\t\t\t}\n\t\t\treturn matchSvg[this.activeStatus] ?? null\n\t\t},\n\n\t\tariaLabel() {\n\t\t\tif (this.ariaHidden === 'true') {\n\t\t\t\treturn null\n\t\t\t}\n\t\t\treturn t('User status: {status}', { status: getUserStatusText(this.activeStatus) })\n\t\t},\n\t},\n\n\twatch: {\n\t\tuser: {\n\t\t\timmediate: true,\n\t\t\tasync handler(user) {\n\t\t\t\tif (!user || !getCapabilities()?.user_status?.enabled) {\n\t\t\t\t\tthis.fetchedUserStatus = null\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t\ttry {\n\t\t\t\t\tconst { data } = await axios.get(generateOcsUrl('/apps/user_status/api/v1/statuses/{user}', { user }))\n\t\t\t\t\tthis.fetchedUserStatus = data.ocs?.data?.status\n\t\t\t\t} catch (error) {\n\t\t\t\t\tthis.fetchedUserStatus = null\n\t\t\t\t}\n\t\t\t},\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.user-status-icon {\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tmin-width: 16px;\n\tmin-height: 16px;\n\tmax-width: 20px;\n\tmax-height: 20px;\n\n\t&--invisible {\n\t\tfilter: var(--background-invert-if-dark);\n\t}\n}\n</style>\n"],"names":["_createElementBlock","_normalizeClass","_createCommentVNode"],"mappings":";;;;;;AAAA,MAAe,YAAA;ACAf,MAAe,UAAA;ACAf,MAAe,SAAA;ACAf,MAAe,eAAA;;ACSF,MAAA,oBAAoB,CAAC,WAA2B;AAC5D,UAAQ,QAAQ;AAAA,IAChB,KAAK;AAAQ,aAAO,EAAE,MAAM;AAAA;AAAA,IAC5B,KAAK;AAAQ,aAAO,EAAE,MAAM;AAAA,IAC5B,KAAK;AAAO,aAAO,EAAE,gBAAgB;AAAA,IACrC,KAAK;AAAU,aAAO,EAAE,QAAQ;AAAA,IAChC,KAAK;AAAa,aAAO,EAAE,WAAW;AAAA,IACtC,KAAK;AAAW,aAAO,EAAE,SAAS;AAAA,IAClC;AAAgB,aAAA;AAAA,EAAA;AAEjB;;ACqCA,MAAK,YAAU;AAAA,EACd,MAAM;AAAA,EAEN,OAAO;AAAA;AAAA;AAAA;AAAA,IAIN,MAAM;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOD,QAAQ;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,MACT,WAAW,CAAC,UAAU;AAAA,QACrB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACD,EAAE,SAAS,KAAK;AAAA,IAChB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOD,YAAY;AAAA,MACX,MAAM;AAAA,MACN,SAAS;AAAA,MACT,WAAW,CAAC,UAAU;AAAA,QACrB;AAAA,QACA;AAAA,MACD,EAAE,SAAS,KAAK;AAAA,IAChB;AAAA,EACD;AAAA,EAED,OAAO;AACN,WAAO;AAAA,MACN,mBAAmB;AAAA,IACpB;AAAA,EACA;AAAA,EAED,UAAU;AAAA,IACT,eAAe;AACd,aAAO,KAAK,UAAU,KAAK;AAAA,IAC3B;AAAA,IAED,YAAY;AACX,YAAM,WAAW;AAAA,QAChB,QAAQ;AAAA,QACR,MAAM;AAAA,QACN,MAAM;AAAA,QACN,KAAK;AAAA,QACL,WAAW;AAAA,QACX,SAAS;AAAA,MACV;AACA,aAAO,SAAS,KAAK,YAAY,KAAK;AAAA,IACtC;AAAA,IAED,YAAY;AACX,UAAI,KAAK,eAAe,QAAQ;AAC/B,eAAO;AAAA,MACR;AACA,aAAO,EAAE,yBAAyB,EAAE,QAAQ,kBAAkB,KAAK,YAAY,EAAG,CAAA;AAAA,IAClF;AAAA,EACD;AAAA,EAED,OAAO;AAAA,IACN,MAAM;AAAA,MACL,WAAW;AAAA,MACX,MAAM,QAAQ,MAAM;AACnB,YAAI,CAAC,QAAQ,CAAC,gBAAe,GAAI,aAAa,SAAS;AACtD,eAAK,oBAAoB;AACzB;AAAA,QACD;AACA,YAAI;AACH,gBAAM,EAAE,SAAS,MAAM,MAAM,IAAI,eAAe,4CAA4C,EAAE,MAAM,CAAC;AACrG,eAAK,oBAAoB,KAAK,KAAK,MAAM;AAAA,QACxC,SAAO,OAAO;AACf,eAAK,oBAAoB;AAAA,QAC1B;AAAA,MACA;AAAA,IACD;AAAA,EACD;AACF;AArJA,MAAA,aAAA,CAAA,eAAA,cAAA,WAAA;;SAgCa,SAAY,6BAAxBA,mBAQsB,QAAA;AAAA,IAxCvB,KAAA;AAAA,IAiCE,OAjCFC,gBAiCQ,oBAAkB;AAAA,MAC6C,+BAAA,CAAA,aAAA,SAAA,EAAA,SAAS,OAAM,MAAA;AAAA;IAGpF,MAAK;AAAA,IACJ,eAAa,OAAU;AAAA,IACvB,cAAY,SAAS;AAAA,IACtB,WAAQ,SAAS;AAAA,EAxCnB,GAAA,MAAA,IAAA,UAAA,KAAAC,mBAAA,IAAA,IAAA;;;"}

package/dist/chunks/{ScopeComponent-DgRMJomt.mjs → ScopeComponent-BIpNSmeE.mjs}

@@ -5,10 +5,11 @@ const ScopeComponent = (Component) => {
     Component.mounted = [Component.mounted];
   }
   Component.mounted.push(function() {
-    this.$el.setAttribute(`data-v-${"448853f"}`, "");
+    this.$el.setAttribute(`data-v-${"b56a8b9"}`, "");
   });
   return Component;
 };
 export {
   ScopeComponent as S
 };
+//# sourceMappingURL=ScopeComponent-BIpNSmeE.mjs.map

package/dist/chunks/{ScopeComponent-DgRMJomt.mjs.map → ScopeComponent-BIpNSmeE.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"ScopeComponent-DgRMJomt.mjs","sources":["../../src/utils/ScopeComponent.js"],"sourcesContent":["/**\n * SPDX-FileCopyrightText: 2018 Nextcloud GmbH and Nextcloud contributors\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\n\nconst ScopeComponent = (Component) => {\n\t// Init mounted vue if none\n\tif (!Component.mounted) {\n\t\tComponent.mounted = []\n\t} else if (!Array.isArray(Component.mounted)) {\n\t\tComponent.mounted = [Component.mounted]\n\t}\n\n\t// Inject root scoping function\n\tComponent.mounted.push(function() {\n\t\tthis.$el.setAttribute(`data-v-${SCOPE_VERSION}`, '')\n\t})\n\n\treturn Component\n}\n\nexport default ScopeComponent\n"],"names":[],"mappings":"AAKK,MAAC,iBAAiB,CAAC,cAAc;AAErC,MAAI,CAAC,UAAU,SAAS;AACvB,cAAU,UAAU,CAAA;AAAA,EACpB,WAAU,CAAC,MAAM,QAAQ,UAAU,OAAO,GAAG;AAC7C,cAAU,UAAU,CAAC,UAAU,OAAO;AAAA,EACxC;AAGC,YAAU,QAAQ,KAAK,WAAW;AACjC,SAAK,IAAI,aAAa,UAAU,SAAa,IAAI,EAAE;AAAA,EACnD,CAAA;AAED,SAAO;AACR;"}
+{"version":3,"file":"ScopeComponent-BIpNSmeE.mjs","sources":["../../src/utils/ScopeComponent.js"],"sourcesContent":["/**\n * SPDX-FileCopyrightText: 2018 Nextcloud GmbH and Nextcloud contributors\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\n\nconst ScopeComponent = (Component) => {\n\t// Init mounted vue if none\n\tif (!Component.mounted) {\n\t\tComponent.mounted = []\n\t} else if (!Array.isArray(Component.mounted)) {\n\t\tComponent.mounted = [Component.mounted]\n\t}\n\n\t// Inject root scoping function\n\tComponent.mounted.push(function() {\n\t\tthis.$el.setAttribute(`data-v-${SCOPE_VERSION}`, '')\n\t})\n\n\treturn Component\n}\n\nexport default ScopeComponent\n"],"names":[],"mappings":"AAKK,MAAC,iBAAiB,CAAC,cAAc;AAErC,MAAI,CAAC,UAAU,SAAS;AACvB,cAAU,UAAU,CAAA;AAAA,EACpB,WAAU,CAAC,MAAM,QAAQ,UAAU,OAAO,GAAG;AAC7C,cAAU,UAAU,CAAC,UAAU,OAAO;AAAA,EACxC;AAGC,YAAU,QAAQ,KAAK,WAAW;AACjC,SAAK,IAAI,aAAa,UAAU,SAAa,IAAI,EAAE;AAAA,EACnD,CAAA;AAED,SAAO;AACR;"}