@nextcloud/vue 9.3.2 → 9.4.0

package/dist/chunks/{NcDashboardWidget-CIUrPOLo.mjs → NcDashboardWidget-Ddt4Ze_7.mjs}

@@ -1,9 +1,9 @@
-import '../assets/NcDashboardWidget-DFY9GRrd.css';
+import '../assets/NcDashboardWidget-nZuIL1UN.css';
 import { createElementBlock, openBlock, mergeProps, createElementVNode, createCommentVNode, toDisplayString, resolveComponent, createBlock, renderSlot, withCtx, createVNode, Fragment, renderList, toHandlers } from "vue";
 import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
-import { r as register, z as t35, a as t } from "./_l10n-CgsPi8nC.mjs";
-import { N as NcAvatar } from "./NcAvatar-S8EJR2BK.mjs";
-import { N as NcDashboardWidgetItem } from "./NcDashboardWidgetItem-DdYM1QYk.mjs";
+import { r as register, z as t35, a as t } from "./_l10n-BSFzy-71.mjs";
+import { N as NcAvatar } from "./NcAvatar-xQb0quUq.mjs";
+import { N as NcDashboardWidgetItem } from "./NcDashboardWidgetItem-Cu-899WY.mjs";
 import { N as NcEmptyContent } from "./NcEmptyContent-B8-90BSI.mjs";
 const _sfc_main$1 = {
   name: "CheckIcon",
@@ -180,7 +180,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
           key: item.id
         }, [
           renderSlot(_ctx.$slots, "default", { item }, () => [
-            createVNode(_component_NcDashboardWidgetItem, mergeProps({ ref_for: true }, item, { "item-menu": $props.itemMenu }, toHandlers($options.handlers)), null, 16, ["item-menu"])
+            createVNode(_component_NcDashboardWidgetItem, mergeProps({ ref_for: true }, item, { itemMenu: $props.itemMenu }, toHandlers($options.handlers)), null, 16, ["itemMenu"])
           ], true)
         ]);
       }), 128))
@@ -220,8 +220,8 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     }, toDisplayString($props.showMoreLabel), 9, _hoisted_3)) : createCommentVNode("", true)
   ]);
 }
-const NcDashboardWidget = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-6b5fc397"]]);
+const NcDashboardWidget = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-8dabc003"]]);
 export {
   NcDashboardWidget as N
 };
-//# sourceMappingURL=NcDashboardWidget-CIUrPOLo.mjs.map
+//# sourceMappingURL=NcDashboardWidget-Ddt4Ze_7.mjs.map

package/dist/chunks/NcDashboardWidget-Ddt4Ze_7.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"NcDashboardWidget-Ddt4Ze_7.mjs","sources":["../../node_modules/vue-material-design-icons/Check.vue","../../src/components/NcDashboardWidget/NcDashboardWidget.vue"],"sourcesContent":["<template>\n  <span v-bind=\"$attrs\"\n        :aria-hidden=\"title ? null : 'true'\"\n        :aria-label=\"title\"\n        class=\"material-design-icon check-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=\"M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z\">\n        <title v-if=\"title\">{{ title }}</title>\n      </path>\n    </svg>\n  </span>\n</template>\n\n<script>\nexport default {\n  name: \"CheckIcon\",\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: 2020 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n## Usage\n\n### Simplest example with custom item\n```vue\n<template>\n\t<NcDashboardWidget :items=\"items\">\n\t\t<template #default=\"{ item }\">\n\t\t\t{{ item.name }}\n\t\t</template>\n\t</NcDashboardWidget>\n</template>\n\n<script>\nconst myItems = [\n\t{\n\t\tname: 'first',\n\t\tcontent: 'blabla',\n\t},\n\t{\n\t\tname: 'second',\n\t\tcontent: 'fuzzfuzz',\n\t},\n]\nexport default {\n\tname: 'MyDashboardWidget',\n\tprops: [],\n\tdata() {\n\t\treturn {\n\t\t\titems: myItems\n\t\t}\n\t},\n}\n</script>\n```\n\n### Showing items and a half empty content message\n```vue\n<template>\n\t<NcDashboardWidget :items=\"items\"\n\t\t:show-items-and-empty-content=\"true\"\n\t\t:half-empty-content-message=\"'No unread items'\">\n\t\t<template #default=\"{ item }\">\n\t\t\t{{ item.name }}\n\t\t</template>\n\t</NcDashboardWidget>\n</template>\n\n<script>\nconst myItems = [\n\t{\n\t\tname: 'first',\n\t\tcontent: 'blabla',\n\t},\n\t{\n\t\tname: 'second',\n\t\tcontent: 'fuzzfuzz',\n\t},\n]\nexport default {\n\tname: 'MyDashboardWidget',\n\tprops: [],\n\tdata() {\n\t\treturn {\n\t\t\titems: myItems\n\t\t}\n\t},\n}\n</script>\n```\n\n### Complete example using NcDashboardWidgetItem\n\n```vue\n<template>\n\t<NcDashboardWidget :items=\"items\"\n\t\t:show-more-url=\"'https://nextcloud.com'\"\n\t\t:item-menu=\"itemMenu\"\n\t\t@hide=\"onHide\"\n\t\t@markDone=\"onMarkDone\">\n\n\t\t<template #empty-content>\n\t\t\tNothing to display\n\t\t</template>\n\t</NcDashboardWidget>\n</template>\n\n<script>\nconst myItems = [\n\t{\n\t\tid: '1',\n\t\ttargetUrl: 'https://example.tld',\n\t\tavatarUrl: 'https://example.tld/img.png',\n\t\tavatarUsername: 'Robert',\n\t\tavatarIsNoUser: true,\n\t\toverlayIconUrl: '/svg/core/actions/sound?color=000',\n\t\tmainText: 'First item text',\n\t\tsubText: 'First item subtext',\n\t},\n\t{\n\t\tid: '2',\n\t\ttargetUrl: 'https://example.tld',\n\t\tavatarUrl: 'https://example.tld/img.jpg',\n\t\toverlayIconUrl: '/svg/core/actions/add?color=000',\n\t\tmainText: 'Second item text',\n\t\tsubText: 'Second item subtext',\n\t},\n]\nconst myItemMenu = {\n\t// triggers an event named \"markDone\" when clicked\n\t'markDone': {\n\t\ttext: 'Mark as done',\n\t\ticon: 'icon-checkmark',\n\t},\n\t// triggers an event named \"hide\" when clicked\n\t'hide': {\n\t\ttext: 'Hide',\n\t\ticon: 'icon-toggle',\n\t},\n}\nexport default {\n\tname: 'MyDashboardWidget',\n\tprops: [],\n\tdata() {\n\t\treturn {\n\t\t\titems: myItems,\n\t\t\titemMenu: myItemMenu,\n\t\t\tloading: true,\n\t\t}\n\t},\n\tmethods: {\n\t\tonMoreClick() {\n\t\t\tconsole.log('more clicked')\n\t\t\tconst win = window.open('https://wherever.you.want', '_blank')\n\t\t\twin.focus()\n\t\t},\n\t\tonHide(item) {\n\t\t\tconsole.log('user wants to hide item ' + item.id)\n\t\t\t// do what you want\n\t\t},\n\t\tonMarkDone(item) {\n\t\t\tconsole.log('user wants to mark item ' + item.id + ' as done')\n\t\t\t// do what you want\n\t\t},\n\t},\n}\n</script>\n```\n\n</docs>\n\n<template>\n\t<div class=\"dashboard-widget\">\n\t\t<!-- This element is shown if we have items, but want to show a general message as well.\n\t\tCan be used e.g. to show \"No mentions\" on top of the item list. -->\n\t\t<NcEmptyContent\n\t\t\tv-if=\"showHalfEmptyContentArea\"\n\t\t\t:description=\"halfEmptyContentString\"\n\t\t\tclass=\"half-screen\">\n\t\t\t<template #icon>\n\t\t\t\t<!-- @slot The icon to show in the half empty content area. -->\n\t\t\t\t<slot name=\"halfEmptyContentIcon\">\n\t\t\t\t\t<Check />\n\t\t\t\t</slot>\n\t\t\t</template>\n\t\t</NcEmptyContent>\n\t\t<!-- The list of items to show. -->\n\t\t<ul>\n\t\t\t<li v-for=\"item in displayedItems\" :key=\"item.id\">\n\t\t\t\t<!-- @slot The default slot can be optionally overridden. It contains the template of one item. -->\n\t\t\t\t<slot name=\"default\" :item=\"item\">\n\t\t\t\t\t<NcDashboardWidgetItem\n\t\t\t\t\t\tv-bind=\"item\"\n\t\t\t\t\t\t:itemMenu=\"itemMenu\"\n\t\t\t\t\t\tv-on=\"handlers\" />\n\t\t\t\t</slot>\n\t\t\t</li>\n\t\t</ul>\n\t\t<!-- While the widget is loading, we show a list of placeholder items. -->\n\t\t<div v-if=\"loading\">\n\t\t\t<div v-for=\"i in 7\" :key=\"i\" class=\"item-list__entry\">\n\t\t\t\t<NcAvatar class=\"item-avatar\" :size=\"44\" />\n\t\t\t\t<div class=\"item__details\">\n\t\t\t\t\t<h3>&nbsp;</h3>\n\t\t\t\t\t<p class=\"message\">\n&nbsp;\n\t\t\t\t\t</p>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t\t<!-- @slot Slot for showing information in case of an empty item list. -->\n\t\t<slot v-else-if=\"items.length === 0\" name=\"empty-content\">\n\t\t\t<NcEmptyContent\n\t\t\t\tv-if=\"emptyContentMessage\"\n\t\t\t\t:description=\"emptyContentMessage\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<!-- @slot The icon to show in the empty content area. -->\n\t\t\t\t\t<slot name=\"emptyContentIcon\" />\n\t\t\t\t</template>\n\t\t\t</NcEmptyContent>\n\t\t</slot>\n\t\t<!-- A \"show more\" link, e.g. to navigate to the main app belonging to this widget. -->\n\t\t<a\n\t\t\tv-else-if=\"showMore\"\n\t\t\t:href=\"showMoreUrl\"\n\t\t\ttarget=\"_blank\"\n\t\t\tclass=\"more\"\n\t\t\ttabindex=\"0\">\n\t\t\t{{ showMoreLabel }}\n\t\t</a>\n\t</div>\n</template>\n\n<script>\nimport Check from 'vue-material-design-icons/Check.vue'\nimport { t } from '../../l10n.ts'\nimport NcAvatar from '../NcAvatar/index.js'\nimport NcDashboardWidgetItem from '../NcDashboardWidgetItem/index.js'\nimport NcEmptyContent from '../NcEmptyContent/index.ts'\n\nexport default {\n\tname: 'NcDashboardWidget',\n\tcomponents: {\n\t\tNcAvatar,\n\t\tNcDashboardWidgetItem,\n\t\tNcEmptyContent,\n\t\tCheck,\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * An array containing the items to show (specific structure must be respected,\n\t\t * except if you override item rendering in the default slot).\n\t\t */\n\t\titems: {\n\t\t\ttype: Array,\n\t\t\tdefault: () => { return [] },\n\t\t},\n\n\t\t/**\n\t\t * If this is set, a \"show more\" text is displayed on the widget's bottom.\n\t\t * It's a link pointing to this URL.\n\t\t */\n\t\tshowMoreUrl: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * The text of show more button.\n\t\t *\n\t\t * Expected to be in the form \"More {itemName} …\"\n\t\t */\n\t\tshowMoreLabel: {\n\t\t\ttype: String,\n\t\t\tdefault: t('More items …'),\n\t\t},\n\n\t\t/**\n\t\t * A boolean to put the widget in a loading state.\n\t\t */\n\t\tloading: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * An object containing context menu entries that will be displayed for each item.\n\t\t */\n\t\titemMenu: {\n\t\t\ttype: Object,\n\t\t\tdefault: () => { return {} },\n\t\t},\n\n\t\t/**\n\t\t * Whether both the items and the empty content message are shown.\n\t\t * Usefull for e.g. showing \"No mentions\" and a list of elements.\n\t\t */\n\t\tshowItemsAndEmptyContent: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * The text to show in the empty content area.\n\t\t */\n\t\temptyContentMessage: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * The text to show in the half empty content area.\n\t\t */\n\t\thalfEmptyContentMessage: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\t},\n\n\tcomputed: {\n\t\t// forward menu events to my parent\n\t\thandlers() {\n\t\t\tconst h = {}\n\t\t\tfor (const evName in this.itemMenu) {\n\t\t\t\th[evName] = (it) => {\n\t\t\t\t\tthis.$emit(evName, it)\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn h\n\t\t},\n\n\t\tdisplayedItems() {\n\t\t\tconst nbItems = (this.showMoreUrl && this.items.length >= this.maxItemNumber)\n\t\t\t\t? this.maxItemNumber - 1\n\t\t\t\t: this.maxItemNumber\n\t\t\treturn this.items.slice(0, nbItems)\n\t\t},\n\n\t\tshowHalfEmptyContentArea() {\n\t\t\treturn this.showItemsAndEmptyContent && this.halfEmptyContentString && this.items.length !== 0\n\t\t},\n\n\t\thalfEmptyContentString() {\n\t\t\treturn this.halfEmptyContentMessage || this.emptyContentMessage\n\t\t},\n\n\t\tmaxItemNumber() {\n\t\t\treturn this.showItemsAndEmptyContent ? 5 : 7\n\t\t},\n\n\t\tshowMore() {\n\t\t\treturn this.showMoreUrl && this.items.length >= this.maxItemNumber\n\t\t},\n\t},\n}\n</script>\n\n<style scoped lang=\"scss\">\n.dashboard-widget :deep(.empty-content) {\n\ttext-align: center;\n\tpadding-top: 5vh;\n\t&.half-screen {\n\t\tpadding-top: 0;\n\t\tmargin-bottom: 1vh;\n\t}\n}\n\n.more {\n\tdisplay: block;\n\ttext-align: center;\n\tcolor: var(--color-text-maxcontrast);\n\tline-height: 60px;\n\tcursor: pointer;\n\n\t&:hover,\n\t&:focus {\n\t\tbackground-color: var(--color-background-hover);\n\t\tborder-radius: var(--border-radius-element);\n\t\tcolor: var(--color-main-text);\n\t}\n}\n\n/* skeleton */\n.item-list__entry {\n\tdisplay: flex;\n\talign-items: flex-start;\n\tpadding: 8px;\n\n\t.item-avatar {\n\t\tposition: relative;\n\t\tmargin-block: auto;\n\t\tbackground-color: var(--color-background-dark) !important;\n\t}\n\t.item__details {\n\t\tpadding-inline-start: 8px;\n\t\tmax-height: var(--default-clickable-area);\n\t\tflex-grow: 1;\n\t\toverflow: hidden;\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\n\t\th3,\n\t\t.message {\n\t\t\twhite-space: nowrap;\n\t\t\tbackground-color: var(--color-background-dark);\n\t\t}\n\t\th3 {\n\t\t\tfont-size: 100%;\n\t\t\tmargin: 0;\n\t\t}\n\t\t.message {\n\t\t\twidth: 80%;\n\t\t\theight: 15px;\n\t\t\tmargin-top: 5px;\n\t\t}\n\t}\n}\n</style>\n"],"names":["_sfc_main","_hoisted_3","_createElementBlock","_mergeProps","_createElementVNode","_openBlock","_createBlock","_renderSlot","_createVNode","_Fragment","_renderList","_toHandlers"],"mappings":";;;;;;AAoBA,MAAKA,cAAU;AAAA,EACb,MAAM;AAAA,EACN,OAAO,CAAC,OAAO;AAAA,EACf,OAAO;AAAA,IACL,OAAO;AAAA,MACL,MAAM;AAAA;IAER,WAAW;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA;IAEX,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,EACF;AACF;;;AAxBY,MAAAC,eAAA,EAAA,GAAE,0DAAyD;;;sBAXrEC,mBAeO,QAfPC,WAAc,KAAA,QAAM;AAAA,IACb,eAAa,OAAA,QAAK,OAAA;AAAA,IAClB,cAAY,OAAA;AAAA,IACb,OAAM;AAAA,IACN,MAAK;AAAA,IACJ,SAAK,OAAA,CAAA,MAAA,OAAA,CAAA,IAAA,YAAE,KAAA,MAAK,SAAU,MAAM;AAAA;kBACjCD,mBAQM,OAAA;AAAA,MARA,MAAM,OAAA;AAAA,MACP,OAAM;AAAA,MACL,OAAO,OAAA;AAAA,MACP,QAAQ,OAAA;AAAA,MACT,SAAQ;AAAA;MACXE,mBAEO,QAFPH,cAEO;AAAA,QADQ,OAAA,SAAbI,UAAA,GAAAH,mBAAuC,qCAAhB,OAAA,KAAK,GAAA,CAAA;;;;;;;ACoNpC,MAAK,YAAU;AAAA,EACd,MAAM;AAAA,EACN,YAAY;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;EAGD,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKN,OAAO;AAAA,MACN,MAAM;AAAA,MACN,SAAS,MAAM;AAAE,eAAO,CAAA;AAAA,MAAG;AAAA;;;;;IAO5B,aAAa;AAAA,MACZ,MAAM;AAAA,MACN,SAAS;AAAA;;;;;;IAQV,eAAe;AAAA,MACd,MAAM;AAAA,MACN,SAAS,EAAE,cAAc;AAAA;;;;IAM1B,SAAS;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA;;;;IAMV,UAAU;AAAA,MACT,MAAM;AAAA,MACN,SAAS,MAAM;AAAE,eAAO,CAAA;AAAA,MAAG;AAAA;;;;;IAO5B,0BAA0B;AAAA,MACzB,MAAM;AAAA,MACN,SAAS;AAAA;;;;IAMV,qBAAqB;AAAA,MACpB,MAAM;AAAA,MACN,SAAS;AAAA;;;;IAMV,yBAAyB;AAAA,MACxB,MAAM;AAAA,MACN,SAAS;AAAA;;EAIX,UAAU;AAAA;AAAA,IAET,WAAW;AACV,YAAM,IAAI,CAAA;AACV,iBAAW,UAAU,KAAK,UAAU;AACnC,UAAE,MAAM,IAAI,CAAC,OAAO;AACnB,eAAK,MAAM,QAAQ,EAAE;AAAA,QACtB;AAAA,MACD;AACA,aAAO;AAAA,IACR;AAAA,IAEA,iBAAiB;AAChB,YAAM,UAAW,KAAK,eAAe,KAAK,MAAM,UAAU,KAAK,gBAC5D,KAAK,gBAAgB,IACrB,KAAK;AACR,aAAO,KAAK,MAAM,MAAM,GAAG,OAAO;AAAA,IACnC;AAAA,IAEA,2BAA2B;AAC1B,aAAO,KAAK,4BAA4B,KAAK,0BAA0B,KAAK,MAAM,WAAW;AAAA,IAC9F;AAAA,IAEA,yBAAyB;AACxB,aAAO,KAAK,2BAA2B,KAAK;AAAA,IAC7C;AAAA,IAEA,gBAAgB;AACf,aAAO,KAAK,2BAA2B,IAAI;AAAA,IAC5C;AAAA,IAEA,WAAW;AACV,aAAO,KAAK,eAAe,KAAK,MAAM,UAAU,KAAK;AAAA,IACtD;AAAA;AAEF;AAvLM,MAAA,aAAA,EAAA,OAAM,mBAAkB;;;;;;;;AAA7B,SAAAG,UAAA,GAAAH,mBA0DM,OA1DN,YA0DM;AAAA,IAtDE,SAAA,yCADPI,YAUiB,2BAAA;AAAA;MARf,aAAa,SAAA;AAAA,MACd,OAAM;AAAA;MACK,cAEV,MAEO;AAAA,QAFPC,WAEO,yCAFP,MAEO;AAAA,UADNC,YAAS,gBAAA;AAAA;;;;IAKZJ,mBAUK,MAAA,MAAA;AAAA,wBATJF,mBAQKO,UAAA,MAAAC,WARc,SAAA,gBAAc,CAAtB,SAAI;4BAAfR,mBAQK,MAAA;AAAA,UAR+B,KAAK,KAAK;AAAA;UAE7CK,WAKO,KAAA,QAAA,WAAA,EALe,KAAU,GAAhC,MAKO;AAAA,YAJNC,YAGmB,kCAHnBL,WAGmB,EAAA,SAAA,QAFV,MAAI,EACX,UAAU,OAAA,YACXQ,WAAM,SAAA,QAAQ,CAAA,GAAA,MAAA,IAAA,CAAA,UAAA,CAAA;AAAA;;;;IAKP,OAAA,wBAAXT,mBAUM,OAAA,YAAA;AAAA,oBATLA,mBAQMO,UAAA,MAAAC,WARW,GAAC,CAAN,MAAC;eAAbN,mBAQM,OAAA;AAAA,UARe,KAAK;AAAA,UAAG,OAAM;AAAA;UAClCI,YAA2C,qBAAA;AAAA,YAAjC,OAAM;AAAA,YAAe,MAAM;AAAA;oCACrCJ,mBAKM,OAAA,EALD,OAAM,mBAAe;AAAA,YACzBA,mBAAe,YAAX,GAAM;AAAA,YACVA,mBAEI,KAAA,EAFD,OAAM,UAAS,GAAC,KAEnB;AAAA;;;UAKc,OAAA,MAAM,WAAM,IAA7BG,WASO,0CATP,MASO;AAAA,MAPC,OAAA,oCADPD,YAOiB,2BAAA;AAAA;QALf,aAAa,OAAA;AAAA;QACH,cAEV,MAAgC;AAAA,UAAhCC,WAAgC,KAAA,QAAA,oBAAA,CAAA,GAAA,QAAA,IAAA;AAAA;;;eAMvB,SAAA,yBADZL,mBAOI,KAAA;AAAA;MALF,MAAM,OAAA;AAAA,MACP,QAAO;AAAA,MACP,OAAM;AAAA,MACN,UAAS;AAAA,uBACN,OAAA,aAAa,GAAA,GAAA,UAAA;;;;","x_google_ignoreList":[0]}

