@conduction/nextcloud-vue 2.56.0-beta.36 → 2.56.0-beta.37

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

@@ -8,7 +8,7 @@ const _hoisted_1 = {
 const _hoisted_2 = ["data-lane"];
 const _hoisted_3 = ["aria-expanded", "onClick"];
 const _hoisted_4 = ["aria-label"];
-const _hoisted_5 = ["data-column", "onDrop"];
+const _hoisted_5 = ["data-column", "data-unreachable", "onDrop"];
 const _hoisted_6 = {
   key: 0,
   class: "cn-board-view__column-head"
@@ -39,48 +39,59 @@ const _hoisted_13 = {
 const _hoisted_14 = ["aria-label"];
 const _hoisted_15 = ["data-card-id", "draggable", "onDragstart", "onKeydown"];
 const _hoisted_16 = { class: "cn-board-view__card-head" };
-const _hoisted_17 = ["data-card-id", "aria-label", "onClick", "onAuxclick"];
-const _hoisted_18 = { class: "cn-board-view__menu-wrap" };
-const _hoisted_19 = ["data-card-id", "aria-expanded", "aria-label", "onClick"];
-const _hoisted_20 = ["aria-label", "onKeydown"];
-const _hoisted_21 = ["aria-label"];
-const _hoisted_22 = {
+const _hoisted_17 = ["data-card-id", "checked", "aria-label", "onChange"];
+const _hoisted_18 = ["data-card-id", "aria-label", "onClick", "onAuxclick"];
+const _hoisted_19 = { class: "cn-board-view__menu-wrap" };
+const _hoisted_20 = ["data-card-id", "aria-expanded", "aria-label", "onClick"];
+const _hoisted_21 = ["aria-label", "onKeydown"];
+const _hoisted_22 = ["aria-label"];
+const _hoisted_23 = {
   class: "cn-board-view__menu-heading",
   "aria-hidden": "true"
 };
-const _hoisted_23 = ["data-target", "onClick"];
-const _hoisted_24 = ["onClick"];
+const _hoisted_24 = ["data-target", "aria-disabled", "onClick"];
 const _hoisted_25 = {
+  key: 0,
+  class: "cn-board-view__menu-note",
+  "data-testid": "cn-board-menu-blocked"
+};
+const _hoisted_26 = ["onClick"];
+const _hoisted_27 = {
   key: 0,
   class: "cn-board-view__card-sub",
   "data-testid": "cn-board-card-sub"
 };
-const _hoisted_26 = {
+const _hoisted_28 = {
   key: 1,
   class: "cn-board-view__card-pills"
 };
-const _hoisted_27 = {
+const _hoisted_29 = {
   key: 2,
   class: "cn-board-view__card-footer",
   "data-testid": "cn-board-card-footer"
 };
-const _hoisted_28 = ["title", "aria-label"];
-const _hoisted_29 = { "aria-hidden": "true" };
-const _hoisted_30 = ["data-card-id", "aria-label", "onClick", "onAuxclick"];
-const _hoisted_31 = {
-  key: 1,
-  class: "cn-board-view__move"
+const _hoisted_30 = ["title", "aria-label"];
+const _hoisted_31 = { "aria-hidden": "true" };
+const _hoisted_32 = {
+  key: 0,
+  class: "cn-board-view__select-label"
 };
-const _hoisted_32 = { class: "cn-board-view__move-label" };
-const _hoisted_33 = ["data-card-id", "value", "onChange"];
-const _hoisted_34 = ["value"];
+const _hoisted_33 = ["data-card-id", "checked", "aria-label", "onChange"];
+const _hoisted_34 = ["data-card-id", "aria-label", "onClick", "onAuxclick"];
 const _hoisted_35 = {
+  key: 2,
+  class: "cn-board-view__move"
+};
+const _hoisted_36 = { class: "cn-board-view__move-label" };
+const _hoisted_37 = ["data-card-id", "value", "onChange"];
+const _hoisted_38 = ["value"];
+const _hoisted_39 = {
   key: 3,
   class: "cn-board-view__empty",
   "data-testid": "cn-board-column-empty"
 };
-const _hoisted_36 = ["onClick"];
-const _hoisted_37 = {
+const _hoisted_40 = ["onClick"];
+const _hoisted_41 = {
   key: 2,
   class: "cn-board-view__refusal",
   "data-testid": "cn-board-refusal",
@@ -91,7 +102,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_CnStatusBadge = resolveComponent("CnStatusBadge");
 
   return (openBlock(), createElementBlock("div", {
-    class: normalizeClass(["cn-board-view", { 'cn-board-view--board': $options.isBoardLook }]),
+    class: normalizeClass(["cn-board-view", { 'cn-board-view--board': $options.isBoardLook, 'cn-board-view--wrap': $props.wrapColumns, 'cn-board-view--selecting': $options.selectedKeys.length > 0 }]),
     "data-testid": "cn-board-view"
   }, [
     (!$options.usable)
@@ -120,11 +131,12 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
               (openBlock(true), createElementBlock(Fragment, null, renderList(lane.columns, (column) => {
                 return (openBlock(), createElementBlock("section", {
                   key: `col-${lane.key}-${column.key}`,
-                  class: "cn-board-view__column",
+                  class: normalizeClass(["cn-board-view__column", { 'cn-board-view__column--unreachable': $options.isUnreachable(column) }]),
                   role: "listitem",
                   "data-testid": "cn-board-column",
                   "data-column": column.key,
-                  onDragover: _cache[2] || (_cache[2] = withModifiers(() => {}, ["prevent"])),
+                  "data-unreachable": $options.isUnreachable(column) ? 'true' : null,
+                  onDragover: _cache[3] || (_cache[3] = withModifiers(() => {}, ["prevent"])),
                   onDrop: $event => ($options.onDrop(column, $event))
                 }, [
                   ($options.isBoardLook)
@@ -171,11 +183,24 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                             "data-card-id": $options.cardKey(card),
                             draggable: $options.canMove,
                             onDragstart: $event => ($options.onDragStart(card, column, $event)),
+                            onDragend: _cache[2] || (_cache[2] = (...args) => ($options.onDragEnd && $options.onDragEnd(...args))),
                             onKeydown: $event => ($options.onCardKeydown(card, column, lane, $event))
                           }, [
                             ($options.isBoardLook)
                               ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
                                   createElementVNode("div", _hoisted_16, [
+                                    ($props.selectable)
+                                      ? (openBlock(), createElementBlock("input", {
+                                          key: 0,
+                                          type: "checkbox",
+                                          class: "cn-board-view__select",
+                                          "data-testid": "cn-board-card-select",
+                                          "data-card-id": $options.cardKey(card),
+                                          checked: $options.isSelected(card),
+                                          "aria-label": $options.selectLabel(card),
+                                          onChange: $event => ($options.toggleSelected(card))
+                                        }, null, 40 /* PROPS, NEED_HYDRATION */, _hoisted_17))
+                                      : createCommentVNode("v-if", true),
                                     createElementVNode("a", {
                                       href: "#",
                                       class: "cn-board-view__card-title",
@@ -185,8 +210,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                                       onClick: withModifiers($event => ($options.openCard(card, $event)), ["prevent"]),
                                       onMousedown: _cache[0] || (_cache[0] = (...args) => ($options.preventMiddleClickAutoscroll && $options.preventMiddleClickAutoscroll(...args))),
                                       onAuxclick: $event => ($options.onCardAuxClick(card, $event))
-                                    }, toDisplayString($options.roleText(card, $options.roles.title) || $options.cardKey(card)), 41 /* TEXT, PROPS, NEED_HYDRATION */, _hoisted_17),
-                                    createElementVNode("span", _hoisted_18, [
+                                    }, toDisplayString($options.roleText(card, $options.roles.title) || $options.cardKey(card)), 41 /* TEXT, PROPS, NEED_HYDRATION */, _hoisted_18),
+                                    createElementVNode("span", _hoisted_19, [
                                       createElementVNode("button", {
                                         type: "button",
                                         class: "cn-board-view__menu-button",
@@ -196,12 +221,12 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                                         "aria-expanded": String($options.isMenuOpen(card)),
                                         "aria-label": $options.menuButtonLabel(card),
                                         onClick: $event => ($options.toggleMenu(card))
-                                      }, [...(_cache[3] || (_cache[3] = [
+                                      }, [...(_cache[4] || (_cache[4] = [
                                         createElementVNode("span", {
                                           class: "cn-board-view__menu-dots",
                                           "aria-hidden": "true"
                                         }, "⋯", -1 /* CACHED */)
-                                      ]))], 8 /* PROPS */, _hoisted_19),
+                                      ]))], 8 /* PROPS */, _hoisted_20),
                                       ($options.isMenuOpen(card))
                                         ? (openBlock(), createElementBlock("div", {
                                             key: 0,
@@ -217,19 +242,25 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                                                   role: "group",
                                                   "aria-label": $options.moveLabel
                                                 }, [
-                                                  createElementVNode("span", _hoisted_22, toDisplayString($options.moveLabel), 1 /* TEXT */),
+                                                  createElementVNode("span", _hoisted_23, toDisplayString($options.moveLabel), 1 /* TEXT */),
                                                   (openBlock(true), createElementBlock(Fragment, null, renderList($options.moveTargets(lane, column), (target) => {
                                                     return (openBlock(), createElementBlock("button", {
                                                       key: `m-${$options.cardKey(card)}-${target.key}`,
                                                       type: "button",
                                                       role: "menuitem",
-                                                      class: "cn-board-view__menu-item",
+                                                      class: normalizeClass(["cn-board-view__menu-item", { 'cn-board-view__menu-item--blocked': !$options.isMoveAllowed(card, target) }]),
                                                       "data-testid": "cn-board-menu-move",
                                                       "data-target": target.key,
-                                                      onClick: $event => ($options.onMenuMove(card, column, target))
-                                                    }, toDisplayString(target.label), 9 /* TEXT, PROPS */, _hoisted_23))
+                                                      "aria-disabled": $options.isMoveAllowed(card, target) ? null : 'true',
+                                                      onClick: $event => ($options.isMoveAllowed(card, target) && $options.onMenuMove(card, column, target))
+                                                    }, [
+                                                      createTextVNode(toDisplayString(target.label) + " ", 1 /* TEXT */),
+                                                      (!$options.isMoveAllowed(card, target))
+                                                        ? (openBlock(), createElementBlock("span", _hoisted_25, toDisplayString($options.notAllowedLabel), 1 /* TEXT */))
+                                                        : createCommentVNode("v-if", true)
+                                                    ], 10 /* CLASS, PROPS */, _hoisted_24))
                                                   }), 128 /* KEYED_FRAGMENT */))
-                                                ], 8 /* PROPS */, _hoisted_21))
+                                                ], 8 /* PROPS */, _hoisted_22))
                                               : createCommentVNode("v-if", true),
                                             createElementVNode("button", {
                                               type: "button",
@@ -237,16 +268,16 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                                               class: "cn-board-view__menu-item",
                                               "data-testid": "cn-board-menu-new-tab",
                                               onClick: $event => ($options.onMenuOpenNewTab(card))
-                                            }, toDisplayString($options.openInNewTabLabel), 9 /* TEXT, PROPS */, _hoisted_24)
-                                          ], 40 /* PROPS, NEED_HYDRATION */, _hoisted_20))
+                                            }, toDisplayString($options.openInNewTabLabel), 9 /* TEXT, PROPS */, _hoisted_26)
+                                          ], 40 /* PROPS, NEED_HYDRATION */, _hoisted_21))
                                         : createCommentVNode("v-if", true)
                                     ])
                                   ]),
                                   ($options.roleText(card, $options.roles.sub) !== '')
-                                    ? (openBlock(), createElementBlock("span", _hoisted_25, toDisplayString($options.roleText(card, $options.roles.sub)), 1 /* TEXT */))
+                                    ? (openBlock(), createElementBlock("span", _hoisted_27, toDisplayString($options.roleText(card, $options.roles.sub)), 1 /* TEXT */))
                                     : createCommentVNode("v-if", true),
                                   ($options.roleText(card, $options.roles.pill) !== '')
-                                    ? (openBlock(), createElementBlock("span", _hoisted_26, [
+                                    ? (openBlock(), createElementBlock("span", _hoisted_28, [
                                         createVNode(_component_CnStatusBadge, {
                                           class: "cn-board-view__pill",
                                           "data-testid": "cn-board-card-pill",
@@ -256,7 +287,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                                       ]))
                                     : createCommentVNode("v-if", true),
                                   ($options.dueText(card) !== '' || $options.ownerName(card) !== '')
-                                    ? (openBlock(), createElementBlock("span", _hoisted_27, [
+                                    ? (openBlock(), createElementBlock("span", _hoisted_29, [
                                         createElementVNode("span", {
                                           class: normalizeClass(["cn-board-view__due-text", $options.cardDueState(card) ? `cn-board-view__due-text--${$options.cardDueState(card)}` : null]),
                                           "data-testid": "cn-board-card-due"
@@ -270,16 +301,29 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                                               role: "img",
                                               "aria-label": $options.ownerName(card)
                                             }, [
-                                              createElementVNode("span", _hoisted_29, toDisplayString($options.ownerInitials(card)), 1 /* TEXT */)
-                                            ], 8 /* PROPS */, _hoisted_28))
+                                              createElementVNode("span", _hoisted_31, toDisplayString($options.ownerInitials(card)), 1 /* TEXT */)
+                                            ], 8 /* PROPS */, _hoisted_30))
                                           : createCommentVNode("v-if", true)
                                       ]))
                                     : createCommentVNode("v-if", true)
                                 ], 64 /* STABLE_FRAGMENT */))
                               : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+                                  ($props.selectable)
+                                    ? (openBlock(), createElementBlock("label", _hoisted_32, [
+                                        createElementVNode("input", {
+                                          type: "checkbox",
+                                          class: "cn-board-view__select",
+                                          "data-testid": "cn-board-card-select",
+                                          "data-card-id": $options.cardKey(card),
+                                          checked: $options.isSelected(card),
+                                          "aria-label": $options.selectLabel(card),
+                                          onChange: $event => ($options.toggleSelected(card))
+                                        }, null, 40 /* PROPS, NEED_HYDRATION */, _hoisted_33)
+                                      ]))
+                                    : createCommentVNode("v-if", true),
                                   ($options.dueLabel(card))
                                     ? (openBlock(), createElementBlock("span", {
-                                        key: 0,
+                                        key: 1,
                                         class: normalizeClass(["cn-board-view__due", `cn-board-view__due--${$options.dueState(card)}`]),
                                         "data-testid": "cn-board-due"
                                       }, toDisplayString($options.dueLabel(card)), 3 /* TEXT, CLASS */))
@@ -299,10 +343,10 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                                     onClick: $event => ($options.openCard(card, $event)),
                                     onMousedown: _cache[1] || (_cache[1] = (...args) => ($options.preventMiddleClickAutoscroll && $options.preventMiddleClickAutoscroll(...args))),
                                     onAuxclick: $event => ($options.onCardAuxClick(card, $event))
-                                  }, toDisplayString($options.openLabel), 41 /* TEXT, PROPS, NEED_HYDRATION */, _hoisted_30),
+                                  }, toDisplayString($options.openLabel), 41 /* TEXT, PROPS, NEED_HYDRATION */, _hoisted_34),
                                   ($options.canMove)
