tuikit-atomicx-vue3 0.1.0 → 3.3.0-beta.3

package/dist/components/Search/SearchResults/SearchResultsItem/Message/Message.js

@@ -0,0 +1,311 @@
+import { defineComponent, useCssModule, computed, createElementBlock, openBlock, normalizeClass, unref, createElementVNode, createVNode, createCommentVNode, toDisplayString, createBlock, resolveDynamicComponent, h } from "vue";
+import TUIChatEngine from "@tencentcloud/chat-uikit-engine";
+import { SearchType } from "../../../../../types/engine.js";
+import Avatar from "../../../../Avatar/Avatar.js";
+import { useUIKit } from "@tencentcloud/uikit-base-component-vue3";
+import { highlightText } from "../utils/highlightText.js";
+import { _ as _export_sfc } from "../../../../../_plugin-vue_export-helper-1tPrXgE0.js";
+const _hoisted_1 = ["innerHTML"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "Message",
+  props: {
+    keyword: {},
+    data: {},
+    type: {},
+    className: {},
+    style: {},
+    onClick: { type: Function }
+  },
+  setup(__props) {
+    const $style = useCssModule();
+    const formatTime = (timestamp) => {
+      return new Date(timestamp * 1e3).toLocaleString();
+    };
+    const props = __props;
+    const { t } = useUIKit();
+    const { nick, avatar, nameCard, from, time } = props.data;
+    const name = computed(() => nameCard || nick || from);
+    const highlightedName = computed(() => {
+      if (!props.keyword) {
+        return name.value;
+      }
+      return highlightText(name.value, props.keyword, $style["SearchMessage__highlight"]);
+    });
+    const renderTextContent = (messageContent, keyword) => {
+      if (messageContent.text && Array.isArray(messageContent.text)) {
+        return messageContent.text.map((item, idx) => {
+          if (item.name === "text") {
+            return h("span", {
+              key: idx,
+              innerHTML: highlightText(item.text, keyword, $style["SearchMessage__highlight"])
+            });
+          }
+          if (item.name === "img") {
+            return h("img", {
+              key: idx,
+              src: item.src,
+              alt: item.emojiKey || "",
+              class: $style["SearchMessage__emoji-img"],
+              draggable: false,
+              "data-emoji-key": item.emojiKey || ""
+            });
+          }
+          return null;
+        }).filter(Boolean);
+      }
+      return h("span", {
+        innerHTML: highlightText(messageContent.text, keyword, $style["SearchMessage__highlight"])
+      });
+    };
+    const renderMessageContent = (message, searchKeyword) => {
+      var _a;
+      const messageContent = ((_a = message.getMessageContent) == null ? void 0 : _a.call(message)) || {};
+      const messageType = message.type;
+      switch (messageType) {
+        case TUIChatEngine.TYPES.MSG_TEXT:
+          return h(
+            "div",
+            {
+              class: $style["SearchMessage__text"]
+            },
+            renderTextContent(messageContent, searchKeyword)
+          );
+        case TUIChatEngine.TYPES.MSG_IMAGE:
+          return h("img", {
+            src: messageContent.url,
+            class: $style["SearchMessage__image-thumb"],
+            alt: t("Search.messageType.image")
+          });
+        case TUIChatEngine.TYPES.MSG_VIDEO:
+          return h(
+            "div",
+            {
+              class: $style["SearchMessage__video-thumb"]
+            },
+            [
+              h("img", {
+                src: messageContent.snapshotUrl,
+                alt: t("Search.messageType.videoCover")
+              }),
+              h(
+                "span",
+                {
+                  class: $style["SearchMessage__play-icon"]
+                },
+                [
+                  h(
+                    "svg",
+                    {
+                      width: "24",
+                      height: "24",
+                      viewBox: "0 0 24 24",
+                      fill: "none"
+                    },
+                    [
+                      h("circle", {
+                        cx: "12",
+                        cy: "12",
+                        r: "12",
+                        fill: "rgba(43,93,245,0.15)"
+                      }),
+                      h("polygon", {
+                        points: "9,7 18,12 9,17",
+                        fill: "#2B5DF5"
+                      })
+                    ]
+                  )
+                ]
+              )
+            ]
+          );
+        case TUIChatEngine.TYPES.MSG_FILE:
+          return h(
+            "div",
+            {
+              class: $style["SearchMessage__file-box"]
+            },
+            [
+              h(
+                "span",
+                {
+                  class: $style["SearchMessage__text"]
+                },
+                messageContent.name
+              ),
+              h(
+                "span",
+                {
+                  class: $style["SearchMessage__text"]
+                },
+                messageContent.size
+              )
+            ]
+          );
+        case TUIChatEngine.TYPES.MSG_AUDIO:
+          return h(
+            "div",
+            {
+              class: $style["SearchMessage__audio-box"]
+            },
+            [
+              h(
+                "span",
+                {
+                  class: $style["SearchMessage__audio-icon"]
+                },
+                [
+                  h(
+                    "svg",
+                    {
+                      width: "20",
+                      height: "20",
+                      viewBox: "0 0 20 20",
+                      fill: "none"
+                    },
+                    [
+                      h("rect", {
+                        x: "3",
+                        y: "7",
+                        width: "4",
+                        height: "6",
+                        rx: "1",
+                        fill: "#2B5DF5"
+                      }),
+                      h("rect", {
+                        x: "8",
+                        y: "5",
+                        width: "4",
+                        height: "10",
+                        rx: "1",
+                        fill: "#2B5DF5",
+                        fillOpacity: "0.7"
+                      }),
+                      h("rect", {
+                        x: "13",
+                        y: "9",
+                        width: "4",
+                        height: "2",
+                        rx: "1",
+                        fill: "#2B5DF5",
+                        fillOpacity: "0.4"
+                      })
+                    ]
+                  )
+                ]
+              ),
+              h("span", `${messageContent.second}s`)
+            ]
+          );
+        case TUIChatEngine.TYPES.MSG_LOCATION:
+          if (messageContent.businessID === "text_link") {
+            return h(
+              "span",
+              {
+                class: $style["SearchMessage__text"]
+              },
+              [
+                messageContent.text,
+                h(
+                  "a",
+                  {
+                    href: messageContent.link,
+                    target: "_blank",
+                    rel: "noopener noreferrer"
+                  },
+                  `${t("Search.action.readMore")}>>>`
+                )
+              ]
+            );
+          }
+          return h("span", t("Search.messageType.custom"));
+        default:
+          return h("span", t("Search.messageType.unsupported"));
+      }
+    };
+    const handleClick = () => {
+      var _a;
+      (_a = props.onClick) == null ? void 0 : _a.call(props, props.data, SearchType.CHAT_MESSAGE);
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(unref($style).SearchMessage)
+      }, [
+        createElementVNode("div", {
+          class: normalizeClass(unref($style)["SearchMessage__avatar-wrapper"])
+        }, [
+          createVNode(unref(Avatar), {
+            src: unref(avatar),
+            alt: name.value
+          }, null, 8, ["src", "alt"])
+        ], 2),
+        createElementVNode("div", {
+          class: normalizeClass(unref($style).SearchMessage__content)
+        }, [
+          createElementVNode("div", {
+            class: normalizeClass(unref($style).SearchMessage__header)
+          }, [
+            createElementVNode("span", {
+              class: normalizeClass(unref($style).SearchMessage__name),
+              innerHTML: highlightedName.value
+            }, null, 10, _hoisted_1),
+            unref(time) ? (openBlock(), createElementBlock("span", {
+              key: 0,
+              class: normalizeClass(unref($style).SearchMessage__time)
+            }, toDisplayString(formatTime(unref(time))), 3)) : createCommentVNode("", true)
+          ], 2),
+          createElementVNode("div", {
+            class: normalizeClass(unref($style).SearchMessage__container)
+          }, [
+            createElementVNode("div", {
+              class: normalizeClass(unref($style)["SearchMessage__container-content"])
+            }, [
+              (openBlock(), createBlock(resolveDynamicComponent(renderMessageContent(_ctx.data, _ctx.keyword))))
+            ], 2),
+            createElementVNode("div", {
+              class: normalizeClass(unref($style)["SearchMessage__container-action"]),
+              onClick: handleClick
+            }, toDisplayString(unref(t)("Search.action.locateToChat")), 3)
+          ], 2)
+        ], 2)
+      ], 2);
+    };
+  }
+});
+const SearchMessage = "_SearchMessage_1vinh_295";
+const SearchMessage__avatar = "_SearchMessage__avatar_1vinh_302";
+const SearchMessage__content = "_SearchMessage__content_1vinh_313";
+const SearchMessage__header = "_SearchMessage__header_1vinh_319";
+const SearchMessage__name = "_SearchMessage__name_1vinh_326";
+const SearchMessage__time = "_SearchMessage__time_1vinh_335";
+const SearchMessage__container = "_SearchMessage__container_1vinh_344";
+const SearchMessage__text = "_SearchMessage__text_1vinh_373";
+const style0 = {
+  "tui-theme-dark": "_tui-theme-dark_1vinh_2",
+  "tui-theme-light": "_tui-theme-light_1vinh_140",
+  SearchMessage,
+  "SearchMessage__avatar-wrapper": "_SearchMessage__avatar-wrapper_1vinh_302",
+  SearchMessage__avatar,
+  SearchMessage__content,
+  SearchMessage__header,
+  SearchMessage__name,
+  SearchMessage__time,
+  SearchMessage__container,
+  "SearchMessage__container-action": "_SearchMessage__container-action_1vinh_349",
+  "SearchMessage__container-content": "_SearchMessage__container-content_1vinh_353",
+  SearchMessage__text,
+  "SearchMessage__emoji-img": "_SearchMessage__emoji-img_1vinh_385",
+  "SearchMessage__image-thumb": "_SearchMessage__image-thumb_1vinh_392",
+  "SearchMessage__video-thumb": "_SearchMessage__video-thumb_1vinh_400",
+  "SearchMessage__play-icon": "_SearchMessage__play-icon_1vinh_415",
+  "SearchMessage__face-img": "_SearchMessage__face-img_1vinh_424",
+  "SearchMessage__file-box": "_SearchMessage__file-box_1vinh_430",
+  "SearchMessage__audio-box": "_SearchMessage__audio-box_1vinh_437",
+  "SearchMessage__audio-icon": "_SearchMessage__audio-icon_1vinh_444"
+};
+const cssModules = {
+  "$style": style0
+};
+const Message = /* @__PURE__ */ _export_sfc(_sfc_main, [["__cssModules", cssModules]]);
+export {
+  Message as default
+};