package/dist/chunks/{NcDashboardWidgetItem-DdYM1QYk.mjs → NcDashboardWidgetItem-Cu-899WY.mjs}

@@ -1,7 +1,7 @@
-import '../assets/NcDashboardWidgetItem-DPVZ3Oso.css';
-import { N as NcActionButton } from "./NcActionButton-BHXE4UKQ.mjs";
-import { N as NcActions } from "./NcActions-4R7icatI.mjs";
-import { N as NcAvatar } from "./NcAvatar-S8EJR2BK.mjs";
+import '../assets/NcDashboardWidgetItem-DpVmEBwQ.css';
+import { N as NcActionButton } from "./NcActionButton-DNXoAooH.mjs";
+import { N as NcActions } from "./NcActions-CCXgfwjS.mjs";
+import { N as NcAvatar } from "./NcAvatar-xQb0quUq.mjs";
 import { resolveComponent, createElementBlock, openBlock, createBlock, resolveDynamicComponent, normalizeClass, withCtx, renderSlot, createCommentVNode, createElementVNode, createVNode, toDisplayString, Fragment, renderList, withModifiers, createTextVNode } from "vue";
 import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
 const _sfc_main = {
@@ -145,9 +145,9 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
             size: 44,
             url: $props.avatarUrl,
             user: $props.avatarUsername,
-            "is-no-user": $props.avatarIsNoUser,
-            "hide-status": $options.gotOverlayIcon
-          }, null, 8, ["url", "user", "is-no-user", "hide-status"])
+            isNoUser: $props.avatarIsNoUser,
+            hideStatus: $options.gotOverlayIcon
+          }, null, 8, ["url", "user", "isNoUser", "hideStatus"])
         ], true),
         $props.overlayIconUrl ? (openBlock(), createElementBlock("img", {
           key: 0,
@@ -165,7 +165,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
         ]),
         $options.gotMenu ? (openBlock(), createBlock(_component_NcActions, {
           key: 1,
-          "force-menu": $props.forceMenu
+          forceMenu: $props.forceMenu
         }, {
           default: withCtx(() => [
             renderSlot(_ctx.$slots, "actions", {}, () => [
@@ -173,7 +173,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
                 return openBlock(), createBlock(_component_NcActionButton, {
                   key: menuItemId,
                   icon: m.icon,
-                  "close-after-click": true,
+                  closeAfterClick: true,
                   onClick: withModifiers(($event) => _ctx.$emit(menuItemId, $options.item), ["prevent", "stop"])
                 }, {
                   default: withCtx(() => [
@@ -185,14 +185,14 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
             ], true)
           ]),
           _: 3
-        }, 8, ["force-menu"])) : createCommentVNode("", true)
+        }, 8, ["forceMenu"])) : createCommentVNode("", true)
       ]),
       _: 3
     }, 8, ["href", "target", "class", "onClick"]))
   ], 32);
 }
-const NcDashboardWidgetItem = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-c033ba26"]]);
+const NcDashboardWidgetItem = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-2c8b617b"]]);
 export {
   NcDashboardWidgetItem as N
 };
-//# sourceMappingURL=NcDashboardWidgetItem-DdYM1QYk.mjs.map
+//# sourceMappingURL=NcDashboardWidgetItem-Cu-899WY.mjs.map

