@conduction/nextcloud-vue 2.65.0 → 2.66.0

package/dist/esm/components/CnDetailPage/CnDetailPage.vue3.js

@@ -1,4 +1,4 @@
-import { resolveComponent, openBlock, createElementBlock, normalizeClass, normalizeStyle, toDisplayString, createCommentVNode, createBlock, renderSlot, createElementVNode, Fragment, renderList, createVNode, withCtx, createTextVNode, createSlots } from 'vue';
+import { resolveComponent, openBlock, createElementBlock, normalizeClass, normalizeStyle, toDisplayString, createCommentVNode, createBlock, renderSlot, createElementVNode, Fragment, renderList, createVNode, withCtx, createTextVNode, createSlots, mergeProps } from 'vue';
 
 const _hoisted_1 = ["href"];
 const _hoisted_2 = { class: "cn-detail-page__header-left" };
@@ -20,7 +20,7 @@ const _hoisted_7 = {
 };
 const _hoisted_8 = { class: "cn-detail-page__header-actions" };
 const _hoisted_9 = {
-  key: 0,
+  key: 1,
   class: "cn-detail-page__list-nav",
   "data-testid": "cn-detail-page-list-nav"
 };
@@ -70,42 +70,43 @@ const _hoisted_20 = {
   class: "cn-detail-page__widget-edit"
 };
 const _hoisted_21 = ["id"];