package/dist/components/Search/SearchResults/SearchResultsItem/Message/Message.vue.d.ts

@@ -0,0 +1,14 @@
+import { SearchType } from '../../../../../types/engine';
+import { ResultItemProps } from '../../../../../types';
+
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<ResultItemProps<SearchType.CHAT_MESSAGE>>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<ResultItemProps<SearchType.CHAT_MESSAGE>>>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/dist/components/Search/SearchResults/SearchResultsItem/Message/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Message } from './Message.vue';
+export * from './Message.vue';

package/dist/components/Search/SearchResults/SearchResultsItem/Message/index.js

@@ -0,0 +1,4 @@
+import { default as default2 } from "./Message.js";
+export {
+  default2 as Message
+};

package/dist/components/Search/SearchResults/SearchResultsItem/SearchResultsItem.js

@@ -0,0 +1,59 @@
+import { defineComponent, createElementBlock, openBlock, normalizeClass, createBlock, createCommentVNode, unref, resolveDynamicComponent } from "vue";
+import { SearchType } from "../../../../types/engine.js";
+import Conversation from "./Conversation/Conversation.js";
+import User from "./User/User.js";
+import Group from "./Group/Group.js";
+import Message from "./Message/Message.js";
+import { _ as _export_sfc } from "../../../../_plugin-vue_export-helper-1tPrXgE0.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "SearchResultsItem",
+  props: {
+    keyword: {},
+    onClick: {},
+    data: {},
+    type: {},
+    className: { default: "" }
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass([_ctx.$style.SearchResultsItem, _ctx.className])
+      }, [
+        _ctx.type === unref(SearchType).MESSAGE ? (openBlock(), createBlock(resolveDynamicComponent(unref(Conversation)), {
+          key: 0,
+          data: _ctx.data,
+          keyword: _ctx.keyword,
+          onClick: _ctx.onClick
+        }, null, 8, ["data", "keyword", "onClick"])) : _ctx.type === unref(SearchType).USER ? (openBlock(), createBlock(resolveDynamicComponent(unref(User)), {
+          key: 1,
+          data: _ctx.data,
+          keyword: _ctx.keyword,
+          onClick: _ctx.onClick
+        }, null, 8, ["data", "keyword", "onClick"])) : _ctx.type === unref(SearchType).GROUP ? (openBlock(), createBlock(resolveDynamicComponent(unref(Group)), {
+          key: 2,
+          data: _ctx.data,
+          keyword: _ctx.keyword,
+          onClick: _ctx.onClick
+        }, null, 8, ["data", "keyword", "onClick"])) : _ctx.type === unref(SearchType).CHAT_MESSAGE ? (openBlock(), createBlock(resolveDynamicComponent(unref(Message)), {
+          key: 3,
+          data: _ctx.data,
+          keyword: _ctx.keyword,
+          onClick: _ctx.onClick
+        }, null, 8, ["data", "keyword", "onClick"])) : createCommentVNode("", true)
+      ], 2);
+    };
+  }
+});
+const SearchResultsItem = "_SearchResultsItem_1c1eu_295";
+const style0 = {
+  "tui-theme-dark": "_tui-theme-dark_1c1eu_2",
+  "tui-theme-light": "_tui-theme-light_1c1eu_140",
+  SearchResultsItem
+};
+const cssModules = {
+  "$style": style0
+};
+const SearchResultItemComponent = /* @__PURE__ */ _export_sfc(_sfc_main, [["__cssModules", cssModules]]);
+export {
+  SearchResultItemComponent as default
+};

