@uzum-tech/ui 1.12.21 → 1.12.22

package/dist/index.js

@@ -126022,6 +126022,18 @@
             (child, index) => renderGroupItem(child, item.key, index)
           )));
         };
+        const renderSearchAction = () => {
+          if (this.$slots.search) return this.$slots.search();
+          return /* @__PURE__ */ vue.h(Button, { text: true, onClick: this.onSearchClick }, () => /* @__PURE__ */ vue.h(UIcon, { size: 24 }, () => /* @__PURE__ */ vue.h(SearchIcon, null)));
+        };
+        const renderPreviewAction = () => {
+          if (this.$slots.preview) return this.$slots.preview();
+          return /* @__PURE__ */ vue.h(Button, { text: true, onClick: this.onPreview }, () => /* @__PURE__ */ vue.h(UIcon, { size: 24 }, () => /* @__PURE__ */ vue.h(EyeIcon, null)));
+        };
+        const renderLogoutAction = () => {
+          if (this.$slots.logout) return this.$slots.logout();
+          return /* @__PURE__ */ vue.h(Button, { text: true, onClick: this.onLogout }, () => /* @__PURE__ */ vue.h(UIcon, { size: 24 }, () => /* @__PURE__ */ vue.h(LogoutIcon, null)));
+        };
         const mobileMenuContent = /* @__PURE__ */ vue.h("div", { class: mobileMenuClass, style: this.cssVars }, /* @__PURE__ */ vue.h("div", { class: `${mobileMenuClass}__header` }, this.$slots.actions ? /* @__PURE__ */ vue.h("div", { class: `${mobileMenuClass}__actions` }, this.$slots.actions()) : this.showHeaderActions ? /* @__PURE__ */ vue.h("div", { class: `${mobileMenuClass}__actions` }, /* @__PURE__ */ vue.h(
           UDropdown,
           {
@@ -126056,7 +126068,7 @@
             )
           }
         ), /* @__PURE__ */ vue.h(UFlex, { size: 24 }, {
-          default: () => /* @__PURE__ */ vue.h(vue.Fragment, null, /* @__PURE__ */ vue.h(Button, { text: true, onClick: this.onSearchClick }, () => /* @__PURE__ */ vue.h(UIcon, { size: 24 }, () => /* @__PURE__ */ vue.h(SearchIcon, null))), /* @__PURE__ */ vue.h(Button, { text: true, onClick: this.onPreview }, () => /* @__PURE__ */ vue.h(UIcon, { size: 24 }, () => /* @__PURE__ */ vue.h(EyeIcon, null))), /* @__PURE__ */ vue.h(Button, { text: true, onClick: this.onLogout }, () => /* @__PURE__ */ vue.h(UIcon, { size: 24 }, () => /* @__PURE__ */ vue.h(LogoutIcon, null))))
+          default: () => /* @__PURE__ */ vue.h(vue.Fragment, null, renderSearchAction(), renderPreviewAction(), renderLogoutAction())
         })) : null, /* @__PURE__ */ vue.h(
           Button,
           {
@@ -126195,15 +126207,20 @@
         const search = vue.ref("");
         const searchText = vue.computed(() => localeRef.value.desktopSearchTitle);
         const placeholder = vue.computed(() => localeRef.value.searchPlaceholder);
+        const inputInstRef = vue.ref(null);
+        vue.onMounted(() => {
+          inputInstRef.value?.focus();
+        });
         return {
           search,
           searchText,
-          placeholder
+          placeholder,
+          inputInstRef
         };
       },
       render() {
         const blockClass = `${this.mergedClsPrefix}-header-search-desktop`;
-        return /* @__PURE__ */ vue.h("div", { class: blockClass, style: this.cssVars }, /* @__PURE__ */ vue.h(
+        const content = /* @__PURE__ */ vue.h("div", { class: blockClass, style: this.cssVars }, /* @__PURE__ */ vue.h(
           Button,
           {
             text: true,
@@ -126216,6 +126233,7 @@
         ), /* @__PURE__ */ vue.h(UFlex, { class: `${blockClass}__title`, justify: "space-between" }, /* @__PURE__ */ vue.h(UText, { variant: "title-l-medium", text: this.searchText })), /* @__PURE__ */ vue.h("div", { class: `${blockClass}__content` }, /* @__PURE__ */ vue.h("div", { class: `${blockClass}__input-wrapper` }, /* @__PURE__ */ vue.h(
           UInput,
           {
+            ref: "inputInstRef",
             value: this.searchValue,
             class: `${blockClass}__input`,
             placeholder: this.placeholder,
@@ -126240,6 +126258,15 @@
           cssVars: this.cssVars,
           onSelect: this.onResultSelect
         }));
+        if (!this.onSearchClose) return content;
+        return vue.withDirectives(content, [
+          [
+            clickoutside,
+            this.onSearchClose,
+            void 0,
+            { capture: true }
+          ]
+        ]);
       }
     });
 
@@ -126488,6 +126515,7 @@
         const searchValue = vue.ref("");
         const searchResults = vue.ref([]);
         const searchLoading = vue.ref(false);
+        const inputInstRef = vue.ref(null);
         const placeholder = vue.computed(() => localeRef.value.searchPlaceholder);
         const handleSearch = async () => {
           const query = searchValue.value.trim();
@@ -126527,11 +126555,15 @@
             void handleSearch();
           }, SEARCH_DEBOUNCE_MS);
         });
+        vue.onMounted(() => {
+          inputInstRef.value?.focus();
+        });
         return {
           placeholder,
           searchValue,
           searchResults,
           searchLoading,
+          inputInstRef,
           handleSearchInput,
           handleSearch,
           handleClose,
@@ -126564,6 +126596,7 @@
           ), /* @__PURE__ */ vue.h("div", { class: `${blockClass}__input-wrapper` }, /* @__PURE__ */ vue.h(UIcon, { size: 20, class: `${blockClass}__input-icon` }, () => /* @__PURE__ */ vue.h(SearchIcon, null)), /* @__PURE__ */ vue.h(
             UInput,
             {
+              ref: "inputInstRef",
               value: this.searchValue,
               placeholder: this.placeholder,
               onKeyup: (e) => {
@@ -126997,7 +127030,10 @@
           },
           {
             actions: $slots["mobile-actions"],
-            footer: $slots["mobile-footer"]
+            footer: $slots["mobile-footer"],
+            search: $slots["mobile-search"],
+            preview: $slots["mobile-preview"],
+            logout: $slots["mobile-logout"]
           }
         ) : null;
         const langNode = resolveWrappedSlot($slots.lang, (children) => children);
@@ -128776,7 +128812,7 @@
         watermarkProps: watermarkProps
     });
 
-    var version = "1.12.21";
+    var version = "1.12.22";
 
     function useExposeProxy(targetRef) {
       return new Proxy({}, {