npm - @conduction/nextcloud-vue - Versions diffs - 2.91.0 → 2.93.0 - Mend

@conduction/nextcloud-vue 2.91.0 → 2.93.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (149) hide show

package/dist/esm/components/CnModuleCard/CnModuleCard.vue3.js ADDED Viewed

@@ -0,0 +1,119 @@
+import { resolveComponent, openBlock, createElementBlock, createElementVNode, normalizeClass, createVNode, createCommentVNode, toDisplayString, Fragment, renderList, createTextVNode } from 'vue';
+const _hoisted_1 = ["aria-labelledby", "data-module-id"];
+const _hoisted_2 = { class: "cn-module-card__head" };
+const _hoisted_3 = ["id"];
+const _hoisted_4 = {
+  key: 0,
+  class: "cn-module-card__description"
+};
+const _hoisted_5 = {
+  class: "cn-module-card__pages-line",
+  "data-testid": "cn-module-card-pages-line"
+};
+const _hoisted_6 = ["aria-label"];
+const _hoisted_7 = ["href", "onClick"];
+const _hoisted_8 = {
+  key: 2,
+  class: "cn-module-card__footer"
+};
+const _hoisted_9 = ["href", "aria-label"];
+const _hoisted_10 = {
+  key: 1,
+  class: "cn-module-card__settings",
+  "data-testid": "cn-module-card-settings"
+};
+const _hoisted_11 = ["href", "target", "rel"];
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_CnIcon = resolveComponent("CnIcon");
+  const _component_CnStatusBadge = resolveComponent("CnStatusBadge");
+  const _component_ChevronRight = resolveComponent("ChevronRight");
+  return (openBlock(), createElementBlock("article", {
+    class: "cn-module-card",
+    "aria-labelledby": $props.headingId,
+    "data-testid": "cn-module-card",
+    "data-module-id": $props.module.id
+  }, [
+    createElementVNode("div", _hoisted_2, [
+      ($props.module.icon)
+        ? (openBlock(), createElementBlock("span", {
+            key: 0,
+            class: normalizeClass(["cn-module-card__icon", { 'cn-module-card__icon--off': !$props.module.enabled }]),
+            "aria-hidden": "true"
+          }, [
+            createVNode(_component_CnIcon, {
+              name: $props.module.icon,
+              size: 22
+            }, null, 8 /* PROPS */, ["name"])
+          ], 2 /* CLASS */))
+        : createCommentVNode("v-if", true),
+      createElementVNode("h3", {
+        id: $props.headingId,
+        class: "cn-module-card__title"
+      }, toDisplayString($props.module.label), 9 /* TEXT, PROPS */, _hoisted_3),
+      createVNode(_component_CnStatusBadge, {
+        class: "cn-module-card__state",
+        label: $props.module.enabled ? $options.t('nextcloud-vue', 'In the menu') : $options.t('nextcloud-vue', 'Off'),
+        variant: $props.module.enabled ? 'success' : 'default',
+        "data-testid": "cn-module-card-state"
+      }, null, 8 /* PROPS */, ["label", "variant"])
+    ]),
+    ($props.module.description)
+      ? (openBlock(), createElementBlock("p", _hoisted_4, toDisplayString($props.module.description), 1 /* TEXT */))
+      : createCommentVNode("v-if", true),
+    ($props.module.pages.length > 0)
+      ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+          createElementVNode("span", _hoisted_5, toDisplayString($options.pagesLine), 1 /* TEXT */),
+          createElementVNode("ul", {
+            class: "cn-module-card__pages",
+            "aria-label": $options.t('nextcloud-vue', 'Pages')
+          }, [
+            (openBlock(true), createElementBlock(Fragment, null, renderList($props.module.pages, (page) => {
+              return (openBlock(), createElementBlock("li", {
+                key: page.key
+              }, [
+                createElementVNode("a", {
+                  class: "cn-module-card__page",
+                  href: page.url,
+                  onClick: $event => ($options.follow(page, $event))
+                }, toDisplayString(page.label), 9 /* TEXT, PROPS */, _hoisted_7)
+              ]))
+            }), 128 /* KEYED_FRAGMENT */))
+          ], 8 /* PROPS */, _hoisted_6)
+        ], 64 /* STABLE_FRAGMENT */))
+      : createCommentVNode("v-if", true),
+    ($props.module.open || (!$props.module.enabled && $props.module.settings))
+      ? (openBlock(), createElementBlock("div", _hoisted_8, [
+          ($props.module.open)
+            ? (openBlock(), createElementBlock("a", {
+                key: 0,
+                class: "cn-module-card__open",
+                href: $props.module.open.url,
+                "aria-label": $options.t('nextcloud-vue', 'Open {module}', { module: $props.module.label }),
+                "data-testid": "cn-module-card-open",
+                onClick: _cache[0] || (_cache[0] = $event => ($options.follow($props.module.open, $event)))
+              }, [
+                createTextVNode(toDisplayString($options.t('nextcloud-vue', 'Open')) + " ", 1 /* TEXT */),
+                createVNode(_component_ChevronRight, { size: 18 })
+              ], 8 /* PROPS */, _hoisted_9))
+            : createCommentVNode("v-if", true),
+          (!$props.module.enabled && $props.module.settings)
+            ? (openBlock(), createElementBlock("span", _hoisted_10, [
+                createTextVNode(toDisplayString($props.module.settings.prefix || $options.t('nextcloud-vue', 'Put it in the menu:')) + " ", 1 /* TEXT */),
+                createElementVNode("a", {
+                  href: $props.module.settings.url,
+                  target: $props.module.settings.external ? '_blank' : null,
+                  rel: $props.module.settings.external ? 'noopener noreferrer' : null,
+                  onClick: _cache[1] || (_cache[1] = $event => ($options.follow($props.module.settings, $event)))
+                }, toDisplayString($props.module.settings.label || $options.t('nextcloud-vue', 'Admin settings')), 9 /* TEXT, PROPS */, _hoisted_11)
+              ]))
+            : createCommentVNode("v-if", true)
+        ]))
+      : createCommentVNode("v-if", true)
+  ], 8 /* PROPS */, _hoisted_1))
+}
+export { render };
+//# sourceMappingURL=CnModuleCard.vue3.js.map

package/dist/esm/components/CnModuleCard/CnModuleCard.vue3.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"CnModuleCard.vue3.js","sources":["../../../../src/components/CnModuleCard/CnModuleCard.vue?vue&type=template&id=7cd47118&lang.js"],"sourcesContent":["\n<template>\n\t<article\n\t\tclass=\"cn-module-card\"\n\t\t:aria-labelledby=\"headingId\"\n\t\tdata-testid=\"cn-module-card\"\n\t\t:data-module-id=\"module.id\">\n\t\t<div class=\"cn-module-card__head\">\n\t\t\t<span\n\t\t\t\tv-if=\"module.icon\"\n\t\t\t\tclass=\"cn-module-card__icon\"\n\t\t\t\t:class=\"{ 'cn-module-card__icon--off': !module.enabled }\"\n\t\t\t\taria-hidden=\"true\">\n\t\t\t\t<CnIcon :name=\"module.icon\" :size=\"22\" />\n\t\t\t</span>\n\t\t\t<h3 :id=\"headingId\" class=\"cn-module-card__title\">\n\t\t\t\t{{ module.label }}\n\t\t\t</h3>\n\t\t\t<CnStatusBadge\n\t\t\t\tclass=\"cn-module-card__state\"\n\t\t\t\t:label=\"module.enabled ? t('nextcloud-vue', 'In the menu') : t('nextcloud-vue', 'Off')\"\n\t\t\t\t:variant=\"module.enabled ? 'success' : 'default'\"\n\t\t\t\tdata-testid=\"cn-module-card-state\" />\n\t\t</div>\n\t\t<p v-if=\"module.description\" class=\"cn-module-card__description\">\n\t\t\t{{ module.description }}\n\t\t</p>\n\t\t<template v-if=\"module.pages.length > 0\">\n\t\t\t<span class=\"cn-module-card__pages-line\" data-testid=\"cn-module-card-pages-line\">{{ pagesLine }}</span>\n\t\t\t<ul class=\"cn-module-card__pages\" :aria-label=\"t('nextcloud-vue', 'Pages')\">\n\t\t\t\t<li v-for=\"page in module.pages\" :key=\"page.key\">\n\t\t\t\t\t<a\n\t\t\t\t\t\tclass=\"cn-module-card__page\"\n\t\t\t\t\t\t:href=\"page.url\"\n\t\t\t\t\t\t@click=\"follow(page, $event)\">{{ page.label }}</a>\n\t\t\t\t</li>\n\t\t\t</ul>\n\t\t</template>\n\t\t<div v-if=\"module.open || (!module.enabled && module.settings)\" class=\"cn-module-card__footer\">\n\t\t\t<a\n\t\t\t\tv-if=\"module.open\"\n\t\t\t\tclass=\"cn-module-card__open\"\n\t\t\t\t:href=\"module.open.url\"\n\t\t\t\t:aria-label=\"t('nextcloud-vue', 'Open {module}', { module: module.label })\"\n\t\t\t\tdata-testid=\"cn-module-card-open\"\n\t\t\t\t@click=\"follow(module.open, $event)\">\n\t\t\t\t{{ t('nextcloud-vue', 'Open') }}\n\t\t\t\t<ChevronRight :size=\"18\" />\n\t\t\t</a>\n\t\t\t<span v-if=\"!module.enabled && module.settings\" class=\"cn-module-card__settings\" data-testid=\"cn-module-card-settings\">\n\t\t\t\t{{ module.settings.prefix || t('nextcloud-vue', 'Put it in the menu:') }}\n\t\t\t\t<a\n\t\t\t\t\t:href=\"module.settings.url\"\n\t\t\t\t\t:target=\"module.settings.external ? '_blank' : null\"\n\t\t\t\t\t:rel=\"module.settings.external ? 'noopener noreferrer' : null\"\n\t\t\t\t\t@click=\"follow(module.settings, $event)\">{{ module.settings.label || t('nextcloud-vue', 'Admin settings') }}</a>\n\t\t\t</span>\n\t\t</div>\n\t</article>\n</template>\n\n<script>\nimport { translatePlural as n, translate as t } from '@nextcloud/l10n'\nimport ChevronRight from 'vue-material-design-icons/ChevronRight.vue'\nimport CnStatusBadge from '../CnStatusBadge/CnStatusBadge.vue'\nimport { followLinkClick } from '../../utils/linkNavigation.js'\nimport { CnIcon } from '../CnIcon/index.js'\n\n/** A module with more pages than this names its highlights instead of every page. */\nconst LISTED_PAGES = 4\n\n/**\n * CnModuleCard - one module on a `type: \"links\"` page (board PqModules): an\n * icon, the title and a state badge (in the menu, or off), a description,\n * the module's pages as a line and as links, an Open button, and for a\n * module that is off a link to where an admin puts it in the menu.\n *\n * Rendered by CnLinkCardsPage for each entry of `config.modules`; the page\n * resolves the links and the text before handing the module over.\n *\n * @spec openspec/changes/screens-links-module-cards/specs/link-cards-page/spec.md#requirement-a-links-page-can-show-modules\n */\nexport default {\n\tname: 'CnModuleCard',\n\n\tcomponents: { ChevronRight, CnIcon, CnStatusBadge },\n\n\tprops: {\n\t\t/**\n\t\t * The resolved module: `{ id, label, description, icon, enabled,\n\t\t * pages: [{ key, label, url, location, highlight }], open: { url,\n\t\t * location }|null, settings: { url, location, external, label, prefix }|null }`.\n\t\t */\n\t\tmodule: {\n\t\t\ttype: Object,\n\t\t\trequired: true,\n\t\t},\n\n\t\t/** Id of the card's heading, unique on the page. */\n\t\theadingId: {\n\t\t\ttype: String,\n\t\t\trequired: true,\n\t\t},\n\t},\n\n\tcomputed: {\n\t\t/**\n\t\t * \"4 pages: Overview, Leads, Prospects, Pipeline\", or for a larger\n\t\t * module \"15 pages, including Campaigns, Blasts and Mailing lists\"\n\t\t * from the pages marked `highlight` (else the first three).\n\t\t *\n\t\t * @return {string} The line.\n\t\t */\n\t\tpagesLine() {\n\t\t\tconst pages = this.module.pages\n\t\t\tif (pages.length <= LISTED_PAGES) {\n\t\t\t\treturn n('nextcloud-vue', '%n page: {pages}', '%n pages: {pages}', pages.length, { pages: pages.map((page) => page.label).join(', ') })\n\t\t\t}\n\t\t\tconst marked = pages.filter((page) => page.highlight)\n\t\t\tconst named = (marked.length > 0 ? marked : pages).slice(0, 3).map((page) => page.label)\n\t\t\tconst last = named.pop()\n\t\t\tconst list = named.length > 0 ? t('nextcloud-vue', '{list} and {last}', { list: named.join(', '), last }) : last\n\t\t\treturn n('nextcloud-vue', '%n page, including {pages}', '%n pages, including {pages}', pages.length, { pages: list })\n\t\t},\n\t},\n\n\tmethods: {\n\t\tt,\n\n\t\t/**\n\t\t * Route a plain click on an in-app link, so the page does not reload.\n\t\t *\n\t\t * @param {{location: (object|null)}} target The resolved link.\n\t\t * @param {MouseEvent} event The click.\n\t\t */\n\t\tfollow(target, event) {\n\t\t\tif (target && target.location) {\n\t\t\t\tfollowLinkClick(event, target.location, this.$router)\n\t\t\t}\n\t\t},\n\t},\n}\n</script>\n\n<style scoped>\n.cn-module-card {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 12px;\n\tpadding: 20px;\n\tborder: 1px solid var(--color-border);\n\tborder-radius: var(--border-radius-container-large, 12px);\n\tbackground: var(--color-main-background);\n}\n\n.cn-module-card__head {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 12px;\n}\n\n.cn-module-card__icon {\n\tdisplay: flex;\n\tflex: none;\n\talign-items: center;\n\tjustify-content: center;\n\twidth: 42px;\n\theight: 42px;\n\tborder-radius: var(--border-radius-large, 10px);\n\tbackground: var(--color-primary-element-light);\n\tcolor: var(--color-primary-element-light-text, var(--color-primary-element));\n}\n\n.cn-module-card__title {\n\tflex: 1 1 auto;\n\tmargin: 0;\n\tfont-size: 17px;\n\tfont-weight: 700;\n}\n\n.cn-module-card__state {\n\tflex: none;\n}\n\n.cn-module-card__description {\n\tmargin: 0;\n\tfont-size: 15px;\n\tline-height: 1.5;\n}\n\n.cn-module-card__pages-line {\n\tfont-size: 13px;\n\tcolor: var(--color-text-maxcontrast);\n}\n\n.cn-module-card__pages {\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: 6px 12px;\n\tmargin: 0;\n\tpadding: 0;\n\tlist-style: none;\n\tfont-size: 14px;\n}\n\n.cn-module-card__page {\n\tfont-weight: 600;\n\tcolor: var(--color-primary-element);\n}\n\n.cn-module-card__footer {\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\talign-items: center;\n\tgap: 8px 14px;\n\tmargin-top: auto;\n\tpadding-top: 4px;\n}\n\n.cn-module-card__open {\n\tdisplay: inline-flex;\n\talign-items: center;\n\tgap: 6px;\n\tbox-sizing: border-box;\n\theight: 36px;\n\tpadding: 0 14px;\n\tfont-size: 14px;\n\tfont-weight: 600;\n\ttext-decoration: none;\n}\n\n.cn-module-card__open {\n\tborder: 1px solid var(--color-border-dark);\n\tborder-radius: var(--border-radius-element, 8px);\n\tbackground: var(--color-main-background);\n\tcolor: var(--color-main-text);\n}\n\n.cn-module-card__icon--off {\n\tbackground: var(--color-background-dark);\n\tcolor: var(--color-main-text);\n}\n\n.cn-module-card__settings {\n\tfont-size: 13px;\n\tcolor: var(--color-text-maxcontrast);\n}\n\n.cn-module-card__open:focus-visible,\n.cn-module-card__settings a:focus-visible,\n.cn-module-card__page:focus-visible {\n\toutline: 2px solid var(--color-primary-element);\n\toutline-offset: 2px;\n}\n</style>\n"],"names":["_createElementBlock","_normalizeClass","_createVNode","_toDisplayString","_Fragment","_createElementVNode","_renderList","_createTextVNode"],"mappings":"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"}

package/dist/esm/components/CnNcWidgetWidget/CnNcWidgetWidget.vue.js CHANGED Viewed

@@ -2,7 +2,7 @@ import script from './CnNcWidgetWidget.vue2.js';
 import { render } from './CnNcWidgetWidget.vue3.js';
 script.render = render;