package/dist/components/Search/SearchResults/SearchResultsItem/SearchResultsItem.vue.d.ts

@@ -0,0 +1,34 @@
+import { SearchType } from '../../../../types/engine';
+
+interface ISearchResultsItemProps {
+    keyword: string;
+    onClick?: () => void;
+    data: any;
+    type: SearchType;
+    className?: string;
+}
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ISearchResultsItemProps>, {
+    className: string;
+}>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ISearchResultsItemProps>, {
+    className: string;
+}>>> & Readonly<{}>, {
+    className: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};

package/dist/components/Search/SearchResults/SearchResultsItem/User/User.js

@@ -0,0 +1,102 @@
+import { defineComponent, computed, createElementBlock, openBlock, normalizeClass, createElementVNode, createVNode, unref, toDisplayString } from "vue";
+import TUIChatEngine from "@tencentcloud/chat-uikit-engine";
+import { SearchType } from "../../../../../types/engine.js";
+import Avatar from "../../../../Avatar/Avatar.js";
+import { useUIKit } from "@tencentcloud/uikit-base-component-vue3";
+import { highlightText } from "../utils/highlightText.js";
+import { _ as _export_sfc } from "../../../../../_plugin-vue_export-helper-1tPrXgE0.js";
+const _hoisted_1 = ["innerHTML"];
+const _hoisted_2 = ["innerHTML"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "User",
+  props: {
+    keyword: {},
+    data: {},
+    type: {},
+    className: {},
+    style: {},
+    onClick: { type: Function }
+  },
+  setup(__props) {
+    const { t } = useUIKit();
+    const birthdayToAge = (birthday) => {
+      const today = /* @__PURE__ */ new Date();
+      const birthDate = new Date(birthday);
+      let age = today.getFullYear() - birthDate.getFullYear();
+      const monthDiff = today.getMonth() - birthDate.getMonth();
+      if (monthDiff < 0 || monthDiff === 0 && today.getDate() < birthDate.getDate()) {
+        age = age - 1;
+      }
+      return age;
+    };
+    const props = __props;
+    const profile = computed(() => props.data.profile);
+    const getGenderText = (gender) => {
+      switch (gender) {
+        case TUIChatEngine.TYPES.GENDER_MALE:
+          return t("Search.filter.gender.male");
+        case TUIChatEngine.TYPES.GENDER_FEMALE:
+          return t("Search.filter.gender.female");
+        default:
+          return t("Search.filter.gender.secret");
+      }
+    };
+    const handleClick = () => {
+      var _a;
+      (_a = props.onClick) == null ? void 0 : _a.call(props, props.data, SearchType.USER);
+    };
+    return (_ctx, _cache) => {
+      var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(_ctx.$style.SearchUser),
+        onClick: handleClick
+      }, [
+        createElementVNode("div", {
+          class: normalizeClass(_ctx.$style["SearchUser__avatar"])
+        }, [
+          createVNode(unref(Avatar), {
+            src: (_a = profile.value) == null ? void 0 : _a.avatar,
+            alt: ((_b = profile.value) == null ? void 0 : _b.nick) || ((_c = profile.value) == null ? void 0 : _c.userID)
+          }, null, 8, ["src", "alt"])
+        ], 2),
+        createElementVNode("div", {
+          class: normalizeClass(_ctx.$style["SearchUser__profile"])
+        }, [
+          createElementVNode("div", {
+            class: normalizeClass(_ctx.$style["SearchUser__nickname"]),
+            innerHTML: unref(highlightText)(((_d = profile.value) == null ? void 0 : _d.nick) || ((_e = profile.value) == null ? void 0 : _e.userID), _ctx.keyword, _ctx.$style["SearchUser__highlight"])
+          }, null, 10, _hoisted_1),
+          ((_f = profile.value) == null ? void 0 : _f.selfSignature) ? (openBlock(), createElementBlock("div", {
+            key: 0,
+            class: normalizeClass(_ctx.$style["SearchUser__signature"]),
+            innerHTML: unref(highlightText)((_g = profile.value) == null ? void 0 : _g.selfSignature, _ctx.keyword, _ctx.$style["SearchUser__highlight"])
+          }, null, 10, _hoisted_2)) : (openBlock(), createElementBlock("div", {
+            key: 1,
+            class: normalizeClass(_ctx.$style["SearchUser__signature"])
+          }, toDisplayString(getGenderText((_h = profile.value) == null ? void 0 : _h.gender)) + "   " + toDisplayString(((_i = profile.value) == null ? void 0 : _i.birthday) && `${birthdayToAge((_j = profile.value) == null ? void 0 : _j.birthday)}${unref(t)("Search.filter.age.yearsOld")}`), 3))
+        ], 2)
+      ], 2);
+    };
+  }
+});
+const SearchUser = "_SearchUser_vb7mm_295";
+const SearchUser__avatar = "_SearchUser__avatar_vb7mm_302";
+const SearchUser__profile = "_SearchUser__profile_vb7mm_310";
+const SearchUser__nickname = "_SearchUser__nickname_vb7mm_316";
+const SearchUser__signature = "_SearchUser__signature_vb7mm_326";
+const style0 = {
+  "tui-theme-dark": "_tui-theme-dark_vb7mm_2",
+  "tui-theme-light": "_tui-theme-light_vb7mm_140",
+  SearchUser,
+  SearchUser__avatar,
+  SearchUser__profile,
+  SearchUser__nickname,
+  SearchUser__signature
+};
+const cssModules = {
+  "$style": style0
+};
+const User = /* @__PURE__ */ _export_sfc(_sfc_main, [["__cssModules", cssModules]]);
+export {
+  User as default
+};