package/dist/chunks/NcDashboardWidgetItem-Cu-899WY.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"NcDashboardWidgetItem-Cu-899WY.mjs","sources":["../../src/components/NcDashboardWidgetItem/NcDashboardWidgetItem.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\n### General description\n\nThis component is meant to be used inside a DashboardWidget component.\n\n</docs>\n\n<template>\n\t<div @mouseover=\"hovered = true\" @mouseleave=\"hovered = false\">\n\t\t<component\n\t\t\t:is=\"targetUrl ? 'a' : 'div'\"\n\t\t\t:href=\"targetUrl || undefined\"\n\t\t\t:target=\"targetUrl ? '_blank' : undefined\"\n\t\t\tclass=\"item-list__entry\"\n\t\t\t:class=\"{ 'item-list__entry--has-actions-menu': gotMenu }\"\n\t\t\t@click=\"onLinkClick\">\n\t\t\t<!-- @slot Slot for passing a user avatar. -->\n\t\t\t<slot name=\"avatar\" :avatarUrl=\"avatarUrl\" :avatarUsername=\"avatarUsername\">\n\t\t\t\t<NcAvatar\n\t\t\t\t\tclass=\"item-avatar\"\n\t\t\t\t\t:size=\"44\"\n\t\t\t\t\t:url=\"avatarUrl\"\n\t\t\t\t\t:user=\"avatarUsername\"\n\t\t\t\t\t:isNoUser=\"avatarIsNoUser\"\n\t\t\t\t\t:hideStatus=\"gotOverlayIcon\" />\n\t\t\t</slot>\n\t\t\t<img\n\t\t\t\tv-if=\"overlayIconUrl\"\n\t\t\t\tclass=\"item-icon\"\n\t\t\t\talt=\"\"\n\t\t\t\t:src=\"overlayIconUrl\">\n\t\t\t<div class=\"item__details\">\n\t\t\t\t<h3 :title=\"mainText\">\n\t\t\t\t\t{{ mainText }}\n\t\t\t\t</h3>\n\t\t\t\t<span v-if=\"subText !== ''\" class=\"message\" :title=\"subText\">\n\t\t\t\t\t{{ subText }}\n\t\t\t\t</span>\n\t\t\t</div>\n\t\t\t<NcActions v-if=\"gotMenu\" :forceMenu=\"forceMenu\">\n\t\t\t\t<!-- @slot This slot can be used to provide actions for each dashboard widget item. -->\n\t\t\t\t<slot name=\"actions\">\n\t\t\t\t\t<NcActionButton\n\t\t\t\t\t\tv-for=\"(m, menuItemId) in itemMenu\"\n\t\t\t\t\t\t:key=\"menuItemId\"\n\t\t\t\t\t\t:icon=\"m.icon\"\n\t\t\t\t\t\t:closeAfterClick=\"true\"\n\t\t\t\t\t\t@click.prevent.stop=\"$emit(menuItemId, item)\">\n\t\t\t\t\t\t{{ m.text }}\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t</slot>\n\t\t\t</NcActions>\n\t\t</component>\n\t</div>\n</template>\n\n<script>\nimport NcActionButton from '../NcActionButton/index.js'\nimport NcActions from '../NcActions/index.js'\nimport NcAvatar from '../NcAvatar/index.js'\n\nexport default {\n\tname: 'NcDashboardWidgetItem',\n\tcomponents: {\n\t\tNcAvatar,\n\t\tNcActions,\n\t\tNcActionButton,\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * The item id (optional)\n\t\t */\n\t\tid: {\n\t\t\ttype: [String, Number],\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * The item element is a link to this URL (optional)\n\t\t */\n\t\ttargetUrl: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * Where to get the avatar image. (optional) Used if avatarUsername is not defined.\n\t\t */\n\t\tavatarUrl: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * Name to provide to the Avatar. (optional) Used if avatarUrl is not defined.\n\t\t */\n\t\tavatarUsername: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * Is the avatarUsername not a user's name? (optional, false by default)\n\t\t */\n\t\tavatarIsNoUser: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Small icon to display on the bottom-right corner of the avatar (optional)\n\t\t */\n\t\toverlayIconUrl: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * Item main text (mandatory)\n\t\t */\n\t\tmainText: {\n\t\t\ttype: String,\n\t\t\trequired: true,\n\t\t},\n\n\t\t/**\n\t\t * Item subline text (optional)\n\t\t */\n\t\tsubText: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * An object containing context menu entries that will be displayed for each items (optional)\n\t\t */\n\t\titemMenu: {\n\t\t\ttype: Object,\n\t\t\tdefault: () => { return {} },\n\t\t},\n\n\t\t/**\n\t\t * Specify whether the 3 dot menu is forced when only one action is present\n\t\t */\n\t\tforceMenu: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: true,\n\t\t},\n\t},\n\n\tdata() {\n\t\treturn {\n\t\t\thovered: false,\n\t\t}\n\t},\n\n\tcomputed: {\n\t\titem() {\n\t\t\treturn {\n\t\t\t\tid: this.id,\n\t\t\t\ttargetUrl: this.targetUrl,\n\t\t\t\tavatarUrl: this.avatarUrl,\n\t\t\t\tavatarUsername: this.avatarUsername,\n\t\t\t\toverlayIconUrl: this.overlayIconUrl,\n\t\t\t\tmainText: this.mainText,\n\t\t\t\tsubText: this.subText,\n\t\t\t}\n\t\t},\n\n\t\tgotMenu() {\n\t\t\treturn Object.keys(this.itemMenu).length !== 0 || !!this.$slots.actions\n\t\t},\n\n\t\tgotOverlayIcon() {\n\t\t\treturn this.overlayIconUrl && this.overlayIconUrl !== ''\n\t\t},\n\t},\n\n\tmethods: {\n\t\tonLinkClick(event) {\n\t\t\tif (event.target.closest('.action-item')) {\n\t\t\t\tevent.preventDefault()\n\t\t\t}\n\t\t},\n\t},\n}\n</script>\n\n<style scoped lang=\"scss\">\n.item-list__entry {\n\tdisplay: flex;\n\talign-items: center;\n\tposition: relative;\n\tpadding: 8px;\n\n\t&:hover,\n\t&:focus {\n\t\tbackground-color: var(--color-background-hover);\n\t\tborder-radius: var(--border-radius-element);\n\t}\n\t.item-avatar {\n\t\tposition: relative;\n\t\tmargin-top: auto;\n\t\tmargin-bottom: auto;\n\t}\n\t.item__details {\n\t\tpadding-inline-start: 8px;\n\t\tmax-height: fit-content;\n\t\tflex-grow: 1;\n\t\toverflow: hidden;\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tjustify-content: center;\n\t\tmin-height: var(--default-clickable-area);\n\n\t\th3,\n\t\t.message {\n\t\t\twhite-space: nowrap;\n\t\t\toverflow: hidden;\n\t\t\ttext-overflow: ellipsis;\n\t\t}\n\t\t.message span {\n\t\t\twidth: 10px;\n\t\t\tdisplay: inline-block;\n\t\t\tmargin-bottom: -3px;\n\t\t}\n\t\th3 {\n\t\t\tfont-size: 100%;\n\t\t\tmargin: 0;\n\t\t}\n\t\t.message {\n\t\t\twidth: 100%;\n\t\t\tcolor: var(--color-text-maxcontrast);\n\t\t}\n\t}\n\n\t.item-icon {\n\t\tposition: relative;\n\t\twidth: 14px;\n\t\theight: 14px;\n\t\tmargin-top: 25px;\n\t\tmargin-inline: -10px -2px;\n\t}\n\n\tbutton.primary {\n\t\tpadding: 21px;\n\t\tmargin: 0;\n\t}\n}\n/*\n.content-popover {\n\theight: 0px;\n\twidth: 0px;\n\tmargin-inline: auto;\n}\n.popover-container {\n\twidth: 100%;\n\theight: 0px;\n}\n*/\n</style>\n"],"names":["_createElementBlock","_openBlock","_createBlock","_resolveDynamicComponent","_normalizeClass","_renderSlot","_createVNode","_createElementVNode","_Fragment","_renderList","_withModifiers","_createTextVNode","_toDisplayString"],"mappings":"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"}

package/dist/chunks/{NcDateTimePicker-DtQaoKbG.mjs → NcDateTimePicker-CF8TMzyS.mjs}

@@ -1,11 +1,11 @@
-import '../assets/NcDateTimePicker-D6xbEbaC.css';
+import '../assets/NcDateTimePicker-HT1ZTE-Z.css';
 import { defineComponent, mergeModels, useModel, useTemplateRef, computed, createElementBlock, openBlock, createVNode, createBlock, unref, mergeProps, createSlots, withCtx, createTextVNode, toDisplayString, Teleport, createElementVNode } from "vue";
-import { t as mdiChevronUp, u as mdiChevronDown, c as mdiChevronRight, v as mdiChevronLeft, w as mdiClock, x as mdiCalendarBlank, b as mdiClose } from "./mdi-DvQxv1t7.mjs";
+import { x as mdiChevronUp, y as mdiChevronDown, c as mdiChevronRight, z as mdiChevronLeft, A as mdiClock, B as mdiCalendarBlank, b as mdiClose } from "./mdi-CpchYUUV.mjs";
 import { getCanonicalLocale, getFirstDay, getDayNamesMin, getDayNames } from "@nextcloud/l10n";
 import VueDatePicker from "@vuepic/vue-datepicker";
 import { N as NcIconSvgWrapper } from "./NcIconSvgWrapper-BvLanNaW.mjs";
-import { _ as _sfc_main$1 } from "./NcTimezonePicker.vue_vue_type_script_setup_true_lang-BffYEppS.mjs";
-import { r as register, y as t13, a as t } from "./_l10n-CgsPi8nC.mjs";
+import { _ as _sfc_main$1 } from "./NcTimezonePicker.vue_vue_type_script_setup_true_lang-t72lL380.mjs";
+import { r as register, y as t13, a as t } from "./_l10n-BSFzy-71.mjs";
 import { N as NcButton } from "./NcButton-CzpKEx4V.mjs";
 import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
 register(t13);
@@ -24,17 +24,20 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     confirm: { type: Boolean },
     format: { type: [String, Function], default: void 0 },
     locale: { default: getCanonicalLocale() },
+    max: { default: void 0 },
+    min: { default: void 0 },
     minuteStep: { default: 10 },
     modelValue: { default: null },
     placeholder: { default: void 0 },
     showTimezoneSelect: { type: Boolean },
     showWeekNumber: { type: Boolean },
-    type: { default: "date" }
+    type: { default: "date" },
+    inline: { type: Boolean, default: false }
   }, {
     "timezoneId": { default: "UTC" },
     "timezoneIdModifiers": {}
   }),
-  emits: /* @__PURE__ */ mergeModels(["update:modelValue", "update:timezoneId"], ["update:timezoneId"]),
+  emits: /* @__PURE__ */ mergeModels(["update:modelValue", "update:timezoneId", "blur"], ["update:timezoneId"]),
   setup(__props, { emit: __emit }) {
     const timezoneId = useModel(__props, "timezoneId");
     const props = __props;
@@ -142,6 +145,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       enableTimePicker: !(props.type === "date" || props.type === "date-range"),
       flow: props.type === "datetime" ? ["calendar", "time"] : void 0
     }));
