@conduction/nextcloud-vue 2.103.0 → 2.104.0

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

@@ -1,4 +1,4 @@
-import { resolveComponent, openBlock, createElementBlock, Fragment, createElementVNode, mergeProps, renderSlot, createBlock, withCtx, createVNode, createTextVNode, toDisplayString, createCommentVNode, renderList, resolveDynamicComponent, normalizeClass, normalizeStyle } from 'vue';
+import { resolveComponent, openBlock, createElementBlock, Fragment, createElementVNode, mergeProps, renderSlot, createVNode, createCommentVNode, createBlock, withCtx, createTextVNode, toDisplayString, renderList, resolveDynamicComponent, normalizeClass, normalizeStyle } from 'vue';
 
 const _hoisted_1 = {
   key: 0,
@@ -7,83 +7,89 @@ const _hoisted_1 = {
 };
 const _hoisted_2 = {
   key: 0,
+  class: "cn-actions-bar__search cn-actions-bar__search--toolbar",
+  "data-testid": "cn-actions-bar-search-toolbar"
+};
+const _hoisted_3 = ["placeholder", "value", "aria-label"];
+const _hoisted_4 = {
+  key: 1,
   class: "cn-actions-bar__view-controls",
   "data-testid": "cn-actions-bar-view-controls"
 };
-const _hoisted_3 = ["aria-label"];
-const _hoisted_4 = ["aria-label"];
-const _hoisted_5 = ["href", "aria-label", "title", "data-mode", "onClick"];
-const _hoisted_6 = ["aria-pressed", "aria-label", "title", "disabled", "data-mode", "onClick"];
-const _hoisted_7 = {
+const _hoisted_5 = ["aria-label"];
+const _hoisted_6 = ["aria-label"];
+const _hoisted_7 = ["href", "aria-label", "title", "data-mode", "onClick"];
+const _hoisted_8 = ["aria-pressed", "aria-label", "title", "disabled", "data-mode", "onClick"];
+const _hoisted_9 = {
   key: 1,
   class: "cn-actions-bar__info"
 };
-const _hoisted_8 = {
+const _hoisted_10 = {
   key: 0,
   class: "cn-actions-bar__search"
 };
-const _hoisted_9 = ["placeholder", "value", "aria-label"];
-const _hoisted_10 = {
+const _hoisted_11 = ["placeholder", "value", "aria-label"];
+const _hoisted_12 = {
   key: 1,
   class: "cn-actions-bar__count"
 };
-const _hoisted_11 = ["aria-label"];
-const _hoisted_12 = ["aria-pressed", "aria-label", "title", "onClick"];
-const _hoisted_13 = {
+const _hoisted_13 = ["aria-label"];
+const _hoisted_14 = ["aria-pressed", "aria-label", "title", "onClick"];
+const _hoisted_15 = {
   key: 2,
   class: "cn-actions-bar__view-toggle-label"
 };
-const _hoisted_14 = { class: "cn-actions-bar__actions" };
-const _hoisted_15 = {
+const _hoisted_16 = { class: "cn-actions-bar__actions" };
+const _hoisted_17 = {
   key: 0,
   class: "cn-actions-bar__sort"
 };
-const _hoisted_16 = {
+const _hoisted_18 = {
   key: 2,
   class: "cn-actions-bar__row cn-actions-bar__row--search",
   "data-testid": "cn-actions-bar-row-search"
 };
-const _hoisted_17 = {
+const _hoisted_19 = {
   key: 0,
   class: "cn-actions-bar__search"
 };
-const _hoisted_18 = ["placeholder", "value", "aria-label"];
-const _hoisted_19 = {
+const _hoisted_20 = ["placeholder", "value", "aria-label"];
+const _hoisted_21 = {
   key: 1,
   class: "cn-actions-bar__count"
 };
-const _hoisted_20 = {
+const _hoisted_22 = {
   class: "cn-actions-bar__active-label",
   "data-testid": "cn-actions-bar-active-label"
 };
-const _hoisted_21 = { class: "cn-actions-bar__filter-chip-label" };
-const _hoisted_22 = ["aria-label", "onClick"];
-const _hoisted_23 = {
+const _hoisted_23 = { class: "cn-actions-bar__filter-chip-label" };
+const _hoisted_24 = ["aria-label", "onClick"];
+const _hoisted_25 = {
   class: "cn-actions-bar__sr-status",
   role: "status"
 };
-const _hoisted_24 = {
+const _hoisted_26 = {
   key: 3,
   class: "cn-actions-bar__selection",
   "data-testid": "cn-selection-strip"
 };
-const _hoisted_25 = {
+const _hoisted_27 = {
   class: "cn-actions-bar__selection-count",
   "aria-hidden": "true"
 };
-const _hoisted_26 = ["aria-label"];
-const _hoisted_27 = { class: "cn-actions-bar__band-lead" };
-const _hoisted_28 = {
+const _hoisted_28 = ["aria-label"];
+const _hoisted_29 = { class: "cn-actions-bar__band-lead" };
+const _hoisted_30 = {
   key: 2,
   class: "cn-actions-bar__band-hint",
   "data-testid": "cn-bulk-band-hint"
 };
 
 function render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_Magnify = resolveComponent("Magnify");
   const _component_Tune = resolveComponent("Tune");
   const _component_NcButton = resolveComponent("NcButton");
   const _component_CnIcon = resolveComponent("CnIcon");
-  const _component_Magnify = resolveComponent("Magnify");
   const _component_SortVariant = resolveComponent("SortVariant");
   const _component_NcSelect = resolveComponent("NcSelect");
   const _component_Plus = resolveComponent("Plus");
@@ -110,8 +116,24 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         ? (openBlock(), createElementBlock("div", _hoisted_1, [
             renderSlot(_ctx.$slots, "filters"),
             renderSlot(_ctx.$slots, "actions-end"),
-            ($props.showSidebarToggle || _ctx.$slots['filter-menu'] || ($props.showViewToggle && $options.viewSegments.length > 1))
+            ($props.showSearch && $options.searchInToolbar)
               ? (openBlock(), createElementBlock("div", _hoisted_2, [
+                  createVNode(_component_Magnify, {
+                    size: 18,
+                    class: "cn-actions-bar__search-icon"
+                  }),
+                  createElementVNode("input", {
+                    type: "search",
+                    class: "cn-actions-bar__search-input",
+                    placeholder: $props.searchPlaceholder || $options.t('nextcloud-vue', 'Search…'),
+                    value: $props.searchValue,
+                    "aria-label": $props.searchPlaceholder || $options.t('nextcloud-vue', 'Search'),
+                    onInput: _cache[0] || (_cache[0] = (...args) => ($options.onSearchInput && $options.onSearchInput(...args)))
+                  }, null, 40 /* PROPS, NEED_HYDRATION */, _hoisted_3)
+                ]))
+              : createCommentVNode("v-if", true),
+            ($props.showSidebarToggle || _ctx.$slots['filter-menu'] || ($props.showViewToggle && $options.viewSegments.length > 1))
+              ? (openBlock(), createElementBlock("div", _hoisted_4, [
                   ($props.showSidebarToggle)
                     ? (openBlock(), createBlock(_component_NcButton, {
                         key: 0,
@@ -119,7 +141,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                         class: "cn-actions-bar__filter-button",
                         "data-testid": "cn-actions-bar-filter-button",
                         pressed: $props.sidebarOpen,
-                        onClick: _cache[0] || (_cache[0] = $event => (_ctx.$emit('toggle-sidebar')))
+                        onClick: _cache[1] || (_cache[1] = $event => (_ctx.$emit('toggle-sidebar')))
                       }, {
                         icon: withCtx(() => [
                           createVNode(_component_Tune, { size: 16 })
@@ -132,7 +154,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                                 class: "cn-actions-bar__filter-badge",
                                 "data-testid": "cn-actions-bar-filter-badge",
                                 "aria-label": $options.filterCountLabel
-                              }, toDisplayString($options.filterCount), 9 /* TEXT, PROPS */, _hoisted_3))
+                              }, toDisplayString($options.filterCount), 9 /* TEXT, PROPS */, _hoisted_5))
                             : createCommentVNode("v-if", true)
                         ]),
                         _: 1 /* STABLE */
@@ -172,7 +194,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                                         size: 18,
                                         class: "cn-actions-bar__view-toggle-icon"
                                       }))
-                                ], 8 /* PROPS */, _hoisted_5))
+                                ], 8 /* PROPS */, _hoisted_7))
                               : (openBlock(), createElementBlock("button", {
                                   key: 1,
                                   type: "button",
@@ -196,19 +218,19 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                                         size: 18,
                                         class: "cn-actions-bar__view-toggle-icon"
                                       }))
-                                ], 10 /* CLASS, PROPS */, _hoisted_6))
+                                ], 10 /* CLASS, PROPS */, _hoisted_8))
                           ], 64 /* STABLE_FRAGMENT */))
                         }), 128 /* KEYED_FRAGMENT */))