-script.__scopeId = "data-v-04be70f3";
+script.__scopeId = "data-v-f553a198";
 const __sfc_main = script;
 export { __sfc_main as default };

package/dist/esm/components/CnNcWidgetWidget/CnNcWidgetWidget.vue2.js CHANGED Viewed

@@ -39,9 +39,16 @@ function getDashboardGlobal() {
 var script = {
 	name: 'CnNcWidgetWidget',
+	inject: {
+		/** Whether the hosting card draws a title row (CnWidgetWrapper). */
+		cnWidgetTitled: { default: null },
+	},
 	props: {
 		/**
-		 * Persisted widget content `{widgetId, displayMode, limit?, showAllUrl?, showAllLabel?}`.
+		 * Persisted widget content `{widgetId, displayMode, limit?, showAllUrl?, showAllLabel?, showHeader?}`.
+		 * `showHeader: false` drops the widget's own header (icon and title);
+		 * it is dropped too when the hosting card draws a title row.
 		 * `limit` is the most items shown (the list then comes from the items
 		 * API, so it fits its cell); `showAllUrl` / `showAllLabel` the link to
 		 * the rest (default the widget's own page and "Show all").
@@ -116,6 +123,20 @@ var script = {
 			return null
 		},
+		/**
+		 * Whether the widget draws its own header: not with
+		 * `content.showHeader: false`, nor inside a card that draws a title.
+		 *
+		 * @spec openspec/changes/nc-widget-header/specs/nc-widget-header/spec.md#requirement-a-nextcloud-widget-draws-no-second-heading
+		 * @return {boolean}
+		 */
+		showsHeader() {
+			if (this.content && this.content.showHeader === false) {
+				return false
+			}
+			return !(typeof this.cnWidgetTitled === 'function' && this.cnWidgetTitled())
+		},
 		/**
 		 * The header title.
 		 *

package/dist/esm/components/CnNcWidgetWidget/CnNcWidgetWidget.vue2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CnNcWidgetWidget.vue2.js","sources":["../../../../src/components/CnNcWidgetWidget/CnNcWidgetWidget.vue"],"sourcesContent":["<!--\n - SPDX-FileCopyrightText: 2026 Conduction B.V.\n - SPDX-License-Identifier: EUPL-1.2\n-->\n\n<template>\n\t<div class=\"cn-nc-widget-widget\" :class=\"{ 'cn-nc-widget-widget--horizontal': displayMode === 'horizontal' }\">\n\t\t<header class=\"cn-nc-widget-widget__header\">\n\t\t\t<img\n\t\t\t\tv-if=\"widgetIconUrl\"\n\t\t\t\tclass=\"cn-nc-widget-widget__header-icon\"\n\t\t\t\t:src=\"widgetIconUrl\"\n\t\t\t\talt=\"\">\n\t\t\t<span class=\"cn-nc-widget-widget__header-title\">{{ widgetTitle }}</span>\n\t\t</header>\n\n\t\t<!--\n\t\t\tNative callback container — always present but hidden until the\n\t\t\tOCA.Dashboard callback mounts into it. Keeping it mounted avoids a\n\t\t\tflicker when the native path wins after the API list has painted.\n\n\t\t\tThe `--horizontal` reskin class lives on the ROOT element, not here:\n\t\t\tnative widget callbacks mount via `new Vue(...).$mount(el)`, which\n\t\t\tREPLACES this element in the live DOM with the callback's own root\n\t\t\tnode — any class we put directly on it is discarded along with the\n\t\t\telement itself, so it can never appear in the rendered page.\n\t\t-->\n\t\t<div\n\t\t\tv-show=\"mode === 'native'\"\n\t\t\tref=\"nativeContainer\"\n\t\t\tclass=\"cn-nc-widget-widget__native\" />\n\n\t\t<div\n\t\t\tv-if=\"mode !== 'native'\"\n\t\t\tclass=\"cn-nc-widget-widget__body\"\n\t\t\t:class=\"bodyClass\">\n\t\t\t<div v-if=\"loading\" class=\"cn-nc-widget-widget__state\">\n\t\t\t\t{{ t('nextcloud-vue', 'Loading…') }}\n\t\t\t</div>\n\n\t\t\t<div v-else-if=\"!widgetId\" class=\"cn-nc-widget-widget__state\">\n\t\t\t\t{{ t('nextcloud-vue', 'No widget selected') }}\n\t\t\t</div>\n\n\t\t\t<div v-else-if=\"unsupported\" class=\"cn-nc-widget-widget__state\" data-testid=\"nc-widget-unsupported\">\n\t\t\t\t{{ t('nextcloud-vue', 'This widget can only be shown on the Nextcloud dashboard itself.') }}\n\t\t\t</div>\n\n\t\t\t<div v-else-if=\"items.length === 0\" class=\"cn-nc-widget-widget__state\">\n\t\t\t\t{{ t('nextcloud-vue', 'No items available') }}\n\t\t\t</div>\n\n\t\t\t<template v-else>\n\t\t\t\t<a\n\t\t\t\t\tv-for=\"(item, idx) in shownItems\"\n\t\t\t\t\t:key=\"item.sinceId \|\| item.id \|\| idx\"\n\t\t\t\t\tclass=\"cn-nc-widget-widget__item\"\n\t\t\t\t\t:class=\"itemClass\"\n\t\t\t\t\t:href=\"item.link \|\| '#'\"\n\t\t\t\t\t:title=\"item.title\">\n\t\t\t\t\t<span class=\"cn-nc-widget-widget__item-icon-wrap\">\n\t\t\t\t\t\t<img\n\t\t\t\t\t\t\tv-if=\"item.iconUrl\"\n\t\t\t\t\t\t\tclass=\"cn-nc-widget-widget__item-icon\"\n\t\t\t\t\t\t\t:src=\"item.iconUrl\"\n\t\t\t\t\t\t\talt=\"\">\n\t\t\t\t\t\t<img\n\t\t\t\t\t\t\tv-if=\"item.overlayIconUrl\"\n\t\t\t\t\t\t\tclass=\"cn-nc-widget-widget__item-overlay\"\n\t\t\t\t\t\t\t:src=\"item.overlayIconUrl\"\n\t\t\t\t\t\t\talt=\"\">\n\t\t\t\t\t</span>\n\t\t\t\t\t<span class=\"cn-nc-widget-widget__item-text\">\n\t\t\t\t\t\t<span class=\"cn-nc-widget-widget__item-title\">{{ item.title }}</span>\n\t\t\t\t\t\t<span v-if=\"item.subtitle\" class=\"cn-nc-widget-widget__item-subtitle\">{{ item.subtitle }}</span>\n\t\t\t\t\t</span>\n\t\t\t\t</a>\n\t\t\t\t<!-- With a `limit`, the rest is one link away (`showAllUrl`, else the widget's own page). -->\n\t\t\t\t<a\n\t\t\t\t\tv-if=\"showAllHref\"\n\t\t\t\t\tclass=\"cn-nc-widget-widget__show-all\"\n\t\t\t\t\tdata-testid=\"nc-widget-show-all\"\n\t\t\t\t\t:href=\"showAllHref\">\n\t\t\t\t\t{{ showAllLabel }}\n\t\t\t\t</a>\n\t\t\t</template>\n\t\t</div>\n\t</div>\n</template>\n\n<script>\nimport axios from '@nextcloud/axios'\nimport { translate as t } from '@nextcloud/l10n'\nimport { generateOcsUrl } from '@nextcloud/router'\n\nconst API_ITEM_LIMIT = 7\n\n/*\n Read the global `OCA.Dashboard` registry without assuming it exists.\n \n @return {object\|null} the `OCA.Dashboard` object, or `null` when absent.\n /\nfunction getDashboardGlobal() {\n\tif (typeof window === 'undefined') {\n\t\treturn null\n\t}\n\tconst oca = window.OCA\n\treturn oca && oca.Dashboard ? oca.Dashboard : null\n}\n\n/\n CnNcWidgetWidget — proxies any native Nextcloud Dashboard widget into a\n * dashboard grid cell.\n \n Two-mode rendering (decoupling seam — reads NC directly, no app bridge):\n * - native — when the widget bundle has registered a callback on the\n * global `OCA.Dashboard` (`getWidget(id)` / `widgets[id]`), the callback is\n * handed the render container and paints itself (native fast-path).\n * - api — otherwise the OCS Dashboard endpoint\n * `/apps/dashboard/api/v{1,2}/widget-items` is fetched directly via\n * `@nextcloud/axios` and a flat item list is rendered.\n \n The header title + icon come from the dashboard widget metadata\n * (`OCA.Dashboard` registry, falling back to the configured `widgetId`). When\n * no `widgetId` is configured the widget renders an empty state and never hits\n * the network.\n \n @spec openspec/changes/cn-widget-library/specs/cn-widget-library/spec.md\n /\nexport default {\n\tname: 'CnNcWidgetWidget',\n\n\tprops: {\n\t\t/\n\t\t Persisted widget content `{widgetId, displayMode, limit?, showAllUrl?, showAllLabel?}`.\n\t\t * `limit` is the most items shown (the list then comes from the items\n\t\t * API, so it fits its cell); `showAllUrl` / `showAllLabel` the link to\n\t\t * the rest (default the widget's own page and \"Show all\").\n\t\t \n\t\t @type {object}\n\t\t /\n\t\tcontent: {\n\t\t\ttype: Object,\n\t\t\tdefault: () => ({}),\n\t\t},\n\t},\n\n\tdata() {\n\t\treturn {\n\t\t\t/* @type {'pending'\|'native'\|'api'} the resolved mounting mode. /\n\t\t\tmode: 'pending',\n\t\t\t/\n\t\t\t Whether the items API has no entry for this widget at all.\n\t\t\t \n\t\t\t Not the same as an empty list. A widget whose provider implements\n\t\t\t * only `IWidget` (no `IAPIWidget`/`IAPIWidgetV2`) declares\n\t\t\t * `itemApiVersions: []` and is simply ABSENT from the widget-items\n\t\t\t * response, while a widget with nothing to show right now comes\n\t\t\t * back as its own key holding an empty list. The Tasks app's widget\n\t\t\t * is the first kind: with no native callback registered on the page\n\t\t\t * it can never render a single item here, and saying \"No items\n\t\t\t * available\" under it told the reader their task list was empty.\n\t\t\t \n\t\t\t @type {boolean}\n\t\t\t /\n\t\t\tunsupported: false,\n\t\t\tloading: false,\n\t\t\titems: [],\n\t\t}\n\t},\n\n\tcomputed: {\n\t\t/\n\t\t The configured native widget id.\n\t\t \n\t\t @return {string} the widget id (empty when unset).\n\t\t /\n\t\twidgetId() {\n\t\t\treturn typeof (this.content && this.content.widgetId) === 'string' ? this.content.widgetId : ''\n\t\t},\n\n\t\t/\n\t\t The item list orientation.\n\t\t \n\t\t @return {string} `horizontal` or `vertical`.\n\t\t /\n\t\tdisplayMode() {\n\t\t\treturn (this.content && this.content.displayMode) === 'horizontal' ? 'horizontal' : 'vertical'\n\t\t},\n\n\t\t/\n\t\t The native widget metadata from the `OCA.Dashboard` global.\n\t\t \n\t\t @return {object\|null} the widget metadata, or `null`.\n\t\t /\n\t\twidgetMeta() {\n\t\t\tconst dashboard = getDashboardGlobal()\n\t\t\tif (!dashboard \|\| !this.widgetId) {\n\t\t\t\treturn null\n\t\t\t}\n\t\t\tif (typeof dashboard.getWidget === 'function') {\n\t\t\t\treturn dashboard.getWidget(this.widgetId) \|\| null\n\t\t\t}\n\t\t\tif (dashboard.widgets && typeof dashboard.widgets === 'object') {\n\t\t\t\treturn dashboard.widgets[this.widgetId] \|\| null\n\t\t\t}\n\t\t\treturn null\n\t\t},\n\n\t\t/\n\t\t The header title.\n\t\t \n\t\t @return {string} the title.\n\t\t /\n\t\twidgetTitle() {\n\t\t\treturn (this.widgetMeta && this.widgetMeta.title) \|\| this.widgetId \|\| t('nextcloud-vue', 'Widget')\n\t\t},\n\n\t\t/\n\t\t The header icon URL.\n\t\t \n\t\t @return {string} the icon URL (empty when none).\n\t\t /\n\t\twidgetIconUrl() {\n\t\t\treturn (this.widgetMeta && this.widgetMeta.iconUrl) \|\| ''\n\t\t},\n\n\t\t/\n\t\t The most items the list shows (`content.limit`), or 0 for no limit.\n\t\t * A limit lets the widget fit a dashboard cell instead of scrolling\n\t\t * inside it.\n\t\t \n\t\t @spec openspec/changes/screens-nc-widget-limit/specs/nc-widget/spec.md#requirement-a-nextcloud-widget-shows-at-most-its-limit\n\t\t * @return {number} the limit.\n\t\t /\n\t\titemLimit() {\n\t\t\tconst limit = Number(this.content && this.content.limit)\n\t\t\treturn Number.isInteger(limit) && limit > 0 ? limit : 0\n\t\t},\n\n\t\t/\n\t\t The items drawn: at most `itemLimit`.\n\t\t \n\t\t @return {object[]} the items.\n\t\t /\n\t\tshownItems() {\n\t\t\treturn this.itemLimit > 0 ? this.items.slice(0, this.itemLimit) : this.items\n\t\t},\n\n\t\t/\n\t\t Where \"Show all\" goes: `content.showAllUrl`, else the page the widget\n\t\t * names itself (its `url`). Only with a limit; '' for no link.\n\t\t \n\t\t @spec openspec/changes/screens-nc-widget-limit/specs/nc-widget/spec.md#requirement-a-nextcloud-widget-shows-at-most-its-limit\n\t\t * @return {string} the URL.\n\t\t /\n\t\tshowAllHref() {\n\t\t\tif (this.itemLimit === 0) {\n\t\t\t\treturn ''\n\t\t\t}\n\t\t\tconst own = this.content && typeof this.content.showAllUrl === 'string' ? this.content.showAllUrl : ''\n\t\t\treturn own \|\| (this.widgetMeta && typeof this.widgetMeta.url === 'string' ? this.widgetMeta.url : '')\n\t\t},\n\n\t\t/\n\t\t The \"Show all\" text (`content.showAllLabel`, else the library's).\n\t\t \n\t\t @return {string} the label.\n\t\t /\n\t\tshowAllLabel() {\n\t\t\tconst label = this.content && this.content.showAllLabel\n\t\t\treturn typeof label === 'string' && label !== '' ? label : t('nextcloud-vue', 'Show all')\n\t\t},\n\n\t\t/\n\t\t The body orientation CSS modifier class.\n\t\t \n\t\t @return {string} the body class.\n\t\t /\n\t\tbodyClass() {\n\t\t\treturn `cn-nc-widget-widget__body--${this.displayMode}`\n\t\t},\n\n\t\t/\n\t\t The item orientation CSS modifier class.\n\t\t \n\t\t @return {string} the item class.\n\t\t /\n\t\titemClass() {\n\t\t\treturn `cn-nc-widget-widget__item--${this.displayMode}`\n\t\t},\n\t},\n\n\tmounted() {\n\t\tthis.tryMount()\n\t},\n\n\tmethods: {\n\t\tt,\n\n\t\t/\n\t\t Resolve the mounting mode. Prefers the native `OCA.Dashboard`\n\t\t * callback fast-path; otherwise falls back to the OCS item list.\n\t\t \n\t\t @return {void}\n\t\t /\n\t\ttryMount() {\n\t\t\tif (!this.widgetId) {\n\t\t\t\tthis.mode = 'api'\n\t\t\t\tthis.items = []\n\t\t\t\treturn\n\t\t\t}\n\t\t\t// The native callback paints its own opaque markup, so `displayMode`\n\t\t\t// (bodyClass/itemClass below) has no effect on it — only the API\n\t\t\t// item list honours the vertical/horizontal setting. Horizontal mode\n\t\t\t// must therefore skip the native fast-path, or the \"Horizontal\n\t\t\t// (cards)\" option would silently do nothing for the (common) case\n\t\t\t// where the widget has a registered native callback.\n\t\t\t// A `limit` also takes the API list first: the native callback paints\n\t\t\t// as many items as it likes. Its fallback to native stays.\n\t\t\tif (this.displayMode !== 'horizontal' && this.itemLimit === 0) {\n\t\t\t\tconst callback = this.resolveNativeCallback()\n\t\t\t\tif (typeof callback === 'function') {\n\t\t\t\t\tthis.mountNative(callback)\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t}\n\t\t\tthis.mode = 'api'\n\t\t\tthis.loadApiItems()\n\t\t},\n\n\t\t/\n\t\t Look up a native render callback on the `OCA.Dashboard` global.\n\t\t \n\t\t @return {((el: HTMLElement, ctx: {widget: object}) => unknown)\|null} the callback, or `null` when none is registered.\n\t\t /\n\t\tresolveNativeCallback() {\n\t\t\tconst dashboard = getDashboardGlobal()\n\t\t\tif (!dashboard) {\n\t\t\t\treturn null\n\t\t\t}\n\t\t\tif (this.widgetMeta && typeof this.widgetMeta.callback === 'function') {\n\t\t\t\treturn this.widgetMeta.callback\n\t\t\t}\n\t\t\tif (dashboard.callbacks && typeof dashboard.callbacks[this.widgetId] === 'function') {\n\t\t\t\treturn dashboard.callbacks[this.widgetId]\n\t\t\t}\n\t\t\treturn null\n\t\t},\n\n\t\t/\n\t\t Mount the widget natively by invoking its registered callback with\n\t\t * our render container.\n\t\t \n\t\t @param {(el: HTMLElement, ctx: {widget: object}) => unknown} callback the native render callback.\n\t\t * @return {void}\n\t\t /\n\t\tmountNative(callback) {\n\t\t\tthis.mode = 'native'\n\t\t\tthis.$nextTick(() => {\n\t\t\t\tconst container = this.$refs.nativeContainer\n\t\t\t\tif (!container) {\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t\t// Native callback failed — fall back to the API list.\n\t\t\t\tconst fallback = () => {\n\t\t\t\t\tthis.mode = 'api'\n\t\t\t\t\tthis.loadApiItems()\n\t\t\t\t}\n\t\t\t\ttry {\n\t\t\t\t\t// NC dashboard widgets are registered as\n\t\t\t\t\t// `register(id, (el, { widget }) => …)` — the second argument\n\t\t\t\t\t// MUST be the `{ widget }` envelope, not the bare metadata, or\n\t\t\t\t\t// the widget destructures `widget` as undefined and throws on\n\t\t\t\t\t// first use (e.g. `widget.title`).\n\t\t\t\t\tconst result = callback(container, { widget: this.widgetMeta \|\| {} })\n\t\t\t\t\t// Most widget callbacks are async; a synchronous try/catch\n\t\t\t\t\t// can't see a rejected promise, so wire the fallback to it too.\n\t\t\t\t\tif (result && typeof result.then === 'function') {\n\t\t\t\t\t\tresult.catch(fallback)\n\t\t\t\t\t}\n\t\t\t\t} catch {\n\t\t\t\t\tfallback()\n\t\t\t\t}\n\t\t\t})\n\t\t},\n\n\t\t/\n\t\t Fetch the API fallback list directly from the OCS Dashboard\n\t\t * endpoint. Malformed or failed responses collapse to an empty list\n\t\t * (the empty state) instead of throwing.\n\t\t \n\t\t @return {Promise<void>}\n\t\t /\n\t\tasync loadApiItems() {\n\t\t\tthis.loading = true\n\t\t\ttry {\n\t\t\t\t// The v2 widget-items API only returns an entry for widgets\n\t\t\t\t// whose server-side provider implements `IAPIWidgetV2` — plenty\n\t\t\t\t// of native dashboard widgets are JS-callback-only (`IWidget`)\n\t\t\t\t// and never appear in this response at all, which looks\n\t\t\t\t// identical to \"0 items\" from here. extractItems() tolerates\n\t\t\t\t// both the flat-array (older providers) and `{items}` (v2) shapes.\n\t\t\t\tconst url = generateOcsUrl('/apps/dashboard/api/v2/widget-items')\n\t\t\t\tconst response = await axios.get(url, {\n\t\t\t\t\tparams: { widgets: [this.widgetId], limit: this.itemLimit > 0 ? this.itemLimit : API_ITEM_LIMIT },\n\t\t\t\t})\n\t\t\t\tconst data = response && response.data && response.data.ocs ? response.data.ocs.data : null\n\t\t\t\tconst widgetData = data ? data[this.widgetId] : null\n\t\t\t\tthis.items = this.extractItems(widgetData)\n\t\t\t\t// Only a SUCCESSFUL response can say the widget is absent. A\n\t\t\t\t// failed request says nothing about the widget, so it keeps\n\t\t\t\t// the ordinary empty state rather than a claim about the app.\n\t\t\t\tthis.unsupported = data !== null && (widgetData === null \|\| widgetData === undefined)\n\t\t\t} catch {\n\t\t\t\tthis.items = []\n\t\t\t\tthis.unsupported = false\n\t\t\t} finally {\n\t\t\t\tthis.loading = false\n\t\t\t}\n\n\t\t\t// Horizontal mode deliberately skips the native fast-path (see\n\t\t\t// tryMount()) to get the styled card layout. But when the API has\n\t\t\t// no entry for this widget at all — no `IAPIWidgetV2` support, not\n\t\t\t// \"no items right now\" — that would render a false empty state for\n\t\t\t// a widget that actually has content. Fall back to native\n\t\t\t// rendering rather than lying about there being nothing to show.\n\t\t\tif (this.items.length === 0) {\n\t\t\t\tconst callback = this.resolveNativeCallback()\n\t\t\t\tif (typeof callback === 'function') {\n\t\t\t\t\tthis.mountNative(callback)\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\t/\n\t\t Normalise a per-widget OCS payload to an items array, tolerating both\n\t\t * the flat array and the `{items}` envelope shapes.\n\t\t \n\t\t @param {unknown} widgetData the per-widget payload.\n\t\t * @return {object[]} the items array (possibly empty).\n\t\t /\n\t\textractItems(widgetData) {\n\t\t\tif (!widgetData) {\n\t\t\t\treturn []\n\t\t\t}\n\t\t\tif (Array.isArray(widgetData)) {\n\t\t\t\treturn widgetData\n\t\t\t}\n\t\t\tif (Array.isArray(widgetData.items)) {\n\t\t\t\treturn widgetData.items\n\t\t\t}\n\t\t\tif (widgetData.items && typeof widgetData.items === 'object') {\n\t\t\t\treturn Object.values(widgetData.items)\n\t\t\t}\n\t\t\treturn []\n\t\t},\n\t},\n}\n</script>\n\n<style scoped>\n.cn-nc-widget-widget {\n\tdisplay: flex;\n\tflex-direction: column;\n\twidth: 100%;\n\theight: 100%;\n\toverflow: hidden;\n}\n\n/\n * Header + content match the native Nextcloud Dashboard panel (apps/dashboard)\n * exactly — this component's whole job is rendering NC dashboard widgets, so it\n * should look native by default: 16px header, 32px leading icon with a 16px\n * gap, a 20px/700 title, and the native panel content inset (16px sides +\n * bottom, flush to the header on top). Same design tokens as core; overridable\n * via the host's CnWidgetWrapper styleConfig / nldesign.\n /\n.cn-nc-widget-widget__header {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 16px;\n\tpadding: 16px;\n\tfont-weight: 700;\n}\n\n.cn-nc-widget-widget__header-icon {\n\twidth: 32px;\n\theight: 32px;\n\tflex: 0 0 auto;\n}\n\n.cn-nc-widget-widget__header-title {\n\tflex: 1;\n\tfont-size: 20px;\n\tfont-weight: 700;\n\tline-height: 24px;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n}\n\n.cn-nc-widget-widget__show-all {\n\talign-self: flex-start;\n\tpadding: 8px 0 0;\n\tcolor: var(--color-primary-element);\n\tfont-weight: 600;\n\ttext-decoration: none;\n}\n\n.cn-nc-widget-widget__show-all:hover,\n.cn-nc-widget-widget__show-all:focus-visible {\n\ttext-decoration: underline;\n}\n\n.cn-nc-widget-widget__native {\n\tflex: 1;\n\toverflow: auto;\n\tpadding: 0 16px 16px;\n}\n\n/\n * The native `OCA.Dashboard` callback paints its own markup we don't control\n * — for first-party widgets that's almost always `@nextcloud/vue`'s\n * `NcDashboardWidget` / `NcDashboardWidgetItem` (`.dashboard-widget` wrapping\n * a bare `<ul>`/`<li>` list, each item a `.item-list__entry`).\n \n Only the LIST CONTAINER is retiled into a grid here — `.item-list__entry`'s\n * own internal layout is left untouched. An earlier version of this override\n * also forced `.item-list__entry` from row to column, but its icon-overlay\n * badge (`.item-icon`, see @nextcloud/vue's NcDashboardWidgetItem CSS) is\n * positioned with negative margins calibrated for the row layout, so\n * flipping to column made items visually overlap. Tiling the `<li>`s into a\n * grid while each entry keeps its normal icon+text row reads as a grid of\n * card tiles without touching that internal math.\n \n Scoped from `.cn-nc-widget-widget--horizontal` on the ROOT element, not\n * `.cn-nc-widget-widget__native`: the callback mounts via `.$mount(el)`,\n * which replaces `nativeContainer` in the live DOM outright, so any class\n * placed directly on it never survives to be selectable.\n \n The 250px column floor matches `.item-list__entry`'s own natural minimum\n * width (avatar + padding + its un-truncatable-below-this content) — a grid\n * track narrower than that squeezes the entry below its real minimum and it\n * overflows into the neighbouring cell. `min-width: 0` on the `<li>` alone\n * isn't enough to shrink it further: the item's own internal flex layout\n * still claims that much room regardless of the grid track size, so the\n * track itself must not go below it.\n */\n.cn-nc-widget-widget--horizontal :deep(.dashboard-widget > ul) {\n\tdisplay: grid;\n\tgrid-template-columns: repeat(auto-fill, minmax(250px, 1fr));\n\tgap: 8px;\n\tlist-style: none;\n\tmargin: 0;\n\tpadding: 0;\n}\n\n.cn-nc-widget-widget--horizontal :deep(.dashboard-widget > ul > li) {\n\twidth: auto;\n\tmin-width: 0;\n}\n\n.cn-nc-widget-widget--horizontal :deep(.item-list__entry) {\n\theight: 100%;\n\tmargin: 0;\n\tborder: 1px solid var(--color-border);\n\tborder-radius: var(--border-radius-large);\n}\n\n.cn-nc-widget-widget__body {\n\tflex: 1;\n\toverflow: auto;\n\tpadding: 0 16px 16px;\n}\n\n.cn-nc-widget-widget__body--vertical {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 8px;\n}\n\n.cn-nc-widget-widget__body--horizontal {\n\tdisplay: flex;\n\tflex-direction: row;\n\tflex-wrap: wrap;\n\tgap: 12px;\n}\n\n.cn-nc-widget-widget__state {\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tflex: 1;\n\tmin-height: 64px;\n\tcolor: var(--color-text-maxcontrast);\n\tfont-style: italic;\n}\n\n.cn-nc-widget-widget__item {\n\tdisplay: flex;\n\ttext-decoration: none;\n\tcolor: var(--color-main-text);\n\tborder-radius: var(--border-radius);\n\tpadding: 4px;\n}\n\n.cn-nc-widget-widget__item:hover {\n\tbackground-color: var(--color-background-hover);\n}\n\n.cn-nc-widget-widget__item--vertical {\n\tflex-direction: row;\n\talign-items: center;\n\tgap: 8px;\n}\n\n.cn-nc-widget-widget__item--horizontal {\n\tflex-direction: column;\n\talign-items: center;\n\twidth: 120px;\n\ttext-align: center;\n}\n\n.cn-nc-widget-widget__item-icon-wrap {\n\twidth: 32px;\n\theight: 32px;\n\tflex: 0 0 32px;\n\tposition: relative;\n}\n\n.cn-nc-widget-widget__item-icon {\n\twidth: 32px;\n\theight: 32px;\n\tobject-fit: cover;\n\tborder-radius: 50%;\n}\n\n.cn-nc-widget-widget__item-overlay {\n\tposition: absolute;\n\tright: -2px;\n\tbottom: -2px;\n\twidth: 14px;\n\theight: 14px;\n}\n\n.cn-nc-widget-widget__item-text {\n\tdisplay: flex;\n\tflex-direction: column;\n\tmin-width: 0;\n\tflex: 1;\n}\n\n.cn-nc-widget-widget__item-title {\n\tfont-weight: 600;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n}\n\n.cn-nc-widget-widget__item-subtitle {\n\tfont-size: 0.85em;\n\tcolor: var(--color-text-maxcontrast);\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n}\n</style>\n"],"names":["t","axios"],"mappings":"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"}
1	+ {"version":3,"file":"CnNcWidgetWidget.vue2.js","sources":["../../../../src/components/CnNcWidgetWidget/CnNcWidgetWidget.vue"],"sourcesContent":["<!--\n - SPDX-FileCopyrightText: 2026 Conduction B.V.\n - SPDX-License-Identifier: EUPL-1.2\n-->\n\n<template>\n\t<div class=\"cn-nc-widget-widget\" :class=\"{ 'cn-nc-widget-widget--horizontal': displayMode === 'horizontal' }\">\n\t\t<header v-if=\"showsHeader\" class=\"cn-nc-widget-widget__header\" data-testid=\"cn-nc-widget-header\">\n\t\t\t<img\n\t\t\t\tv-if=\"widgetIconUrl\"\n\t\t\t\tclass=\"cn-nc-widget-widget__header-icon\"\n\t\t\t\t:src=\"widgetIconUrl\"\n\t\t\t\talt=\"\">\n\t\t\t<span class=\"cn-nc-widget-widget__header-title\">{{ widgetTitle }}</span>\n\t\t</header>\n\n\t\t<!--\n\t\t\tNative callback container — always present but hidden until the\n\t\t\tOCA.Dashboard callback mounts into it. Keeping it mounted avoids a\n\t\t\tflicker when the native path wins after the API list has painted.\n\n\t\t\tThe `--horizontal` reskin class lives on the ROOT element, not here:\n\t\t\tnative widget callbacks mount via `new Vue(...).$mount(el)`, which\n\t\t\tREPLACES this element in the live DOM with the callback's own root\n\t\t\tnode — any class we put directly on it is discarded along with the\n\t\t\telement itself, so it can never appear in the rendered page.\n\t\t-->\n\t\t<div\n\t\t\tv-show=\"mode === 'native'\"\n\t\t\tref=\"nativeContainer\"\n\t\t\tclass=\"cn-nc-widget-widget__native\" />\n\n\t\t<div\n\t\t\tv-if=\"mode !== 'native'\"\n\t\t\tclass=\"cn-nc-widget-widget__body\"\n\t\t\t:class=\"bodyClass\">\n\t\t\t<div v-if=\"loading\" class=\"cn-nc-widget-widget__state\">\n\t\t\t\t{{ t('nextcloud-vue', 'Loading…') }}\n\t\t\t</div>\n\n\t\t\t<div v-else-if=\"!widgetId\" class=\"cn-nc-widget-widget__state\">\n\t\t\t\t{{ t('nextcloud-vue', 'No widget selected') }}\n\t\t\t</div>\n\n\t\t\t<div v-else-if=\"unsupported\" class=\"cn-nc-widget-widget__state\" data-testid=\"nc-widget-unsupported\">\n\t\t\t\t{{ t('nextcloud-vue', 'This widget can only be shown on the Nextcloud dashboard itself.') }}\n\t\t\t</div>\n\n\t\t\t<div v-else-if=\"items.length === 0\" class=\"cn-nc-widget-widget__state\">\n\t\t\t\t{{ t('nextcloud-vue', 'No items available') }}\n\t\t\t</div>\n\n\t\t\t<template v-else>\n\t\t\t\t<a\n\t\t\t\t\tv-for=\"(item, idx) in shownItems\"\n\t\t\t\t\t:key=\"item.sinceId \|\| item.id \|\| idx\"\n\t\t\t\t\tclass=\"cn-nc-widget-widget__item\"\n\t\t\t\t\t:class=\"itemClass\"\n\t\t\t\t\t:href=\"item.link \|\| '#'\"\n\t\t\t\t\t:title=\"item.title\">\n\t\t\t\t\t<span class=\"cn-nc-widget-widget__item-icon-wrap\">\n\t\t\t\t\t\t<img\n\t\t\t\t\t\t\tv-if=\"item.iconUrl\"\n\t\t\t\t\t\t\tclass=\"cn-nc-widget-widget__item-icon\"\n\t\t\t\t\t\t\t:src=\"item.iconUrl\"\n\t\t\t\t\t\t\talt=\"\">\n\t\t\t\t\t\t<img\n\t\t\t\t\t\t\tv-if=\"item.overlayIconUrl\"\n\t\t\t\t\t\t\tclass=\"cn-nc-widget-widget__item-overlay\"\n\t\t\t\t\t\t\t:src=\"item.overlayIconUrl\"\n\t\t\t\t\t\t\talt=\"\">\n\t\t\t\t\t</span>\n\t\t\t\t\t<span class=\"cn-nc-widget-widget__item-text\">\n\t\t\t\t\t\t<span class=\"cn-nc-widget-widget__item-title\">{{ item.title }}</span>\n\t\t\t\t\t\t<span v-if=\"item.subtitle\" class=\"cn-nc-widget-widget__item-subtitle\">{{ item.subtitle }}</span>\n\t\t\t\t\t</span>\n\t\t\t\t</a>\n\t\t\t\t<!-- With a `limit`, the rest is one link away (`showAllUrl`, else the widget's own page). -->\n\t\t\t\t<a\n\t\t\t\t\tv-if=\"showAllHref\"\n\t\t\t\t\tclass=\"cn-nc-widget-widget__show-all\"\n\t\t\t\t\tdata-testid=\"nc-widget-show-all\"\n\t\t\t\t\t:href=\"showAllHref\">\n\t\t\t\t\t{{ showAllLabel }}\n\t\t\t\t</a>\n\t\t\t</template>\n\t\t</div>\n\t</div>\n</template>\n\n<script>\nimport axios from '@nextcloud/axios'\nimport { translate as t } from '@nextcloud/l10n'\nimport { generateOcsUrl } from '@nextcloud/router'\n\nconst API_ITEM_LIMIT = 7\n\n/*\n Read the global `OCA.Dashboard` registry without assuming it exists.\n \n @return {object\|null} the `OCA.Dashboard` object, or `null` when absent.\n /\nfunction getDashboardGlobal() {\n\tif (typeof window === 'undefined') {\n\t\treturn null\n\t}\n\tconst oca = window.OCA\n\treturn oca && oca.Dashboard ? oca.Dashboard : null\n}\n\n/\n CnNcWidgetWidget — proxies any native Nextcloud Dashboard widget into a\n * dashboard grid cell.\n \n Two-mode rendering (decoupling seam — reads NC directly, no app bridge):\n * - native — when the widget bundle has registered a callback on the\n * global `OCA.Dashboard` (`getWidget(id)` / `widgets[id]`), the callback is\n * handed the render container and paints itself (native fast-path).\n * - api — otherwise the OCS Dashboard endpoint\n * `/apps/dashboard/api/v{1,2}/widget-items` is fetched directly via\n * `@nextcloud/axios` and a flat item list is rendered.\n \n The header title + icon come from the dashboard widget metadata\n * (`OCA.Dashboard` registry, falling back to the configured `widgetId`). When\n * no `widgetId` is configured the widget renders an empty state and never hits\n * the network.\n \n @spec openspec/changes/cn-widget-library/specs/cn-widget-library/spec.md\n /\nexport default {\n\tname: 'CnNcWidgetWidget',\n\n\tinject: {\n\t\t/* Whether the hosting card draws a title row (CnWidgetWrapper). /\n\t\tcnWidgetTitled: { default: null },\n\t},\n\n\tprops: {\n\t\t/\n\t\t Persisted widget content `{widgetId, displayMode, limit?, showAllUrl?, showAllLabel?, showHeader?}`.\n\t\t * `showHeader: false` drops the widget's own header (icon and title);\n\t\t * it is dropped too when the hosting card draws a title row.\n\t\t * `limit` is the most items shown (the list then comes from the items\n\t\t * API, so it fits its cell); `showAllUrl` / `showAllLabel` the link to\n\t\t * the rest (default the widget's own page and \"Show all\").\n\t\t \n\t\t @type {object}\n\t\t /\n\t\tcontent: {\n\t\t\ttype: Object,\n\t\t\tdefault: () => ({}),\n\t\t},\n\t},\n\n\tdata() {\n\t\treturn {\n\t\t\t/* @type {'pending'\|'native'\|'api'} the resolved mounting mode. /\n\t\t\tmode: 'pending',\n\t\t\t/\n\t\t\t Whether the items API has no entry for this widget at all.\n\t\t\t \n\t\t\t Not the same as an empty list. A widget whose provider implements\n\t\t\t * only `IWidget` (no `IAPIWidget`/`IAPIWidgetV2`) declares\n\t\t\t * `itemApiVersions: []` and is simply ABSENT from the widget-items\n\t\t\t * response, while a widget with nothing to show right now comes\n\t\t\t * back as its own key holding an empty list. The Tasks app's widget\n\t\t\t * is the first kind: with no native callback registered on the page\n\t\t\t * it can never render a single item here, and saying \"No items\n\t\t\t * available\" under it told the reader their task list was empty.\n\t\t\t \n\t\t\t @type {boolean}\n\t\t\t /\n\t\t\tunsupported: false,\n\t\t\tloading: false,\n\t\t\titems: [],\n\t\t}\n\t},\n\n\tcomputed: {\n\t\t/\n\t\t The configured native widget id.\n\t\t \n\t\t @return {string} the widget id (empty when unset).\n\t\t /\n\t\twidgetId() {\n\t\t\treturn typeof (this.content && this.content.widgetId) === 'string' ? this.content.widgetId : ''\n\t\t},\n\n\t\t/\n\t\t The item list orientation.\n\t\t \n\t\t @return {string} `horizontal` or `vertical`.\n\t\t /\n\t\tdisplayMode() {\n\t\t\treturn (this.content && this.content.displayMode) === 'horizontal' ? 'horizontal' : 'vertical'\n\t\t},\n\n\t\t/\n\t\t The native widget metadata from the `OCA.Dashboard` global.\n\t\t \n\t\t @return {object\|null} the widget metadata, or `null`.\n\t\t /\n\t\twidgetMeta() {\n\t\t\tconst dashboard = getDashboardGlobal()\n\t\t\tif (!dashboard \|\| !this.widgetId) {\n\t\t\t\treturn null\n\t\t\t}\n\t\t\tif (typeof dashboard.getWidget === 'function') {\n\t\t\t\treturn dashboard.getWidget(this.widgetId) \|\| null\n\t\t\t}\n\t\t\tif (dashboard.widgets && typeof dashboard.widgets === 'object') {\n\t\t\t\treturn dashboard.widgets[this.widgetId] \|\| null\n\t\t\t}\n\t\t\treturn null\n\t\t},\n\n\t\t/\n\t\t Whether the widget draws its own header: not with\n\t\t * `content.showHeader: false`, nor inside a card that draws a title.\n\t\t \n\t\t @spec openspec/changes/nc-widget-header/specs/nc-widget-header/spec.md#requirement-a-nextcloud-widget-draws-no-second-heading\n\t\t * @return {boolean}\n\t\t /\n\t\tshowsHeader() {\n\t\t\tif (this.content && this.content.showHeader === false) {\n\t\t\t\treturn false\n\t\t\t}\n\t\t\treturn !(typeof this.cnWidgetTitled === 'function' && this.cnWidgetTitled())\n\t\t},\n\n\t\t/\n\t\t The header title.\n\t\t \n\t\t @return {string} the title.\n\t\t /\n\t\twidgetTitle() {\n\t\t\treturn (this.widgetMeta && this.widgetMeta.title) \|\| this.widgetId \|\| t('nextcloud-vue', 'Widget')\n\t\t},\n\n\t\t/\n\t\t The header icon URL.\n\t\t \n\t\t @return {string} the icon URL (empty when none).\n\t\t /\n\t\twidgetIconUrl() {\n\t\t\treturn (this.widgetMeta && this.widgetMeta.iconUrl) \|\| ''\n\t\t},\n\n\t\t/\n\t\t The most items the list shows (`content.limit`), or 0 for no limit.\n\t\t * A limit lets the widget fit a dashboard cell instead of scrolling\n\t\t * inside it.\n\t\t \n\t\t @spec openspec/changes/screens-nc-widget-limit/specs/nc-widget/spec.md#requirement-a-nextcloud-widget-shows-at-most-its-limit\n\t\t * @return {number} the limit.\n\t\t /\n\t\titemLimit() {\n\t\t\tconst limit = Number(this.content && this.content.limit)\n\t\t\treturn Number.isInteger(limit) && limit > 0 ? limit : 0\n\t\t},\n\n\t\t/\n\t\t The items drawn: at most `itemLimit`.\n\t\t \n\t\t @return {object[]} the items.\n\t\t /\n\t\tshownItems() {\n\t\t\treturn this.itemLimit > 0 ? this.items.slice(0, this.itemLimit) : this.items\n\t\t},\n\n\t\t/\n\t\t Where \"Show all\" goes: `content.showAllUrl`, else the page the widget\n\t\t * names itself (its `url`). Only with a limit; '' for no link.\n\t\t \n\t\t @spec openspec/changes/screens-nc-widget-limit/specs/nc-widget/spec.md#requirement-a-nextcloud-widget-shows-at-most-its-limit\n\t\t * @return {string} the URL.\n\t\t /\n\t\tshowAllHref() {\n\t\t\tif (this.itemLimit === 0) {\n\t\t\t\treturn ''\n\t\t\t}\n\t\t\tconst own = this.content && typeof this.content.showAllUrl === 'string' ? this.content.showAllUrl : ''\n\t\t\treturn own \|\| (this.widgetMeta && typeof this.widgetMeta.url === 'string' ? this.widgetMeta.url : '')\n\t\t},\n\n\t\t/\n\t\t The \"Show all\" text (`content.showAllLabel`, else the library's).\n\t\t \n\t\t @return {string} the label.\n\t\t /\n\t\tshowAllLabel() {\n\t\t\tconst label = this.content && this.content.showAllLabel\n\t\t\treturn typeof label === 'string' && label !== '' ? label : t('nextcloud-vue', 'Show all')\n\t\t},\n\n\t\t/\n\t\t The body orientation CSS modifier class.\n\t\t \n\t\t @return {string} the body class.\n\t\t /\n\t\tbodyClass() {\n\t\t\treturn `cn-nc-widget-widget__body--${this.displayMode}`\n\t\t},\n\n\t\t/\n\t\t The item orientation CSS modifier class.\n\t\t \n\t\t @return {string} the item class.\n\t\t /\n\t\titemClass() {\n\t\t\treturn `cn-nc-widget-widget__item--${this.displayMode}`\n\t\t},\n\t},\n\n\tmounted() {\n\t\tthis.tryMount()\n\t},\n\n\tmethods: {\n\t\tt,\n\n\t\t/\n\t\t Resolve the mounting mode. Prefers the native `OCA.Dashboard`\n\t\t * callback fast-path; otherwise falls back to the OCS item list.\n\t\t \n\t\t @return {void}\n\t\t /\n\t\ttryMount() {\n\t\t\tif (!this.widgetId) {\n\t\t\t\tthis.mode = 'api'\n\t\t\t\tthis.items = []\n\t\t\t\treturn\n\t\t\t}\n\t\t\t// The native callback paints its own opaque markup, so `displayMode`\n\t\t\t// (bodyClass/itemClass below) has no effect on it — only the API\n\t\t\t// item list honours the vertical/horizontal setting. Horizontal mode\n\t\t\t// must therefore skip the native fast-path, or the \"Horizontal\n\t\t\t// (cards)\" option would silently do nothing for the (common) case\n\t\t\t// where the widget has a registered native callback.\n\t\t\t// A `limit` also takes the API list first: the native callback paints\n\t\t\t// as many items as it likes. Its fallback to native stays.\n\t\t\tif (this.displayMode !== 'horizontal' && this.itemLimit === 0) {\n\t\t\t\tconst callback = this.resolveNativeCallback()\n\t\t\t\tif (typeof callback === 'function') {\n\t\t\t\t\tthis.mountNative(callback)\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t}\n\t\t\tthis.mode = 'api'\n\t\t\tthis.loadApiItems()\n\t\t},\n\n\t\t/\n\t\t Look up a native render callback on the `OCA.Dashboard` global.\n\t\t \n\t\t @return {((el: HTMLElement, ctx: {widget: object}) => unknown)\|null} the callback, or `null` when none is registered.\n\t\t /\n\t\tresolveNativeCallback() {\n\t\t\tconst dashboard = getDashboardGlobal()\n\t\t\tif (!dashboard) {\n\t\t\t\treturn null\n\t\t\t}\n\t\t\tif (this.widgetMeta && typeof this.widgetMeta.callback === 'function') {\n\t\t\t\treturn this.widgetMeta.callback\n\t\t\t}\n\t\t\tif (dashboard.callbacks && typeof dashboard.callbacks[this.widgetId] === 'function') {\n\t\t\t\treturn dashboard.callbacks[this.widgetId]\n\t\t\t}\n\t\t\treturn null\n\t\t},\n\n\t\t/\n\t\t Mount the widget natively by invoking its registered callback with\n\t\t * our render container.\n\t\t \n\t\t @param {(el: HTMLElement, ctx: {widget: object}) => unknown} callback the native render callback.\n\t\t * @return {void}\n\t\t /\n\t\tmountNative(callback) {\n\t\t\tthis.mode = 'native'\n\t\t\tthis.$nextTick(() => {\n\t\t\t\tconst container = this.$refs.nativeContainer\n\t\t\t\tif (!container) {\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t\t// Native callback failed — fall back to the API list.\n\t\t\t\tconst fallback = () => {\n\t\t\t\t\tthis.mode = 'api'\n\t\t\t\t\tthis.loadApiItems()\n\t\t\t\t}\n\t\t\t\ttry {\n\t\t\t\t\t// NC dashboard widgets are registered as\n\t\t\t\t\t// `register(id, (el, { widget }) => …)` — the second argument\n\t\t\t\t\t// MUST be the `{ widget }` envelope, not the bare metadata, or\n\t\t\t\t\t// the widget destructures `widget` as undefined and throws on\n\t\t\t\t\t// first use (e.g. `widget.title`).\n\t\t\t\t\tconst result = callback(container, { widget: this.widgetMeta \|\| {} })\n\t\t\t\t\t// Most widget callbacks are async; a synchronous try/catch\n\t\t\t\t\t// can't see a rejected promise, so wire the fallback to it too.\n\t\t\t\t\tif (result && typeof result.then === 'function') {\n\t\t\t\t\t\tresult.catch(fallback)\n\t\t\t\t\t}\n\t\t\t\t} catch {\n\t\t\t\t\tfallback()\n\t\t\t\t}\n\t\t\t})\n\t\t},\n\n\t\t/\n\t\t Fetch the API fallback list directly from the OCS Dashboard\n\t\t * endpoint. Malformed or failed responses collapse to an empty list\n\t\t * (the empty state) instead of throwing.\n\t\t \n\t\t @return {Promise<void>}\n\t\t /\n\t\tasync loadApiItems() {\n\t\t\tthis.loading = true\n\t\t\ttry {\n\t\t\t\t// The v2 widget-items API only returns an entry for widgets\n\t\t\t\t// whose server-side provider implements `IAPIWidgetV2` — plenty\n\t\t\t\t// of native dashboard widgets are JS-callback-only (`IWidget`)\n\t\t\t\t// and never appear in this response at all, which looks\n\t\t\t\t// identical to \"0 items\" from here. extractItems() tolerates\n\t\t\t\t// both the flat-array (older providers) and `{items}` (v2) shapes.\n\t\t\t\tconst url = generateOcsUrl('/apps/dashboard/api/v2/widget-items')\n\t\t\t\tconst response = await axios.get(url, {\n\t\t\t\t\tparams: { widgets: [this.widgetId], limit: this.itemLimit > 0 ? this.itemLimit : API_ITEM_LIMIT },\n\t\t\t\t})\n\t\t\t\tconst data = response && response.data && response.data.ocs ? response.data.ocs.data : null\n\t\t\t\tconst widgetData = data ? data[this.widgetId] : null\n\t\t\t\tthis.items = this.extractItems(widgetData)\n\t\t\t\t// Only a SUCCESSFUL response can say the widget is absent. A\n\t\t\t\t// failed request says nothing about the widget, so it keeps\n\t\t\t\t// the ordinary empty state rather than a claim about the app.\n\t\t\t\tthis.unsupported = data !== null && (widgetData === null \|\| widgetData === undefined)\n\t\t\t} catch {\n\t\t\t\tthis.items = []\n\t\t\t\tthis.unsupported = false\n\t\t\t} finally {\n\t\t\t\tthis.loading = false\n\t\t\t}\n\n\t\t\t// Horizontal mode deliberately skips the native fast-path (see\n\t\t\t// tryMount()) to get the styled card layout. But when the API has\n\t\t\t// no entry for this widget at all — no `IAPIWidgetV2` support, not\n\t\t\t// \"no items right now\" — that would render a false empty state for\n\t\t\t// a widget that actually has content. Fall back to native\n\t\t\t// rendering rather than lying about there being nothing to show.\n\t\t\tif (this.items.length === 0) {\n\t\t\t\tconst callback = this.resolveNativeCallback()\n\t\t\t\tif (typeof callback === 'function') {\n\t\t\t\t\tthis.mountNative(callback)\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\t/\n\t\t Normalise a per-widget OCS payload to an items array, tolerating both\n\t\t * the flat array and the `{items}` envelope shapes.\n\t\t \n\t\t @param {unknown} widgetData the per-widget payload.\n\t\t * @return {object[]} the items array (possibly empty).\n\t\t /\n\t\textractItems(widgetData) {\n\t\t\tif (!widgetData) {\n\t\t\t\treturn []\n\t\t\t}\n\t\t\tif (Array.isArray(widgetData)) {\n\t\t\t\treturn widgetData\n\t\t\t}\n\t\t\tif (Array.isArray(widgetData.items)) {\n\t\t\t\treturn widgetData.items\n\t\t\t}\n\t\t\tif (widgetData.items && typeof widgetData.items === 'object') {\n\t\t\t\treturn Object.values(widgetData.items)\n\t\t\t}\n\t\t\treturn []\n\t\t},\n\t},\n}\n</script>\n\n<style scoped>\n.cn-nc-widget-widget {\n\tdisplay: flex;\n\tflex-direction: column;\n\twidth: 100%;\n\theight: 100%;\n\toverflow: hidden;\n}\n\n/\n * Header + content match the native Nextcloud Dashboard panel (apps/dashboard)\n * exactly — this component's whole job is rendering NC dashboard widgets, so it\n * should look native by default: 16px header, 32px leading icon with a 16px\n * gap, a 20px/700 title, and the native panel content inset (16px sides +\n * bottom, flush to the header on top). Same design tokens as core; overridable\n * via the host's CnWidgetWrapper styleConfig / nldesign.\n /\n.cn-nc-widget-widget__header {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 16px;\n\tpadding: 16px;\n\tfont-weight: 700;\n}\n\n.cn-nc-widget-widget__header-icon {\n\twidth: 32px;\n\theight: 32px;\n\tflex: 0 0 auto;\n}\n\n.cn-nc-widget-widget__header-title {\n\tflex: 1;\n\tfont-size: 20px;\n\tfont-weight: 700;\n\tline-height: 24px;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n}\n\n.cn-nc-widget-widget__show-all {\n\talign-self: flex-start;\n\tpadding: 8px 0 0;\n\tcolor: var(--color-primary-element);\n\tfont-weight: 600;\n\ttext-decoration: none;\n}\n\n.cn-nc-widget-widget__show-all:hover,\n.cn-nc-widget-widget__show-all:focus-visible {\n\ttext-decoration: underline;\n}\n\n.cn-nc-widget-widget__native {\n\tflex: 1;\n\toverflow: auto;\n\tpadding: 0 16px 16px;\n}\n\n/\n * The native `OCA.Dashboard` callback paints its own markup we don't control\n * — for first-party widgets that's almost always `@nextcloud/vue`'s\n * `NcDashboardWidget` / `NcDashboardWidgetItem` (`.dashboard-widget` wrapping\n * a bare `<ul>`/`<li>` list, each item a `.item-list__entry`).\n \n Only the LIST CONTAINER is retiled into a grid here — `.item-list__entry`'s\n * own internal layout is left untouched. An earlier version of this override\n * also forced `.item-list__entry` from row to column, but its icon-overlay\n * badge (`.item-icon`, see @nextcloud/vue's NcDashboardWidgetItem CSS) is\n * positioned with negative margins calibrated for the row layout, so\n * flipping to column made items visually overlap. Tiling the `<li>`s into a\n * grid while each entry keeps its normal icon+text row reads as a grid of\n * card tiles without touching that internal math.\n \n Scoped from `.cn-nc-widget-widget--horizontal` on the ROOT element, not\n * `.cn-nc-widget-widget__native`: the callback mounts via `.$mount(el)`,\n * which replaces `nativeContainer` in the live DOM outright, so any class\n * placed directly on it never survives to be selectable.\n \n The 250px column floor matches `.item-list__entry`'s own natural minimum\n * width (avatar + padding + its un-truncatable-below-this content) — a grid\n * track narrower than that squeezes the entry below its real minimum and it\n * overflows into the neighbouring cell. `min-width: 0` on the `<li>` alone\n * isn't enough to shrink it further: the item's own internal flex layout\n * still claims that much room regardless of the grid track size, so the\n * track itself must not go below it.\n */\n.cn-nc-widget-widget--horizontal :deep(.dashboard-widget > ul) {\n\tdisplay: grid;\n\tgrid-template-columns: repeat(auto-fill, minmax(250px, 1fr));\n\tgap: 8px;\n\tlist-style: none;\n\tmargin: 0;\n\tpadding: 0;\n}\n\n.cn-nc-widget-widget--horizontal :deep(.dashboard-widget > ul > li) {\n\twidth: auto;\n\tmin-width: 0;\n}\n\n.cn-nc-widget-widget--horizontal :deep(.item-list__entry) {\n\theight: 100%;\n\tmargin: 0;\n\tborder: 1px solid var(--color-border);\n\tborder-radius: var(--border-radius-large);\n}\n\n.cn-nc-widget-widget__body {\n\tflex: 1;\n\toverflow: auto;\n\tpadding: 0 16px 16px;\n}\n\n.cn-nc-widget-widget__body--vertical {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 8px;\n}\n\n.cn-nc-widget-widget__body--horizontal {\n\tdisplay: flex;\n\tflex-direction: row;\n\tflex-wrap: wrap;\n\tgap: 12px;\n}\n\n.cn-nc-widget-widget__state {\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tflex: 1;\n\tmin-height: 64px;\n\tcolor: var(--color-text-maxcontrast);\n\tfont-style: italic;\n}\n\n.cn-nc-widget-widget__item {\n\tdisplay: flex;\n\ttext-decoration: none;\n\tcolor: var(--color-main-text);\n\tborder-radius: var(--border-radius);\n\tpadding: 4px;\n}\n\n.cn-nc-widget-widget__item:hover {\n\tbackground-color: var(--color-background-hover);\n}\n\n.cn-nc-widget-widget__item--vertical {\n\tflex-direction: row;\n\talign-items: center;\n\tgap: 8px;\n}\n\n.cn-nc-widget-widget__item--horizontal {\n\tflex-direction: column;\n\talign-items: center;\n\twidth: 120px;\n\ttext-align: center;\n}\n\n.cn-nc-widget-widget__item-icon-wrap {\n\twidth: 32px;\n\theight: 32px;\n\tflex: 0 0 32px;\n\tposition: relative;\n}\n\n.cn-nc-widget-widget__item-icon {\n\twidth: 32px;\n\theight: 32px;\n\tobject-fit: cover;\n\tborder-radius: 50%;\n}\n\n.cn-nc-widget-widget__item-overlay {\n\tposition: absolute;\n\tright: -2px;\n\tbottom: -2px;\n\twidth: 14px;\n\theight: 14px;\n}\n\n.cn-nc-widget-widget__item-text {\n\tdisplay: flex;\n\tflex-direction: column;\n\tmin-width: 0;\n\tflex: 1;\n}\n\n.cn-nc-widget-widget__item-title {\n\tfont-weight: 600;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n}\n\n.cn-nc-widget-widget__item-subtitle {\n\tfont-size: 0.85em;\n\tcolor: var(--color-text-maxcontrast);\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n}\n</style>\n"],"names":["t","axios"],"mappings":"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"}

package/dist/esm/components/CnNcWidgetWidget/CnNcWidgetWidget.vue3.js CHANGED Viewed

@@ -1,6 +1,10 @@
-import { openBlock, createElementBlock, normalizeClass, createElementVNode, createCommentVNode, toDisplayString, withDirectives, vShow, Fragment, renderList } from 'vue';
+import { openBlock, createElementBlock, normalizeClass, createCommentVNode, createElementVNode, toDisplayString, withDirectives, vShow, Fragment, renderList } from 'vue';
-const _hoisted_1 = { class: "cn-nc-widget-widget__header" };
+const _hoisted_1 = {
+  key: 0,
+  class: "cn-nc-widget-widget__header",
+  "data-testid": "cn-nc-widget-header"
+};
 const _hoisted_2 = ["src"];
 const _hoisted_3 = { class: "cn-nc-widget-widget__header-title" };
 const _hoisted_4 = {
@@ -40,23 +44,25 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
   return (openBlock(), createElementBlock("div", {
     class: normalizeClass(["cn-nc-widget-widget", { 'cn-nc-widget-widget--horizontal': $options.displayMode === 'horizontal' }])
   }, [
-    createElementVNode("header", _hoisted_1, [
-      ($options.widgetIconUrl)
-        ? (openBlock(), createElementBlock("img", {
-            key: 0,
-            class: "cn-nc-widget-widget__header-icon",
-            src: $options.widgetIconUrl,
-            alt: ""
-          }, null, 8 /* PROPS */, _hoisted_2))
-        : createCommentVNode("v-if", true),
-      createElementVNode("span", _hoisted_3, toDisplayString($options.widgetTitle), 1 /* TEXT */)
-    ]),
+    ($options.showsHeader)
+      ? (openBlock(), createElementBlock("header", _hoisted_1, [
+          ($options.widgetIconUrl)
+            ? (openBlock(), createElementBlock("img", {
+                key: 0,
+                class: "cn-nc-widget-widget__header-icon",
+                src: $options.widgetIconUrl,
+                alt: ""
+              }, null, 8 /* PROPS */, _hoisted_2))
+            : createCommentVNode("v-if", true),
+          createElementVNode("span", _hoisted_3, toDisplayString($options.widgetTitle), 1 /* TEXT */)
+        ]))
+      : createCommentVNode("v-if", true),
     withDirectives(createElementVNode("div", _hoisted_4, null, 512 /* NEED_PATCH */), [
       [vShow, $data.mode === 'native']
     ]),
     ($data.mode !== 'native')
       ? (openBlock(), createElementBlock("div", {
-          key: 0,
+          key: 1,
           class: normalizeClass(["cn-nc-widget-widget__body", $options.bodyClass])
         }, [
           ($data.loading)

package/dist/esm/components/CnNcWidgetWidget/CnNcWidgetWidget.vue3.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CnNcWidgetWidget.vue3.js","sources":["../../../../src/components/CnNcWidgetWidget/CnNcWidgetWidget.vue?vue&type=template&id=04be70f3&lang.js"],"sourcesContent":["<!--\n - SPDX-FileCopyrightText: 2026 Conduction B.V.\n - SPDX-License-Identifier: EUPL-1.2\n-->\n\n<template>\n\t<div class=\"cn-nc-widget-widget\" :class=\"{ 'cn-nc-widget-widget--horizontal': displayMode === 'horizontal' }\">\n\t\t<header class=\"cn-nc-widget-widget__header\">\n\t\t\t<img\n\t\t\t\tv-if=\"widgetIconUrl\"\n\t\t\t\tclass=\"cn-nc-widget-widget__header-icon\"\n\t\t\t\t:src=\"widgetIconUrl\"\n\t\t\t\talt=\"\">\n\t\t\t<span class=\"cn-nc-widget-widget__header-title\">{{ widgetTitle }}</span>\n\t\t</header>\n\n\t\t<!--\n\t\t\tNative callback container — always present but hidden until the\n\t\t\tOCA.Dashboard callback mounts into it. Keeping it mounted avoids a\n\t\t\tflicker when the native path wins after the API list has painted.\n\n\t\t\tThe `--horizontal` reskin class lives on the ROOT element, not here:\n\t\t\tnative widget callbacks mount via `new Vue(...).$mount(el)`, which\n\t\t\tREPLACES this element in the live DOM with the callback's own root\n\t\t\tnode — any class we put directly on it is discarded along with the\n\t\t\telement itself, so it can never appear in the rendered page.\n\t\t-->\n\t\t<div\n\t\t\tv-show=\"mode === 'native'\"\n\t\t\tref=\"nativeContainer\"\n\t\t\tclass=\"cn-nc-widget-widget__native\" />\n\n\t\t<div\n\t\t\tv-if=\"mode !== 'native'\"\n\t\t\tclass=\"cn-nc-widget-widget__body\"\n\t\t\t:class=\"bodyClass\">\n\t\t\t<div v-if=\"loading\" class=\"cn-nc-widget-widget__state\">\n\t\t\t\t{{ t('nextcloud-vue', 'Loading…') }}\n\t\t\t</div>\n\n\t\t\t<div v-else-if=\"!widgetId\" class=\"cn-nc-widget-widget__state\">\n\t\t\t\t{{ t('nextcloud-vue', 'No widget selected') }}\n\t\t\t</div>\n\n\t\t\t<div v-else-if=\"unsupported\" class=\"cn-nc-widget-widget__state\" data-testid=\"nc-widget-unsupported\">\n\t\t\t\t{{ t('nextcloud-vue', 'This widget can only be shown on the Nextcloud dashboard itself.') }}\n\t\t\t</div>\n\n\t\t\t<div v-else-if=\"items.length === 0\" class=\"cn-nc-widget-widget__state\">\n\t\t\t\t{{ t('nextcloud-vue', 'No items available') }}\n\t\t\t</div>\n\n\t\t\t<template v-else>\n\t\t\t\t<a\n\t\t\t\t\tv-for=\"(item, idx) in shownItems\"\n\t\t\t\t\t:key=\"item.sinceId \|\| item.id \|\| idx\"\n\t\t\t\t\tclass=\"cn-nc-widget-widget__item\"\n\t\t\t\t\t:class=\"itemClass\"\n\t\t\t\t\t:href=\"item.link \|\| '#'\"\n\t\t\t\t\t:title=\"item.title\">\n\t\t\t\t\t<span class=\"cn-nc-widget-widget__item-icon-wrap\">\n\t\t\t\t\t\t<img\n\t\t\t\t\t\t\tv-if=\"item.iconUrl\"\n\t\t\t\t\t\t\tclass=\"cn-nc-widget-widget__item-icon\"\n\t\t\t\t\t\t\t:src=\"item.iconUrl\"\n\t\t\t\t\t\t\talt=\"\">\n\t\t\t\t\t\t<img\n\t\t\t\t\t\t\tv-if=\"item.overlayIconUrl\"\n\t\t\t\t\t\t\tclass=\"cn-nc-widget-widget__item-overlay\"\n\t\t\t\t\t\t\t:src=\"item.overlayIconUrl\"\n\t\t\t\t\t\t\talt=\"\">\n\t\t\t\t\t</span>\n\t\t\t\t\t<span class=\"cn-nc-widget-widget__item-text\">\n\t\t\t\t\t\t<span class=\"cn-nc-widget-widget__item-title\">{{ item.title }}</span>\n\t\t\t\t\t\t<span v-if=\"item.subtitle\" class=\"cn-nc-widget-widget__item-subtitle\">{{ item.subtitle }}</span>\n\t\t\t\t\t</span>\n\t\t\t\t</a>\n\t\t\t\t<!-- With a `limit`, the rest is one link away (`showAllUrl`, else the widget's own page). -->\n\t\t\t\t<a\n\t\t\t\t\tv-if=\"showAllHref\"\n\t\t\t\t\tclass=\"cn-nc-widget-widget__show-all\"\n\t\t\t\t\tdata-testid=\"nc-widget-show-all\"\n\t\t\t\t\t:href=\"showAllHref\">\n\t\t\t\t\t{{ showAllLabel }}\n\t\t\t\t</a>\n\t\t\t</template>\n\t\t</div>\n\t</div>\n</template>\n\n<script>\nimport axios from '@nextcloud/axios'\nimport { translate as t } from '@nextcloud/l10n'\nimport { generateOcsUrl } from '@nextcloud/router'\n\nconst API_ITEM_LIMIT = 7\n\n/*\n Read the global `OCA.Dashboard` registry without assuming it exists.\n \n @return {object\|null} the `OCA.Dashboard` object, or `null` when absent.\n /\nfunction getDashboardGlobal() {\n\tif (typeof window === 'undefined') {\n\t\treturn null\n\t}\n\tconst oca = window.OCA\n\treturn oca && oca.Dashboard ? oca.Dashboard : null\n}\n\n/\n CnNcWidgetWidget — proxies any native Nextcloud Dashboard widget into a\n * dashboard grid cell.\n \n Two-mode rendering (decoupling seam — reads NC directly, no app bridge):\n * - native — when the widget bundle has registered a callback on the\n * global `OCA.Dashboard` (`getWidget(id)` / `widgets[id]`), the callback is\n * handed the render container and paints itself (native fast-path).\n * - api — otherwise the OCS Dashboard endpoint\n * `/apps/dashboard/api/v{1,2}/widget-items` is fetched directly via\n * `@nextcloud/axios` and a flat item list is rendered.\n \n The header title + icon come from the dashboard widget metadata\n * (`OCA.Dashboard` registry, falling back to the configured `widgetId`). When\n * no `widgetId` is configured the widget renders an empty state and never hits\n * the network.\n \n @spec openspec/changes/cn-widget-library/specs/cn-widget-library/spec.md\n /\nexport default {\n\tname: 'CnNcWidgetWidget',\n\n\tprops: {\n\t\t/\n\t\t Persisted widget content `{widgetId, displayMode, limit?, showAllUrl?, showAllLabel?}`.\n\t\t * `limit` is the most items shown (the list then comes from the items\n\t\t * API, so it fits its cell); `showAllUrl` / `showAllLabel` the link to\n\t\t * the rest (default the widget's own page and \"Show all\").\n\t\t \n\t\t @type {object}\n\t\t /\n\t\tcontent: {\n\t\t\ttype: Object,\n\t\t\tdefault: () => ({}),\n\t\t},\n\t},\n\n\tdata() {\n\t\treturn {\n\t\t\t/* @type {'pending'\|'native'\|'api'} the resolved mounting mode. /\n\t\t\tmode: 'pending',\n\t\t\t/\n\t\t\t Whether the items API has no entry for this widget at all.\n\t\t\t \n\t\t\t Not the same as an empty list. A widget whose provider implements\n\t\t\t * only `IWidget` (no `IAPIWidget`/`IAPIWidgetV2`) declares\n\t\t\t * `itemApiVersions: []` and is simply ABSENT from the widget-items\n\t\t\t * response, while a widget with nothing to show right now comes\n\t\t\t * back as its own key holding an empty list. The Tasks app's widget\n\t\t\t * is the first kind: with no native callback registered on the page\n\t\t\t * it can never render a single item here, and saying \"No items\n\t\t\t * available\" under it told the reader their task list was empty.\n\t\t\t \n\t\t\t @type {boolean}\n\t\t\t /\n\t\t\tunsupported: false,\n\t\t\tloading: false,\n\t\t\titems: [],\n\t\t}\n\t},\n\n\tcomputed: {\n\t\t/\n\t\t The configured native widget id.\n\t\t \n\t\t @return {string} the widget id (empty when unset).\n\t\t /\n\t\twidgetId() {\n\t\t\treturn typeof (this.content && this.content.widgetId) === 'string' ? this.content.widgetId : ''\n\t\t},\n\n\t\t/\n\t\t The item list orientation.\n\t\t \n\t\t @return {string} `horizontal` or `vertical`.\n\t\t /\n\t\tdisplayMode() {\n\t\t\treturn (this.content && this.content.displayMode) === 'horizontal' ? 'horizontal' : 'vertical'\n\t\t},\n\n\t\t/\n\t\t The native widget metadata from the `OCA.Dashboard` global.\n\t\t \n\t\t @return {object\|null} the widget metadata, or `null`.\n\t\t /\n\t\twidgetMeta() {\n\t\t\tconst dashboard = getDashboardGlobal()\n\t\t\tif (!dashboard \|\| !this.widgetId) {\n\t\t\t\treturn null\n\t\t\t}\n\t\t\tif (typeof dashboard.getWidget === 'function') {\n\t\t\t\treturn dashboard.getWidget(this.widgetId) \|\| null\n\t\t\t}\n\t\t\tif (dashboard.widgets && typeof dashboard.widgets === 'object') {\n\t\t\t\treturn dashboard.widgets[this.widgetId] \|\| null\n\t\t\t}\n\t\t\treturn null\n\t\t},\n\n\t\t/\n\t\t The header title.\n\t\t \n\t\t @return {string} the title.\n\t\t /\n\t\twidgetTitle() {\n\t\t\treturn (this.widgetMeta && this.widgetMeta.title) \|\| this.widgetId \|\| t('nextcloud-vue', 'Widget')\n\t\t},\n\n\t\t/\n\t\t The header icon URL.\n\t\t \n\t\t @return {string} the icon URL (empty when none).\n\t\t /\n\t\twidgetIconUrl() {\n\t\t\treturn (this.widgetMeta && this.widgetMeta.iconUrl) \|\| ''\n\t\t},\n\n\t\t/\n\t\t The most items the list shows (`content.limit`), or 0 for no limit.\n\t\t * A limit lets the widget fit a dashboard cell instead of scrolling\n\t\t * inside it.\n\t\t \n\t\t @spec openspec/changes/screens-nc-widget-limit/specs/nc-widget/spec.md#requirement-a-nextcloud-widget-shows-at-most-its-limit\n\t\t * @return {number} the limit.\n\t\t /\n\t\titemLimit() {\n\t\t\tconst limit = Number(this.content && this.content.limit)\n\t\t\treturn Number.isInteger(limit) && limit > 0 ? limit : 0\n\t\t},\n\n\t\t/\n\t\t The items drawn: at most `itemLimit`.\n\t\t \n\t\t @return {object[]} the items.\n\t\t /\n\t\tshownItems() {\n\t\t\treturn this.itemLimit > 0 ? this.items.slice(0, this.itemLimit) : this.items\n\t\t},\n\n\t\t/\n\t\t Where \"Show all\" goes: `content.showAllUrl`, else the page the widget\n\t\t * names itself (its `url`). Only with a limit; '' for no link.\n\t\t \n\t\t @spec openspec/changes/screens-nc-widget-limit/specs/nc-widget/spec.md#requirement-a-nextcloud-widget-shows-at-most-its-limit\n\t\t * @return {string} the URL.\n\t\t /\n\t\tshowAllHref() {\n\t\t\tif (this.itemLimit === 0) {\n\t\t\t\treturn ''\n\t\t\t}\n\t\t\tconst own = this.content && typeof this.content.showAllUrl === 'string' ? this.content.showAllUrl : ''\n\t\t\treturn own \|\| (this.widgetMeta && typeof this.widgetMeta.url === 'string' ? this.widgetMeta.url : '')\n\t\t},\n\n\t\t/\n\t\t The \"Show all\" text (`content.showAllLabel`, else the library's).\n\t\t \n\t\t @return {string} the label.\n\t\t /\n\t\tshowAllLabel() {\n\t\t\tconst label = this.content && this.content.showAllLabel\n\t\t\treturn typeof label === 'string' && label !== '' ? label : t('nextcloud-vue', 'Show all')\n\t\t},\n\n\t\t/\n\t\t The body orientation CSS modifier class.\n\t\t \n\t\t @return {string} the body class.\n\t\t /\n\t\tbodyClass() {\n\t\t\treturn `cn-nc-widget-widget__body--${this.displayMode}`\n\t\t},\n\n\t\t/\n\t\t The item orientation CSS modifier class.\n\t\t \n\t\t @return {string} the item class.\n\t\t /\n\t\titemClass() {\n\t\t\treturn `cn-nc-widget-widget__item--${this.displayMode}`\n\t\t},\n\t},\n\n\tmounted() {\n\t\tthis.tryMount()\n\t},\n\n\tmethods: {\n\t\tt,\n\n\t\t/\n\t\t Resolve the mounting mode. Prefers the native `OCA.Dashboard`\n\t\t * callback fast-path; otherwise falls back to the OCS item list.\n\t\t \n\t\t @return {void}\n\t\t /\n\t\ttryMount() {\n\t\t\tif (!this.widgetId) {\n\t\t\t\tthis.mode = 'api'\n\t\t\t\tthis.items = []\n\t\t\t\treturn\n\t\t\t}\n\t\t\t// The native callback paints its own opaque markup, so `displayMode`\n\t\t\t// (bodyClass/itemClass below) has no effect on it — only the API\n\t\t\t// item list honours the vertical/horizontal setting. Horizontal mode\n\t\t\t// must therefore skip the native fast-path, or the \"Horizontal\n\t\t\t// (cards)\" option would silently do nothing for the (common) case\n\t\t\t// where the widget has a registered native callback.\n\t\t\t// A `limit` also takes the API list first: the native callback paints\n\t\t\t// as many items as it likes. Its fallback to native stays.\n\t\t\tif (this.displayMode !== 'horizontal' && this.itemLimit === 0) {\n\t\t\t\tconst callback = this.resolveNativeCallback()\n\t\t\t\tif (typeof callback === 'function') {\n\t\t\t\t\tthis.mountNative(callback)\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t}\n\t\t\tthis.mode = 'api'\n\t\t\tthis.loadApiItems()\n\t\t},\n\n\t\t/\n\t\t Look up a native render callback on the `OCA.Dashboard` global.\n\t\t \n\t\t @return {((el: HTMLElement, ctx: {widget: object}) => unknown)\|null} the callback, or `null` when none is registered.\n\t\t /\n\t\tresolveNativeCallback() {\n\t\t\tconst dashboard = getDashboardGlobal()\n\t\t\tif (!dashboard) {\n\t\t\t\treturn null\n\t\t\t}\n\t\t\tif (this.widgetMeta && typeof this.widgetMeta.callback === 'function') {\n\t\t\t\treturn this.widgetMeta.callback\n\t\t\t}\n\t\t\tif (dashboard.callbacks && typeof dashboard.callbacks[this.widgetId] === 'function') {\n\t\t\t\treturn dashboard.callbacks[this.widgetId]\n\t\t\t}\n\t\t\treturn null\n\t\t},\n\n\t\t/\n\t\t Mount the widget natively by invoking its registered callback with\n\t\t * our render container.\n\t\t \n\t\t @param {(el: HTMLElement, ctx: {widget: object}) => unknown} callback the native render callback.\n\t\t * @return {void}\n\t\t /\n\t\tmountNative(callback) {\n\t\t\tthis.mode = 'native'\n\t\t\tthis.$nextTick(() => {\n\t\t\t\tconst container = this.$refs.nativeContainer\n\t\t\t\tif (!container) {\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t\t// Native callback failed — fall back to the API list.\n\t\t\t\tconst fallback = () => {\n\t\t\t\t\tthis.mode = 'api'\n\t\t\t\t\tthis.loadApiItems()\n\t\t\t\t}\n\t\t\t\ttry {\n\t\t\t\t\t// NC dashboard widgets are registered as\n\t\t\t\t\t// `register(id, (el, { widget }) => …)` — the second argument\n\t\t\t\t\t// MUST be the `{ widget }` envelope, not the bare metadata, or\n\t\t\t\t\t// the widget destructures `widget` as undefined and throws on\n\t\t\t\t\t// first use (e.g. `widget.title`).\n\t\t\t\t\tconst result = callback(container, { widget: this.widgetMeta \|\| {} })\n\t\t\t\t\t// Most widget callbacks are async; a synchronous try/catch\n\t\t\t\t\t// can't see a rejected promise, so wire the fallback to it too.\n\t\t\t\t\tif (result && typeof result.then === 'function') {\n\t\t\t\t\t\tresult.catch(fallback)\n\t\t\t\t\t}\n\t\t\t\t} catch {\n\t\t\t\t\tfallback()\n\t\t\t\t}\n\t\t\t})\n\t\t},\n\n\t\t/\n\t\t Fetch the API fallback list directly from the OCS Dashboard\n\t\t * endpoint. Malformed or failed responses collapse to an empty list\n\t\t * (the empty state) instead of throwing.\n\t\t \n\t\t @return {Promise<void>}\n\t\t /\n\t\tasync loadApiItems() {\n\t\t\tthis.loading = true\n\t\t\ttry {\n\t\t\t\t// The v2 widget-items API only returns an entry for widgets\n\t\t\t\t// whose server-side provider implements `IAPIWidgetV2` — plenty\n\t\t\t\t// of native dashboard widgets are JS-callback-only (`IWidget`)\n\t\t\t\t// and never appear in this response at all, which looks\n\t\t\t\t// identical to \"0 items\" from here. extractItems() tolerates\n\t\t\t\t// both the flat-array (older providers) and `{items}` (v2) shapes.\n\t\t\t\tconst url = generateOcsUrl('/apps/dashboard/api/v2/widget-items')\n\t\t\t\tconst response = await axios.get(url, {\n\t\t\t\t\tparams: { widgets: [this.widgetId], limit: this.itemLimit > 0 ? this.itemLimit : API_ITEM_LIMIT },\n\t\t\t\t})\n\t\t\t\tconst data = response && response.data && response.data.ocs ? response.data.ocs.data : null\n\t\t\t\tconst widgetData = data ? data[this.widgetId] : null\n\t\t\t\tthis.items = this.extractItems(widgetData)\n\t\t\t\t// Only a SUCCESSFUL response can say the widget is absent. A\n\t\t\t\t// failed request says nothing about the widget, so it keeps\n\t\t\t\t// the ordinary empty state rather than a claim about the app.\n\t\t\t\tthis.unsupported = data !== null && (widgetData === null \|\| widgetData === undefined)\n\t\t\t} catch {\n\t\t\t\tthis.items = []\n\t\t\t\tthis.unsupported = false\n\t\t\t} finally {\n\t\t\t\tthis.loading = false\n\t\t\t}\n\n\t\t\t// Horizontal mode deliberately skips the native fast-path (see\n\t\t\t// tryMount()) to get the styled card layout. But when the API has\n\t\t\t// no entry for this widget at all — no `IAPIWidgetV2` support, not\n\t\t\t// \"no items right now\" — that would render a false empty state for\n\t\t\t// a widget that actually has content. Fall back to native\n\t\t\t// rendering rather than lying about there being nothing to show.\n\t\t\tif (this.items.length === 0) {\n\t\t\t\tconst callback = this.resolveNativeCallback()\n\t\t\t\tif (typeof callback === 'function') {\n\t\t\t\t\tthis.mountNative(callback)\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\t/\n\t\t Normalise a per-widget OCS payload to an items array, tolerating both\n\t\t * the flat array and the `{items}` envelope shapes.\n\t\t \n\t\t @param {unknown} widgetData the per-widget payload.\n\t\t * @return {object[]} the items array (possibly empty).\n\t\t /\n\t\textractItems(widgetData) {\n\t\t\tif (!widgetData) {\n\t\t\t\treturn []\n\t\t\t}\n\t\t\tif (Array.isArray(widgetData)) {\n\t\t\t\treturn widgetData\n\t\t\t}\n\t\t\tif (Array.isArray(widgetData.items)) {\n\t\t\t\treturn widgetData.items\n\t\t\t}\n\t\t\tif (widgetData.items && typeof widgetData.items === 'object') {\n\t\t\t\treturn Object.values(widgetData.items)\n\t\t\t}\n\t\t\treturn []\n\t\t},\n\t},\n}\n</script>\n\n<style scoped>\n.cn-nc-widget-widget {\n\tdisplay: flex;\n\tflex-direction: column;\n\twidth: 100%;\n\theight: 100%;\n\toverflow: hidden;\n}\n\n/\n * Header + content match the native Nextcloud Dashboard panel (apps/dashboard)\n * exactly — this component's whole job is rendering NC dashboard widgets, so it\n * should look native by default: 16px header, 32px leading icon with a 16px\n * gap, a 20px/700 title, and the native panel content inset (16px sides +\n * bottom, flush to the header on top). Same design tokens as core; overridable\n * via the host's CnWidgetWrapper styleConfig / nldesign.\n /\n.cn-nc-widget-widget__header {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 16px;\n\tpadding: 16px;\n\tfont-weight: 700;\n}\n\n.cn-nc-widget-widget__header-icon {\n\twidth: 32px;\n\theight: 32px;\n\tflex: 0 0 auto;\n}\n\n.cn-nc-widget-widget__header-title {\n\tflex: 1;\n\tfont-size: 20px;\n\tfont-weight: 700;\n\tline-height: 24px;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n}\n\n.cn-nc-widget-widget__show-all {\n\talign-self: flex-start;\n\tpadding: 8px 0 0;\n\tcolor: var(--color-primary-element);\n\tfont-weight: 600;\n\ttext-decoration: none;\n}\n\n.cn-nc-widget-widget__show-all:hover,\n.cn-nc-widget-widget__show-all:focus-visible {\n\ttext-decoration: underline;\n}\n\n.cn-nc-widget-widget__native {\n\tflex: 1;\n\toverflow: auto;\n\tpadding: 0 16px 16px;\n}\n\n/\n * The native `OCA.Dashboard` callback paints its own markup we don't control\n * — for first-party widgets that's almost always `@nextcloud/vue`'s\n * `NcDashboardWidget` / `NcDashboardWidgetItem` (`.dashboard-widget` wrapping\n * a bare `<ul>`/`<li>` list, each item a `.item-list__entry`).\n \n Only the LIST CONTAINER is retiled into a grid here — `.item-list__entry`'s\n * own internal layout is left untouched. An earlier version of this override\n * also forced `.item-list__entry` from row to column, but its icon-overlay\n * badge (`.item-icon`, see @nextcloud/vue's NcDashboardWidgetItem CSS) is\n * positioned with negative margins calibrated for the row layout, so\n * flipping to column made items visually overlap. Tiling the `<li>`s into a\n * grid while each entry keeps its normal icon+text row reads as a grid of\n * card tiles without touching that internal math.\n \n Scoped from `.cn-nc-widget-widget--horizontal` on the ROOT element, not\n * `.cn-nc-widget-widget__native`: the callback mounts via `.$mount(el)`,\n * which replaces `nativeContainer` in the live DOM outright, so any class\n * placed directly on it never survives to be selectable.\n \n The 250px column floor matches `.item-list__entry`'s own natural minimum\n * width (avatar + padding + its un-truncatable-below-this content) — a grid\n * track narrower than that squeezes the entry below its real minimum and it\n * overflows into the neighbouring cell. `min-width: 0` on the `<li>` alone\n * isn't enough to shrink it further: the item's own internal flex layout\n * still claims that much room regardless of the grid track size, so the\n * track itself must not go below it.\n */\n.cn-nc-widget-widget--horizontal :deep(.dashboard-widget > ul) {\n\tdisplay: grid;\n\tgrid-template-columns: repeat(auto-fill, minmax(250px, 1fr));\n\tgap: 8px;\n\tlist-style: none;\n\tmargin: 0;\n\tpadding: 0;\n}\n\n.cn-nc-widget-widget--horizontal :deep(.dashboard-widget > ul > li) {\n\twidth: auto;\n\tmin-width: 0;\n}\n\n.cn-nc-widget-widget--horizontal :deep(.item-list__entry) {\n\theight: 100%;\n\tmargin: 0;\n\tborder: 1px solid var(--color-border);\n\tborder-radius: var(--border-radius-large);\n}\n\n.cn-nc-widget-widget__body {\n\tflex: 1;\n\toverflow: auto;\n\tpadding: 0 16px 16px;\n}\n\n.cn-nc-widget-widget__body--vertical {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 8px;\n}\n\n.cn-nc-widget-widget__body--horizontal {\n\tdisplay: flex;\n\tflex-direction: row;\n\tflex-wrap: wrap;\n\tgap: 12px;\n}\n\n.cn-nc-widget-widget__state {\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tflex: 1;\n\tmin-height: 64px;\n\tcolor: var(--color-text-maxcontrast);\n\tfont-style: italic;\n}\n\n.cn-nc-widget-widget__item {\n\tdisplay: flex;\n\ttext-decoration: none;\n\tcolor: var(--color-main-text);\n\tborder-radius: var(--border-radius);\n\tpadding: 4px;\n}\n\n.cn-nc-widget-widget__item:hover {\n\tbackground-color: var(--color-background-hover);\n}\n\n.cn-nc-widget-widget__item--vertical {\n\tflex-direction: row;\n\talign-items: center;\n\tgap: 8px;\n}\n\n.cn-nc-widget-widget__item--horizontal {\n\tflex-direction: column;\n\talign-items: center;\n\twidth: 120px;\n\ttext-align: center;\n}\n\n.cn-nc-widget-widget__item-icon-wrap {\n\twidth: 32px;\n\theight: 32px;\n\tflex: 0 0 32px;\n\tposition: relative;\n}\n\n.cn-nc-widget-widget__item-icon {\n\twidth: 32px;\n\theight: 32px;\n\tobject-fit: cover;\n\tborder-radius: 50%;\n}\n\n.cn-nc-widget-widget__item-overlay {\n\tposition: absolute;\n\tright: -2px;\n\tbottom: -2px;\n\twidth: 14px;\n\theight: 14px;\n}\n\n.cn-nc-widget-widget__item-text {\n\tdisplay: flex;\n\tflex-direction: column;\n\tmin-width: 0;\n\tflex: 1;\n}\n\n.cn-nc-widget-widget__item-title {\n\tfont-weight: 600;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n}\n\n.cn-nc-widget-widget__item-subtitle {\n\tfont-size: 0.85em;\n\tcolor: var(--color-text-maxcontrast);\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n}\n</style>\n"],"names":["_createElementBlock","_normalizeClass","_createElementVNode","_toDisplayString","_withDirectives","_openBlock","_Fragment","_renderList"],"mappings":"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"}
1	+ {"version":3,"file":"CnNcWidgetWidget.vue3.js","sources":["../../../../src/components/CnNcWidgetWidget/CnNcWidgetWidget.vue?vue&type=template&id=f553a198&lang.js"],"sourcesContent":["<!--\n - SPDX-FileCopyrightText: 2026 Conduction B.V.\n - SPDX-License-Identifier: EUPL-1.2\n-->\n\n<template>\n\t<div class=\"cn-nc-widget-widget\" :class=\"{ 'cn-nc-widget-widget--horizontal': displayMode === 'horizontal' }\">\n\t\t<header v-if=\"showsHeader\" class=\"cn-nc-widget-widget__header\" data-testid=\"cn-nc-widget-header\">\n\t\t\t<img\n\t\t\t\tv-if=\"widgetIconUrl\"\n\t\t\t\tclass=\"cn-nc-widget-widget__header-icon\"\n\t\t\t\t:src=\"widgetIconUrl\"\n\t\t\t\talt=\"\">\n\t\t\t<span class=\"cn-nc-widget-widget__header-title\">{{ widgetTitle }}</span>\n\t\t</header>\n\n\t\t<!--\n\t\t\tNative callback container — always present but hidden until the\n\t\t\tOCA.Dashboard callback mounts into it. Keeping it mounted avoids a\n\t\t\tflicker when the native path wins after the API list has painted.\n\n\t\t\tThe `--horizontal` reskin class lives on the ROOT element, not here:\n\t\t\tnative widget callbacks mount via `new Vue(...).$mount(el)`, which\n\t\t\tREPLACES this element in the live DOM with the callback's own root\n\t\t\tnode — any class we put directly on it is discarded along with the\n\t\t\telement itself, so it can never appear in the rendered page.\n\t\t-->\n\t\t<div\n\t\t\tv-show=\"mode === 'native'\"\n\t\t\tref=\"nativeContainer\"\n\t\t\tclass=\"cn-nc-widget-widget__native\" />\n\n\t\t<div\n\t\t\tv-if=\"mode !== 'native'\"\n\t\t\tclass=\"cn-nc-widget-widget__body\"\n\t\t\t:class=\"bodyClass\">\n\t\t\t<div v-if=\"loading\" class=\"cn-nc-widget-widget__state\">\n\t\t\t\t{{ t('nextcloud-vue', 'Loading…') }}\n\t\t\t</div>\n\n\t\t\t<div v-else-if=\"!widgetId\" class=\"cn-nc-widget-widget__state\">\n\t\t\t\t{{ t('nextcloud-vue', 'No widget selected') }}\n\t\t\t</div>\n\n\t\t\t<div v-else-if=\"unsupported\" class=\"cn-nc-widget-widget__state\" data-testid=\"nc-widget-unsupported\">\n\t\t\t\t{{ t('nextcloud-vue', 'This widget can only be shown on the Nextcloud dashboard itself.') }}\n\t\t\t</div>\n\n\t\t\t<div v-else-if=\"items.length === 0\" class=\"cn-nc-widget-widget__state\">\n\t\t\t\t{{ t('nextcloud-vue', 'No items available') }}\n\t\t\t</div>\n\n\t\t\t<template v-else>\n\t\t\t\t<a\n\t\t\t\t\tv-for=\"(item, idx) in shownItems\"\n\t\t\t\t\t:key=\"item.sinceId \|\| item.id \|\| idx\"\n\t\t\t\t\tclass=\"cn-nc-widget-widget__item\"\n\t\t\t\t\t:class=\"itemClass\"\n\t\t\t\t\t:href=\"item.link \|\| '#'\"\n\t\t\t\t\t:title=\"item.title\">\n\t\t\t\t\t<span class=\"cn-nc-widget-widget__item-icon-wrap\">\n\t\t\t\t\t\t<img\n\t\t\t\t\t\t\tv-if=\"item.iconUrl\"\n\t\t\t\t\t\t\tclass=\"cn-nc-widget-widget__item-icon\"\n\t\t\t\t\t\t\t:src=\"item.iconUrl\"\n\t\t\t\t\t\t\talt=\"\">\n\t\t\t\t\t\t<img\n\t\t\t\t\t\t\tv-if=\"item.overlayIconUrl\"\n\t\t\t\t\t\t\tclass=\"cn-nc-widget-widget__item-overlay\"\n\t\t\t\t\t\t\t:src=\"item.overlayIconUrl\"\n\t\t\t\t\t\t\talt=\"\">\n\t\t\t\t\t</span>\n\t\t\t\t\t<span class=\"cn-nc-widget-widget__item-text\">\n\t\t\t\t\t\t<span class=\"cn-nc-widget-widget__item-title\">{{ item.title }}</span>\n\t\t\t\t\t\t<span v-if=\"item.subtitle\" class=\"cn-nc-widget-widget__item-subtitle\">{{ item.subtitle }}</span>\n\t\t\t\t\t</span>\n\t\t\t\t</a>\n\t\t\t\t<!-- With a `limit`, the rest is one link away (`showAllUrl`, else the widget's own page). -->\n\t\t\t\t<a\n\t\t\t\t\tv-if=\"showAllHref\"\n\t\t\t\t\tclass=\"cn-nc-widget-widget__show-all\"\n\t\t\t\t\tdata-testid=\"nc-widget-show-all\"\n\t\t\t\t\t:href=\"showAllHref\">\n\t\t\t\t\t{{ showAllLabel }}\n\t\t\t\t</a>\n\t\t\t</template>\n\t\t</div>\n\t</div>\n</template>\n\n<script>\nimport axios from '@nextcloud/axios'\nimport { translate as t } from '@nextcloud/l10n'\nimport { generateOcsUrl } from '@nextcloud/router'\n\nconst API_ITEM_LIMIT = 7\n\n/*\n Read the global `OCA.Dashboard` registry without assuming it exists.\n \n @return {object\|null} the `OCA.Dashboard` object, or `null` when absent.\n /\nfunction getDashboardGlobal() {\n\tif (typeof window === 'undefined') {\n\t\treturn null\n\t}\n\tconst oca = window.OCA\n\treturn oca && oca.Dashboard ? oca.Dashboard : null\n}\n\n/\n CnNcWidgetWidget — proxies any native Nextcloud Dashboard widget into a\n * dashboard grid cell.\n \n Two-mode rendering (decoupling seam — reads NC directly, no app bridge):\n * - native — when the widget bundle has registered a callback on the\n * global `OCA.Dashboard` (`getWidget(id)` / `widgets[id]`), the callback is\n * handed the render container and paints itself (native fast-path).\n * - api — otherwise the OCS Dashboard endpoint\n * `/apps/dashboard/api/v{1,2}/widget-items` is fetched directly via\n * `@nextcloud/axios` and a flat item list is rendered.\n \n The header title + icon come from the dashboard widget metadata\n * (`OCA.Dashboard` registry, falling back to the configured `widgetId`). When\n * no `widgetId` is configured the widget renders an empty state and never hits\n * the network.\n \n @spec openspec/changes/cn-widget-library/specs/cn-widget-library/spec.md\n /\nexport default {\n\tname: 'CnNcWidgetWidget',\n\n\tinject: {\n\t\t/* Whether the hosting card draws a title row (CnWidgetWrapper). /\n\t\tcnWidgetTitled: { default: null },\n\t},\n\n\tprops: {\n\t\t/\n\t\t Persisted widget content `{widgetId, displayMode, limit?, showAllUrl?, showAllLabel?, showHeader?}`.\n\t\t * `showHeader: false` drops the widget's own header (icon and title);\n\t\t * it is dropped too when the hosting card draws a title row.\n\t\t * `limit` is the most items shown (the list then comes from the items\n\t\t * API, so it fits its cell); `showAllUrl` / `showAllLabel` the link to\n\t\t * the rest (default the widget's own page and \"Show all\").\n\t\t \n\t\t @type {object}\n\t\t /\n\t\tcontent: {\n\t\t\ttype: Object,\n\t\t\tdefault: () => ({}),\n\t\t},\n\t},\n\n\tdata() {\n\t\treturn {\n\t\t\t/* @type {'pending'\|'native'\|'api'} the resolved mounting mode. /\n\t\t\tmode: 'pending',\n\t\t\t/\n\t\t\t Whether the items API has no entry for this widget at all.\n\t\t\t \n\t\t\t Not the same as an empty list. A widget whose provider implements\n\t\t\t * only `IWidget` (no `IAPIWidget`/`IAPIWidgetV2`) declares\n\t\t\t * `itemApiVersions: []` and is simply ABSENT from the widget-items\n\t\t\t * response, while a widget with nothing to show right now comes\n\t\t\t * back as its own key holding an empty list. The Tasks app's widget\n\t\t\t * is the first kind: with no native callback registered on the page\n\t\t\t * it can never render a single item here, and saying \"No items\n\t\t\t * available\" under it told the reader their task list was empty.\n\t\t\t \n\t\t\t @type {boolean}\n\t\t\t /\n\t\t\tunsupported: false,\n\t\t\tloading: false,\n\t\t\titems: [],\n\t\t}\n\t},\n\n\tcomputed: {\n\t\t/\n\t\t The configured native widget id.\n\t\t \n\t\t @return {string} the widget id (empty when unset).\n\t\t /\n\t\twidgetId() {\n\t\t\treturn typeof (this.content && this.content.widgetId) === 'string' ? this.content.widgetId : ''\n\t\t},\n\n\t\t/\n\t\t The item list orientation.\n\t\t \n\t\t @return {string} `horizontal` or `vertical`.\n\t\t /\n\t\tdisplayMode() {\n\t\t\treturn (this.content && this.content.displayMode) === 'horizontal' ? 'horizontal' : 'vertical'\n\t\t},\n\n\t\t/\n\t\t The native widget metadata from the `OCA.Dashboard` global.\n\t\t \n\t\t @return {object\|null} the widget metadata, or `null`.\n\t\t /\n\t\twidgetMeta() {\n\t\t\tconst dashboard = getDashboardGlobal()\n\t\t\tif (!dashboard \|\| !this.widgetId) {\n\t\t\t\treturn null\n\t\t\t}\n\t\t\tif (typeof dashboard.getWidget === 'function') {\n\t\t\t\treturn dashboard.getWidget(this.widgetId) \|\| null\n\t\t\t}\n\t\t\tif (dashboard.widgets && typeof dashboard.widgets === 'object') {\n\t\t\t\treturn dashboard.widgets[this.widgetId] \|\| null\n\t\t\t}\n\t\t\treturn null\n\t\t},\n\n\t\t/\n\t\t Whether the widget draws its own header: not with\n\t\t * `content.showHeader: false`, nor inside a card that draws a title.\n\t\t \n\t\t @spec openspec/changes/nc-widget-header/specs/nc-widget-header/spec.md#requirement-a-nextcloud-widget-draws-no-second-heading\n\t\t * @return {boolean}\n\t\t /\n\t\tshowsHeader() {\n\t\t\tif (this.content && this.content.showHeader === false) {\n\t\t\t\treturn false\n\t\t\t}\n\t\t\treturn !(typeof this.cnWidgetTitled === 'function' && this.cnWidgetTitled())\n\t\t},\n\n\t\t/\n\t\t The header title.\n\t\t \n\t\t @return {string} the title.\n\t\t /\n\t\twidgetTitle() {\n\t\t\treturn (this.widgetMeta && this.widgetMeta.title) \|\| this.widgetId \|\| t('nextcloud-vue', 'Widget')\n\t\t},\n\n\t\t/\n\t\t The header icon URL.\n\t\t \n\t\t @return {string} the icon URL (empty when none).\n\t\t /\n\t\twidgetIconUrl() {\n\t\t\treturn (this.widgetMeta && this.widgetMeta.iconUrl) \|\| ''\n\t\t},\n\n\t\t/\n\t\t The most items the list shows (`content.limit`), or 0 for no limit.\n\t\t * A limit lets the widget fit a dashboard cell instead of scrolling\n\t\t * inside it.\n\t\t \n\t\t @spec openspec/changes/screens-nc-widget-limit/specs/nc-widget/spec.md#requirement-a-nextcloud-widget-shows-at-most-its-limit\n\t\t * @return {number} the limit.\n\t\t /\n\t\titemLimit() {\n\t\t\tconst limit = Number(this.content && this.content.limit)\n\t\t\treturn Number.isInteger(limit) && limit > 0 ? limit : 0\n\t\t},\n\n\t\t/\n\t\t The items drawn: at most `itemLimit`.\n\t\t \n\t\t @return {object[]} the items.\n\t\t /\n\t\tshownItems() {\n\t\t\treturn this.itemLimit > 0 ? this.items.slice(0, this.itemLimit) : this.items\n\t\t},\n\n\t\t/\n\t\t Where \"Show all\" goes: `content.showAllUrl`, else the page the widget\n\t\t * names itself (its `url`). Only with a limit; '' for no link.\n\t\t \n\t\t @spec openspec/changes/screens-nc-widget-limit/specs/nc-widget/spec.md#requirement-a-nextcloud-widget-shows-at-most-its-limit\n\t\t * @return {string} the URL.\n\t\t /\n\t\tshowAllHref() {\n\t\t\tif (this.itemLimit === 0) {\n\t\t\t\treturn ''\n\t\t\t}\n\t\t\tconst own = this.content && typeof this.content.showAllUrl === 'string' ? this.content.showAllUrl : ''\n\t\t\treturn own \|\| (this.widgetMeta && typeof this.widgetMeta.url === 'string' ? this.widgetMeta.url : '')\n\t\t},\n\n\t\t/\n\t\t The \"Show all\" text (`content.showAllLabel`, else the library's).\n\t\t \n\t\t @return {string} the label.\n\t\t /\n\t\tshowAllLabel() {\n\t\t\tconst label = this.content && this.content.showAllLabel\n\t\t\treturn typeof label === 'string' && label !== '' ? label : t('nextcloud-vue', 'Show all')\n\t\t},\n\n\t\t/\n\t\t The body orientation CSS modifier class.\n\t\t \n\t\t @return {string} the body class.\n\t\t /\n\t\tbodyClass() {\n\t\t\treturn `cn-nc-widget-widget__body--${this.displayMode}`\n\t\t},\n\n\t\t/\n\t\t The item orientation CSS modifier class.\n\t\t \n\t\t @return {string} the item class.\n\t\t /\n\t\titemClass() {\n\t\t\treturn `cn-nc-widget-widget__item--${this.displayMode}`\n\t\t},\n\t},\n\n\tmounted() {\n\t\tthis.tryMount()\n\t},\n\n\tmethods: {\n\t\tt,\n\n\t\t/\n\t\t Resolve the mounting mode. Prefers the native `OCA.Dashboard`\n\t\t * callback fast-path; otherwise falls back to the OCS item list.\n\t\t \n\t\t @return {void}\n\t\t /\n\t\ttryMount() {\n\t\t\tif (!this.widgetId) {\n\t\t\t\tthis.mode = 'api'\n\t\t\t\tthis.items = []\n\t\t\t\treturn\n\t\t\t}\n\t\t\t// The native callback paints its own opaque markup, so `displayMode`\n\t\t\t// (bodyClass/itemClass below) has no effect on it — only the API\n\t\t\t// item list honours the vertical/horizontal setting. Horizontal mode\n\t\t\t// must therefore skip the native fast-path, or the \"Horizontal\n\t\t\t// (cards)\" option would silently do nothing for the (common) case\n\t\t\t// where the widget has a registered native callback.\n\t\t\t// A `limit` also takes the API list first: the native callback paints\n\t\t\t// as many items as it likes. Its fallback to native stays.\n\t\t\tif (this.displayMode !== 'horizontal' && this.itemLimit === 0) {\n\t\t\t\tconst callback = this.resolveNativeCallback()\n\t\t\t\tif (typeof callback === 'function') {\n\t\t\t\t\tthis.mountNative(callback)\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t}\n\t\t\tthis.mode = 'api'\n\t\t\tthis.loadApiItems()\n\t\t},\n\n\t\t/\n\t\t Look up a native render callback on the `OCA.Dashboard` global.\n\t\t \n\t\t @return {((el: HTMLElement, ctx: {widget: object}) => unknown)\|null} the callback, or `null` when none is registered.\n\t\t /\n\t\tresolveNativeCallback() {\n\t\t\tconst dashboard = getDashboardGlobal()\n\t\t\tif (!dashboard) {\n\t\t\t\treturn null\n\t\t\t}\n\t\t\tif (this.widgetMeta && typeof this.widgetMeta.callback === 'function') {\n\t\t\t\treturn this.widgetMeta.callback\n\t\t\t}\n\t\t\tif (dashboard.callbacks && typeof dashboard.callbacks[this.widgetId] === 'function') {\n\t\t\t\treturn dashboard.callbacks[this.widgetId]\n\t\t\t}\n\t\t\treturn null\n\t\t},\n\n\t\t/\n\t\t Mount the widget natively by invoking its registered callback with\n\t\t * our render container.\n\t\t \n\t\t @param {(el: HTMLElement, ctx: {widget: object}) => unknown} callback the native render callback.\n\t\t * @return {void}\n\t\t /\n\t\tmountNative(callback) {\n\t\t\tthis.mode = 'native'\n\t\t\tthis.$nextTick(() => {\n\t\t\t\tconst container = this.$refs.nativeContainer\n\t\t\t\tif (!container) {\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t\t// Native callback failed — fall back to the API list.\n\t\t\t\tconst fallback = () => {\n\t\t\t\t\tthis.mode = 'api'\n\t\t\t\t\tthis.loadApiItems()\n\t\t\t\t}\n\t\t\t\ttry {\n\t\t\t\t\t// NC dashboard widgets are registered as\n\t\t\t\t\t// `register(id, (el, { widget }) => …)` — the second argument\n\t\t\t\t\t// MUST be the `{ widget }` envelope, not the bare metadata, or\n\t\t\t\t\t// the widget destructures `widget` as undefined and throws on\n\t\t\t\t\t// first use (e.g. `widget.title`).\n\t\t\t\t\tconst result = callback(container, { widget: this.widgetMeta \|\| {} })\n\t\t\t\t\t// Most widget callbacks are async; a synchronous try/catch\n\t\t\t\t\t// can't see a rejected promise, so wire the fallback to it too.\n\t\t\t\t\tif (result && typeof result.then === 'function') {\n\t\t\t\t\t\tresult.catch(fallback)\n\t\t\t\t\t}\n\t\t\t\t} catch {\n\t\t\t\t\tfallback()\n\t\t\t\t}\n\t\t\t})\n\t\t},\n\n\t\t/\n\t\t Fetch the API fallback list directly from the OCS Dashboard\n\t\t * endpoint. Malformed or failed responses collapse to an empty list\n\t\t * (the empty state) instead of throwing.\n\t\t \n\t\t @return {Promise<void>}\n\t\t /\n\t\tasync loadApiItems() {\n\t\t\tthis.loading = true\n\t\t\ttry {\n\t\t\t\t// The v2 widget-items API only returns an entry for widgets\n\t\t\t\t// whose server-side provider implements `IAPIWidgetV2` — plenty\n\t\t\t\t// of native dashboard widgets are JS-callback-only (`IWidget`)\n\t\t\t\t// and never appear in this response at all, which looks\n\t\t\t\t// identical to \"0 items\" from here. extractItems() tolerates\n\t\t\t\t// both the flat-array (older providers) and `{items}` (v2) shapes.\n\t\t\t\tconst url = generateOcsUrl('/apps/dashboard/api/v2/widget-items')\n\t\t\t\tconst response = await axios.get(url, {\n\t\t\t\t\tparams: { widgets: [this.widgetId], limit: this.itemLimit > 0 ? this.itemLimit : API_ITEM_LIMIT },\n\t\t\t\t})\n\t\t\t\tconst data = response && response.data && response.data.ocs ? response.data.ocs.data : null\n\t\t\t\tconst widgetData = data ? data[this.widgetId] : null\n\t\t\t\tthis.items = this.extractItems(widgetData)\n\t\t\t\t// Only a SUCCESSFUL response can say the widget is absent. A\n\t\t\t\t// failed request says nothing about the widget, so it keeps\n\t\t\t\t// the ordinary empty state rather than a claim about the app.\n\t\t\t\tthis.unsupported = data !== null && (widgetData === null \|\| widgetData === undefined)\n\t\t\t} catch {\n\t\t\t\tthis.items = []\n\t\t\t\tthis.unsupported = false\n\t\t\t} finally {\n\t\t\t\tthis.loading = false\n\t\t\t}\n\n\t\t\t// Horizontal mode deliberately skips the native fast-path (see\n\t\t\t// tryMount()) to get the styled card layout. But when the API has\n\t\t\t// no entry for this widget at all — no `IAPIWidgetV2` support, not\n\t\t\t// \"no items right now\" — that would render a false empty state for\n\t\t\t// a widget that actually has content. Fall back to native\n\t\t\t// rendering rather than lying about there being nothing to show.\n\t\t\tif (this.items.length === 0) {\n\t\t\t\tconst callback = this.resolveNativeCallback()\n\t\t\t\tif (typeof callback === 'function') {\n\t\t\t\t\tthis.mountNative(callback)\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\t/\n\t\t Normalise a per-widget OCS payload to an items array, tolerating both\n\t\t * the flat array and the `{items}` envelope shapes.\n\t\t \n\t\t @param {unknown} widgetData the per-widget payload.\n\t\t * @return {object[]} the items array (possibly empty).\n\t\t /\n\t\textractItems(widgetData) {\n\t\t\tif (!widgetData) {\n\t\t\t\treturn []\n\t\t\t}\n\t\t\tif (Array.isArray(widgetData)) {\n\t\t\t\treturn widgetData\n\t\t\t}\n\t\t\tif (Array.isArray(widgetData.items)) {\n\t\t\t\treturn widgetData.items\n\t\t\t}\n\t\t\tif (widgetData.items && typeof widgetData.items === 'object') {\n\t\t\t\treturn Object.values(widgetData.items)\n\t\t\t}\n\t\t\treturn []\n\t\t},\n\t},\n}\n</script>\n\n<style scoped>\n.cn-nc-widget-widget {\n\tdisplay: flex;\n\tflex-direction: column;\n\twidth: 100%;\n\theight: 100%;\n\toverflow: hidden;\n}\n\n/\n * Header + content match the native Nextcloud Dashboard panel (apps/dashboard)\n * exactly — this component's whole job is rendering NC dashboard widgets, so it\n * should look native by default: 16px header, 32px leading icon with a 16px\n * gap, a 20px/700 title, and the native panel content inset (16px sides +\n * bottom, flush to the header on top). Same design tokens as core; overridable\n * via the host's CnWidgetWrapper styleConfig / nldesign.\n /\n.cn-nc-widget-widget__header {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 16px;\n\tpadding: 16px;\n\tfont-weight: 700;\n}\n\n.cn-nc-widget-widget__header-icon {\n\twidth: 32px;\n\theight: 32px;\n\tflex: 0 0 auto;\n}\n\n.cn-nc-widget-widget__header-title {\n\tflex: 1;\n\tfont-size: 20px;\n\tfont-weight: 700;\n\tline-height: 24px;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n}\n\n.cn-nc-widget-widget__show-all {\n\talign-self: flex-start;\n\tpadding: 8px 0 0;\n\tcolor: var(--color-primary-element);\n\tfont-weight: 600;\n\ttext-decoration: none;\n}\n\n.cn-nc-widget-widget__show-all:hover,\n.cn-nc-widget-widget__show-all:focus-visible {\n\ttext-decoration: underline;\n}\n\n.cn-nc-widget-widget__native {\n\tflex: 1;\n\toverflow: auto;\n\tpadding: 0 16px 16px;\n}\n\n/\n * The native `OCA.Dashboard` callback paints its own markup we don't control\n * — for first-party widgets that's almost always `@nextcloud/vue`'s\n * `NcDashboardWidget` / `NcDashboardWidgetItem` (`.dashboard-widget` wrapping\n * a bare `<ul>`/`<li>` list, each item a `.item-list__entry`).\n \n Only the LIST CONTAINER is retiled into a grid here — `.item-list__entry`'s\n * own internal layout is left untouched. An earlier version of this override\n * also forced `.item-list__entry` from row to column, but its icon-overlay\n * badge (`.item-icon`, see @nextcloud/vue's NcDashboardWidgetItem CSS) is\n * positioned with negative margins calibrated for the row layout, so\n * flipping to column made items visually overlap. Tiling the `<li>`s into a\n * grid while each entry keeps its normal icon+text row reads as a grid of\n * card tiles without touching that internal math.\n \n Scoped from `.cn-nc-widget-widget--horizontal` on the ROOT element, not\n * `.cn-nc-widget-widget__native`: the callback mounts via `.$mount(el)`,\n * which replaces `nativeContainer` in the live DOM outright, so any class\n * placed directly on it never survives to be selectable.\n \n The 250px column floor matches `.item-list__entry`'s own natural minimum\n * width (avatar + padding + its un-truncatable-below-this content) — a grid\n * track narrower than that squeezes the entry below its real minimum and it\n * overflows into the neighbouring cell. `min-width: 0` on the `<li>` alone\n * isn't enough to shrink it further: the item's own internal flex layout\n * still claims that much room regardless of the grid track size, so the\n * track itself must not go below it.\n */\n.cn-nc-widget-widget--horizontal :deep(.dashboard-widget > ul) {\n\tdisplay: grid;\n\tgrid-template-columns: repeat(auto-fill, minmax(250px, 1fr));\n\tgap: 8px;\n\tlist-style: none;\n\tmargin: 0;\n\tpadding: 0;\n}\n\n.cn-nc-widget-widget--horizontal :deep(.dashboard-widget > ul > li) {\n\twidth: auto;\n\tmin-width: 0;\n}\n\n.cn-nc-widget-widget--horizontal :deep(.item-list__entry) {\n\theight: 100%;\n\tmargin: 0;\n\tborder: 1px solid var(--color-border);\n\tborder-radius: var(--border-radius-large);\n}\n\n.cn-nc-widget-widget__body {\n\tflex: 1;\n\toverflow: auto;\n\tpadding: 0 16px 16px;\n}\n\n.cn-nc-widget-widget__body--vertical {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 8px;\n}\n\n.cn-nc-widget-widget__body--horizontal {\n\tdisplay: flex;\n\tflex-direction: row;\n\tflex-wrap: wrap;\n\tgap: 12px;\n}\n\n.cn-nc-widget-widget__state {\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tflex: 1;\n\tmin-height: 64px;\n\tcolor: var(--color-text-maxcontrast);\n\tfont-style: italic;\n}\n\n.cn-nc-widget-widget__item {\n\tdisplay: flex;\n\ttext-decoration: none;\n\tcolor: var(--color-main-text);\n\tborder-radius: var(--border-radius);\n\tpadding: 4px;\n}\n\n.cn-nc-widget-widget__item:hover {\n\tbackground-color: var(--color-background-hover);\n}\n\n.cn-nc-widget-widget__item--vertical {\n\tflex-direction: row;\n\talign-items: center;\n\tgap: 8px;\n}\n\n.cn-nc-widget-widget__item--horizontal {\n\tflex-direction: column;\n\talign-items: center;\n\twidth: 120px;\n\ttext-align: center;\n}\n\n.cn-nc-widget-widget__item-icon-wrap {\n\twidth: 32px;\n\theight: 32px;\n\tflex: 0 0 32px;\n\tposition: relative;\n}\n\n.cn-nc-widget-widget__item-icon {\n\twidth: 32px;\n\theight: 32px;\n\tobject-fit: cover;\n\tborder-radius: 50%;\n}\n\n.cn-nc-widget-widget__item-overlay {\n\tposition: absolute;\n\tright: -2px;\n\tbottom: -2px;\n\twidth: 14px;\n\theight: 14px;\n}\n\n.cn-nc-widget-widget__item-text {\n\tdisplay: flex;\n\tflex-direction: column;\n\tmin-width: 0;\n\tflex: 1;\n}\n\n.cn-nc-widget-widget__item-title {\n\tfont-weight: 600;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n}\n\n.cn-nc-widget-widget__item-subtitle {\n\tfont-size: 0.85em;\n\tcolor: var(--color-text-maxcontrast);\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n}\n</style>\n"],"names":["_createElementBlock","_normalizeClass","_openBlock","_createElementVNode","_toDisplayString","_withDirectives","_Fragment","_renderList"],"mappings":"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"}

package/dist/esm/components/CnNotificationPreferences/CnNotificationPreferences.vue.js CHANGED Viewed

@@ -2,7 +2,7 @@ import script from './CnNotificationPreferences.vue2.js';
 import { render } from './CnNotificationPreferences.vue3.js';
 script.render = render;
-script.__scopeId = "data-v-2a94b3e4";
+script.__scopeId = "data-v-c746b496";
 const __sfc_main = script;
 export { __sfc_main as default };

package/dist/esm/components/CnNotificationPreferences/CnNotificationPreferences.vue2.js CHANGED Viewed

@@ -29,6 +29,8 @@ var script = {
 		 * than an always-empty pane.
 		 */
 		cnAppId: { default: () => '' },
+		/** The app's look; `board` gives the section its navigation icon. */
+		cnLook: { default: 'nextcloud' },
 		/**
 		 * App-supplied labels for its notification rules, provided by the
 		 * CnAppRoot ancestor from its `notificationLabels` prop. Keyed