package/dist/components/Search/SearchResults/SearchResultsItem/User/User.vue.d.ts

@@ -0,0 +1,14 @@
+import { SearchType } from '../../../../../types/engine';
+import { ResultItemProps } from '../../../../../types/search';
+
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<ResultItemProps<SearchType.USER>>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<ResultItemProps<SearchType.USER>>>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/dist/components/Search/SearchResults/SearchResultsItem/User/index.d.ts

@@ -0,0 +1,2 @@
+export { default as User } from './User.vue';
+export * from './User.vue';

package/dist/components/Search/SearchResults/SearchResultsItem/User/index.js

@@ -0,0 +1,4 @@
+import { default as default2 } from "./User.js";
+export {
+  default2 as User
+};

package/dist/components/Search/SearchResults/SearchResultsItem/index.d.ts

@@ -0,0 +1,9 @@
+import { default as SearchResultItemComponent } from './SearchResultsItem.vue';
+
+export { default as SearchResultItem } from './SearchResultsItem.vue';
+export * from './SearchResultsItem.vue';
+export * from './Conversation';
+export * from './Group';
+export * from './Message';
+export * from './User';
+export default SearchResultItemComponent;

package/dist/components/Search/SearchResults/SearchResultsItem/index.js

@@ -0,0 +1,13 @@
+import SearchResultItemComponent from "./SearchResultsItem.js";
+import { default as default2 } from "./Conversation/Conversation.js";
+import { default as default3 } from "./Group/Group.js";
+import { default as default4 } from "./Message/Message.js";
+import { default as default5 } from "./User/User.js";
+export {
+  default2 as Conversation,
+  default3 as Group,
+  default4 as Message,
+  SearchResultItemComponent as SearchResultItem,
+  default5 as User,
+  SearchResultItemComponent as default
+};