-                      ], 8 /* PROPS */, _hoisted_4))
+                      ], 8 /* PROPS */, _hoisted_6))
                     : createCommentVNode("v-if", true)
                 ]))
               : createCommentVNode("v-if", true)
           ]))
         : createCommentVNode("v-if", true),
       (!$options.isBoardLayout)
-        ? (openBlock(), createElementBlock("div", _hoisted_7, [
+        ? (openBlock(), createElementBlock("div", _hoisted_9, [
             ($props.showSearch)
-              ? (openBlock(), createElementBlock("div", _hoisted_8, [
+              ? (openBlock(), createElementBlock("div", _hoisted_10, [
                   createVNode(_component_Magnify, {
                     size: 18,
                     class: "cn-actions-bar__search-icon"
@@ -219,11 +241,11 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                     placeholder: $props.searchPlaceholder || $options.t('nextcloud-vue', 'Search…'),
                     value: $props.searchValue,
                     "aria-label": $props.searchPlaceholder || $options.t('nextcloud-vue', 'Search'),
-                    onInput: _cache[1] || (_cache[1] = (...args) => ($options.onSearchInput && $options.onSearchInput(...args)))
-                  }, null, 40 /* PROPS, NEED_HYDRATION */, _hoisted_9)
+                    onInput: _cache[2] || (_cache[2] = (...args) => ($options.onSearchInput && $options.onSearchInput(...args)))
+                  }, null, 40 /* PROPS, NEED_HYDRATION */, _hoisted_11)
                 ]))
               : ($props.showCount && $options.hasTotal)
-                ? (openBlock(), createElementBlock("span", _hoisted_10, toDisplayString($options.countText), 1 /* TEXT */))
+                ? (openBlock(), createElementBlock("span", _hoisted_12, toDisplayString($options.countText), 1 /* TEXT */))
                 : createCommentVNode("v-if", true),
             renderSlot(_ctx.$slots, "after-search"),
             ($props.showCount && $props.showSearch && $props.showCountWithSearch)
@@ -271,17 +293,17 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                             class: "cn-actions-bar__view-toggle-icon"
                           })),
                       (!$options.isBoardLayout)
-                        ? (openBlock(), createElementBlock("span", _hoisted_13, toDisplayString(seg.label), 1 /* TEXT */))
+                        ? (openBlock(), createElementBlock("span", _hoisted_15, toDisplayString(seg.label), 1 /* TEXT */))
                         : createCommentVNode("v-if", true)
-                    ], 10 /* CLASS, PROPS */, _hoisted_12))
+                    ], 10 /* CLASS, PROPS */, _hoisted_14))
                   }), 128 /* KEYED_FRAGMENT */))
