@nextcloud/vue 8.26.1 → 8.28.0

package/dist/Components/NcEmptyContent.mjs

@@ -1,4 +1,4 @@
-import '../assets/NcEmptyContent-CSsXYYcn.css';
+import '../assets/NcEmptyContent-CHVEJoER.css';
 import { n as normalizeComponent } from "../chunks/_plugin-vue2_normalizer-DU4iP6Vu.mjs";
 const _sfc_main = {
   name: "NcEmptyContent",
@@ -47,7 +47,7 @@ var __component__ = /* @__PURE__ */ normalizeComponent(
   _sfc_staticRenderFns,
   false,
   null,
-  "12126d08"
+  "8aaa3146"
 );
 const NcEmptyContent = __component__.exports;
 export {

package/dist/Components/NcEmptyContent.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"NcEmptyContent.mjs","sources":["../../src/components/NcEmptyContent/NcEmptyContent.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2020 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n### Basic use\n\nUse this component to display a message about an empty content.\nProviding an icon, name, and a description is strongly advised.\n\n```\n<template>\n\t<NcEmptyContent name=\"No comments\"\n\t\tdescription=\"Start writing comments and they will appear here.\">\n\t\t<template #icon>\n\t\t\t<Comment />\n\t\t</template>\n\t</NcEmptyContent>\n</template>\n\n<script>\nimport Comment from 'vue-material-design-icons/Comment.vue'\n\nexport default {\n\tcomponents: {\n\t\tComment,\n\t},\n}\n</script>\n```\n#### With custom svg\n\n```\n<template>\n\t<NcEmptyContent\n\t\tname=\"No files in here\">\n\t\t<template #icon>\n\t\t\t<NcIconSvgWrapper :svg=\"folderSvg\" />\n\t\t</template>\n\t</NcEmptyContent>\n</template>\n\n<script>\nimport folderSvg from '@mdi/svg/svg/folder.svg?raw'\n\nexport default {\n\tcomponents: {\n\t\tComment,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tfolderSvg,\n\t\t}\n\t},\n}\n</script>\n```\n\nYou can also customize the name using the `#name` slot\nand add actions. But to keep the style consistent across Nextcloud\nconsider only using header elements as the root elements for the name slot.\n\n```\n<template>\n\t<NcEmptyContent\n\t\tdescription=\"No comments in here\">\n\t\t<template #icon>\n\t\t\t<Comment />\n\t\t</template>\n\t\t<template #name>\n\t\t\t<h1 class=\"empty-content__name\">\n\t\t\t\tNo comments\n\t\t\t</h1>\n\t\t</template>\n\t\t<template #action>\n\t\t\t<NcButton variant=\"primary\">\n\t\t\t\tAdd a comment!\n\t\t\t</NcButton>\n\t\t</template>\n\t</NcEmptyContent>\n</template>\n\n<script>\nimport Comment from 'vue-material-design-icons/Comment.vue'\n\nexport default {\n\tcomponents: {\n\t\tComment,\n\t},\n}\n</script>\n```\n\nSimilar to the `#name` slot, you could also use the `#description` slot.\nThe content will be rendered within a paragraph so you can use any inline element,\nlike a link.\n\n```\n<template>\n\t<NcEmptyContent\n\t\tname=\"No comments\">\n\t\t<template #icon>\n\t\t\t<Comment />\n\t\t</template>\n\t\t<template #description>\n\t\t\t<a href=\"https://en.wikipedia.org/wiki/Comment\">What is even a comment?</a>\n\t\t</template>\n\t</NcEmptyContent>\n</template>\n\n<script>\nimport Comment from 'vue-material-design-icons/Comment.vue'\n\nexport default {\n\tcomponents: {\n\t\tComment,\n\t},\n}\n</script>\n```\n</docs>\n\n<template>\n\t<div class=\"empty-content\" role=\"note\">\n\t\t<div v-if=\"$slots.icon\" class=\"empty-content__icon\" aria-hidden=\"true\">\n\t\t\t<!-- @slot Optional material design icon -->\n\t\t\t<slot name=\"icon\" />\n\t\t</div>\n\t\t<!-- @slot Optional name if not set as property, shall be enclosed by a header element -->\n\t\t<slot name=\"name\">\n\t\t\t<span v-if=\"hasName\" class=\"empty-content__name\">\n\t\t\t\t{{ name }}\n\t\t\t</span>\n\t\t</slot>\n\t\t<p v-if=\"hasDescription\" class=\"empty-content__description\">\n\t\t\t<!-- @slot Optional formatted description rendered inside a paragraph -->\n\t\t\t<slot name=\"description\">\n\t\t\t\t{{ description }}\n\t\t\t</slot>\n\t\t</p>\n\t\t<div v-if=\"$slots.action\" class=\"empty-content__action\">\n\t\t\t<!-- @slot Optional slot for a button or the like -->\n\t\t\t<slot name=\"action\" />\n\t\t</div>\n\t</div>\n</template>\n\n<script>\nexport default {\n\tname: 'NcEmptyContent',\n\n\tprops: {\n\t\t/**\n\t\t * A header message about an empty content shown\n\t\t * @example 'No comments'\n\t\t */\n\t\tname: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * Desription of the empty content\n\t\t * @example 'No comments yet, start the conversation!'\n\t\t */\n\t\tdescription: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\t},\n\n\tcomputed: {\n\t\thasName() {\n\t\t\treturn this.name !== ''\n\t\t},\n\t\t/**\n\t\t * Check if a description is given as either property or slot\n\t\t */\n\t\thasDescription() {\n\t\t\treturn this.description !== '' || this.$slots.description?.[0]\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.empty-content {\n\tdisplay: flex;\n\talign-items: center;\n\tflex-direction: column;\n\tjustify-content: center;\n\t/* In case of using in a flex container - flex in advance */\n\tflex-grow: 1;\n\n\t.modal-wrapper & {\n\t\tmargin-top: 5vh;\n\t\tmargin-bottom: 5vh;\n\t}\n\n\t&__icon {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\twidth: 64px;\n\t\theight: 64px;\n\t\tmargin: 0 auto 15px;\n\t\topacity: .4;\n\t\tbackground-repeat: no-repeat;\n\t\tbackground-position: center;\n\t\tbackground-size: 64px;\n\n\t\t:deep(svg) {\n\t\t\twidth: 64px !important;\n\t\t\theight: 64px !important;\n\t\t\tmax-width: 64px !important;\n\t\t\tmax-height: 64px !important;\n\t\t}\n\t}\n\n\t&__name {\n\t\tmargin-bottom: 10px;\n\t\ttext-align: center;\n\t\tfont-weight: bold;\n\t\tfont-size: 20px;\n\t\tline-height: 30px;\n\t}\n\n\t&__description {\n\t\tcolor: var(--color-text-maxcontrast);\n\t}\n\n\t&__action {\n\t\tmargin-top: 8px;\n\n\t\t.modal-wrapper & {\n\t\t\tmargin-top: 20px;\n\t\t\tdisplay: flex;\n\t\t}\n\t}\n}\n</style>\n"],"names":[],"mappings":";AAqJA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,UAAA;AACA,aAAA,KAAA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAIA,iBAAA;AACA,aAAA,KAAA,gBAAA,MAAA,KAAA,OAAA,cAAA,CAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"NcEmptyContent.mjs","sources":["../../src/components/NcEmptyContent/NcEmptyContent.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2020 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n### Basic use\n\nUse this component to display a message about an empty content.\nProviding an icon, name, and a description is strongly advised.\n\n```\n<template>\n\t<NcEmptyContent name=\"No comments\"\n\t\tdescription=\"Start writing comments and they will appear here.\">\n\t\t<template #icon>\n\t\t\t<Comment />\n\t\t</template>\n\t</NcEmptyContent>\n</template>\n\n<script>\nimport Comment from 'vue-material-design-icons/Comment.vue'\n\nexport default {\n\tcomponents: {\n\t\tComment,\n\t},\n}\n</script>\n```\n#### With custom svg\n\n```\n<template>\n\t<NcEmptyContent\n\t\tname=\"No files in here\">\n\t\t<template #icon>\n\t\t\t<NcIconSvgWrapper :svg=\"folderSvg\" />\n\t\t</template>\n\t</NcEmptyContent>\n</template>\n\n<script>\nimport folderSvg from '@mdi/svg/svg/folder.svg?raw'\n\nexport default {\n\tcomponents: {\n\t\tComment,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tfolderSvg,\n\t\t}\n\t},\n}\n</script>\n```\n\nYou can also customize the name using the `#name` slot\nand add actions. But to keep the style consistent across Nextcloud\nconsider only using header elements as the root elements for the name slot.\n\n```\n<template>\n\t<NcEmptyContent\n\t\tdescription=\"No comments in here\">\n\t\t<template #icon>\n\t\t\t<Comment />\n\t\t</template>\n\t\t<template #name>\n\t\t\t<h1 class=\"empty-content__name\">\n\t\t\t\tNo comments\n\t\t\t</h1>\n\t\t</template>\n\t\t<template #action>\n\t\t\t<NcButton variant=\"primary\">\n\t\t\t\tAdd a comment!\n\t\t\t</NcButton>\n\t\t</template>\n\t</NcEmptyContent>\n</template>\n\n<script>\nimport Comment from 'vue-material-design-icons/Comment.vue'\n\nexport default {\n\tcomponents: {\n\t\tComment,\n\t},\n}\n</script>\n```\n\nSimilar to the `#name` slot, you could also use the `#description` slot.\nThe content will be rendered within a paragraph so you can use any inline element,\nlike a link.\n\n```\n<template>\n\t<NcEmptyContent\n\t\tname=\"No comments\">\n\t\t<template #icon>\n\t\t\t<Comment />\n\t\t</template>\n\t\t<template #description>\n\t\t\t<a href=\"https://en.wikipedia.org/wiki/Comment\">What is even a comment?</a>\n\t\t</template>\n\t</NcEmptyContent>\n</template>\n\n<script>\nimport Comment from 'vue-material-design-icons/Comment.vue'\n\nexport default {\n\tcomponents: {\n\t\tComment,\n\t},\n}\n</script>\n```\n</docs>\n\n<template>\n\t<div class=\"empty-content\" role=\"note\">\n\t\t<div v-if=\"$slots.icon\" class=\"empty-content__icon\" aria-hidden=\"true\">\n\t\t\t<!-- @slot Optional material design icon -->\n\t\t\t<slot name=\"icon\" />\n\t\t</div>\n\t\t<!-- @slot Optional name if not set as property, shall be enclosed by a header element -->\n\t\t<slot name=\"name\">\n\t\t\t<span v-if=\"hasName\" class=\"empty-content__name\">\n\t\t\t\t{{ name }}\n\t\t\t</span>\n\t\t</slot>\n\t\t<p v-if=\"hasDescription\" class=\"empty-content__description\">\n\t\t\t<!-- @slot Optional formatted description rendered inside a paragraph -->\n\t\t\t<slot name=\"description\">\n\t\t\t\t{{ description }}\n\t\t\t</slot>\n\t\t</p>\n\t\t<div v-if=\"$slots.action\" class=\"empty-content__action\">\n\t\t\t<!-- @slot Optional slot for a button or the like -->\n\t\t\t<slot name=\"action\" />\n\t\t</div>\n\t</div>\n</template>\n\n<script>\nexport default {\n\tname: 'NcEmptyContent',\n\n\tprops: {\n\t\t/**\n\t\t * A header message about an empty content shown\n\t\t * @example 'No comments'\n\t\t */\n\t\tname: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * Desription of the empty content\n\t\t * @example 'No comments yet, start the conversation!'\n\t\t */\n\t\tdescription: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\t},\n\n\tcomputed: {\n\t\thasName() {\n\t\t\treturn this.name !== ''\n\t\t},\n\t\t/**\n\t\t * Check if a description is given as either property or slot\n\t\t */\n\t\thasDescription() {\n\t\t\treturn this.description !== '' || this.$slots.description?.[0]\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.empty-content {\n\tdisplay: flex;\n\talign-items: center;\n\tflex-direction: column;\n\tjustify-content: center;\n\t/* In case of using in a flex container - flex in advance */\n\tflex-grow: 1;\n\tpadding: var(--default-grid-baseline);\n\n\t.modal-wrapper & {\n\t\tmargin-top: 5vh;\n\t\tmargin-bottom: 5vh;\n\t}\n\n\t&__icon {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\twidth: 64px;\n\t\theight: 64px;\n\t\tmargin: 0 auto 15px;\n\t\topacity: .4;\n\t\tbackground-repeat: no-repeat;\n\t\tbackground-position: center;\n\t\tbackground-size: 64px;\n\n\t\t:deep(svg) {\n\t\t\twidth: 64px !important;\n\t\t\theight: 64px !important;\n\t\t\tmax-width: 64px !important;\n\t\t\tmax-height: 64px !important;\n\t\t}\n\t}\n\n\t&__name {\n\t\tmargin-bottom: 10px;\n\t\ttext-align: center;\n\t\tfont-weight: bold;\n\t\tfont-size: 20px;\n\t\tline-height: 30px;\n\t}\n\n\t&__description {\n\t\tcolor: var(--color-text-maxcontrast);\n\t\ttext-align: center;\n\t\ttext-wrap-style: balance;\n\t}\n\n\t&__action {\n\t\tmargin-top: 8px;\n\n\t\t.modal-wrapper & {\n\t\t\tmargin-top: 20px;\n\t\t\tdisplay: flex;\n\t\t}\n\t}\n}\n</style>\n"],"names":[],"mappings":";AAqJA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,UAAA;AACA,aAAA,KAAA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAIA,iBAAA;AACA,aAAA,KAAA,gBAAA,MAAA,KAAA,OAAA,cAAA,CAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;"}

package/dist/Components/NcListItem.cjs

@@ -1,4 +1,4 @@
 "use strict";
-const NcListItem = require("../chunks/NcListItem-BVNMtN9D.cjs");
+const NcListItem = require("../chunks/NcListItem-Bs-sl-hH.cjs");
 module.exports = NcListItem.NcListItem;
 //# sourceMappingURL=NcListItem.cjs.map

package/dist/Components/NcListItem.mjs

@@ -1,4 +1,4 @@
-import { N } from "../chunks/NcListItem-CM-2Sxu0.mjs";
+import { N } from "../chunks/NcListItem-BHhlE1Sb.mjs";
 export {
   N as default
 };

package/dist/Components/NcListItemIcon.cjs

@@ -1,4 +1,4 @@
 "use strict";
-const NcListItemIcon = require("../chunks/NcListItemIcon-Dn98VepV.cjs");
+const NcListItemIcon = require("../chunks/NcListItemIcon-DQn2njGl.cjs");
 module.exports = NcListItemIcon.NcListItemIcon;
 //# sourceMappingURL=NcListItemIcon.cjs.map

package/dist/Components/NcListItemIcon.mjs

@@ -1,4 +1,4 @@
-import { N } from "../chunks/NcListItemIcon-NVu4D1gV.mjs";
+import { N } from "../chunks/NcListItemIcon-BDq6PIUq.mjs";
 export {
   N as default
 };

package/dist/Components/NcModal.cjs

@@ -1,14 +1,14 @@
 require('../assets/NcModal-BS5vtogq.css');
 "use strict";
-const ScopeComponent = require("../chunks/ScopeComponent-BccjTlJa.cjs");
+const ScopeComponent = require("../chunks/ScopeComponent-SIPKHdQy.cjs");
 const core = require("@vueuse/core");
-const mdi = require("../chunks/mdi-Da9VuUVq.cjs");
+const mdi = require("../chunks/mdi-BflUJIiB.cjs");
 const focusTrap$1 = require("focus-trap");
 const Vue = require("vue");
 const GenRandomId = require("../chunks/GenRandomId-BQDud3d4.cjs");
 const focusTrap = require("../chunks/focusTrap-Vbgxe8ZX.cjs");
-const _l10n = require("../chunks/_l10n-BiiXtYiP.cjs");
-const NcActions = require("../chunks/NcActions-B7DbEbCo.cjs");
+const _l10n = require("../chunks/_l10n-CXXSIoEf.cjs");
+const NcActions = require("../chunks/NcActions-DvZOLPjX.cjs");
 const Components_NcButton = require("./NcButton.cjs");
 const NcIconSvgWrapper = require("../chunks/NcIconSvgWrapper-CrnN5Sq5.cjs");
 const Close = require("../chunks/Close-CqmXxEKi.cjs");

package/dist/Components/NcModal.mjs

@@ -1,13 +1,13 @@
 import '../assets/NcModal-BS5vtogq.css';
-import { S as ScopeComponent } from "../chunks/ScopeComponent-FtC2zEqX.mjs";
+import { S as ScopeComponent } from "../chunks/ScopeComponent-CC0LPlVx.mjs";
 import { useSwipe } from "@vueuse/core";
-import { a as mdiChevronRight, b as mdiChevronLeft } from "../chunks/mdi-CZJxQPz6.mjs";
+import { m as mdiChevronRight, e as mdiChevronLeft } from "../chunks/mdi-C1L0jZ1V.mjs";
 import { createFocusTrap } from "focus-trap";
 import Vue, { useCssVars } from "vue";
 import { G as GenRandomId } from "../chunks/GenRandomId-CMooMQt0.mjs";
 import { g as getTrapStack } from "../chunks/focusTrap-DmkaYJTC.mjs";
-import { r as register, J as t33, n as t17, a as t } from "../chunks/_l10n-Dt0m9Fxw.mjs";
-import { N as NcActions } from "../chunks/NcActions-DEZO46mP.mjs";
+import { r as register, J as t33, n as t17, a as t } from "../chunks/_l10n-DIOHNc85.mjs";
+import { N as NcActions } from "../chunks/NcActions-CzpbMJoY.mjs";
 import NcButton from "./NcButton.mjs";
 import { N as NcIconSvgWrapper } from "../chunks/NcIconSvgWrapper-Cb-cPj1R.mjs";
 import { C as Close } from "../chunks/Close-BtLPUSdO.mjs";

package/dist/Components/NcPasswordField.cjs

@@ -1,4 +1,4 @@
 "use strict";
-const NcPasswordField = require("../chunks/NcPasswordField-BCzIotoB.cjs");
+const NcPasswordField = require("../chunks/NcPasswordField-B_d4oTF9.cjs");
 module.exports = NcPasswordField.NcPasswordField;
 //# sourceMappingURL=NcPasswordField.cjs.map

package/dist/Components/NcPasswordField.mjs

@@ -1,4 +1,4 @@
-import { N } from "../chunks/NcPasswordField-CTKHRVC4.mjs";
+import { N } from "../chunks/NcPasswordField-5oXVlA4T.mjs";
 export {
   N as default
 };

package/dist/Components/NcRelatedResourcesPanel.cjs

@@ -1,4 +1,4 @@
 "use strict";
-const NcRelatedResourcesPanel = require("../chunks/NcRelatedResourcesPanel-C9qkNtuo.cjs");
+const NcRelatedResourcesPanel = require("../chunks/NcRelatedResourcesPanel-DDKi2A47.cjs");
 module.exports = NcRelatedResourcesPanel.NcRelatedResourcesPanel;
 //# sourceMappingURL=NcRelatedResourcesPanel.cjs.map

package/dist/Components/NcRelatedResourcesPanel.mjs

@@ -1,4 +1,4 @@
-import { N } from "../chunks/NcRelatedResourcesPanel-BtfnMS2U.mjs";
+import { N } from "../chunks/NcRelatedResourcesPanel-w0cVgK_u.mjs";
 export {
   N as default
 };

package/dist/Components/NcRichContenteditable.cjs

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const Mixins_richEditor = require("../chunks/index-B0yHh7IW.cjs");
-const NcRichContenteditable = require("../chunks/NcRichContenteditable-BQcBCaz-.cjs");
+const NcRichContenteditable = require("../chunks/NcRichContenteditable-CbF4935r.cjs");
 exports.NcMentionBubble = Mixins_richEditor.NcMentionBubble;
 exports.NcAutoCompleteResult = NcRichContenteditable.NcAutoCompleteResult;
 exports.default = NcRichContenteditable.NcRichContenteditable;

package/dist/Components/NcRichContenteditable.mjs

@@ -1,5 +1,5 @@
 import { N } from "../chunks/index-Dpk-sL3D.mjs";
-import { N as N2, a } from "../chunks/NcRichContenteditable-nJL0Ml6f.mjs";
+import { N as N2, a } from "../chunks/NcRichContenteditable-Cqt-neS3.mjs";
 export {
   N2 as NcAutoCompleteResult,
   N as NcMentionBubble,

package/dist/Components/NcRichText.cjs

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const NcRichText = require("../chunks/NcRichText-BzJv-N1n.cjs");
+const NcRichText = require("../chunks/NcRichText-DxDK1G5d.cjs");
 const Functions_registerReference = require("../chunks/index-BV85rPB7.cjs");
-const referencePickerModal = require("../chunks/referencePickerModal-qWVMGb2m.cjs");
+const referencePickerModal = require("../chunks/referencePickerModal-DbrHVDKS.cjs");
 exports.NcReferenceList = NcRichText.NcReferenceList;
 exports.NcRichText = NcRichText.NcRichText;
 exports.default = NcRichText.NcRichText;

package/dist/Components/NcRichText.mjs

@@ -1,7 +1,7 @@
-import { N as NcRichText } from "../chunks/NcRichText-Br5t5ga_.mjs";
-import { a } from "../chunks/NcRichText-Br5t5ga_.mjs";
+import { N as NcRichText } from "../chunks/NcRichText-BWY0OxW9.mjs";
+import { a } from "../chunks/NcRichText-BWY0OxW9.mjs";
 import { N, d, i, b, r, c, a as a2 } from "../chunks/index-56SXuvlv.mjs";
-import { e, f, N as N2, h, a as a3, g, b as b2, c as c2, d as d2, s } from "../chunks/referencePickerModal-DN7C4An4.mjs";
+import { e, f, N as N2, h, a as a3, g, b as b2, c as c2, d as d2, s } from "../chunks/referencePickerModal-sscttPbK.mjs";
 export {
   N as NcCustomPickerRenderResult,
   a as NcReferenceList,

package/dist/Components/NcSelect.cjs

@@ -1,4 +1,4 @@
 "use strict";
-const NcSelect = require("../chunks/NcSelect-ByaW3kG-.cjs");
+const NcSelect = require("../chunks/NcSelect-CvN1DuY2.cjs");
 module.exports = NcSelect.NcSelect;
 //# sourceMappingURL=NcSelect.cjs.map

package/dist/Components/NcSelect.mjs

@@ -1,4 +1,4 @@
-import { N } from "../chunks/NcSelect-DVUm4oCe.mjs";
+import { N } from "../chunks/NcSelect-DmIaznJY.mjs";
 export {
   N as default
 };

package/dist/Components/NcSelectTags.cjs

@@ -1,4 +1,4 @@
 "use strict";
-const NcSelectTags = require("../chunks/NcSelectTags-Bv44W43g.cjs");
+const NcSelectTags = require("../chunks/NcSelectTags-DJoDzrZl.cjs");
 module.exports = NcSelectTags.NcSelectTags;
 //# sourceMappingURL=NcSelectTags.cjs.map

package/dist/Components/NcSelectTags.mjs

@@ -1,4 +1,4 @@
-import { N } from "../chunks/NcSelectTags-BcBE70eK.mjs";
+import { N } from "../chunks/NcSelectTags-MsqvY1l4.mjs";
 export {
   N as default
 };

package/dist/Components/NcSelectUsers.cjs

@@ -1,4 +1,4 @@
 "use strict";
-const NcSelectUsers = require("../chunks/NcSelectUsers-CMnFliv_.cjs");
+const NcSelectUsers = require("../chunks/NcSelectUsers-IoPgizBH.cjs");
 module.exports = NcSelectUsers.NcSelectUsers;
 //# sourceMappingURL=NcSelectUsers.cjs.map

package/dist/Components/NcSelectUsers.mjs

@@ -1,4 +1,4 @@
-import { N } from "../chunks/NcSelectUsers-BQGjCB8x.mjs";
+import { N } from "../chunks/NcSelectUsers-BYynRS17.mjs";
 export {
   N as default
 };

package/dist/Components/NcSettingsInputText.cjs

@@ -1,4 +1,4 @@
 "use strict";
-const NcSettingsInputText = require("../chunks/NcSettingsInputText-BU1_SHOq.cjs");
+const NcSettingsInputText = require("../chunks/NcSettingsInputText-BknU0gbE.cjs");
 module.exports = NcSettingsInputText.NcSettingsInputText;
 //# sourceMappingURL=NcSettingsInputText.cjs.map

package/dist/Components/NcSettingsInputText.mjs

@@ -1,4 +1,4 @@
-import { N } from "../chunks/NcSettingsInputText-t1FMnLKA.mjs";
+import { N } from "../chunks/NcSettingsInputText-BXbSSC7N.mjs";
 export {
   N as default
 };

package/dist/Components/NcSettingsSection.cjs

@@ -1,4 +1,4 @@
 "use strict";
-const NcSettingsSection = require("../chunks/NcSettingsSection-Dcdxs1IN.cjs");
+const NcSettingsSection = require("../chunks/NcSettingsSection-dlDi9oLJ.cjs");
 module.exports = NcSettingsSection.NcSettingsSection;
 //# sourceMappingURL=NcSettingsSection.cjs.map

package/dist/Components/NcSettingsSection.mjs

@@ -1,4 +1,4 @@
-import { N } from "../chunks/NcSettingsSection-EC3SmiDX.mjs";
+import { N } from "../chunks/NcSettingsSection-BNefU-yk.mjs";
 export {
   N as default
 };

package/dist/Components/NcSettingsSelectGroup.cjs

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const NcSettingsSelectGroup = require("../chunks/NcSettingsSelectGroup-LMFSKor_.cjs");
+const NcSettingsSelectGroup = require("../chunks/NcSettingsSelectGroup-Bm8naUVk.cjs");
 exports.NcSettingsSelectGroup = NcSettingsSelectGroup.NcSettingsSelectGroup;
 exports.default = NcSettingsSelectGroup.NcSettingsSelectGroup;
 //# sourceMappingURL=NcSettingsSelectGroup.cjs.map

package/dist/Components/NcSettingsSelectGroup.mjs

@@ -1,4 +1,4 @@
-import { N as NcSettingsSelectGroup } from "../chunks/NcSettingsSelectGroup-BaxnrQ1h.mjs";
+import { N as NcSettingsSelectGroup } from "../chunks/NcSettingsSelectGroup-DWEorw2V.mjs";
 export {
   NcSettingsSelectGroup,
   NcSettingsSelectGroup as default

package/dist/Components/NcTextField.cjs

@@ -1,4 +1,4 @@
 "use strict";
-const NcTextField = require("../chunks/NcTextField-Uk5iD8o2.cjs");
+const NcTextField = require("../chunks/NcTextField-CMxmd2Wn.cjs");
 module.exports = NcTextField.NcTextField;
 //# sourceMappingURL=NcTextField.cjs.map

package/dist/Components/NcTextField.mjs

@@ -1,4 +1,4 @@
-import { N } from "../chunks/NcTextField-DRANdaIf.mjs";
+import { N } from "../chunks/NcTextField-Cd_RjGj6.mjs";
 export {
   N as default
 };

package/dist/Components/NcTimezonePicker.cjs

@@ -1,4 +1,4 @@
 "use strict";
-const NcTimezonePicker = require("../chunks/NcTimezonePicker-CcFJQMX9.cjs");
+const NcTimezonePicker = require("../chunks/NcTimezonePicker-Ds_yZJVZ.cjs");
 module.exports = NcTimezonePicker.NcTimezonePicker;
 //# sourceMappingURL=NcTimezonePicker.cjs.map

package/dist/Components/NcTimezonePicker.mjs

@@ -1,4 +1,4 @@
-import { N } from "../chunks/NcTimezonePicker-t60uHoNB.mjs";
+import { N } from "../chunks/NcTimezonePicker-BjUmYLVj.mjs";
 export {
   N as default
 };

package/dist/Components/NcUserBubble.cjs

@@ -1,4 +1,4 @@
 "use strict";
-const NcUserBubble = require("../chunks/NcUserBubble-Dvxdr2ee.cjs");
+const NcUserBubble = require("../chunks/NcUserBubble-B5MtyQce.cjs");
 module.exports = NcUserBubble.NcUserBubble;
 //# sourceMappingURL=NcUserBubble.cjs.map

package/dist/Components/NcUserBubble.mjs

@@ -1,4 +1,4 @@
-import { N } from "../chunks/NcUserBubble-W_wjP2lY.mjs";
+import { N } from "../chunks/NcUserBubble-DH2UiUfH.mjs";
 export {
   N as default
 };

package/dist/Components/NcUserStatusIcon.cjs

@@ -1,4 +1,4 @@
 "use strict";
-const NcUserStatusIcon = require("../chunks/NcUserStatusIcon-cs42Lzdd.cjs");
+const NcUserStatusIcon = require("../chunks/NcUserStatusIcon-B_-V1MDZ.cjs");
 module.exports = NcUserStatusIcon.NcUserStatusIcon;
 //# sourceMappingURL=NcUserStatusIcon.cjs.map

package/dist/Components/NcUserStatusIcon.mjs

@@ -1,4 +1,4 @@
-import { N } from "../chunks/NcUserStatusIcon-WEKmuaoU.mjs";
+import { N } from "../chunks/NcUserStatusIcon-Bya1v9qo.mjs";
 export {
   N as default
 };

package/dist/Composables/useFormatDateTime.cjs

@@ -0,0 +1,68 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const l10n = require("@nextcloud/l10n");
+const core = require("@vueuse/core");
+const Vue = require("vue");
+const _l10n = require("../chunks/_l10n-CXXSIoEf.cjs");
+_l10n.register(_l10n.t2);
+const FEW_SECONDS_AGO = {
+  long: _l10n.t("a few seconds ago"),
+  short: _l10n.t("seconds ago"),
+  // FOR TRANSLATORS: Shorter version of 'a few seconds ago'
+  narrow: _l10n.t("sec. ago")
+  // FOR TRANSLATORS: If possible in your language an even shorter version of 'a few seconds ago'
+};
+function useFormatRelativeTime(timestamp = Date.now(), opts = {}) {
+  let timeoutId;
+  const date = Vue.computed(() => new Date(core.toValue(timestamp)));
+  const options = Vue.computed(() => {
+    const { language, relativeTime: relativeTime2, ignoreSeconds } = core.toValue(opts);
+    return {
+      ...language && { language },
+      ...relativeTime2 && { relativeTime: relativeTime2 },
+      ignoreSeconds: ignoreSeconds ? FEW_SECONDS_AGO[relativeTime2 || "long"] : false
+    };
+  });
+  const relativeTime = Vue.ref("");
+  Vue.watchEffect(() => updateRelativeTime());
+  function updateRelativeTime() {
+    relativeTime.value = l10n.formatRelativeTime(date.value, options.value);
+    if (core.toValue(opts).update !== false) {
+      const diff = Math.abs(Date.now() - new Date(core.toValue(timestamp)).getTime());
+      const interval = diff > 12e4 || options.value.ignoreSeconds ? Math.min(diff / 60, 18e5) : 1e3;
+      timeoutId = window.setTimeout(updateRelativeTime, interval);
+    }
+  }
+  Vue.onUnmounted(() => timeoutId && window.clearTimeout(timeoutId));
+  return Vue.readonly(relativeTime);
+}
+function useFormatTime(timestamp, opts) {
+  const options = Vue.computed(() => ({
+    locale: l10n.getCanonicalLocale(),
+    format: { dateStyle: "short", timeStyle: "medium" },
+    ...core.toValue(opts)
+  }));
+  const formatter = Vue.computed(() => new Intl.DateTimeFormat(options.value.locale, options.value.format));
+  return Vue.computed(() => formatter.value.format(core.toValue(timestamp)));
+}
+function useFormatDateTime(timestamp = Date.now(), opts = {}) {
+  const formattedFullTime = useFormatTime(timestamp, opts);
+  const relativeTime = useFormatRelativeTime(timestamp, Vue.computed(() => {
+    const options = core.toValue(opts);
+    return {
+      ...options,
+      relativeTime: typeof options.relativeTime === "string" ? options.relativeTime : "long"
+    };
+  }));
+  const formattedTime = Vue.computed(
+    () => core.toValue(opts).relativeTime !== false ? relativeTime.value : formattedFullTime.value
+  );
+  return {
+    formattedTime,
+    formattedFullTime
+  };
+}
+exports.useFormatDateTime = useFormatDateTime;
+exports.useFormatRelativeTime = useFormatRelativeTime;
+exports.useFormatTime = useFormatTime;
+//# sourceMappingURL=useFormatDateTime.cjs.map

package/dist/Composables/useFormatDateTime.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFormatDateTime.cjs","sources":["../../src/composables/useFormatDateTime/index.ts"],"sourcesContent":["/**\n * SPDX-FileCopyrightText: 2024 Nextcloud GmbH and Nextcloud contributors\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\n\nimport type { FormatDateOptions } from '@nextcloud/l10n'\nimport type { MaybeRefOrGetter } from '@vueuse/core'\nimport type { Ref } from 'vue'\n\nimport { formatRelativeTime, getCanonicalLocale } from '@nextcloud/l10n'\nimport { toValue } from '@vueuse/core'\nimport { computed, onUnmounted, readonly, ref, watchEffect } from 'vue'\nimport { t } from '../../l10n.js'\n\ninterface FormatRelativeTimeOptions extends Partial<Omit<FormatDateOptions, 'ignoreSeconds'>> {\n\tignoreSeconds?: boolean\n\n\t/**\n\t * If set to false the relative time will not be updated anymore.\n\t * @default true - Meaning the relative time will be updated if needed\n\t */\n\tupdate?: boolean\n}\n\ninterface FormatTimeOptions {\n\t/**\n\t * Locale to use for formatting.\n\t * @default current locale\n\t */\n\tlocale?: string\n\n\t/**\n\t * The format used for displaying.\n\t *\n\t * @default { timeStyle: 'medium', dateStyle: 'short' }\n\t */\n\tformat?: Intl.DateTimeFormatOptions\n}\n\n/**\n * @deprecated\n */\ninterface LegacyFormatDateTimeOptions {\n\t/**\n\t * The format used for displaying, or if relative time is used the format used for the title\n\t */\n\tformat?: Intl.DateTimeFormatOptions\n\t/**\n\t * Ignore seconds when displaying the relative time and just show `a few seconds ago`\n\t */\n\tignoreSeconds?: boolean\n\t/**\n\t * Wether to display the timestamp as time from now\n\t */\n\trelativeTime?: false | 'long' | 'short' | 'narrow'\n}\n\nconst FEW_SECONDS_AGO = {\n\tlong: t('a few seconds ago'),\n\tshort: t('seconds ago'), // FOR TRANSLATORS: Shorter version of 'a few seconds ago'\n\tnarrow: t('sec. ago'), // FOR TRANSLATORS: If possible in your language an even shorter version of 'a few seconds ago'\n}\n\n/**\n * Format a timestamp or date object as relative time.\n *\n * This is a composable wrapper around `formatRelativeTime` from `@nextcloud/l10n`.\n *\n * @param timestamp - The timestamp to format\n * @param opts - Formatting options\n */\nexport function useFormatRelativeTime(\n\ttimestamp: MaybeRefOrGetter<Date | number> = Date.now(),\n\topts: MaybeRefOrGetter<FormatRelativeTimeOptions> = {},\n): Readonly<Ref<string>> {\n\tlet timeoutId: number\n\n\t/**\n\t * ECMA Date object of the timestamp\n\t */\n\tconst date = computed(() => new Date(toValue(timestamp)))\n\n\t/**\n\t * Reactive options for `formatRelativeTime` method\n\t */\n\tconst options = computed<FormatDateOptions>(() => {\n\t\tconst { language, relativeTime, ignoreSeconds } = toValue(opts)\n\t\treturn {\n\t\t\t...language && { language },\n\t\t\t...relativeTime && { relativeTime },\n\t\t\tignoreSeconds: ignoreSeconds\n\t\t\t\t? FEW_SECONDS_AGO[relativeTime || 'long']\n\t\t\t\t: false,\n\t\t}\n\t})\n\n\t/**\n\t * The formatted relative time\n\t */\n\tconst relativeTime = ref('')\n\twatchEffect(() => updateRelativeTime())\n\n\t/**\n\t * Update the relative time string.\n\t * This is the callback for the interval.\n\t */\n\tfunction updateRelativeTime() {\n\t\trelativeTime.value = formatRelativeTime(date.value, options.value)\n\n\t\tif (toValue(opts).update !== false) {\n\t\t\tconst diff = Math.abs(Date.now() - new Date(toValue(timestamp)).getTime())\n\t\t\tconst interval = diff > 120000 || options.value.ignoreSeconds\n\t\t\t\t? Math.min(diff / 60, 1800000)\n\t\t\t\t: 1000\n\t\t\ttimeoutId = window.setTimeout(updateRelativeTime, interval)\n\t\t}\n\t}\n\n\t// when the component is unmounted we also clear the timeout\n\tonUnmounted(() => timeoutId && window.clearTimeout(timeoutId))\n\n\treturn readonly(relativeTime)\n}\n\n/**\n * Format a given timestamp or date object as a human readable string.\n *\n * @param timestamp - Timestamp or date object to format\n * @param opts - Formatting options\n */\nexport function useFormatTime(\n\ttimestamp: MaybeRefOrGetter<number | Date>,\n\topts: MaybeRefOrGetter<FormatTimeOptions>,\n): Readonly<Ref<string>> {\n\tconst options = computed<Required<FormatTimeOptions>>(() => ({\n\t\tlocale: getCanonicalLocale(),\n\t\tformat: { dateStyle: 'short', timeStyle: 'medium' },\n\t\t...toValue(opts),\n\t}))\n\n\tconst formatter = computed(() => new Intl.DateTimeFormat(options.value.locale, options.value.format))\n\n\treturn computed(() => formatter.value.format(toValue(timestamp)))\n}\n\n/**\n * Composable for formatting time stamps using current users locale and language\n *\n * @param {import('vue').MaybeRefOrGetter<Date | number>} timestamp Current timestamp\n * @param {object} opts Optional options\n * @param {Intl.DateTimeFormatOptions} opts.format The format used for displaying, or if relative time is used the format used for the title (optional)\n * @param {boolean} opts.ignoreSeconds Ignore seconds when displaying the relative time and just show `a few seconds ago`\n * @param {false | 'long' | 'short' | 'narrow'} opts.relativeTime Wether to display the timestamp as time from now (optional)\n *\n * @deprecated use `useFormatRelativeTime` or `useFormatTime` instead.\n */\nexport function useFormatDateTime(\n\ttimestamp: MaybeRefOrGetter<Date|number> = Date.now(),\n\topts: MaybeRefOrGetter<LegacyFormatDateTimeOptions> = {},\n) {\n\tconst formattedFullTime = useFormatTime(timestamp, opts)\n\tconst relativeTime = useFormatRelativeTime(timestamp, computed(() => {\n\t\tconst options = toValue(opts)\n\t\treturn {\n\t\t\t...options,\n\t\t\trelativeTime: typeof options.relativeTime === 'string'\n\t\t\t\t? options.relativeTime\n\t\t\t\t: 'long',\n\t\t}\n\t}))\n\n\tconst formattedTime = computed(() => toValue(opts).relativeTime !== false\n\t\t? relativeTime.value\n\t\t: formattedFullTime.value,\n\t)\n\n\treturn {\n\t\tformattedTime,\n\t\tformattedFullTime,\n\t}\n}\n"],"names":["t","computed","toValue","relativeTime","ref","watchEffect","formatRelativeTime","onUnmounted","readonly","getCanonicalLocale"],"mappings":";;;;;;;AAyDA,MAAM,kBAAkB;AAAA,EACvB,MAAMA,QAAE,mBAAmB;AAAA,EAC3B,OAAOA,QAAE,aAAa;AAAA;AAAA,EACtB,QAAQA,QAAE,UAAU;AAAA;AACrB;AAUO,SAAS,sBACf,YAA6C,KAAK,OAClD,OAAoD,CAAA,GAC5B;AACpB,MAAA;AAKE,QAAA,OAAOC,IAAAA,SAAS,MAAM,IAAI,KAAKC,KAAQ,QAAA,SAAS,CAAC,CAAC;AAKlD,QAAA,UAAUD,IAAAA,SAA4B,MAAM;AACjD,UAAM,EAAE,UAAU,cAAAE,eAAc,cAAc,IAAID,aAAQ,IAAI;AACvD,WAAA;AAAA,MACN,GAAG,YAAY,EAAE,SAAS;AAAA,MAC1B,GAAGC,iBAAgB,EAAE,cAAAA,cAAa;AAAA,MAClC,eAAe,gBACZ,gBAAgBA,iBAAgB,MAAM,IACtC;AAAA,IACJ;AAAA,EAAA,CACA;AAKK,QAAA,eAAeC,QAAI,EAAE;AACfC,MAAA,YAAA,MAAM,oBAAoB;AAMtC,WAAS,qBAAqB;AAC7B,iBAAa,QAAQC,KAAA,mBAAmB,KAAK,OAAO,QAAQ,KAAK;AAEjE,QAAIJ,aAAQ,IAAI,EAAE,WAAW,OAAO;AACnC,YAAM,OAAO,KAAK,IAAI,KAAK,IAAI,IAAI,IAAI,KAAKA,KAAAA,QAAQ,SAAS,CAAC,EAAE,SAAS;AACnE,YAAA,WAAW,OAAO,QAAU,QAAQ,MAAM,gBAC7C,KAAK,IAAI,OAAO,IAAI,IAAO,IAC3B;AACS,kBAAA,OAAO,WAAW,oBAAoB,QAAQ;AAAA,IAAA;AAAA,EAC3D;AAIDK,MAAAA,YAAY,MAAM,aAAa,OAAO,aAAa,SAAS,CAAC;AAE7D,SAAOC,IAAAA,SAAS,YAAY;AAC7B;AAQgB,SAAA,cACf,WACA,MACwB;AAClB,QAAA,UAAUP,IAAAA,SAAsC,OAAO;AAAA,IAC5D,QAAQQ,KAAAA,mBAAmB;AAAA,IAC3B,QAAQ,EAAE,WAAW,SAAS,WAAW,SAAS;AAAA,IAClD,GAAGP,aAAQ,IAAI;AAAA,EAAA,EACd;AAEF,QAAM,YAAYD,IAAAA,SAAS,MAAM,IAAI,KAAK,eAAe,QAAQ,MAAM,QAAQ,QAAQ,MAAM,MAAM,CAAC;AAE7F,SAAAA,IAAAA,SAAS,MAAM,UAAU,MAAM,OAAOC,KAAQ,QAAA,SAAS,CAAC,CAAC;AACjE;AAaO,SAAS,kBACf,YAA2C,KAAK,OAChD,OAAsD,CAAA,GACrD;AACK,QAAA,oBAAoB,cAAc,WAAW,IAAI;AACvD,QAAM,eAAe,sBAAsB,WAAWD,IAAA,SAAS,MAAM;AAC9D,UAAA,UAAUC,aAAQ,IAAI;AACrB,WAAA;AAAA,MACN,GAAG;AAAA,MACH,cAAc,OAAO,QAAQ,iBAAiB,WAC3C,QAAQ,eACR;AAAA,IACJ;AAAA,EAAA,CACA,CAAC;AAEF,QAAM,gBAAgBD,IAAA;AAAA,IAAS,MAAMC,KAAAA,QAAQ,IAAI,EAAE,iBAAiB,QACjE,aAAa,QACb,kBAAkB;AAAA,EACrB;AAEO,SAAA;AAAA,IACN;AAAA,IACA;AAAA,EACD;AACD;;;;"}

package/dist/Composables/useFormatDateTime.mjs

@@ -0,0 +1,68 @@
+import { formatRelativeTime, getCanonicalLocale } from "@nextcloud/l10n";
+import { toValue } from "@vueuse/core";
+import { computed, ref, watchEffect, onUnmounted, readonly } from "vue";
+import { r as register, e as t2, a as t } from "../chunks/_l10n-DIOHNc85.mjs";
+register(t2);
+const FEW_SECONDS_AGO = {
+  long: t("a few seconds ago"),
+  short: t("seconds ago"),
+  // FOR TRANSLATORS: Shorter version of 'a few seconds ago'
+  narrow: t("sec. ago")
+  // FOR TRANSLATORS: If possible in your language an even shorter version of 'a few seconds ago'
+};
+function useFormatRelativeTime(timestamp = Date.now(), opts = {}) {
+  let timeoutId;
+  const date = computed(() => new Date(toValue(timestamp)));
+  const options = computed(() => {
+    const { language, relativeTime: relativeTime2, ignoreSeconds } = toValue(opts);
+    return {
+      ...language && { language },
+      ...relativeTime2 && { relativeTime: relativeTime2 },
+      ignoreSeconds: ignoreSeconds ? FEW_SECONDS_AGO[relativeTime2 || "long"] : false
+    };
+  });
+  const relativeTime = ref("");
+  watchEffect(() => updateRelativeTime());
+  function updateRelativeTime() {
+    relativeTime.value = formatRelativeTime(date.value, options.value);
+    if (toValue(opts).update !== false) {
+      const diff = Math.abs(Date.now() - new Date(toValue(timestamp)).getTime());
+      const interval = diff > 12e4 || options.value.ignoreSeconds ? Math.min(diff / 60, 18e5) : 1e3;
+      timeoutId = window.setTimeout(updateRelativeTime, interval);
+    }
+  }
+  onUnmounted(() => timeoutId && window.clearTimeout(timeoutId));
+  return readonly(relativeTime);
+}
+function useFormatTime(timestamp, opts) {
+  const options = computed(() => ({
+    locale: getCanonicalLocale(),
+    format: { dateStyle: "short", timeStyle: "medium" },
+    ...toValue(opts)
+  }));
+  const formatter = computed(() => new Intl.DateTimeFormat(options.value.locale, options.value.format));
+  return computed(() => formatter.value.format(toValue(timestamp)));
+}
+function useFormatDateTime(timestamp = Date.now(), opts = {}) {
+  const formattedFullTime = useFormatTime(timestamp, opts);
+  const relativeTime = useFormatRelativeTime(timestamp, computed(() => {
+    const options = toValue(opts);
+    return {
+      ...options,
+      relativeTime: typeof options.relativeTime === "string" ? options.relativeTime : "long"
+    };
+  }));
+  const formattedTime = computed(
+    () => toValue(opts).relativeTime !== false ? relativeTime.value : formattedFullTime.value
+  );
+  return {
+    formattedTime,
+    formattedFullTime
+  };
+}
+export {
+  useFormatDateTime,
+  useFormatRelativeTime,
+  useFormatTime
+};
+//# sourceMappingURL=useFormatDateTime.mjs.map

package/dist/Composables/useFormatDateTime.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFormatDateTime.mjs","sources":["../../src/composables/useFormatDateTime/index.ts"],"sourcesContent":["/**\n * SPDX-FileCopyrightText: 2024 Nextcloud GmbH and Nextcloud contributors\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\n\nimport type { FormatDateOptions } from '@nextcloud/l10n'\nimport type { MaybeRefOrGetter } from '@vueuse/core'\nimport type { Ref } from 'vue'\n\nimport { formatRelativeTime, getCanonicalLocale } from '@nextcloud/l10n'\nimport { toValue } from '@vueuse/core'\nimport { computed, onUnmounted, readonly, ref, watchEffect } from 'vue'\nimport { t } from '../../l10n.js'\n\ninterface FormatRelativeTimeOptions extends Partial<Omit<FormatDateOptions, 'ignoreSeconds'>> {\n\tignoreSeconds?: boolean\n\n\t/**\n\t * If set to false the relative time will not be updated anymore.\n\t * @default true - Meaning the relative time will be updated if needed\n\t */\n\tupdate?: boolean\n}\n\ninterface FormatTimeOptions {\n\t/**\n\t * Locale to use for formatting.\n\t * @default current locale\n\t */\n\tlocale?: string\n\n\t/**\n\t * The format used for displaying.\n\t *\n\t * @default { timeStyle: 'medium', dateStyle: 'short' }\n\t */\n\tformat?: Intl.DateTimeFormatOptions\n}\n\n/**\n * @deprecated\n */\ninterface LegacyFormatDateTimeOptions {\n\t/**\n\t * The format used for displaying, or if relative time is used the format used for the title\n\t */\n\tformat?: Intl.DateTimeFormatOptions\n\t/**\n\t * Ignore seconds when displaying the relative time and just show `a few seconds ago`\n\t */\n\tignoreSeconds?: boolean\n\t/**\n\t * Wether to display the timestamp as time from now\n\t */\n\trelativeTime?: false | 'long' | 'short' | 'narrow'\n}\n\nconst FEW_SECONDS_AGO = {\n\tlong: t('a few seconds ago'),\n\tshort: t('seconds ago'), // FOR TRANSLATORS: Shorter version of 'a few seconds ago'\n\tnarrow: t('sec. ago'), // FOR TRANSLATORS: If possible in your language an even shorter version of 'a few seconds ago'\n}\n\n/**\n * Format a timestamp or date object as relative time.\n *\n * This is a composable wrapper around `formatRelativeTime` from `@nextcloud/l10n`.\n *\n * @param timestamp - The timestamp to format\n * @param opts - Formatting options\n */\nexport function useFormatRelativeTime(\n\ttimestamp: MaybeRefOrGetter<Date | number> = Date.now(),\n\topts: MaybeRefOrGetter<FormatRelativeTimeOptions> = {},\n): Readonly<Ref<string>> {\n\tlet timeoutId: number\n\n\t/**\n\t * ECMA Date object of the timestamp\n\t */\n\tconst date = computed(() => new Date(toValue(timestamp)))\n\n\t/**\n\t * Reactive options for `formatRelativeTime` method\n\t */\n\tconst options = computed<FormatDateOptions>(() => {\n\t\tconst { language, relativeTime, ignoreSeconds } = toValue(opts)\n\t\treturn {\n\t\t\t...language && { language },\n\t\t\t...relativeTime && { relativeTime },\n\t\t\tignoreSeconds: ignoreSeconds\n\t\t\t\t? FEW_SECONDS_AGO[relativeTime || 'long']\n\t\t\t\t: false,\n\t\t}\n\t})\n\n\t/**\n\t * The formatted relative time\n\t */\n\tconst relativeTime = ref('')\n\twatchEffect(() => updateRelativeTime())\n\n\t/**\n\t * Update the relative time string.\n\t * This is the callback for the interval.\n\t */\n\tfunction updateRelativeTime() {\n\t\trelativeTime.value = formatRelativeTime(date.value, options.value)\n\n\t\tif (toValue(opts).update !== false) {\n\t\t\tconst diff = Math.abs(Date.now() - new Date(toValue(timestamp)).getTime())\n\t\t\tconst interval = diff > 120000 || options.value.ignoreSeconds\n\t\t\t\t? Math.min(diff / 60, 1800000)\n\t\t\t\t: 1000\n\t\t\ttimeoutId = window.setTimeout(updateRelativeTime, interval)\n\t\t}\n\t}\n\n\t// when the component is unmounted we also clear the timeout\n\tonUnmounted(() => timeoutId && window.clearTimeout(timeoutId))\n\n\treturn readonly(relativeTime)\n}\n\n/**\n * Format a given timestamp or date object as a human readable string.\n *\n * @param timestamp - Timestamp or date object to format\n * @param opts - Formatting options\n */\nexport function useFormatTime(\n\ttimestamp: MaybeRefOrGetter<number | Date>,\n\topts: MaybeRefOrGetter<FormatTimeOptions>,\n): Readonly<Ref<string>> {\n\tconst options = computed<Required<FormatTimeOptions>>(() => ({\n\t\tlocale: getCanonicalLocale(),\n\t\tformat: { dateStyle: 'short', timeStyle: 'medium' },\n\t\t...toValue(opts),\n\t}))\n\n\tconst formatter = computed(() => new Intl.DateTimeFormat(options.value.locale, options.value.format))\n\n\treturn computed(() => formatter.value.format(toValue(timestamp)))\n}\n\n/**\n * Composable for formatting time stamps using current users locale and language\n *\n * @param {import('vue').MaybeRefOrGetter<Date | number>} timestamp Current timestamp\n * @param {object} opts Optional options\n * @param {Intl.DateTimeFormatOptions} opts.format The format used for displaying, or if relative time is used the format used for the title (optional)\n * @param {boolean} opts.ignoreSeconds Ignore seconds when displaying the relative time and just show `a few seconds ago`\n * @param {false | 'long' | 'short' | 'narrow'} opts.relativeTime Wether to display the timestamp as time from now (optional)\n *\n * @deprecated use `useFormatRelativeTime` or `useFormatTime` instead.\n */\nexport function useFormatDateTime(\n\ttimestamp: MaybeRefOrGetter<Date|number> = Date.now(),\n\topts: MaybeRefOrGetter<LegacyFormatDateTimeOptions> = {},\n) {\n\tconst formattedFullTime = useFormatTime(timestamp, opts)\n\tconst relativeTime = useFormatRelativeTime(timestamp, computed(() => {\n\t\tconst options = toValue(opts)\n\t\treturn {\n\t\t\t...options,\n\t\t\trelativeTime: typeof options.relativeTime === 'string'\n\t\t\t\t? options.relativeTime\n\t\t\t\t: 'long',\n\t\t}\n\t}))\n\n\tconst formattedTime = computed(() => toValue(opts).relativeTime !== false\n\t\t? relativeTime.value\n\t\t: formattedFullTime.value,\n\t)\n\n\treturn {\n\t\tformattedTime,\n\t\tformattedFullTime,\n\t}\n}\n"],"names":["relativeTime"],"mappings":";;;;;AAyDA,MAAM,kBAAkB;AAAA,EACvB,MAAM,EAAE,mBAAmB;AAAA,EAC3B,OAAO,EAAE,aAAa;AAAA;AAAA,EACtB,QAAQ,EAAE,UAAU;AAAA;AACrB;AAUO,SAAS,sBACf,YAA6C,KAAK,OAClD,OAAoD,CAAA,GAC5B;AACpB,MAAA;AAKE,QAAA,OAAO,SAAS,MAAM,IAAI,KAAK,QAAQ,SAAS,CAAC,CAAC;AAKlD,QAAA,UAAU,SAA4B,MAAM;AACjD,UAAM,EAAE,UAAU,cAAAA,eAAc,cAAc,IAAI,QAAQ,IAAI;AACvD,WAAA;AAAA,MACN,GAAG,YAAY,EAAE,SAAS;AAAA,MAC1B,GAAGA,iBAAgB,EAAE,cAAAA,cAAa;AAAA,MAClC,eAAe,gBACZ,gBAAgBA,iBAAgB,MAAM,IACtC;AAAA,IACJ;AAAA,EAAA,CACA;AAKK,QAAA,eAAe,IAAI,EAAE;AACf,cAAA,MAAM,oBAAoB;AAMtC,WAAS,qBAAqB;AAC7B,iBAAa,QAAQ,mBAAmB,KAAK,OAAO,QAAQ,KAAK;AAEjE,QAAI,QAAQ,IAAI,EAAE,WAAW,OAAO;AACnC,YAAM,OAAO,KAAK,IAAI,KAAK,IAAI,IAAI,IAAI,KAAK,QAAQ,SAAS,CAAC,EAAE,SAAS;AACnE,YAAA,WAAW,OAAO,QAAU,QAAQ,MAAM,gBAC7C,KAAK,IAAI,OAAO,IAAI,IAAO,IAC3B;AACS,kBAAA,OAAO,WAAW,oBAAoB,QAAQ;AAAA,IAAA;AAAA,EAC3D;AAID,cAAY,MAAM,aAAa,OAAO,aAAa,SAAS,CAAC;AAE7D,SAAO,SAAS,YAAY;AAC7B;AAQgB,SAAA,cACf,WACA,MACwB;AAClB,QAAA,UAAU,SAAsC,OAAO;AAAA,IAC5D,QAAQ,mBAAmB;AAAA,IAC3B,QAAQ,EAAE,WAAW,SAAS,WAAW,SAAS;AAAA,IAClD,GAAG,QAAQ,IAAI;AAAA,EAAA,EACd;AAEF,QAAM,YAAY,SAAS,MAAM,IAAI,KAAK,eAAe,QAAQ,MAAM,QAAQ,QAAQ,MAAM,MAAM,CAAC;AAE7F,SAAA,SAAS,MAAM,UAAU,MAAM,OAAO,QAAQ,SAAS,CAAC,CAAC;AACjE;AAaO,SAAS,kBACf,YAA2C,KAAK,OAChD,OAAsD,CAAA,GACrD;AACK,QAAA,oBAAoB,cAAc,WAAW,IAAI;AACvD,QAAM,eAAe,sBAAsB,WAAW,SAAS,MAAM;AAC9D,UAAA,UAAU,QAAQ,IAAI;AACrB,WAAA;AAAA,MACN,GAAG;AAAA,MACH,cAAc,OAAO,QAAQ,iBAAiB,WAC3C,QAAQ,eACR;AAAA,IACJ;AAAA,EAAA,CACA,CAAC;AAEF,QAAM,gBAAgB;AAAA,IAAS,MAAM,QAAQ,IAAI,EAAE,iBAAiB,QACjE,aAAa,QACb,kBAAkB;AAAA,EACrB;AAEO,SAAA;AAAA,IACN;AAAA,IACA;AAAA,EACD;AACD;"}

package/dist/Composables/useHotKey.cjs

@@ -3,31 +3,35 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const core = require("@vueuse/core");
 const disableKeyboardShortcuts = window.OCP?.Accessibility?.disableKeyboardShortcuts?.();
 const isMac = /mac|ipad|iphone|darwin/i.test(navigator.userAgent);
+const derivedKeysRegex = /^[a-zA-Z0-9]$/;
+const nonAsciiPrintableRegex = /^[^\x20-\x7F]$/;
 function shouldIgnoreEvent(event) {
-  if (event.target instanceof HTMLInputElement || event.target instanceof HTMLTextAreaElement || event.target instanceof HTMLSelectElement || event.target?.isContentEditable) {
+  if (!(event.target instanceof HTMLElement) || event.target instanceof HTMLInputElement || event.target instanceof HTMLTextAreaElement || event.target instanceof HTMLSelectElement || event.target.isContentEditable) {
     return true;
   }
   return document.getElementsByClassName("modal-mask").length !== 0;
 }
-const eventHandler = (callback, options) => (event) => {
-  const ctrlKeyPressed = isMac ? event.metaKey : event.ctrlKey;
-  if (ctrlKeyPressed !== Boolean(options.ctrl)) {
-    return;
-  } else if (event.altKey !== Boolean(options.alt)) {
-    return;
-  } else if (options.shift !== void 0 && event.shiftKey !== Boolean(options.shift)) {
-    return;
-  } else if (shouldIgnoreEvent(event)) {
-    return;
-  }
-  if (options.prevent) {
-    event.preventDefault();
-  }
-  if (options.stop) {
-    event.stopPropagation();
-  }
-  callback(event);
-};
+function eventHandler(callback, options) {
+  return (event) => {
+    const ctrlKeyPressed = isMac ? event.metaKey : event.ctrlKey;
+    if (ctrlKeyPressed !== Boolean(options.ctrl)) {
+      return;
+    } else if (event.altKey !== Boolean(options.alt)) {
+      return;
+    } else if (options.shift !== void 0 && event.shiftKey !== Boolean(options.shift)) {
+      return;
+    } else if (shouldIgnoreEvent(event)) {
+      return;
+    }
+    if (options.prevent) {
+      event.preventDefault();
+    }
+    if (options.stop) {
+      event.stopPropagation();
+    }
+    callback(event);
+  };
+}
 function useHotKey(keysOrFilter, callback = () => {
 }, options = {}) {
   if (disableKeyboardShortcuts) {
@@ -35,8 +39,18 @@ function useHotKey(keysOrFilter, callback = () => {
     };
   }
   const validateKeyEvent = (event, key) => {
+    if (event.key === key) {
+      return true;
+    }
     if (options.caseSensitive) {
-      return event.key === key;
+      const isKeyInLowerCase = key === key.toLowerCase();
+      const isEventKeyInLowerCase = event.key === event.key.toLowerCase();
+      if (isKeyInLowerCase !== isEventKeyInLowerCase) {
+        return false;
+      }
+    }
+    if (derivedKeysRegex.test(key) && nonAsciiPrintableRegex.test(event.key)) {
+      return event.code.replace(/^(?:Key|Digit|Numpad)/, "") === key.toUpperCase();
     }
     return event.key.toLowerCase() === key.toLowerCase();
   };