+    const minTime = computed(() => props.min && { hours: props.min.getHours(), minutes: props.min.getMinutes(), seconds: props.min.getSeconds() });
+    const maxTime = computed(() => props.max && { hours: props.max.getHours(), minutes: props.max.getMinutes(), seconds: props.max.getSeconds() });
     function onUpdateModelValue(value2) {
       if (value2 === null) {
         return emit("update:modelValue", null);
@@ -229,30 +234,69 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     function cancelSelection() {
       pickerInstance.value.closeMenu();
     }
+    const calcMinMaxTime = computed(() => {
+      if (props.type === "datetime") {
+        return {
+          minDate: props.min,
+          maxDate: props.max,
+          minTime: props.min && value.value && sameDay(props.min, value.value) ? minTime.value : void 0,
+          maxTime: props.max && value.value && sameDay(props.max, value.value) ? maxTime.value : void 0
+        };
+      }
+      if (props.type === "datetime-range") {
+        return {
+          minDate: props.min,
+          maxDate: props.max,
+          minTime: props.min && value.value ? sameDay(props.min, value.value[0]) ? minTime.value : void 0 : void 0,
+          maxTime: props.max && value.value ? sameDay(props.max, value.value[1]) ? maxTime.value : void 0 : void 0
+        };
+      }
+      if (props.type === "time" || props.type === "time-range") {
+        return {
+          minTime: props.min ? minTime.value : void 0,
+          maxTime: props.max ? maxTime.value : void 0
+        };
+      }
+      return {
+        minDate: props.min,
+        maxDate: props.max
+      };
+    });
+    function sameDay(a, b) {
+      return a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
+    }
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1, [
         createVNode(unref(VueDatePicker), mergeProps({
           ref: "picker",
           "aria-labels": ariaLabels.value,
-          "auto-apply": !_ctx.confirm,
+          autoApply: !_ctx.confirm,
           class: ["vue-date-time-picker", { "vue-date-time-picker--clearable": _ctx.clearable }],
-          "cancel-text": unref(t)("Cancel"),
+          cancelText: unref(t)("Cancel"),
           clearable: _ctx.clearable,
-          "day-names": dayNames,
+          dayNames,
           placeholder: _ctx.placeholder ?? placeholderFallback.value,
           format: realFormat.value,
           locale: _ctx.locale,
-          "minutes-increment": _ctx.minuteStep,
-          "model-value": value.value,
-          "now-button-label": unref(t)("Now"),
-          "select-text": unref(t)("Pick"),
-          "six-weeks": "fair",
+          minDate: calcMinMaxTime.value.minDate,
+          maxDate: calcMinMaxTime.value.maxDate,
+          minTime: calcMinMaxTime.value.minTime,
+          maxTime: calcMinMaxTime.value.maxTime,
+          minutesIncrement: _ctx.minuteStep,
+          modelValue: value.value,
+          nowButtonLabel: unref(t)("Now"),
+          selectText: unref(t)("Pick"),
+          sixWeeks: "fair",
+          inline: _ctx.inline,
           teleport: _ctx.appendToBody ? targetElement.value || void 0 : false,
-          "text-input": "",
-          "week-num-name": unref(weekNumName),
-          "week-numbers": _ctx.showWeekNumber ? { type: "iso" } : void 0,
-          "week-start": unref(weekStart)
-        }, pickerType.value, { "onUpdate:modelValue": onUpdateModelValue }), createSlots({
+          textInput: "",
+          weekNumName: unref(weekNumName),
+          weekNumbers: _ctx.showWeekNumber ? { type: "iso" } : void 0,
+          weekStart: unref(weekStart)
+        }, pickerType.value, {
+          "onUpdate:modelValue": onUpdateModelValue,
+          onBlur: _cache[1] || (_cache[1] = ($event) => emit("blur"))
+        }), createSlots({
           "action-buttons": withCtx(() => [
             createVNode(unref(NcButton), {
               size: "small",
@@ -341,13 +385,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 modelValue: timezoneId.value,
                 "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => timezoneId.value = $event),
                 class: "vue-date-time-picker__timezone",
-                "append-to-body": false,
-                "input-label": unref(t)("Time zone")
-              }, null, 8, ["modelValue", "input-label"])
+                appendToBody: false,
+                inputLabel: unref(t)("Time zone")
+              }, null, 8, ["modelValue", "inputLabel"])
             ]),
             key: "0"
           } : void 0
-        ]), 1040, ["aria-labels", "auto-apply", "class", "cancel-text", "clearable", "placeholder", "format", "locale", "minutes-increment", "model-value", "now-button-label", "select-text", "teleport", "week-num-name", "week-numbers", "week-start"]),
+        ]), 1040, ["aria-labels", "autoApply", "class", "cancelText", "clearable", "placeholder", "format", "locale", "minDate", "maxDate", "minTime", "maxTime", "minutesIncrement", "modelValue", "nowButtonLabel", "selectText", "inline", "teleport", "weekNumName", "weekNumbers", "weekStart"]),
         (openBlock(), createBlock(Teleport, {
           to: "body",
           disabled: !_ctx.appendToBody
@@ -358,8 +402,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const NcDateTimePicker = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-c436522a"]]);
+const NcDateTimePicker = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-e6654786"]]);
 export {
   NcDateTimePicker as N
 };
-//# sourceMappingURL=NcDateTimePicker-DtQaoKbG.mjs.map
+//# sourceMappingURL=NcDateTimePicker-CF8TMzyS.mjs.map

package/dist/chunks/NcDateTimePicker-CF8TMzyS.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"NcDateTimePicker-CF8TMzyS.mjs","sources":["../../src/components/NcDateTimePicker/NcDateTimePicker.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2018 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\nIn general it is recommended to use the native date picker (see `NcDateTimePickerNative` which is based on `<input type=\"date\">`).\nBut some use cases are not covered by the native date selector, like selecting ranges or selecting a timezone.\nFor those cases this component can be used.\n\n### General examples\n```vue\n<template>\n\t<div class=\"wrapper\">\n\t\t<fieldset class=\"type-select\">\n\t\t\t<legend>Picker mode</legend>\n\t\t\t<NcCheckboxRadioSwitch v-model=\"type\" type=\"radio\" value=\"date\">Date</NcCheckboxRadioSwitch>\n\t\t\t<NcCheckboxRadioSwitch v-model=\"type\" type=\"radio\" value=\"datetime\">Date and time</NcCheckboxRadioSwitch>\n\t\t\t<NcCheckboxRadioSwitch v-model=\"type\" type=\"radio\" value=\"week\">Week</NcCheckboxRadioSwitch>\n\t\t\t<NcCheckboxRadioSwitch v-model=\"type\" type=\"radio\" value=\"month\">Month</NcCheckboxRadioSwitch>\n\t\t\t<NcCheckboxRadioSwitch v-model=\"type\" type=\"radio\" value=\"year\">Year</NcCheckboxRadioSwitch>\n\t\t</fieldset>\n\t\t<NcDateTimePicker\n\t\t\tv-model=\"time\"\n\t\t\t:type />\n\t\t<span>{{ time }}</span>\n\t</div>\n</template>\n<script>\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\ttype: 'date',\n\t\t\ttime: new Date('2022-10-10 10:10:10'),\n\t\t}\n\t},\n}\n</script>\n<style scoped>\n.wrapper {\n\tdisplay: flex;\n\tflex-direction: column;\n}\n\n.type-select {\n\tdisplay: flex;\n\tflex-direction: row;\n\tflex-wrap: wrap;\n}\n</style>\n```\n\n### Example with confirm button\n\nBy default the date is applied as soon as you select the day in the calendar.\nSometimes - especially when selecting date and time - it is required to only emit the selected date when the flow is finished.\nFor this the `confirm` prop can be used, this will add a confirmation button to the selector.\n\n```vue\n<template>\n\t<span>\n\t\t<NcDateTimePicker\n\t\t\tv-model=\"time\"\n\t\t\ttype=\"datetime\"\n\t\t\tconfirm />\n\t\t{{ time }}\n\t</span>\n</template>\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\ttime: null,\n\t\t\t}\n\t\t},\n\t}\n</script>\n```\n\n### Range picker\n\nThe most common use case for the `NcDateTimePicker` is picking a range, as this is not supported by the native date picker.\n\nWhen selecting the range picker type, the model value type will change from `Date` to `[Date, Date]`.\nMeaning an array with two dates is used, the first date is the range start and the second date is the range end.\n\n```vue\n<template>\n\t<div>\n\t\t<fieldset class=\"type-select\">\n\t\t\t<legend>Picker mode</legend>\n\t\t\t<NcCheckboxRadioSwitch v-model=\"type\" type=\"radio\" value=\"date-range\">Date</NcCheckboxRadioSwitch>\n\t\t\t<NcCheckboxRadioSwitch v-model=\"type\" type=\"radio\" value=\"time-range\">Time</NcCheckboxRadioSwitch>\n\t\t\t<NcCheckboxRadioSwitch v-model=\"type\" type=\"radio\" value=\"datetime-range\">Date and time</NcCheckboxRadioSwitch>\n\t\t</fieldset>\n\n\t\t<NcDateTimePicker\n\t\t\t:key=\"type\"\n\t\t\tv-model=\"time\"\n\t\t\t:type />\n\t\t<div>\n\t\t\t<div>Start: {{ formatDate(time[0]) }}</div>\n\t\t\t<div>End: {{ formatDate(time[1]) }}</div>\n\t\t</div>\n\t</div>\n</template>\n<script>\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\ttime: [new Date(2025, 3, 18, 12, 30), new Date(2025, 3, 21, 13, 30)],\n\t\t\ttype: 'date-range',\n\t\t}\n\t},\n\tmethods: {\n\t\tformatDate(date) {\n\t\t\tconst dateString = `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')}`\n\t\t\tconst timeString = `${String(date.getHours()).padStart(2, '0')}:${String(date.getMinutes()).padStart(2, '0')}`\n\t\t\tif (this.type === 'date-range') {\n\t\t\t\treturn dateString\n\t\t\t} else if (this.type === 'time-range') {\n\t\t\t\treturn timeString\n\t\t\t}\n\t\t\treturn `${dateString} ${timeString}`\n\t\t},\n\t},\n}\n</script>\n\n<style scoped>\n.type-select {\n\tdisplay: flex;\n\tflex-direction: row;\n\tflex-wrap: wrap;\n}\n</style>\n```\n\n### Time zone aware date picker\n\nThe datepicker can optionally include a picker for the preferred time zone. The selected time does not factor in the\npicked time zone, but you will have to convert it yourself when necessary.\n\n```vue\n<template>\n\t<span>\n\t\t<NcDateTimePicker\n\t\t\tv-model=\"time\"\n\t\t\ttype=\"datetime\"\n\t\t\tshow-timezone-select\n\t\t\tv-model:timezone-id=\"tz\" /><br>\n\t\t{{ time }} | {{ tz }}\n\t</span>\n</template>\n<script>\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\ttime: undefined,\n\t\t\ttz: 'Europe/Berlin',\n\t\t}\n\t},\n}\n</script>\n```\n\n### Restricting to a specific time range\n\nYou can optionally restrict the selectable time range, for example from 08:00 on Monday to 20:00 on Sunday of the current week.\nThis example shows how the `min` and `max` properties are applied to different picker types.\n\n```vue\n<template>\n\t<div>\n\t\t<h4>Date and time</h4>\n\t\t<NcDateTimePicker\n\t\t\tv-model=\"selectedDatetime\"\n\t\t\ttype=\"datetime\"\n\t\t\t:min=\"min\"\n\t\t\t:max=\"max\" />\n\t\t<p>Selected: {{ selectedDatetime }}</p>\n\n\t\t<h4>Date range</h4>\n\t\t<NcDateTimePicker\n\t\t\tv-model=\"selectedDateRange\"\n\t\t\ttype=\"date-range\"\n\t\t\t:min=\"min\"\n\t\t\t:max=\"max\" />\n\t\t<p>Selected: {{ selectedDateRange }}</p>\n\n\t\t<h4>Date and time range</h4>\n\t\t<NcDateTimePicker\n\t\t\tv-model=\"selectedDatetimeRange\"\n\t\t\ttype=\"datetime-range\"\n\t\t\t:min=\"min\"\n\t\t\t:max=\"max\" />\n\t\t<p>Selected: {{ selectedDatetimeRange }}</p>\n\n\t\t<h4>Time range</h4>\n\t\t<NcDateTimePicker\n\t\t\tv-model=\"selectedTimeRange\"\n\t\t\ttype=\"time-range\"\n\t\t\t:min=\"min\"\n\t\t\t:max=\"max\" />\n\t\t<p>Selected: {{ selectedTimeRange }}</p>\n\n\t\t<h4>Time</h4>\n\t\t<NcDateTimePicker\n\t\t\tv-model=\"selectedTime\"\n\t\t\ttype=\"time\"\n\t\t\t:min=\"min\"\n\t\t\t:max=\"max\" />\n\t\t<p>Selected: {{ selectedTime }}</p>\n\t</div>\n</template>\n<script>\nexport default {\n\tdata() {\n\t\tconst now = new Date()\n\t\tconst day = now.getDay()\n\t\tconst daysSinceMonday = (day + 6) % 7\n\n\t\tconst startOfWeek = new Date(now)\n\t\tstartOfWeek.setDate(now.getDate() - daysSinceMonday)\n\t\tstartOfWeek.setHours(8, 0, 0, 0)\n\n\t\tconst endOfWeek = new Date(startOfWeek)\n\t\tendOfWeek.setDate(startOfWeek.getDate() + 6)\n\t\tendOfWeek.setHours(20, 0, 0, 0)\n\n\t\treturn {\n\t\t\tselectedDatetime: null,\n\t\t\tselectedDateRange: null,\n\t\t\tselectedDatetimeRange: null,\n\t\t\tselectedTimeRange: null,\n\t\t\tselectedTime: null,\n\t\t\tmin: startOfWeek,\n\t\t\tmax: endOfWeek,\n\t\t}\n\t},\n}\n</script>\n```\n\n### Inline calendar\n\nRenders the calendar inline (without the text input) inside your parent component.\n\n```vue\n<template>\n\t<div>\n\t\t<NcDateTimePicker v-model=\"date\" inline />\n\t\t<p>Selected: {{ date }}</p>\n\t</div>\n</template>\n<script>\nexport default {\n\tdata() {\n\t\treturn { date: new Date() }\n\t},\n}\n</script>\n```\n</docs>\n\n<script setup lang=\"ts\">\nimport type {\n\t// The accepted model value\n\tModelValue as LibraryModelValue,\n\t// The emitted object for time picker\n\tTimeObj as LibraryTimeObject,\n\tVueDatePickerProps,\n} from '@vuepic/vue-datepicker'\n\nimport {\n\tmdiCalendarBlank,\n\tmdiChevronDown,\n\tmdiChevronLeft,\n\tmdiChevronRight,\n\tmdiChevronUp,\n\tmdiClock,\n\tmdiClose,\n} from '@mdi/js'\nimport {\n\tgetCanonicalLocale,\n\tgetDayNames,\n\tgetDayNamesMin,\n\tgetFirstDay,\n} from '@nextcloud/l10n'\nimport VueDatePicker from '@vuepic/vue-datepicker'\nimport { computed, useTemplateRef } from 'vue'\nimport NcIconSvgWrapper from '../NcIconSvgWrapper/NcIconSvgWrapper.vue'\nimport NcTimezonePicker from '../NcTimezonePicker/NcTimezonePicker.vue'\nimport { t } from '../../l10n.ts'\nimport NcButton from '../NcButton/index.ts'\n\ntype LibraryFormatOptions = VueDatePickerProps['format']\n\n/**\n * The preselected IANA time zone ID for the time zone picker,\n * only relevant in combination with `show-timezone-select`.\n * The prop supports two-way binding through v-model directive.\n *\n * @example `Europe/Berlin`\n * @default 'UTC'\n */\nconst timezoneId = defineModel<string>('timezoneId', { default: 'UTC' })\n\nconst props = withDefaults(defineProps<{\n\t/**\n\t * If set to true the menu will be placed on the `<body>`\n\t * instead of default placement on the picker.\n\t */\n\tappendToBody?: boolean\n\n\t/**\n\t * Aria label for the input box.\n\t *\n\t * @default 'Datepicker input'\n\t */\n\tariaLabel?: string\n\n\t/**\n\t * Aria label for the date picker menu.\n\t *\n\t * @default 'Datepicker menu'\n\t */\n\tariaLabelMenu?: string\n\n\t/**\n\t * Allow to clear the input.\n\t *\n\t * @default false\n\t */\n\tclearable?: boolean\n\n\t/**\n\t * Do not auto-apply the date but require clicking the confirmation button.\n\t *\n\t * @default false\n\t */\n\tconfirm?: boolean\n\n\t/**\n\t * Preview format for the picker input field.\n\t * Can either be a string of Unicode tokens or a function that takes a Date object\n\t * or for range picker an array of two dates, and returns the formatted date as string.\n\t *\n\t * @default Intl.DateTimeFormat is used to format dates and times\n\t * @see https://www.unicode.org/reports/tr35/tr35-dates.html#Date_Field_Symbol_Table\n\t */\n\tformat?: string | ((date: Date) => string) | ((dates: [Date, Date]) => string)\n\n\t/**\n\t * The locale to use for formatting the shown dates.\n\t * By default the users current Nextcloud locale is used.\n\t */\n\tlocale?: string\n\n\t/**\n\t * The maximum date that can be selected.\n\t */\n\tmax?: Date\n\n\t/**\n\t * The minimum date that can be selected.\n\t */\n\tmin?: Date\n\n\t/**\n\t * Default increment step for minutes in the time picker.\n\t *\n\t * @default 10\n\t */\n\tminuteStep?: number\n\n\t/**\n\t * The value to initialize, but also two-way bind the selected date. The date is – like the `Date` object in\n\t * JavaScript – tied to UTC. The selected time zone does not have an influence of the selected time and date\n\t * value. You have to translate the time yourself when you want to factor in time zones.\n\t *\n\t * When using the range picker then an array containing the start and end date needs to be passed.\n\t */\n\tmodelValue?: Date | [Date, Date] | null\n\n\t/**\n\t * Optional custom placeholder for the input box.\n\t */\n\tplaceholder?: string\n\n\t/**\n\t * Include a timezone picker within the menu.\n\t * Please note that the dates are still bound to the locale timezone\n\t * and any conversion needs to be done by the app itself.\n\t *\n\t * @default false\n\t */\n\tshowTimezoneSelect?: boolean\n\n\t/**\n\t * Show the ISO week numbers within the calendar.\n\t *\n\t * @default false\n\t */\n\tshowWeekNumber?: boolean\n\n\t/**\n\t * Type of the picker.\n\t * There is some special handling for ranges as those types require a `[Date, Date]` model value.\n\t * - The 'date-range' type will enable a range picker for dates\n\t * - The 'time-range' allows picking a time range.\n\t * - The 'datetime-range' allows picking dates with times assigned.\n\t *\n\t * @default 'date'\n\t */\n\ttype?: 'date' | 'datetime' | 'time' | 'week' | 'month' | 'year' | 'date-range' | 'time-range' | 'datetime-range'\n\n\t/**\n\t * Render the calendar inline (no input field).\n\t *\n\t * @default false\n\t */\n\tinline?: boolean\n}>(), {\n\tariaLabel: t('Datepicker input'),\n\tariaLabelMenu: t('Datepicker menu'),\n\tformat: undefined,\n\tlocale: getCanonicalLocale(),\n\tmax: undefined,\n\tmin: undefined,\n\tminuteStep: 10,\n\ttimezoneId: 'UTC',\n\tmodelValue: null,\n\t// set by fallbackPlaceholder\n\tplaceholder: undefined,\n\ttype: 'date',\n\tinline: false,\n})\n\nconst emit = defineEmits<{\n\t/**\n\t * If range picker is enabled then an array containing start and end date are emitted.\n\t * Otherwise the selected date is emitted.\n\t * `null` is emitted if `clearable` is set to `true` and the value was cleared.\n\t */\n\t'update:modelValue': [Date | [Date, Date] | null]\n\t'update:timezoneId': [string]\n\t/**\n\t * Input blur\n\t */\n\tblur: []\n}>()\n\nconst targetElement = useTemplateRef('target')\nconst pickerInstance = useTemplateRef('picker')\n\n/**\n * Mapping of the model-value prop to the format expected by the library.\n * We do not directly pass the prop and adjust the interface to not transparently wrap the library.\n * This has show as beeing a pain in the past when we need to switch underlying libraries.\n */\nconst value = computed<LibraryModelValue>(() => {\n\tif (props.modelValue === null && props.clearable) {\n\t\treturn null\n\t}\n\n\tif (props.type === 'week') {\n\t\tconst date = props.modelValue instanceof Date ? props.modelValue : new Date()\n\t\tconst end = new Date(date)\n\t\tend.setUTCDate(date.getUTCDate() + 6)\n\t\treturn [date, end]\n\t} else if (props.type === 'year') {\n\t\tconst date = props.modelValue instanceof Date ? props.modelValue : new Date()\n\t\treturn date.getUTCFullYear()\n\t} else if (props.type === 'month') {\n\t\tconst date = props.modelValue instanceof Date ? props.modelValue : new Date()\n\t\treturn { year: date.getUTCFullYear(), month: date.getUTCMonth() }\n\t} else if (props.type === 'time') {\n\t\tconst time = props.modelValue instanceof Date ? props.modelValue : new Date()\n\t\treturn {\n\t\t\thours: time.getHours(),\n\t\t\tminutes: time.getMinutes(),\n\t\t\tseconds: time.getSeconds(),\n\t\t} satisfies LibraryTimeObject\n\t} else if (props.type === 'time-range') {\n\t\tconst time = [props.modelValue].flat()\n\t\tif (time.length !== 2) {\n\t\t\tconst start = new Date()\n\t\t\tconst end = new Date(start)\n\t\t\tend.setHours(end.getHours() + 1)\n\t\t\ttime.splice(0, 2, start, end)\n\t\t}\n\n\t\treturn (time as [Date, Date]).map((date) => ({\n\t\t\thours: date.getHours(),\n\t\t\tminutes: date.getMinutes(),\n\t\t\tseconds: date.getSeconds(),\n\t\t} as LibraryTimeObject))\n\t} else if (props.type.endsWith('-range')) {\n\t\tif (props.modelValue === undefined) {\n\t\t\tconst start = new Date()\n\t\t\tconst end = new Date(start)\n\t\t\tend.setUTCDate(start.getUTCDate() + 7)\n\t\t\treturn [start, end]\n\t\t}\n\t\treturn props.modelValue\n\t}\n\n\t// no special handling for other types needed\n\treturn props.modelValue ?? new Date()\n})\n\nconst placeholderFallback = computed(() => {\n\tif (props.type === 'date') {\n\t\treturn t('Select date')\n\t} else if (props.type === 'time') {\n\t\treturn t('Select time')\n\t} else if (props.type === 'datetime') {\n\t\treturn t('Select date and time')\n\t} else if (props.type === 'week') {\n\t\treturn t('Select week')\n\t} else if (props.type === 'month') {\n\t\treturn t('Select month')\n\t} else if (props.type === 'year') {\n\t\treturn t('Select year')\n\t} else if (props.type.endsWith('-range')) {\n\t\treturn t('Select time range')\n\t}\n\t// should not be reached\n\treturn t('Select date and time')\n})\n\n/**\n * The date (time) formatting to be used by the library.\n * We use the provided format if possible, otherwise we provide a formatting function\n * which uses the browsers Intl API to format the date / time in the current users locale.\n */\nconst realFormat = computed<LibraryFormatOptions>(() => {\n\tif (props.format) {\n\t\t// we can cast the type here as in this case its either string\n\t\t// function `(Date) => string` or `([Date, Date]) => string` where we cast to `(Date[]) => string` here.\n\t\treturn props.format as LibraryFormatOptions\n\t} else if (props.type === 'week') {\n\t\t// cannot format weeks with Intl.\n\t\treturn 'RR-II'\n\t}\n\n\tlet formatter: Intl.DateTimeFormat | undefined\n\tif (props.type === 'date' || props.type === 'date-range') {\n\t\tformatter = new Intl.DateTimeFormat(getCanonicalLocale(), { dateStyle: 'medium' })\n\t} else if (props.type === 'time' || props.type === 'time-range') {\n\t\tformatter = new Intl.DateTimeFormat(getCanonicalLocale(), { timeStyle: 'short' })\n\t} else if (props.type === 'datetime' || props.type === 'datetime-range') {\n\t\tformatter = new Intl.DateTimeFormat(getCanonicalLocale(), { dateStyle: 'medium', timeStyle: 'short' })\n\t} else if (props.type === 'month') {\n\t\tformatter = new Intl.DateTimeFormat(getCanonicalLocale(), { year: 'numeric', month: '2-digit' })\n\t} else if (props.type === 'year') {\n\t\tformatter = new Intl.DateTimeFormat(getCanonicalLocale(), { year: 'numeric' })\n\t}\n\n\tif (formatter) {\n\t\treturn (input: Date | [Date, Date]) => Array.isArray(input)\n\t\t\t? formatter.formatRange(input[0], input[1])\n\t\t\t: formatter.format(input)\n\t}\n\n\t// fallback to default formatting\n\treturn undefined\n})\n\nconst pickerType = computed(() => ({\n\ttimePicker: props.type === 'time' || props.type === 'time-range',\n\tyearPicker: props.type === 'year',\n\tmonthPicker: props.type === 'month',\n\tweekPicker: props.type === 'week',\n\trange: props.type.endsWith('-range') && {\n\t\t// do not use partial ranges (meaning after selecting the start [Date, null] will be emitted)\n\t\t// if this is needed someday we can enable it,\n\t\t// but its not covered by our component interface (props / events) documentation so just disabled for now.\n\t\tpartialRange: false,\n\t},\n\tenableTimePicker: !(props.type === 'date' || props.type === 'date-range'),\n\tflow: props.type === 'datetime'\n\t\t? ['calendar', 'time'] as ['calendar', 'time']\n\t\t: undefined,\n}))\n\n// Convert min/max Date into VueDatePicker's time object shape\nconst minTime = computed(() => props.min && { hours: props.min.getHours(), minutes: props.min.getMinutes(), seconds: props.min.getSeconds() })\nconst maxTime = computed(() => props.max && { hours: props.max.getHours(), minutes: props.max.getMinutes(), seconds: props.max.getSeconds() })\n\n/**\n * Called on model value update of the library.\n *\n * @param value The value emitted from the underlying library\n */\nfunction onUpdateModelValue(value: LibraryModelValue): void {\n\tif (value === null) {\n\t\treturn emit('update:modelValue', null)\n\t}\n\n\tif (props.type === 'time') {\n\t\t// time is provided as an object\n\t\temit('update:modelValue', formatLibraryTime(value as LibraryTimeObject))\n\t} else if (props.type === 'time-range') {\n\t\t// same as time but as an array with two elements\n\t\tconst start = formatLibraryTime(value[0])\n\t\tconst end = formatLibraryTime(value[1])\n\t\t// ensure end is beyond the start\n\t\tif (end.getTime() < start.getTime()) {\n\t\t\tend.setDate(end.getDate() + 1)\n\t\t}\n\t\temit('update:modelValue', [start, end])\n\t} else if (props.type === 'month') {\n\t\t// month is emitted as an object with month and year attribute\n\t\tconst data = value as { month: number, year: number }\n\t\temit('update:modelValue', new Date(data.year, data.month, 1))\n\t} else if (props.type === 'year') {\n\t\t// Years are emitted as the numeric year e.g. 2022\n\t\temit('update:modelValue', new Date(value as number, 0))\n\t} else if (props.type === 'week') {\n\t\t// weeks are emitted as [Date, Date]\n\t\temit('update:modelValue', value[0])\n\t} else {\n\t\t// otherwise it already emits the correct format\n\t\temit('update:modelValue', value as Date | [Date, Date])\n\t}\n}\n\n/**\n * Format a vuepick time object to native JS Date object.\n *\n * @param time - The library time value object\n */\nfunction formatLibraryTime(time: LibraryTimeObject): Date {\n\tconst date = new Date()\n\tdate.setHours(time.hours)\n\tdate.setMinutes(time.minutes)\n\tdate.setSeconds(time.seconds)\n\treturn date\n}\n\n// Localization\n\nconst weekStart = getFirstDay()\n\nconst dayNames = [...getDayNamesMin()]\n// see https://github.com/Vuepic/vue-datepicker/issues/1159\nfor (let i = 0; i < weekStart; i++) {\n\tdayNames.push(dayNames.shift() as string)\n}\n\n// TRANSLATORS: A very short abbrevation used as a heading for \"week number\"\nconst weekNumName = t('W')\n\nconst ariaLabels = computed(() => ({\n\ttoggleOverlay: t('Toggle overlay'),\n\tmenu: props.ariaLabelMenu,\n\tinput: props.ariaLabel,\n\topenTimePicker: t('Open time picker'),\n\tcloseTimePicker: t('Close time Picker'),\n\tincrementValue: (type: 'hours' | 'minutes' | 'seconds') => {\n\t\tif (type === 'hours') {\n\t\t\treturn t('Increment hours')\n\t\t} else if (type === 'minutes') {\n\t\t\treturn t('Increment minutes')\n\t\t}\n\t\treturn t('Increment seconds')\n\t},\n\tdecrementValue: (type: 'hours' | 'minutes' | 'seconds') => {\n\t\tif (type === 'hours') {\n\t\t\treturn t('Decrement hours')\n\t\t} else if (type === 'minutes') {\n\t\t\treturn t('Decrement minutes')\n\t\t}\n\t\treturn t('Decrement seconds')\n\t},\n\topenTpOverlay: (type: 'hours' | 'minutes' | 'seconds') => {\n\t\tif (type === 'hours') {\n\t\t\treturn t('Open hours overlay')\n\t\t} else if (type === 'minutes') {\n\t\t\treturn t('Open minutes overlay')\n\t\t}\n\t\treturn t('Open seconds overlay')\n\t},\n\tamPmButton: t('Switch AM/PM mode'),\n\topenYearsOverlay: t('Open years overlay'),\n\topenMonthsOverlay: t('Open months overlay'),\n\tnextMonth: t('Next month'),\n\tprevMonth: t('Previous month'),\n\tnextYear: t('Next year'),\n\tprevYear: t('Previous year'),\n\tweekDay: (day: number) => getDayNames()[day],\n\tclearInput: t('Clear value'),\n\tcalendarIcon: t('Calendar icon'),\n\ttimePicker: t('Time picker'),\n\tmonthPicker: (overlay: boolean) => overlay ? t('Month picker overlay') : t('Month picker'),\n\tyearPicker: (overlay: boolean) => overlay ? t('Year picker overlay') : t('Year picker'),\n}))\n\n/**\n * Select the current value.\n * This is used by the confirmation button if `confirmation` was set.\n */\nfunction selectDate() {\n\tpickerInstance.value!.selectDate()\n}\n\n/**\n * Cancel the current selection by closing the overlay.\n * This is used by the confirmation button if `confirmation` was set.\n */\nfunction cancelSelection() {\n\tpickerInstance.value!.closeMenu()\n}\n\n/**\n * Calculate the min/max time restrictions based on the selected date(s) and provided min/max dates.\n */\nconst calcMinMaxTime = computed(() => {\n\tif (props.type === 'datetime') {\n\t\treturn {\n\t\t\tminDate: props.min,\n\t\t\tmaxDate: props.max,\n\t\t\tminTime: props.min && value.value && sameDay(props.min, value.value as Date) ? minTime.value : undefined,\n\t\t\tmaxTime: props.max && value.value && sameDay(props.max, value.value as Date) ? maxTime.value : undefined,\n\t\t}\n\t}\n\n\tif (props.type === 'datetime-range') {\n\t\treturn {\n\t\t\tminDate: props.min,\n\t\t\tmaxDate: props.max,\n\t\t\tminTime: props.min && value.value ? (sameDay(props.min, value.value[0] as Date) ? minTime.value : undefined) : undefined,\n\t\t\tmaxTime: props.max && value.value ? (sameDay(props.max, value.value[1] as Date) ? maxTime.value : undefined) : undefined,\n\t\t}\n\t}\n\n\tif (props.type === 'time' || props.type === 'time-range') {\n\t\treturn {\n\t\t\tminTime: props.min ? minTime.value : undefined,\n\t\t\tmaxTime: props.max ? maxTime.value : undefined,\n\t\t}\n\t}\n\n\treturn {\n\t\tminDate: props.min,\n\t\tmaxDate: props.max,\n\t}\n})\n\n/**\n * Check if two dates are on the same day.\n *\n * @param a - First date\n * @param b - Second date\n */\nfunction sameDay(a: Date, b: Date): boolean {\n\treturn (\n\t\ta.getFullYear() === b.getFullYear()\n\t\t&& a.getMonth() === b.getMonth()\n\t\t&& a.getDate() === b.getDate()\n\t)\n}\n</script>\n\n<template>\n\t<div class=\"vue-date-time-picker__wrapper\">\n\t\t<VueDatePicker\n\t\t\tref=\"picker\"\n\t\t\t:aria-labels\n\t\t\t:autoApply=\"!confirm\"\n\t\t\tclass=\"vue-date-time-picker\"\n\t\t\t:class=\"{ 'vue-date-time-picker--clearable': clearable }\"\n\t\t\t:cancelText=\"t('Cancel')\"\n\t\t\t:clearable\n\t\t\t:dayNames\n\t\t\t:placeholder=\"placeholder ?? placeholderFallback\"\n\t\t\t:format=\"realFormat\"\n\t\t\t:locale\n\t\t\t:minDate=\"calcMinMaxTime.minDate\"\n\t\t\t:maxDate=\"calcMinMaxTime.maxDate\"\n\t\t\t:minTime=\"calcMinMaxTime.minTime\"\n\t\t\t:maxTime=\"calcMinMaxTime.maxTime\"\n\t\t\t:minutesIncrement=\"minuteStep\"\n\t\t\t:modelValue=\"value\"\n\t\t\t:nowButtonLabel=\"t('Now')\"\n\t\t\t:selectText=\"t('Pick')\"\n\t\t\tsixWeeks=\"fair\"\n\t\t\t:inline\n\t\t\t:teleport=\"appendToBody ? (targetElement || undefined) : false\"\n\t\t\ttextInput\n\t\t\t:weekNumName\n\t\t\t:weekNumbers=\"showWeekNumber ? { type: 'iso' } : undefined\"\n\t\t\t:weekStart\n\t\t\tv-bind=\"pickerType\"\n\t\t\t@update:modelValue=\"onUpdateModelValue\"\n\t\t\t@blur=\"emit('blur')\">\n\t\t\t<template #action-buttons>\n\t\t\t\t<NcButton size=\"small\" variant=\"tertiary\" @click=\"cancelSelection\">\n\t\t\t\t\t{{ t('Cancel') }}\n\t\t\t\t</NcButton>\n\t\t\t\t<NcButton size=\"small\" variant=\"primary\" @click=\"selectDate\">\n\t\t\t\t\t{{ t('Pick') }}\n\t\t\t\t</NcButton>\n\t\t\t</template>\n\t\t\t<template #clear-icon=\"{ clear }\">\n\t\t\t\t<NcButton\n\t\t\t\t\t:aria-label=\"t('Clear value')\"\n\t\t\t\t\tvariant=\"tertiary-no-background\"\n\t\t\t\t\t@click=\"clear\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<NcIconSvgWrapper inline :path=\"mdiClose\" :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t</NcButton>\n\t\t\t</template>\n\t\t\t<template #input-icon>\n\t\t\t\t<NcIconSvgWrapper :path=\"mdiCalendarBlank\" :size=\"20\" />\n\t\t\t</template>\n\t\t\t<template #clock-icon>\n\t\t\t\t<NcIconSvgWrapper inline :path=\"mdiClock\" :size=\"20\" />\n\t\t\t</template>\n\t\t\t<template #arrow-left>\n\t\t\t\t<NcIconSvgWrapper inline :path=\"mdiChevronLeft\" :size=\"20\" />\n\t\t\t</template>\n\t\t\t<template #arrow-right>\n\t\t\t\t<NcIconSvgWrapper inline :path=\"mdiChevronRight\" :size=\"20\" />\n\t\t\t</template>\n\t\t\t<template #arrow-down>\n\t\t\t\t<NcIconSvgWrapper inline :path=\"mdiChevronDown\" :size=\"20\" />\n\t\t\t</template>\n\t\t\t<template #arrow-up>\n\t\t\t\t<NcIconSvgWrapper inline :path=\"mdiChevronUp\" :size=\"20\" />\n\t\t\t</template>\n\t\t\t<template v-if=\"showTimezoneSelect\" #action-extra>\n\t\t\t\t<NcTimezonePicker\n\t\t\t\t\tv-model=\"timezoneId\"\n\t\t\t\t\tclass=\"vue-date-time-picker__timezone\"\n\t\t\t\t\t:appendToBody=\"false\"\n\t\t\t\t\t:inputLabel=\"t('Time zone')\" />\n\t\t\t</template>\n\t\t</VueDatePicker>\n\t\t<Teleport to=\"body\" :disabled=\"!appendToBody\">\n\t\t\t<div ref=\"target\" class=\"vue-date-time-picker__wrapper vue-date-time-picker__wrapper--teleport\" />\n\t\t</Teleport>\n\t</div>\n</template>\n\n<style scoped lang=\"scss\">\n@use \"sass:meta\";\n\n.vue-date-time-picker__wrapper {\n\t// This is under :root in @vuepic/vue-datepicker/dist/main.css, so importing it scoped won't work\n\t--dp-common-transition: all var(--animation-quick) ease-in;\n\t--dp-menu-padding: 6px 8px;\n\t--dp-animation-duration: var(--animation-quick);\n\t--dp-menu-appear-transition-timing: cubic-bezier(.4, 0, 1, 1);\n\t--dp-transition-timing: ease-out;\n\t--dp-action-row-transtion: all 0.2s ease-in;\n\t--dp-font-family: var(--font-face);\n\t--dp-border-radius: var(--border-radius-element);\n\t--dp-cell-border-radius: var(--border-radius-small);\n\t--dp-transition-length: 22px;\n\t--dp-transition-timing-general: var(--animation-quick);\n\t--dp-button-height: var(--default-clickable-area);\n\t--dp-month-year-row-height: var(--default-clickable-area);\n\t--dp-month-year-row-button-size: var(--clickable-area-small);\n\t--dp-button-icon-height: 20px;\n\t--dp-calendar-wrap-padding: 0 5px;\n\t--dp-cell-size: var(--default-clickable-area);\n\t--dp-cell-padding: 5px;\n\t--dp-common-padding: 10px;\n\t--dp-input-icon-padding: var(--default-clickable-area);\n\t--dp-input-padding: 6px 12px;\n\t--dp-menu-min-width: 260px;\n\t--dp-action-buttons-padding: 1px 6px;\n\t--dp-row-margin: 5px 0;\n\t--dp-calendar-header-cell-padding: 0.5rem;\n\t--dp-multi-calendars-spacing: 10px;\n\t--dp-overlay-col-padding: 3px;\n\t--dp-time-inc-dec-button-size: var(--default-clickable-area);\n\t--dp-font-size: 1rem;\n\t--dp-preview-font-size: var(--font-size-small);\n\t--dp-time-font-size: 2rem;\n\t--dp-action-button-height: var(--clickable-area-small);\n\t--dp-action-row-padding: 8px;\n\t--dp-direction: ltr;\n\n\t// We need to import the vuepic styles, but at least scoped to our class and scope\n\t// plain @import does not work as this will scope all styles imported.\n\t:deep() {\n\t\t@include meta.load-css('@vuepic/vue-datepicker/dist/main.css');\n\t}\n\n\t// When rendered as part of NcActionInput, should be lifted above the NcPopover (99999 < 100000)\n\t&.vue-date-time-picker__wrapper--teleport :deep(.dp--menu-wrapper) {\n\t\tz-index: 100001;\n\t}\n\n\t.vue-date-time-picker--clearable :deep(.dp__input) {\n\t\tpadding-inline-end: var(--default-clickable-area);\n\t}\n\n\t.vue-date-time-picker__timezone {\n\t\tmin-width: unset;\n\t\twidth: 100%;\n\t}\n\n\t:deep(.icon-vue) {\n\t\t// we enforce full opacity to not create a11y issues with contrast\n\t\topacity: 1 !important;\n\t}\n\n\t// time selector button should have consistent padding\n\t:deep(.dp--tp-wrap),\n\t:deep(.dp__action_extra) {\n\t\tpadding: var(--dp-menu-padding);\n\t\tpadding-top: 0;\n\t}\n\n\t:deep(.dp__overlay.dp--overlay-absolute) {\n\t\tpadding: var(--dp-menu-padding);\n\n\t\t.dp__btn.dp__button.dp__button_bottom {\n\t\t\tinset-block-end: 6px;\n\t\t}\n\t}\n\n\t:deep(.dp__btn.dp__button.dp__button_bottom),\n\t:deep(.dp--tp-wrap .dp__button) {\n\t\twidth: 100%;\n\t}\n\n\t:deep(.dp__btn.dp__button.dp__overlay_action) {\n\t\twidth: calc(100% - 16px);\n\t}\n\n\t// fix issues caused by Nextcloud server styles\n\t:deep(input) {\n\t\tpadding-inline-start: var(--dp-input-icon-padding) !important;\n\t}\n\t:deep(.dp__btn) {\n\t\tmargin: 0;\n\t}\n\t:deep(.dp__inner_nav) {\n\t\theight: fit-content;\n\t\twidth: fit-content;\n\t}\n\n\t// make the bottom page toggle stand out better\n\t:deep(.dp__btn.dp__button.dp__button_bottom) {\n\t\tcolor: var(--color-primary-element-light);\n\t\tbackground-color: var(--color-primary-element-light);\n\t}\n\n\t// Fix server styles causing buttons to be primary colored\n\t:deep(.dp--header-wrap .dp__btn:not(.dp__button_bottom)),\n\t:deep(.dp__time_col .dp__btn) {\n\t\tbackground-color: var(--color-main-background);\n\n\t\t&:hover {\n\t\t\tbackground: var(--dp-hover-color);\n\t\t\tcolor: var(--dp-hover-icon-color);\n\t\t}\n\t}\n\n\t// Server styles cause the month and year to be fit-content -> fixing it to be max size.\n\t:deep(.dp__month_year_select) {\n\t\tflex: 1;\n\t}\n\t:deep(.dp--time-overlay-btn) {\n\t\tfont-size: calc(2 * var(--default-font-size)) !important;\n\t}\n\n\t// Adjust padding to prevent horizontal scrolling in time selection\n\t:deep(.dp__time_input .dp__time_col_reg_block) {\n\t\tpadding: 0 calc(4 * var(--default-grid-baseline));\n\t}\n\n\t.vue-date-time-picker.dp__theme_dark,\n\t.vue-date-time-picker.dp__theme_light,\n\t:deep(.dp__theme_dark),\n\t:deep(.dp__theme_light) {\n\t\t--dp-background-color: var(--color-main-background);\n\t\t--dp-text-color: var(--color-main-text);\n\t\t--dp-hover-color: var(--color-primary-element-light-hover);\n\t\t--dp-hover-text-color: var(--color-primary-element-light-text);\n\t\t--dp-hover-icon-color: var(--color-primary-element-light-text);\n\t\t--dp-primary-color: var(--color-primary-element);\n\t\t--dp-primary-disabled-color: var(--color-primary-element-hover);\n\t\t--dp-primary-text-color: var(--color-primary-element-text);\n\t\t--dp-secondary-color: var(--color-text-maxcontrast); // this is used for \"disabled\" dates\n\t\t--dp-border-color: var(--color-border);\n\t\t--dp-menu-border-color: var(--color-border-dark);\n\t\t--dp-border-color-hover: var(--color-border-maxcontrast);\n\t\t--dp-border-color-focus: var(--color-border-maxcontrast);\n\t\t--dp-disabled-color: var(--color-background-dark);\n\t\t--dp-disabled-color-text: var(--color-text-maxcontrast);\n\t\t--dp-scroll-bar-background: var(--color-scrollbar);\n\t\t--dp-scroll-bar-color: var(--color-scrollbar);\n\t\t--dp-success-color: var(--color-success);\n\t\t--dp-success-color-disabled: var(--color-success-hover);\n\t\t--dp-icon-color: var(--color-main-text);\n\t\t--dp-danger-color: var(--color-error);\n\t\t--dp-marker-color: var(--color-text-error, var(--color-error));\n\t\t--dp-tooltip-color: var(--color-main-text);\n\t\t--dp-highlight-color: var(--color-main-text);\n\t}\n}\n</style>\n"],"names":["_useModel","value","_openBlock","_createElementBlock","_createVNode","_unref","_mergeProps","confirm","clearable","placeholder","locale","minuteStep","inline","appendToBody","showWeekNumber","_withCtx","showTimezoneSelect","NcTimezonePicker","_createBlock","_Teleport","_createElementVNode"],"mappings":"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"}

package/dist/chunks/{NcDateTimePickerNative-Dr8_mGlQ.mjs → NcDateTimePickerNative-DvvKjw_h.mjs}

@@ -1,6 +1,6 @@
 import '../assets/NcDateTimePickerNative-BP6eg8aU.css';
 import { defineComponent, mergeModels, useModel, computed, createElementBlock, openBlock, normalizeClass, createElementVNode, toDisplayString, mergeProps } from "vue";
-import { r as register, x as t39, a as t } from "./_l10n-CgsPi8nC.mjs";
+import { r as register, x as t39, a as t } from "./_l10n-BSFzy-71.mjs";
 import { c as createElementId } from "./createElementId-DhjFt1I9.mjs";
 import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
 register(t39);
@@ -97,4 +97,4 @@ const NcDateTimePickerNative = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scope
 export {
   NcDateTimePickerNative as N
 };
-//# sourceMappingURL=NcDateTimePickerNative-Dr8_mGlQ.mjs.map
+//# sourceMappingURL=NcDateTimePickerNative-DvvKjw_h.mjs.map

package/dist/chunks/{NcDateTimePickerNative-Dr8_mGlQ.mjs.map → NcDateTimePickerNative-DvvKjw_h.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"NcDateTimePickerNative-Dr8_mGlQ.mjs","sources":["../../src/components/NcDateTimePickerNative/NcDateTimePickerNative.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2022 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n\n### General description\n\nThis components provides a wrapper around the native browser datetime picker. <br>\nThis is an input with some type of date e.g. https://html.spec.whatwg.org/multipage/input.html#local-date-and-time-state-(type=datetime-local). <br>\nAll available types are: 'date', 'datetime-local', 'month', 'time' and 'week', please check them here: https://html.spec.whatwg.org/multipage/input.html#  <br>\n\n### Examples\n\n```vue\n<template>\n\t<div>\n\t\t<span>Picked date: {{ value || 'null' }}</span>\n\t\t<hr/>\n\t\t<div class=\"flex\">\n\t\t\t<NcSelect v-bind=\"props\" v-model=\"type\" />\n\t\t\t<NcDateTimePickerNative\n\t\t\t\tv-model=\"value\"\n\t\t\t\t:label=\"label\"\n\t\t\t\t:type=\"type\" />\n\t\t</div>\n\t</div>\n</template>\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tprops: {\n\t\t\t\t\tclearable: false,\n\t\t\t\t\tinputLabel: 'Picker type',\n\t\t\t\t\toptions: [\n\t\t\t\t\t\t'date',\n\t\t\t\t\t\t'datetime-local',\n\t\t\t\t\t\t'month',\n\t\t\t\t\t\t'time',\n\t\t\t\t\t\t'week',\n\t\t\t\t\t],\n\t\t\t\t},\n\t\t\t\ttype: 'datetime-local',\n\t\t\t\tvalue: new Date(),\n\t\t\t\tlabel: 'Select a new date or time',\n\t\t\t}\n\t\t},\n\t}\n</script>\n<style scoped>\n.flex {\n\tdisplay: flex;\n\tgap: 4px;\n}\n</style>\n```\n\n#### Usage: type='datetime-local' with min date and max date\n```vue\n<template>\n\t<div>\n\t\t<span>Picked date: {{ value || 'null' }}</span>\n\t\t<NcDateTimePickerNative\n\t\t\tv-model=\"value\"\n\t\t\t:min=\"yesterdayDate\"\n\t\t\t:max=\"someDate\"\n\t\t\t:label=\"label\"\n\t\t\ttype=\"datetime-local\" />\n\t</div>\n</template>\n\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tvalue: new Date(),\n\t\t\t\tlabel: 'Please select a new date',\n\t\t\t\tyesterdayDate: new Date(new Date().setDate(new Date().getDate() - 1)),\n\t\t\t\tsomeDate: new Date(new Date().setDate(new Date().getDate() + 7)),\n\t\t\t}\n\t\t},\n\t}\n</script>\n```\n\n</docs>\n\n<script setup lang=\"ts\">\nimport type { VueClassType } from '../../utils/VueTypes.ts'\n\nimport { computed } from 'vue'\nimport { t } from '../../l10n.ts'\nimport { createElementId } from '../../utils/createElementId.ts'\n\ndefineOptions({ inheritAttrs: false })\n\n/**\n * The date is – like the `Date` object in JavaScript – tied to UTC.\n * The selected time zone does not have an influence of the selected time and date value.\n * You have to translate the time yourself when you want to factor in time zones.\n * Pass null to clear the input field.\n */\nconst modelValue = defineModel<Date | null>({ default: null })\n\nconst props = withDefaults(defineProps<{\n\t/**\n\t * HTML class of the element\n\t */\n\tclass?: VueClassType\n\n\t/**\n\t * ID of the input element\n\t */\n\tid?: string\n\n\t/**\n\t * Class to add to the input field.\n\t * Necessary to use NcDateTimePickerNative in the NcActionInput component.\n\t */\n\tinputClass?: VueClassType\n\n\t/**\n\t * type attribute of the input field\n\t * default type: String\n\t * The type of the input element, it can be `date`, `datetime-local`, `month`, `time`, `week`\n\t */\n\ttype?: 'date' | 'datetime-local' | 'month' | 'time' | 'week'\n\n\t/**\n\t * Visual label of the input\n\t */\n\tlabel?: string\n\n\t/**\n\t * min attribute of the input field\n\t */\n\tmin?: Date | null\n\n\t/**\n\t * max attribute of the input field\n\t */\n\tmax?: Date | null\n\n\t/**\n\t * Flag to hide the label.\n\t * The hidden input label for accessibility purposes.\n\t */\n\thideLabel?: boolean\n}>(), {\n\tclass: undefined,\n\tid: () => createElementId(),\n\tinputClass: '',\n\tlabel: () => t('Please choose a date'),\n\tmax: null,\n\tmin: null,\n\tmodelValue: null,\n\ttype: 'date',\n})\n\nconst formattedValue = computed(() => modelValue.value ? formatValue(modelValue.value) : '')\nconst formattedMax = computed(() => props.max ? formatValue(props.max) : undefined)\nconst formattedMin = computed(() => props.min ? formatValue(props.min) : undefined)\n\n/**\n * Returns Object with string values of a Date\n *\n * @param value - The selected value\n */\nfunction getReadableDate(value: Date) {\n\tconst yyyy = value.getFullYear().toString().padStart(4, '0')\n\tconst MM = (value.getMonth() + 1).toString().padStart(2, '0')\n\tconst dd = value.getDate().toString().padStart(2, '0')\n\tconst hh = value.getHours().toString().padStart(2, '0')\n\tconst mm = value.getMinutes().toString().padStart(2, '0')\n\n\treturn { yyyy, MM, dd, hh, mm }\n}\n\n/**\n * Returns preformatted value for the input field\n *\n * @param value - The selected value\n */\nfunction formatValue(value: Date): string {\n\tconst { yyyy, MM, dd, hh, mm } = getReadableDate(value)\n\tif (props.type === 'datetime-local') {\n\t\treturn `${yyyy}-${MM}-${dd}T${hh}:${mm}`\n\t} else if (props.type === 'date') {\n\t\treturn `${yyyy}-${MM}-${dd}`\n\t} else if (props.type === 'month') {\n\t\treturn `${yyyy}-${MM}`\n\t} else if (props.type === 'time') {\n\t\treturn `${hh}:${mm}`\n\t} else if (props.type === 'week') {\n\t\tconst startDate = new Date(Number.parseInt(yyyy), 0, 1)\n\t\tconst daysSinceBeginningOfYear = Math.floor((value.getTime() - startDate.getTime())\n\t\t\t/ (24 * 60 * 60 * 1000))\n\t\tconst weekNumber = Math.ceil(daysSinceBeginningOfYear / 7)\n\t\treturn `${yyyy}-W${weekNumber}`\n\t}\n\treturn ''\n}\n\n/**\n * Handle the input event\n *\n * @param event - The input event payload\n */\nfunction onInput(event: Event): void {\n\tconst input = event.target as HTMLInputElement\n\tif (!input || isNaN(input.valueAsNumber)) {\n\t\tmodelValue.value = null\n\t} else if (props.type === 'time') {\n\t\tconst time = input.value\n\n\t\tconst { yyyy, MM, dd } = getReadableDate(modelValue.value || new Date())\n\t\tmodelValue.value = new Date(`${yyyy}-${MM}-${dd}T${time}`)\n\t} else if (props.type === 'month') {\n\t\tconst MM = (new Date(input.value).getMonth() + 1).toString().padStart(2, '0')\n\t\tconst { yyyy, dd, hh, mm } = getReadableDate(modelValue.value || new Date())\n\t\tmodelValue.value = new Date(`${yyyy}-${MM}-${dd}T${hh}:${mm}`)\n\t} else {\n\t\tconst timezoneOffsetSeconds = new Date(input.valueAsNumber).getTimezoneOffset() * 1000 * 60\n\t\tconst inputDateWithTimezone = input.valueAsNumber + timezoneOffsetSeconds\n\t\tmodelValue.value = new Date(inputDateWithTimezone)\n\t}\n}\n</script>\n\n<template>\n\t<div class=\"native-datetime-picker\" :class=\"$props.class\">\n\t\t<label\n\t\t\tclass=\"native-datetime-picker__label\"\n\t\t\t:class=\"{ 'hidden-visually': hideLabel }\"\n\t\t\t:for=\"id\">\n\t\t\t{{ label }}\n\t\t</label>\n\t\t<input\n\t\t\t:id\n\t\t\tclass=\"native-datetime-picker__input\"\n\t\t\t:class=\"inputClass\"\n\t\t\t:type\n\t\t\t:value=\"formattedValue\"\n\t\t\t:min=\"formattedMin\"\n\t\t\t:max=\"formattedMax\"\n\t\t\tv-bind=\"$attrs\"\n\t\t\t@input=\"onInput\">\n\t</div>\n</template>\n\n<style lang=\"scss\" scoped>\n.native-datetime-picker {\n\tdisplay: flex;\n\tflex-direction: column;\n\n\t.native-datetime-picker__label {\n\t\tmargin-block-end: 2px;\n\t}\n\n\t.native-datetime-picker__input {\n\t\t// If border width differs between focused and unfocused we need to compensate to prevent jumping\n\t\t--input-border-width-offset: calc(var(--border-width-input-focused, 2px) - var(--border-width-input, 2px));\n\t\twidth: 100%;\n\t\tflex: 0 0 auto;\n\t\tmargin: 0;\n\t\tpadding-inline-start: calc(var(--border-radius-element) + var(--input-border-width-offset));\n\t\tpadding-inline-end: calc(var(--default-grid-baseline) + var(--input-border-width-offset));\n\t\tborder: var(--border-width-input, 2px) solid var(--color-border-maxcontrast);\n\n\t\t&:active:not([disabled]),\n\t\t&:hover:not([disabled]),\n\t\t&:focus:not([disabled]),\n\t\t&:focus-within:not([disabled]) {\n\t\t\tborder-color: var(--color-main-text);\n\t\t\tborder-width: var(--border-width-input-focused, 2px);\n\t\t\tbox-shadow: 0 0 0 2px var(--color-main-background) !important;\n\t\t\t// Reset padding offset when focused\n\t\t\t--input-border-width-offset: 0px;\n\t\t}\n\t}\n}\n\n[data-theme-light],\n[data-themes*=light] {\n\t.native-datetime-picker__input {\n\t\tcolor-scheme: light;\n\t}\n}\n\n[data-theme-dark],\n[data-themes*=dark] {\n\t.native-datetime-picker__input {\n\t\tcolor-scheme: dark;\n\t}\n}\n\n[data-theme-default],\n[data-themes*=default] {\n\t@media (prefers-color-scheme: light) {\n\t\t.native-datetime-picker__input {\n\t\t\tcolor-scheme: light;\n\t\t}\n\t}\n\t@media (prefers-color-scheme: dark) {\n\t\t.native-datetime-picker__input {\n\t\t\tcolor-scheme: dark;\n\t\t}\n\t}\n}\n</style>\n"],"names":["_useModel","_createElementBlock","_normalizeClass","$props","_createElementVNode","hideLabel","id","label","_mergeProps","inputClass","type","$attrs"],"mappings":"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"}
+{"version":3,"file":"NcDateTimePickerNative-DvvKjw_h.mjs","sources":["../../src/components/NcDateTimePickerNative/NcDateTimePickerNative.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2022 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n\n### General description\n\nThis components provides a wrapper around the native browser datetime picker. <br>\nThis is an input with some type of date e.g. https://html.spec.whatwg.org/multipage/input.html#local-date-and-time-state-(type=datetime-local). <br>\nAll available types are: 'date', 'datetime-local', 'month', 'time' and 'week', please check them here: https://html.spec.whatwg.org/multipage/input.html#  <br>\n\n### Examples\n\n```vue\n<template>\n\t<div>\n\t\t<span>Picked date: {{ value || 'null' }}</span>\n\t\t<hr/>\n\t\t<div class=\"flex\">\n\t\t\t<NcSelect v-bind=\"props\" v-model=\"type\" />\n\t\t\t<NcDateTimePickerNative\n\t\t\t\tv-model=\"value\"\n\t\t\t\t:label=\"label\"\n\t\t\t\t:type=\"type\" />\n\t\t</div>\n\t</div>\n</template>\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tprops: {\n\t\t\t\t\tclearable: false,\n\t\t\t\t\tinputLabel: 'Picker type',\n\t\t\t\t\toptions: [\n\t\t\t\t\t\t'date',\n\t\t\t\t\t\t'datetime-local',\n\t\t\t\t\t\t'month',\n\t\t\t\t\t\t'time',\n\t\t\t\t\t\t'week',\n\t\t\t\t\t],\n\t\t\t\t},\n\t\t\t\ttype: 'datetime-local',\n\t\t\t\tvalue: new Date(),\n\t\t\t\tlabel: 'Select a new date or time',\n\t\t\t}\n\t\t},\n\t}\n</script>\n<style scoped>\n.flex {\n\tdisplay: flex;\n\tgap: 4px;\n}\n</style>\n```\n\n#### Usage: type='datetime-local' with min date and max date\n```vue\n<template>\n\t<div>\n\t\t<span>Picked date: {{ value || 'null' }}</span>\n\t\t<NcDateTimePickerNative\n\t\t\tv-model=\"value\"\n\t\t\t:min=\"yesterdayDate\"\n\t\t\t:max=\"someDate\"\n\t\t\t:label=\"label\"\n\t\t\ttype=\"datetime-local\" />\n\t</div>\n</template>\n\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tvalue: new Date(),\n\t\t\t\tlabel: 'Please select a new date',\n\t\t\t\tyesterdayDate: new Date(new Date().setDate(new Date().getDate() - 1)),\n\t\t\t\tsomeDate: new Date(new Date().setDate(new Date().getDate() + 7)),\n\t\t\t}\n\t\t},\n\t}\n</script>\n```\n\n</docs>\n\n<script setup lang=\"ts\">\nimport type { VueClassType } from '../../utils/VueTypes.ts'\n\nimport { computed } from 'vue'\nimport { t } from '../../l10n.ts'\nimport { createElementId } from '../../utils/createElementId.ts'\n\ndefineOptions({ inheritAttrs: false })\n\n/**\n * The date is – like the `Date` object in JavaScript – tied to UTC.\n * The selected time zone does not have an influence of the selected time and date value.\n * You have to translate the time yourself when you want to factor in time zones.\n * Pass null to clear the input field.\n */\nconst modelValue = defineModel<Date | null>({ default: null })\n\nconst props = withDefaults(defineProps<{\n\t/**\n\t * HTML class of the element\n\t */\n\tclass?: VueClassType\n\n\t/**\n\t * ID of the input element\n\t */\n\tid?: string\n\n\t/**\n\t * Class to add to the input field.\n\t * Necessary to use NcDateTimePickerNative in the NcActionInput component.\n\t */\n\tinputClass?: VueClassType\n\n\t/**\n\t * type attribute of the input field\n\t * default type: String\n\t * The type of the input element, it can be `date`, `datetime-local`, `month`, `time`, `week`\n\t */\n\ttype?: 'date' | 'datetime-local' | 'month' | 'time' | 'week'\n\n\t/**\n\t * Visual label of the input\n\t */\n\tlabel?: string\n\n\t/**\n\t * min attribute of the input field\n\t */\n\tmin?: Date | null\n\n\t/**\n\t * max attribute of the input field\n\t */\n\tmax?: Date | null\n\n\t/**\n\t * Flag to hide the label.\n\t * The hidden input label for accessibility purposes.\n\t */\n\thideLabel?: boolean\n}>(), {\n\tclass: undefined,\n\tid: () => createElementId(),\n\tinputClass: '',\n\tlabel: () => t('Please choose a date'),\n\tmax: null,\n\tmin: null,\n\tmodelValue: null,\n\ttype: 'date',\n})\n\nconst formattedValue = computed(() => modelValue.value ? formatValue(modelValue.value) : '')\nconst formattedMax = computed(() => props.max ? formatValue(props.max) : undefined)\nconst formattedMin = computed(() => props.min ? formatValue(props.min) : undefined)\n\n/**\n * Returns Object with string values of a Date\n *\n * @param value - The selected value\n */\nfunction getReadableDate(value: Date) {\n\tconst yyyy = value.getFullYear().toString().padStart(4, '0')\n\tconst MM = (value.getMonth() + 1).toString().padStart(2, '0')\n\tconst dd = value.getDate().toString().padStart(2, '0')\n\tconst hh = value.getHours().toString().padStart(2, '0')\n\tconst mm = value.getMinutes().toString().padStart(2, '0')\n\n\treturn { yyyy, MM, dd, hh, mm }\n}\n\n/**\n * Returns preformatted value for the input field\n *\n * @param value - The selected value\n */\nfunction formatValue(value: Date): string {\n\tconst { yyyy, MM, dd, hh, mm } = getReadableDate(value)\n\tif (props.type === 'datetime-local') {\n\t\treturn `${yyyy}-${MM}-${dd}T${hh}:${mm}`\n\t} else if (props.type === 'date') {\n\t\treturn `${yyyy}-${MM}-${dd}`\n\t} else if (props.type === 'month') {\n\t\treturn `${yyyy}-${MM}`\n\t} else if (props.type === 'time') {\n\t\treturn `${hh}:${mm}`\n\t} else if (props.type === 'week') {\n\t\tconst startDate = new Date(Number.parseInt(yyyy), 0, 1)\n\t\tconst daysSinceBeginningOfYear = Math.floor((value.getTime() - startDate.getTime())\n\t\t\t/ (24 * 60 * 60 * 1000))\n\t\tconst weekNumber = Math.ceil(daysSinceBeginningOfYear / 7)\n\t\treturn `${yyyy}-W${weekNumber}`\n\t}\n\treturn ''\n}\n\n/**\n * Handle the input event\n *\n * @param event - The input event payload\n */\nfunction onInput(event: Event): void {\n\tconst input = event.target as HTMLInputElement\n\tif (!input || isNaN(input.valueAsNumber)) {\n\t\tmodelValue.value = null\n\t} else if (props.type === 'time') {\n\t\tconst time = input.value\n\n\t\tconst { yyyy, MM, dd } = getReadableDate(modelValue.value || new Date())\n\t\tmodelValue.value = new Date(`${yyyy}-${MM}-${dd}T${time}`)\n\t} else if (props.type === 'month') {\n\t\tconst MM = (new Date(input.value).getMonth() + 1).toString().padStart(2, '0')\n\t\tconst { yyyy, dd, hh, mm } = getReadableDate(modelValue.value || new Date())\n\t\tmodelValue.value = new Date(`${yyyy}-${MM}-${dd}T${hh}:${mm}`)\n\t} else {\n\t\tconst timezoneOffsetSeconds = new Date(input.valueAsNumber).getTimezoneOffset() * 1000 * 60\n\t\tconst inputDateWithTimezone = input.valueAsNumber + timezoneOffsetSeconds\n\t\tmodelValue.value = new Date(inputDateWithTimezone)\n\t}\n}\n</script>\n\n<template>\n\t<div class=\"native-datetime-picker\" :class=\"$props.class\">\n\t\t<label\n\t\t\tclass=\"native-datetime-picker__label\"\n\t\t\t:class=\"{ 'hidden-visually': hideLabel }\"\n\t\t\t:for=\"id\">\n\t\t\t{{ label }}\n\t\t</label>\n\t\t<input\n\t\t\t:id\n\t\t\tclass=\"native-datetime-picker__input\"\n\t\t\t:class=\"inputClass\"\n\t\t\t:type\n\t\t\t:value=\"formattedValue\"\n\t\t\t:min=\"formattedMin\"\n\t\t\t:max=\"formattedMax\"\n\t\t\tv-bind=\"$attrs\"\n\t\t\t@input=\"onInput\">\n\t</div>\n</template>\n\n<style lang=\"scss\" scoped>\n.native-datetime-picker {\n\tdisplay: flex;\n\tflex-direction: column;\n\n\t.native-datetime-picker__label {\n\t\tmargin-block-end: 2px;\n\t}\n\n\t.native-datetime-picker__input {\n\t\t// If border width differs between focused and unfocused we need to compensate to prevent jumping\n\t\t--input-border-width-offset: calc(var(--border-width-input-focused, 2px) - var(--border-width-input, 2px));\n\t\twidth: 100%;\n\t\tflex: 0 0 auto;\n\t\tmargin: 0;\n\t\tpadding-inline-start: calc(var(--border-radius-element) + var(--input-border-width-offset));\n\t\tpadding-inline-end: calc(var(--default-grid-baseline) + var(--input-border-width-offset));\n\t\tborder: var(--border-width-input, 2px) solid var(--color-border-maxcontrast);\n\n\t\t&:active:not([disabled]),\n\t\t&:hover:not([disabled]),\n\t\t&:focus:not([disabled]),\n\t\t&:focus-within:not([disabled]) {\n\t\t\tborder-color: var(--color-main-text);\n\t\t\tborder-width: var(--border-width-input-focused, 2px);\n\t\t\tbox-shadow: 0 0 0 2px var(--color-main-background) !important;\n\t\t\t// Reset padding offset when focused\n\t\t\t--input-border-width-offset: 0px;\n\t\t}\n\t}\n}\n\n[data-theme-light],\n[data-themes*=light] {\n\t.native-datetime-picker__input {\n\t\tcolor-scheme: light;\n\t}\n}\n\n[data-theme-dark],\n[data-themes*=dark] {\n\t.native-datetime-picker__input {\n\t\tcolor-scheme: dark;\n\t}\n}\n\n[data-theme-default],\n[data-themes*=default] {\n\t@media (prefers-color-scheme: light) {\n\t\t.native-datetime-picker__input {\n\t\t\tcolor-scheme: light;\n\t\t}\n\t}\n\t@media (prefers-color-scheme: dark) {\n\t\t.native-datetime-picker__input {\n\t\t\tcolor-scheme: dark;\n\t\t}\n\t}\n}\n</style>\n"],"names":["_useModel","_createElementBlock","_normalizeClass","$props","_createElementVNode","hideLabel","id","label","_mergeProps","inputClass","type","$attrs"],"mappings":"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"}

package/dist/chunks/{NcDialog-BTmnYNeo.mjs → NcDialog-Cnd9YBlk.mjs}

@@ -1,9 +1,9 @@
-import '../assets/NcDialog-D3fAX1Fs.css';
+import '../assets/NcDialog-BSV74Bru.css';
 import { defineComponent, mergeModels, useModel, useSlots, useTemplateRef, computed, ref, createBlock, createCommentVNode, openBlock, unref, mergeProps, withCtx, createElementVNode, toDisplayString, resolveDynamicComponent, toHandlers, normalizeClass, createElementBlock, renderSlot, Fragment, renderList } from "vue";
 import { useElementSize } from "@vueuse/core";
 import { c as createElementId } from "./createElementId-DhjFt1I9.mjs";
-import { _ as _sfc_main$1 } from "./NcDialogButton.vue_vue_type_script_setup_true_lang-CYpktNKA.mjs";
-import { N as NcModal } from "./NcModal-DSCYMxfe.mjs";
+import { _ as _sfc_main$1 } from "./NcDialogButton.vue_vue_type_script_setup_true_lang-BnCX7Duz.mjs";
+import { N as NcModal } from "./NcModal-PlfVmTTk.mjs";
 import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
 const _hoisted_1 = ["id", "textContent"];
 const _hoisted_2 = ["aria-label", "aria-labelledby"];
@@ -105,8 +105,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       return open.value ? (openBlock(), createBlock(unref(NcModal), mergeProps({
         key: 0,
         class: "dialog__modal",
-        "enable-slideshow": false,
-        "disable-swipe": ""
+        disableSwipe: ""
       }, modalProps.value, {
         onClose: handleClosed,
         "onUpdate:show": _cache[0] || (_cache[0] = ($event) => handleClosing())
@@ -160,8 +159,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const NcDialog = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-ca0b8eba"]]);
+const NcDialog = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-24e91b99"]]);
 export {
   NcDialog as N
 };
-//# sourceMappingURL=NcDialog-BTmnYNeo.mjs.map
+//# sourceMappingURL=NcDialog-Cnd9YBlk.mjs.map