-                                    ? (openBlock(), createElementBlock("label", _hoisted_31, [
-                                        createElementVNode("span", _hoisted_32, toDisplayString($options.moveLabel), 1 /* TEXT */),
+                                    ? (openBlock(), createElementBlock("label", _hoisted_35, [
+                                        createElementVNode("span", _hoisted_36, toDisplayString($options.moveLabel), 1 /* TEXT */),
                                         createElementVNode("select", {
                                           "data-testid": "cn-board-move",
                                           "data-card-id": $options.cardKey(card),
@@ -313,16 +357,16 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                                             return (openBlock(), createElementBlock("option", {
                                               key: `t-${$options.cardKey(card)}-${target.key}`,
                                               value: target.key
-                                            }, toDisplayString(target.label), 9 /* TEXT, PROPS */, _hoisted_34))
+                                            }, toDisplayString(target.label), 9 /* TEXT, PROPS */, _hoisted_38))
                                           }), 128 /* KEYED_FRAGMENT */))
-                                        ], 40 /* PROPS, NEED_HYDRATION */, _hoisted_33)
+                                        ], 40 /* PROPS, NEED_HYDRATION */, _hoisted_37)
                                       ]))
                                     : createCommentVNode("v-if", true)
                                 ], 64 /* STABLE_FRAGMENT */))
                           ], 42 /* CLASS, PROPS, NEED_HYDRATION */, _hoisted_15))
                         }), 128 /* KEYED_FRAGMENT */))
                       ], 8 /* PROPS */, _hoisted_14))
