tuikit-atomicx-vue3 3.3.3 → 3.4.1

package/dist/components/Search/Search.js

@@ -1,25 +1,25 @@
-import { defineComponent, ref, watch, createElementBlock, openBlock, normalizeStyle, normalizeClass, createBlock, resolveDynamicComponent, unref } from "vue";
-import { useSearchState } from "../../states/SearchState.js";
-import { SearchType } from "../../types/engine.js";
-import { VariantType, defaultTypeLabels } from "../../types/search.js";
-import { debounce } from "../../utils/lodash.js";
-import SearchAdvancedComponent from "./SearchAdvanced/SearchAdvanced.js";
-import SearchBarComponent from "./SearchBar/SearchBar.js";
-import SearchResultsComponent from "./SearchResults/SearchResults.js";
-import { _ as _export_sfc } from "../../_plugin-vue_export-helper-1tPrXgE0.js";
-const _sfc_main = /* @__PURE__ */ defineComponent({
+import { defineComponent as K, ref as E, watch as k, createElementBlock as O, openBlock as i, normalizeStyle as j, normalizeClass as N, createBlock as v, resolveDynamicComponent as S, unref as s } from "vue";
+import { useSearchState as U } from "../../states/SearchState.js";
+import { SearchType as u } from "../../types/engine.js";
+import { VariantType as f, defaultTypeLabels as x } from "../../types/search.js";
+import { debounce as V } from "../../utils/lodash.js";
+import z from "./SearchAdvanced/SearchAdvanced.js";
+import $ from "./SearchBar/SearchBar.js";
+import q from "./SearchResults/SearchResults.js";
+import { _ as H } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
+const X = /* @__PURE__ */ K({
   __name: "Search",
   props: {
-    variant: { default: VariantType.MINI },
-    SearchBar: { type: [Object, Function], default: SearchBarComponent },
-    SearchResults: { type: [Object, Function], default: SearchResultsComponent },
-    SearchAdvanced: { type: [Object, Function], default: SearchAdvancedComponent },
+    variant: { default: f.MINI },
+    SearchBar: { type: [Object, Function], default: $ },
+    SearchResults: { type: [Object, Function], default: q },
+    SearchAdvanced: { type: [Object, Function], default: z },
     SearchResultsPresearch: { default: void 0 },
     SearchResultsLoading: { default: void 0 },
     SearchResultsEmpty: { default: void 0 },
     SearchResultItem: { type: [Object, Function], default: void 0 },
     debounceTime: { default: 300 },
-    autoFocus: { type: Boolean, default: false },
+    autoFocus: { type: Boolean, default: !1 },
     className: { default: "" },
     style: { default: () => ({}) },
     onKeywordChange: {},
@@ -27,163 +27,124 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     onResultItemClick: {},
     onError: {}
   },
-  setup(__props) {
-    const props = __props;
-    const {
-      keyword,
-      results,
-      isLoading,
-      error,
-      selectedSearchType,
-      searchAdvancedParams,
-      setKeyword,
-      setSelectedType,
-      loadMore,
-      setSearchMessageAdvancedParams,
-      setSearchUserAdvancedParams,
-      setSearchGroupAdvancedParams
-    } = useSearchState(props.variant);
-    const searchValue = ref(keyword.value);
-    const isExternalUpdate = ref(false);
-    const debouncedSearch = debounce(async (searchKeyword) => {
-      var _a;
+  setup(r) {
+    const t = r, {
+      keyword: d,
+      results: A,
+      isLoading: p,
+      error: w,
+      selectedSearchType: y,
+      searchAdvancedParams: R,
+      setKeyword: h,
+      setSelectedType: I,
+      loadMore: m,
+      setSearchMessageAdvancedParams: P,
+      setSearchUserAdvancedParams: b,
+      setSearchGroupAdvancedParams: T
+    } = U(t.variant), l = E(d.value), o = E(!1), c = V(async (e) => {
+      var a;
       try {
-        isExternalUpdate.value = true;
-        await setKeyword(searchKeyword);
-      } catch (err) {
-        (_a = props.onError) == null ? void 0 : _a.call(props, err);
+        o.value = !0, await h(e);
+      } catch (n) {
+        (a = t.onError) == null || a.call(t, n);
       }
-    }, props.debounceTime);
-    watch(
-      searchValue,
-      (newValue) => {
-        if (!isExternalUpdate.value) {
-          debouncedSearch(newValue);
-        }
+    }, t.debounceTime);
+    k(
+      l,
+      (e) => {
+        o.value || c(e);
       },
-      { immediate: false }
-    );
-    watch(keyword, (newKeyword) => {
-      if (isExternalUpdate.value) {
-        isExternalUpdate.value = false;
+      { immediate: !1 }
+    ), k(d, (e) => {
+      if (o.value) {
+        o.value = !1;
         return;
       }
-      searchValue.value = newKeyword;
+      l.value = e;
     });
-    const handleInputChange = (e) => {
-      var _a;
-      const target = e.target;
-      const { value } = target;
-      searchValue.value = value;
-      (_a = props.onKeywordChange) == null ? void 0 : _a.call(props, value);
-      if (props.variant !== VariantType.EXACT) {
-        debouncedSearch(value);
-      }
-    };
-    const handleKeyDown = (e) => {
-      var _a;
-      if (e.key === "Enter") {
-        (_a = debouncedSearch.cancel) == null ? void 0 : _a.call(debouncedSearch);
-        isExternalUpdate.value = true;
-        setKeyword(searchValue.value);
-      }
-    };
-    const handleClear = () => {
-      var _a, _b;
-      searchValue.value = "";
-      (_a = debouncedSearch.cancel) == null ? void 0 : _a.call(debouncedSearch);
-      isExternalUpdate.value = true;
-      setKeyword("");
-      (_b = props.onKeywordChange) == null ? void 0 : _b.call(props, "");
-    };
-    const handleAdvancedChange = (type, params) => {
-      const storeParams = searchAdvancedParams.value.get(type) || {};
-      switch (type) {
-        case SearchType.MESSAGE:
-          setSearchMessageAdvancedParams({
-            ...storeParams,
-            ...params
+    const M = (e) => {
+      var g;
+      const a = e.target, { value: n } = a;
+      l.value = n, (g = t.onKeywordChange) == null || g.call(t, n), t.variant !== f.EXACT && c(n);
+    }, B = (e) => {
+      var a;
+      e.key === "Enter" && ((a = c.cancel) == null || a.call(c), o.value = !0, h(l.value));
+    }, F = () => {
+      var e, a;
+      l.value = "", (e = c.cancel) == null || e.call(c), o.value = !0, h(""), (a = t.onKeywordChange) == null || a.call(t, "");
+    }, C = (e, a) => {
+      const n = R.value.get(e) || {};
+      switch (e) {
+        case u.MESSAGE:
+          P({
+            ...n,
+            ...a
           });
           break;
-        case SearchType.USER:
-          setSearchUserAdvancedParams({
-            ...storeParams,
-            ...params
+        case u.USER:
+          b({
+            ...n,
+            ...a
           });
           break;
-        case SearchType.GROUP:
-          setSearchGroupAdvancedParams({
-            ...storeParams,
-            ...params
+        case u.GROUP:
+          T({
+            ...n,
+            ...a
           });
           break;
       }
-    };
-    const handleResultItemClick = (item, type) => {
-      if (props.onResultItemClick) {
-        props.onResultItemClick(item, type);
-      }
-      if (type === SearchType.MESSAGE) {
-        const { conversationID = "" } = item.conversation || {};
-        handleAdvancedChange(SearchType.MESSAGE, { conversationID });
+    }, G = (e, a) => {
+      if (t.onResultItemClick && t.onResultItemClick(e, a), a === u.MESSAGE) {
+        const { conversationID: n = "" } = e.conversation || {};
+        C(u.MESSAGE, { conversationID: n });
       }
-    };
-    const handleViewMore = (type) => {
-      if (props.variant === VariantType.STANDARD && type !== SearchType.CHAT_MESSAGE) {
-        setSelectedType(type);
-      }
-      loadMore == null ? void 0 : loadMore(type);
-    };
-    const stopClickPropagation = (e) => {
+    }, L = (e) => {
+      t.variant === f.STANDARD && e !== u.CHAT_MESSAGE && I(e), m == null || m(e);
+    }, D = (e) => {
       e.stopPropagation();
     };
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", {
-        class: normalizeClass([_ctx.$style.Search, props.className]),
-        style: normalizeStyle(props.style),
-        onClick: stopClickPropagation
-      }, [
-        (openBlock(), createBlock(resolveDynamicComponent(_ctx.SearchBar), {
-          value: searchValue.value,
-          "on-change": handleInputChange,
-          "on-key-down": handleKeyDown,
-          "on-clear": handleClear,
-          "auto-focus": _ctx.autoFocus,
-          variant: _ctx.variant
-        }, null, 40, ["value", "auto-focus", "variant"])),
-        (openBlock(), createBlock(resolveDynamicComponent(_ctx.SearchAdvanced), {
-          variant: _ctx.variant,
-          "search-type": unref(selectedSearchType),
-          "advanced-params": unref(searchAdvancedParams),
-          "on-advanced-params-change": handleAdvancedChange
-        }, null, 40, ["variant", "search-type", "advanced-params"])),
-        (openBlock(), createBlock(resolveDynamicComponent(_ctx.SearchResults), {
-          results: unref(results),
-          "is-loading": unref(isLoading),
-          error: unref(error),
-          keyword: unref(keyword),
-          "type-labels": unref(defaultTypeLabels),
-          "search-type": unref(selectedSearchType),
-          "on-result-item-click": handleResultItemClick,
-          "on-load-more": handleViewMore,
-          SearchResultsPresearch: _ctx.SearchResultsPresearch,
-          SearchResultsLoading: _ctx.SearchResultsLoading,
-          SearchResultsEmpty: _ctx.SearchResultsEmpty,
-          SearchResultItem: _ctx.SearchResultItem,
-          variant: _ctx.variant
-        }, null, 40, ["results", "is-loading", "error", "keyword", "type-labels", "search-type", "SearchResultsPresearch", "SearchResultsLoading", "SearchResultsEmpty", "SearchResultItem", "variant"]))
-      ], 6);
-    };
+    return (e, a) => (i(), O("div", {
+      class: N([e.$style.Search, t.className]),
+      style: j(t.style),
+      onClick: D
+    }, [
+      (i(), v(S(r.SearchBar), {
+        value: l.value,
+        "on-change": M,
+        "on-key-down": B,
+        "on-clear": F,
+        "auto-focus": r.autoFocus,
+        variant: r.variant
+      }, null, 40, ["value", "auto-focus", "variant"])),
+      (i(), v(S(r.SearchAdvanced), {
+        variant: r.variant,
+        "search-type": s(y),
+        "advanced-params": s(R),
+        "on-advanced-params-change": C
+      }, null, 40, ["variant", "search-type", "advanced-params"])),
+      (i(), v(S(r.SearchResults), {
+        results: s(A),
+        "is-loading": s(p),
+        error: s(w),
+        keyword: s(d),
+        "type-labels": s(x),
+        "search-type": s(y),
+        "on-result-item-click": G,
+        "on-load-more": L,
+        SearchResultsPresearch: r.SearchResultsPresearch,
+        SearchResultsLoading: r.SearchResultsLoading,
+        SearchResultsEmpty: r.SearchResultsEmpty,
+        SearchResultItem: r.SearchResultItem,
+        variant: r.variant
+      }, null, 40, ["results", "is-loading", "error", "keyword", "type-labels", "search-type", "SearchResultsPresearch", "SearchResultsLoading", "SearchResultsEmpty", "SearchResultItem", "variant"]))
+    ], 6));
   }
-});
-const Search = "_Search_gblqf_1";
-const style0 = {
-  Search
-};
-const cssModules = {
-  "$style": style0
-};
-const SearchComponent = /* @__PURE__ */ _export_sfc(_sfc_main, [["__cssModules", cssModules]]);
+}), J = "_Search_gblqf_1", Q = {
+  Search: J
+}, W = {
+  $style: Q
+}, se = /* @__PURE__ */ H(X, [["__cssModules", W]]);
 export {
-  SearchComponent as default
+  se as default
 };