package/dist/components/Search/SearchResults/SearchResultsItem/utils/highlightText.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Highlights a keyword in a given text
+ * @param text - text to highlight
+ * @param keyword - keyword to highlight
+ * @param className - CSS class name for the highlight, default is 'highlight'
+ * @returns HTML string with highlighted text
+ */
+export declare const highlightText: (text: string, keyword: string, className?: string) => string;
+export default highlightText;

package/dist/components/Search/SearchResults/SearchResultsItem/utils/highlightText.js

@@ -0,0 +1,43 @@
+function escapeRegExp(string) {
+  return string.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+}
+function sanitizeInput(text) {
+  if (!text || typeof text !== "string") {
+    return String(text || "");
+  }
+  return text.replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
+}
+const highlightText = (text, keyword, className = "highlight") => {
+  const safeText = sanitizeInput(text);
+  const safeKeyword = sanitizeInput(keyword);
+  if (!text || typeof text !== "string") {
+    return safeText;
+  }
+  if (!safeKeyword || typeof safeKeyword !== "string") {
+    return safeText;
+  }
+  const trimmedKeyword = safeKeyword.trim();
+  if (!trimmedKeyword) {
+    return safeText;
+  }
+  try {
+    const regex = new RegExp(`(${escapeRegExp(trimmedKeyword)})`, "gi");
+    const parts = safeText.split(regex);
+    if (parts.length === 1) {
+      return safeText;
+    }
+    return parts.map((part, index) => {
+      if (part.toLowerCase() === trimmedKeyword.toLowerCase()) {
+        return `<span key="${index}" class="${className}">${part}</span>`;
+      }
+      return part;
+    }).join("");
+  } catch (error) {
+    console.warn("Error highlighting text:", error);
+    return safeText;
+  }
+};
+export {
+  highlightText as default,
+  highlightText
+};

package/dist/components/Search/SearchResults/SearchResultsItem/utils/index.d.ts

@@ -0,0 +1 @@
+export { highlightText } from './highlightText';

package/dist/components/Search/SearchResults/SearchResultsItem/utils/index.js

@@ -0,0 +1,4 @@
+import { highlightText } from "./highlightText.js";
+export {
+  highlightText
+};

package/dist/components/Search/SearchResults/index.d.ts

@@ -0,0 +1,6 @@
+import { default as SearchResultsComponent } from './SearchResults.vue';
+
+export * from './SearchResultsItem';
+export * from './EmptyResult';
+export * from './Loading';
+export default SearchResultsComponent;