-                    : (openBlock(), createElementBlock("p", _hoisted_35, toDisplayString($options.emptyColumnText), 1 /* TEXT */)),
+                    : (openBlock(), createElementBlock("p", _hoisted_39, toDisplayString($options.emptyColumnText), 1 /* TEXT */)),
                   ($options.hiddenCount(lane, column) > 0)
                     ? (openBlock(), createElementBlock("button", {
                         key: 4,
@@ -330,9 +374,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                         class: "cn-board-view__show-more",
                         "data-testid": "cn-board-show-more",
                         onClick: $event => ($options.showMore(lane, column))
-                      }, toDisplayString($options.showMoreLabel($options.hiddenCount(lane, column))), 9 /* TEXT, PROPS */, _hoisted_36))
+                      }, toDisplayString($options.showMoreLabel($options.hiddenCount(lane, column))), 9 /* TEXT, PROPS */, _hoisted_40))
                     : createCommentVNode("v-if", true)
-                ], 40 /* PROPS, NEED_HYDRATION */, _hoisted_5))
+                ], 42 /* CLASS, PROPS, NEED_HYDRATION */, _hoisted_5))
               }), 128 /* KEYED_FRAGMENT */))
             ], 8 /* PROPS */, _hoisted_4), [
               [vShow, !$options.isCollapsed(lane.key)]
@@ -340,7 +384,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
           ], 8 /* PROPS */, _hoisted_2))
         }), 128 /* KEYED_FRAGMENT */)),
     ($data.refusal)
-      ? (openBlock(), createElementBlock("p", _hoisted_37, toDisplayString($data.refusal), 1 /* TEXT */))
+      ? (openBlock(), createElementBlock("p", _hoisted_41, toDisplayString($data.refusal), 1 /* TEXT */))
       : createCommentVNode("v-if", true)
   ], 2 /* CLASS */))
 }