-                ], 8 /* PROPS */, _hoisted_11))
+                ], 8 /* PROPS */, _hoisted_13))
               : createCommentVNode("v-if", true)
           ]))
         : createCommentVNode("v-if", true),
-      createElementVNode("div", _hoisted_14, [
+      createElementVNode("div", _hoisted_16, [
         ($props.showSortSelect && $props.sortOptions.length)
-          ? (openBlock(), createElementBlock("div", _hoisted_15, [
+          ? (openBlock(), createElementBlock("div", _hoisted_17, [
               createVNode(_component_SortVariant, {
                 size: 20,
                 class: "cn-actions-bar__sort-icon",
@@ -309,7 +331,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
               "aria-label": $options.t('nextcloud-vue', 'Search and columns'),
               title: $options.t('nextcloud-vue', 'Search and columns'),
               pressed: $props.sidebarOpen,
-              onClick: _cache[2] || (_cache[2] = $event => (_ctx.$emit('toggle-sidebar')))
+              onClick: _cache[3] || (_cache[3] = $event => (_ctx.$emit('toggle-sidebar')))
             }, {
               icon: withCtx(() => [
                 createVNode(_component_Tune, { size: 20 })
@@ -363,7 +385,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
               default: withCtx(() => [
                 createVNode(_component_NcActionButton, {
                   disabled: $props.refreshing || $props.refreshDisabled,
-                  onClick: _cache[3] || (_cache[3] = $event => (_ctx.$emit('refresh')))
+                  onClick: _cache[4] || (_cache[4] = $event => (_ctx.$emit('refresh')))
                 }, {
                   icon: withCtx(() => [
                     ($props.refreshing)
@@ -460,7 +482,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                 ($props.showMassImport)
                   ? (openBlock(), createBlock(_component_NcActionButton, {
                       key: 2,
-                      onClick: _cache[4] || (_cache[4] = $event => (_ctx.$emit('show-import')))
+                      onClick: _cache[5] || (_cache[5] = $event => (_ctx.$emit('show-import')))
                     }, {
                       icon: withCtx(() => [
                         createVNode(_component_Import, { size: 20 })
@@ -474,7 +496,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                 ($props.showMassExport)
                   ? (openBlock(), createBlock(_component_NcActionButton, {
                       key: 3,
-                      onClick: _cache[5] || (_cache[5] = $event => (_ctx.$emit('show-export')))
+                      onClick: _cache[6] || (_cache[6] = $event => (_ctx.$emit('show-export')))
                     }, {
                       icon: withCtx(() => [
                         createVNode(_component_Export, { size: 20 })
@@ -490,7 +512,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                       key: 4,
                       disabled: $props.selectedIds.length < 1,
                       title: $props.selectedIds.length < 1 ? $options.t('nextcloud-vue', 'Select 1 or more items to copy') : '',
-                      onClick: _cache[6] || (_cache[6] = $event => (_ctx.$emit('show-copy')))
+                      onClick: _cache[7] || (_cache[7] = $event => (_ctx.$emit('show-copy')))
                     }, {
                       icon: withCtx(() => [
                         createVNode(_component_ContentCopy, { size: 20 })
@@ -506,7 +528,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                       key: 5,
                       disabled: $props.selectedIds.length < 1,
                       title: $props.selectedIds.length < 1 ? $options.t('nextcloud-vue', 'Select 1 or more items to delete') : '',
-                      onClick: _cache[7] || (_cache[7] = $event => (_ctx.$emit('show-delete')))
+                      onClick: _cache[8] || (_cache[8] = $event => (_ctx.$emit('show-delete')))
                     }, {
                       icon: withCtx(() => [
                         createVNode(_component_TrashCanOutline, { size: 20 })
@@ -527,9 +549,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
           : createCommentVNode("v-if", true)
       ]),
       ($options.isBoardLayout)
-        ? (openBlock(), createElementBlock("div", _hoisted_16, [
-            ($props.showSearch)
-              ? (openBlock(), createElementBlock("div", _hoisted_17, [
+        ? (openBlock(), createElementBlock("div", _hoisted_18, [
+            ($props.showSearch && !$options.searchInToolbar)
+              ? (openBlock(), createElementBlock("div", _hoisted_19, [
                   createVNode(_component_Magnify, {
                     size: 18,
                     class: "cn-actions-bar__search-icon"
@@ -540,23 +562,23 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                     placeholder: $props.searchPlaceholder || $options.t('nextcloud-vue', 'Search…'),
                     value: $props.searchValue,
                     "aria-label": $props.searchPlaceholder || $options.t('nextcloud-vue', 'Search'),
-                    onInput: _cache[8] || (_cache[8] = (...args) => ($options.onSearchInput && $options.onSearchInput(...args)))
-                  }, null, 40 /* PROPS, NEED_HYDRATION */, _hoisted_18)
+                    onInput: _cache[9] || (_cache[9] = (...args) => ($options.onSearchInput && $options.onSearchInput(...args)))
+                  }, null, 40 /* PROPS, NEED_HYDRATION */, _hoisted_20)
                 ]))
-              : ($props.showCount && $options.hasTotal)
-                ? (openBlock(), createElementBlock("span", _hoisted_19, toDisplayString($options.countText), 1 /* TEXT */))
+              : ($props.showCount && $options.hasTotal && !$options.searchInToolbar)
+                ? (openBlock(), createElementBlock("span", _hoisted_21, toDisplayString($options.countText), 1 /* TEXT */))
                 : createCommentVNode("v-if", true),
             renderSlot(_ctx.$slots, "after-search"),
             ($props.activeFilterChips.length > 0)
               ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [
-                  createElementVNode("span", _hoisted_20, toDisplayString($options.t('nextcloud-vue', 'Active:')), 1 /* TEXT */),
+                  createElementVNode("span", _hoisted_22, toDisplayString($options.t('nextcloud-vue', 'Active:')), 1 /* TEXT */),
                   (openBlock(true), createElementBlock(Fragment, null, renderList($props.activeFilterChips, (chip) => {
                     return (openBlock(), createElementBlock("span", {
                       key: chip.key,
                       class: "cn-actions-bar__filter-chip",
                       "data-testid": "cn-actions-bar-filter-chip"
                     }, [
-                      createElementVNode("span", _hoisted_21, toDisplayString(chip.label), 1 /* TEXT */),
+                      createElementVNode("span", _hoisted_23, toDisplayString(chip.label), 1 /* TEXT */),
                       createElementVNode("button", {
                         type: "button",
                         class: "cn-actions-bar__filter-chip-remove",
@@ -567,14 +589,14 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                           size: 14,
                           "aria-hidden": "true"
                         })
-                      ], 8 /* PROPS */, _hoisted_22)
+                      ], 8 /* PROPS */, _hoisted_24)
                     ]))
                   }), 128 /* KEYED_FRAGMENT */)),
                   createElementVNode("button", {
                     type: "button",
                     class: "cn-actions-bar__clear-all",
                     "data-testid": "cn-actions-bar-clear-all",
-                    onClick: _cache[9] || (_cache[9] = $event => (_ctx.$emit('clear-filters')))
+                    onClick: _cache[10] || (_cache[10] = $event => (_ctx.$emit('clear-filters')))
                   }, toDisplayString($options.t('nextcloud-vue', 'Clear all')), 1 /* TEXT */)
                 ], 64 /* STABLE_FRAGMENT */))
               : createCommentVNode("v-if", true),
@@ -587,15 +609,15 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
               : createCommentVNode("v-if", true)
           ]))
         : createCommentVNode("v-if", true),
-      createElementVNode("span", _hoisted_23, toDisplayString($props.selectable && $props.selectedIds.length > 0 ? $options.selectionCountText : ''), 1 /* TEXT */),
+      createElementVNode("span", _hoisted_25, toDisplayString($props.selectable && $props.selectedIds.length > 0 ? $options.selectionCountText : ''), 1 /* TEXT */),
       (!$options.isBoardLayout && $props.selectable && $props.selectedIds.length > 0)
-        ? (openBlock(), createElementBlock("div", _hoisted_24, [
-            createElementVNode("span", _hoisted_25, toDisplayString($options.selectionCountText), 1 /* TEXT */),
+        ? (openBlock(), createElementBlock("div", _hoisted_26, [
+            createElementVNode("span", _hoisted_27, toDisplayString($options.selectionCountText), 1 /* TEXT */),
             ($props.showMassCopy)
               ? (openBlock(), createBlock(_component_NcButton, {
                   key: 0,
                   variant: "secondary",
-                  onClick: _cache[10] || (_cache[10] = $event => (_ctx.$emit('show-copy')))
+                  onClick: _cache[11] || (_cache[11] = $event => (_ctx.$emit('show-copy')))
                 }, {
                   icon: withCtx(() => [
                     createVNode(_component_ContentCopy, { size: 20 })
@@ -610,7 +632,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
               ? (openBlock(), createBlock(_component_NcButton, {
                   key: 1,
                   variant: "secondary",
-                  onClick: _cache[11] || (_cache[11] = $event => (_ctx.$emit('show-delete')))
+                  onClick: _cache[12] || (_cache[12] = $event => (_ctx.$emit('show-delete')))
                 }, {
                   icon: withCtx(() => [
                     createVNode(_component_TrashCanOutline, { size: 20 })
@@ -643,7 +665,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
             createVNode(_component_NcButton, {
               class: "cn-actions-bar__selection-clear",
               variant: "tertiary",
-              onClick: _cache[12] || (_cache[12] = $event => (_ctx.$emit('clear-selection')))
+              onClick: _cache[13] || (_cache[13] = $event => (_ctx.$emit('clear-selection')))
             }, {
               icon: withCtx(() => [
                 createVNode(_component_Close, { size: 20 })
@@ -664,13 +686,13 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
           "aria-label": $options.t('nextcloud-vue', 'Actions for the selection'),
           "data-testid": "cn-bulk-band"
         }, [
-          createElementVNode("strong", _hoisted_27, toDisplayString($options.bulkBandLead), 1 /* TEXT */),
+          createElementVNode("strong", _hoisted_29, toDisplayString($options.bulkBandLead), 1 /* TEXT */),
           ($props.showMassCopy)
             ? (openBlock(), createBlock(_component_NcButton, {
                 key: 0,
                 variant: "secondary",
                 disabled: $props.selectedIds.length === 0,
-                onClick: _cache[13] || (_cache[13] = $event => (_ctx.$emit('show-copy')))
+                onClick: _cache[14] || (_cache[14] = $event => (_ctx.$emit('show-copy')))
               }, {
                 default: withCtx(() => [
                   createTextVNode(toDisplayString($options.t('nextcloud-vue', 'Copy selected')), 1 /* TEXT */)
@@ -683,7 +705,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                 key: 1,
                 variant: "secondary",
                 disabled: $props.selectedIds.length === 0,
-                onClick: _cache[14] || (_cache[14] = $event => (_ctx.$emit('show-delete')))
+                onClick: _cache[15] || (_cache[15] = $event => (_ctx.$emit('show-delete')))
               }, {
                 default: withCtx(() => [
                   createTextVNode(toDisplayString($options.t('nextcloud-vue', 'Delete selected')), 1 /* TEXT */)
@@ -711,9 +733,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
             selectedIds: $props.selectedIds
           }),
           ($props.bulkHint)
-            ? (openBlock(), createElementBlock("span", _hoisted_28, toDisplayString($props.bulkHint), 1 /* TEXT */))
+            ? (openBlock(), createElementBlock("span", _hoisted_30, toDisplayString($props.bulkHint), 1 /* TEXT */))
             : createCommentVNode("v-if", true)
-        ], 10 /* CLASS, PROPS */, _hoisted_26))
+        ], 10 /* CLASS, PROPS */, _hoisted_28))
       : createCommentVNode("v-if", true)
   ], 64 /* STABLE_FRAGMENT */))
 }