-const _hoisted_22 = {
+const _hoisted_22 = ["id", "aria-label"];
+const _hoisted_23 = {
   key: 3,
   class: "cn-detail-page__stats"
 };
-const _hoisted_23 = {
+const _hoisted_24 = {
   key: 0,
   class: "cn-detail-page__section-title"
 };
-const _hoisted_24 = { class: "cn-detail-page__stats-table" };
-const _hoisted_25 = { key: 0 };
-const _hoisted_26 = {
+const _hoisted_25 = { class: "cn-detail-page__stats-table" };
+const _hoisted_26 = { key: 0 };
+const _hoisted_27 = {
   key: 4,
   class: "cn-detail-page__content"
 };
-const _hoisted_27 = {
+const _hoisted_28 = {
   key: 0,
   class: "cn-detail-page__content"
 };
-const _hoisted_28 = {
+const _hoisted_29 = {
   key: 1,
   class: "cn-detail-page__sections"
 };
-const _hoisted_29 = {
+const _hoisted_30 = {
   key: 6,
   class: "cn-detail-page__related-collections"
 };
-const _hoisted_30 = {
+const _hoisted_31 = {
   key: 0,
   class: "cn-detail-page__relation-links"
 };
-const _hoisted_31 = {
+const _hoisted_32 = {
   key: 9,
   class: "cn-detail-page__footer"
 };
-const _hoisted_32 = ["aria-label"];
-const _hoisted_33 = ["data-testid"];
+const _hoisted_33 = ["aria-label"];
+const _hoisted_34 = ["data-testid"];
 
 function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_CnBreadcrumbs = resolveComponent("CnBreadcrumbs");
@@ -113,6 +114,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_CnStatusBadge = resolveComponent("CnStatusBadge");
   const _component_CnTranslatedBadge = resolveComponent("CnTranslatedBadge");
   const _component_CnSummaryAggregates = resolveComponent("CnSummaryAggregates");
+  const _component_CnSegmentedControl = resolveComponent("CnSegmentedControl");
   const _component_ChevronLeft = resolveComponent("ChevronLeft");
   const _component_NcButton = resolveComponent("NcButton");
   const _component_ChevronRight = resolveComponent("ChevronRight");
@@ -138,6 +140,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_CnBodySections = resolveComponent("CnBodySections");
   const _component_Cog = resolveComponent("Cog");
   const _component_CnDashboardGrid = resolveComponent("CnDashboardGrid");
+  const _component_ViewDashboardOutline = resolveComponent("ViewDashboardOutline");
   const _component_Plus = resolveComponent("Plus");
   const _component_CnRelatedCollections = resolveComponent("CnRelatedCollections");
   const _component_CnWidgetStyleEditorModal = resolveComponent("CnWidgetStyleEditorModal");
@@ -236,6 +239,18 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
             ])
           ]),
           createElementVNode("div", _hoisted_8, [
+            (_ctx.showsPageViewSwitch)
+              ? (openBlock(), createBlock(_component_CnSegmentedControl, {
+                  key: 0,
+                  class: "cn-page-view-switch",
+                  options: _ctx.viewSwitchOptions,
+                  modelValue: _ctx.activeViewId,
+                  ariaLabel: _ctx.viewSwitchLabel,
+                  controls: _ctx.viewRegionId,
+                  "data-testid": "cn-detail-page-view-switch",
+                  "onUpdate:modelValue": _ctx.selectView
+                }, null, 8 /* PROPS */, ["options", "modelValue", "ariaLabel", "controls", "onUpdate:modelValue"]))
+              : createCommentVNode("v-if", true),
             ($props.listNavigation && $props.listNavigation.available)
               ? (openBlock(), createElementBlock("div", _hoisted_9, [
                   createVNode(_component_NcButton, {
@@ -271,7 +286,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
               : createCommentVNode("v-if", true),
             ($options.effectivePrimaryLabel && !$options.showsNextStepCard)
               ? (openBlock(), createBlock(_component_NcButton, {
-                  key: 1,
+                  key: 2,
                   id: $options.primaryActionAnchorId,
                   ref: "primaryActionButton",
                   variant: "primary",
@@ -318,7 +333,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
             }), 128 /* KEYED_FRAGMENT */)),
             ($options.showsLifecycleActions)
               ? (openBlock(), createBlock(_component_CnLifecycleActions, {
-                  key: 2,
+                  key: 3,
                   objectId: $props.objectId,
                   object: $options.currentObject,
                   config: $props.lifecycleActions,
@@ -331,7 +346,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
               : createCommentVNode("v-if", true),
             ($options.effectiveHeaderActions.length > 0)
               ? (openBlock(), createBlock(_component_CnActionButtons, {
-                  key: 3,
+                  key: 4,
                   actions: $options.effectiveHeaderActions,
                   display: "menu",
                   "data-testid": "cn-detail-page-header-actions",
@@ -350,7 +365,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
             }),
             ($options.canEditRecord && !$options.foldsEditIntoActions)
               ? (openBlock(), createBlock(_component_NcButton, {
-                  key: 4,
+                  key: 5,
                   variant: "secondary",
                   "data-testid": "cn-detail-page-edit",
                   "aria-label": $options.editActionLabel,
@@ -669,87 +684,105 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                       "data-testid": "cn-detail-body-sections-before-body"
                     }, null, 8 /* PROPS */, ["sections", "context"]))
                   : createCommentVNode("v-if", true),
-                ($options.hasBodyGrid)
-                  ? (openBlock(), createBlock(_component_CnDashboardGrid, {
-                      key: `cn-detail-grid-${$options.editingBody ? 'editing' : 'live'}`,
-                      layout: $options.bodyGridLayout,
-                      editable: $options.editingBody,
-                      columns: 12,
-                      columnOpts: $props.columnOpts,
-                      class: "cn-detail-page__grid",
-                      onLayoutChange: $options.onBodyLayoutChange
-                    }, {
-                      widget: withCtx(({ item }) => [
-                        createElementVNode("div", {
-                          class: normalizeClass(["cn-detail-page__grid-item", { 'cn-detail-page__grid-item--fit': !!item.sizeToContent }]),
-                          "aria-labelledby": $options.showGridTitle(item) ? `widget-title-${item.id}` : undefined
-                        }, [
-                          ($options.showsCog(item))
-                            ? (openBlock(), createElementBlock("div", _hoisted_20, [
-                                createVNode(_component_NcButton, {
-                                  variant: "tertiary",
-                                  "aria-label": _ctx.t('nextcloud-vue', 'Configure widget'),
-                                  onClick: $event => ($options.configureWidget(item))
-                                }, {
-                                  icon: withCtx(() => [
-                                    createVNode(_component_Cog, { size: 18 })
-                                  ]),
-                                  _: 1 /* STABLE */
-                                }, 8 /* PROPS */, ["aria-label", "onClick"])
-                              ]))
-                            : createCommentVNode("v-if", true),
-                          ($options.showGridTitle(item))
-                            ? (openBlock(), createElementBlock("h3", {
-                                key: 1,
-                                id: `widget-title-${item.id}`,
-                                class: "cn-detail-page__widget-title"
-                              }, toDisplayString($options.gridTitle(item)), 9 /* TEXT, PROPS */, _hoisted_21))
-                            : createCommentVNode("v-if", true),
-                          renderSlot(_ctx.$slots, `widget-${item.widgetId}`, {
-                            item: item,
+                (openBlock(true), createElementBlock(Fragment, null, renderList($options.bodyGridSections, (section) => {
+                  return (openBlock(), createBlock(_component_CnDashboardGrid, mergeProps({
+                    key: `cn-detail-grid-${section.key}-${$options.editingBody ? 'editing' : 'live'}`
+                  }, { ref_for: true }, section.attrs, {
+                    layout: section.layout,
+                    editable: $options.editingBody,
+                    columns: 12,
+                    columnOpts: $props.columnOpts,
+                    class: "cn-detail-page__grid",
+                    onLayoutChange: $event => (section.view ? _ctx.onViewLayoutChange($event) : $options.onBodyLayoutChange($event))
+                  }), {
+                    widget: withCtx(({ item }) => [
+                      createElementVNode("div", {
+                        class: normalizeClass(["cn-detail-page__grid-item", { 'cn-detail-page__grid-item--fit': !!item.sizeToContent }]),
+                        "aria-labelledby": $options.showGridTitle(item) ? `widget-title-${item.id}` : undefined
+                      }, [
+                        ($options.showsCog(item))
+                          ? (openBlock(), createElementBlock("div", _hoisted_20, [
+                              createVNode(_component_NcButton, {
+                                variant: "tertiary",
+                                "aria-label": _ctx.t('nextcloud-vue', 'Configure widget'),
+                                onClick: $event => ($options.configureWidget(item))
+                              }, {
+                                icon: withCtx(() => [
+                                  createVNode(_component_Cog, { size: 18 })
+                                ]),
+                                _: 1 /* STABLE */
+                              }, 8 /* PROPS */, ["aria-label", "onClick"])
+                            ]))
+                          : createCommentVNode("v-if", true),
+                        ($options.showGridTitle(item))
+                          ? (openBlock(), createElementBlock("h3", {
+                              key: 1,
+                              id: `widget-title-${item.id}`,
+                              class: "cn-detail-page__widget-title"
+                            }, toDisplayString($options.gridTitle(item)), 9 /* TEXT, PROPS */, _hoisted_21))
+                          : createCommentVNode("v-if", true),
+                        renderSlot(_ctx.$slots, `widget-${item.widgetId}`, {
+                          item: item,
+                          widget: $options.findWidget(item),
+                          objectId: $props.objectId,
+                          object: $options.resolvedObject,
+                          objectData: $options.resolvedObject,
+                          objectType: $options.resolvedObjectType,
+                          register: $props.register,
+                          schema: $props.schema
+                        }, () => [
+                          createVNode(_component_CnDetailWidgetHost, {
                             widget: $options.findWidget(item),
+                            chrome: "card",
+                            showCardTitle: $options.showCardTitle(item),
                             objectId: $props.objectId,
-                            object: $options.resolvedObject,
-                            objectData: $options.resolvedObject,
+                            object: $options.currentObject,
                             objectType: $options.resolvedObjectType,
+                            schemaObject: $options.currentSchema,
                             register: $props.register,
-                            schema: $props.schema
-                          }, () => [
-                            createVNode(_component_CnDetailWidgetHost, {
-                              widget: $options.findWidget(item),
-                              chrome: "card",
-                              showCardTitle: $options.showCardTitle(item),
-                              objectId: $props.objectId,
-                              object: $options.currentObject,
-                              objectType: $options.resolvedObjectType,
-                              schemaObject: $options.currentSchema,
-                              register: $props.register,
-                              schema: $props.schema,
-                              store: $options.effectiveObjectStore,
-                              surface: $props.surface,
-                              integrationContext: $options.effectiveIntegrationContext,
-                              hideEmpty: $props.hideEmpty,
-                              cnRegistry: $options.cnRegistry,
-                              availableWidgets: $options.bodyGridWidgets,
-                              onGeoSaved: $options.onGeoSaved,
-                              onOpenIntegration: $options.onAutoBodyOpenIntegration
-                            }, null, 8 /* PROPS */, ["widget", "showCardTitle", "objectId", "object", "objectType", "schemaObject", "register", "schema", "store", "surface", "integrationContext", "hideEmpty", "cnRegistry", "availableWidgets", "onGeoSaved", "onOpenIntegration"])
-                          ])
-                        ], 10 /* CLASS, PROPS */, _hoisted_19)
-                      ]),
-                      _: 3 /* FORWARDED */
-                    }, 8 /* PROPS */, ["layout", "editable", "columnOpts", "onLayoutChange"]))
+                            schema: $props.schema,
+                            store: $options.effectiveObjectStore,
+                            surface: $props.surface,
+                            integrationContext: $options.effectiveIntegrationContext,
+                            hideEmpty: $props.hideEmpty,
+                            cnRegistry: $options.cnRegistry,
+                            availableWidgets: $options.bodyGridWidgets,
+                            onGeoSaved: $options.onGeoSaved,
+                            onOpenIntegration: $options.onAutoBodyOpenIntegration
+                          }, null, 8 /* PROPS */, ["widget", "showCardTitle", "objectId", "object", "objectType", "schemaObject", "register", "schema", "store", "surface", "integrationContext", "hideEmpty", "cnRegistry", "availableWidgets", "onGeoSaved", "onOpenIntegration"])
+                        ])
+                      ], 10 /* CLASS, PROPS */, _hoisted_19)
+                    ]),
+                    _: 3 /* FORWARDED */
+                  }, 16 /* FULL_PROPS */, ["layout", "editable", "columnOpts", "onLayoutChange"]))
+                }), 128 /* KEYED_FRAGMENT */)),
+                ($options.viewIsEmpty)
+                  ? (openBlock(), createElementBlock("div", {
+                      key: 2,
+                      id: _ctx.viewRegionId,
+                      role: "region",
+                      "aria-label": _ctx.activeView ? _ctx.activeView.label : null,
+                      class: "cn-page-view-region cn-page-view-region--empty",
+                      "data-testid": "cn-detail-page-view-empty"
+                    }, [
+                      createVNode(_component_NcEmptyContent, { description: _ctx.viewEmptyText }, {
+                        icon: withCtx(() => [
+                          createVNode(_component_ViewDashboardOutline, { size: 48 })
+                        ]),
+                        _: 1 /* STABLE */
+                      }, 8 /* PROPS */, ["description"])
+                    ], 8 /* PROPS */, _hoisted_22))
                   : createCommentVNode("v-if", true),
                 ($options.hasStats)
-                  ? (openBlock(), createElementBlock("div", _hoisted_22, [
+                  ? (openBlock(), createElementBlock("div", _hoisted_23, [
                       renderSlot(_ctx.$slots, "stats-header", {}, () => [
                         ($props.statsTitle)
-                          ? (openBlock(), createElementBlock("h3", _hoisted_23, toDisplayString($options.resolvedStatsTitle), 1 /* TEXT */))
+                          ? (openBlock(), createElementBlock("h3", _hoisted_24, toDisplayString($options.resolvedStatsTitle), 1 /* TEXT */))
                           : createCommentVNode("v-if", true)
                       ]),
-                      createElementVNode("table", _hoisted_24, [
+                      createElementVNode("table", _hoisted_25, [
                         ($props.statsColumns.length > 0)
-                          ? (openBlock(), createElementBlock("thead", _hoisted_25, [
+                          ? (openBlock(), createElementBlock("thead", _hoisted_26, [
                               createElementVNode("tr", null, [
                                 (openBlock(true), createElementBlock(Fragment, null, renderList($props.statsColumns, (col) => {
                                   return (openBlock(), createElementBlock("th", {
@@ -780,14 +813,14 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                         ])
                       ])
                     ]))
-                  : (openBlock(), createElementBlock("div", _hoisted_26, [
+                  : (openBlock(), createElementBlock("div", _hoisted_27, [
                       (!$options.hasBodyGrid)
-                        ? (openBlock(), createElementBlock("div", _hoisted_27, [
+                        ? (openBlock(), createElementBlock("div", _hoisted_28, [
                             renderSlot(_ctx.$slots, "default")
                           ]))
                         : createCommentVNode("v-if", true),
                       (_ctx.$slots.sections)
-                        ? (openBlock(), createElementBlock("div", _hoisted_28, [
+                        ? (openBlock(), createElementBlock("div", _hoisted_29, [
                             renderSlot(_ctx.$slots, "sections")
                           ]))
                         : createCommentVNode("v-if", true)
@@ -802,9 +835,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                     }, null, 8 /* PROPS */, ["sections", "context"]))
                   : createCommentVNode("v-if", true),
                 (($props.relatedCollections && $props.relatedCollections.length > 0) || ($props.relationLinks && $props.relationLinks.length > 0))
-                  ? (openBlock(), createElementBlock("div", _hoisted_29, [
+                  ? (openBlock(), createElementBlock("div", _hoisted_30, [
                       ($props.relationLinks && $props.relationLinks.length > 0)
-                        ? (openBlock(), createElementBlock("div", _hoisted_30, [
+                        ? (openBlock(), createElementBlock("div", _hoisted_31, [
                             (openBlock(true), createElementBlock(Fragment, null, renderList($props.relationLinks, (link, li) => {
                               return (openBlock(), createBlock(_component_NcButton, {
                                 key: li,
@@ -851,7 +884,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                     }, null, 8 /* PROPS */, ["sections", "context"]))
                   : createCommentVNode("v-if", true),
                 (_ctx.$slots.footer)
-                  ? (openBlock(), createElementBlock("div", _hoisted_31, [
+                  ? (openBlock(), createElementBlock("div", _hoisted_32, [
                       renderSlot(_ctx.$slots, "footer")
                     ]))
                   : createCommentVNode("v-if", true)
@@ -899,9 +932,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                   onOpenIntegration: $options.onAutoBodyOpenIntegration
                 }, null, 8 /* PROPS */, ["widget", "objectId", "object", "objectType", "schemaObject", "register", "schema", "store", "surface", "integrationContext", "hideEmpty", "cnRegistry", "availableWidgets", "onGeoSaved", "onOpenIntegration"])
               ])
-            ], 8 /* PROPS */, _hoisted_33))
+            ], 8 /* PROPS */, _hoisted_34))
           }), 128 /* KEYED_FRAGMENT */))
-        ], 8 /* PROPS */, _hoisted_32))
+        ], 8 /* PROPS */, _hoisted_33))
       : createCommentVNode("v-if", true),
     ($data.showWidgetConfig)
       ? (openBlock(), createBlock(_component_CnWidgetStyleEditorModal, {