@litelens/design-system 1.0.3

package/dist/chunk-GPI6G5NM.js

@@ -0,0 +1,148 @@
+import { SearchIcon, Input } from './chunk-7YPL4ZPM.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState, useRef } from 'react';
+
+var FullTextSearchInput = ({
+  searchTerm,
+  matchCount,
+  currentMatchIdx,
+  onSearch,
+  onSearchNext,
+  ariaLabel = "Search"
+}) => /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+  /* @__PURE__ */ jsx(SearchIcon, { className: "text-muted-foreground absolute left-1.5 top-1/2 size-3 -translate-y-1/2" }),
+  /* @__PURE__ */ jsx(
+    Input,
+    {
+      className: "h-6 w-44 pl-6 pr-9 text-xs",
+      placeholder: "Search\u2026",
+      value: searchTerm,
+      onChange: (e) => onSearch(e.target.value),
+      onKeyDown: (e) => {
+        if (e.key === "Enter") {
+          e.preventDefault();
+          onSearchNext();
+        }
+      },
+      "aria-label": ariaLabel
+    }
+  ),
+  /* @__PURE__ */ jsx(
+    "output",
+    {
+      "aria-live": "polite",
+      className: "text-muted-foreground absolute right-1.5 top-1/2 -translate-y-1/2 text-[10px] tabular-nums",
+      children: searchTerm ? matchCount === 0 ? "0" : `${currentMatchIdx + 1}/${matchCount}` : ""
+    }
+  )
+] });
+function useFullTextSearch(options) {
+  const [searchTerm, setSearchTerm] = useState("");
+  const [matchCount, setMatchCount] = useState(0);
+  const [currentMatchIdx, setCurrentMatchIdx] = useState(0);
+  const [matches, setMatches] = useState([]);
+  const contentRef = useRef(null);
+  const resetMatches = () => {
+    setMatchCount(0);
+    setCurrentMatchIdx(0);
+  };
+  const base = {
+    searchTerm,
+    matchCount,
+    currentMatchIdx,
+    setSearchTerm,
+    setMatchCount,
+    setCurrentMatchIdx,
+    resetMatches
+  };
+  if (!options) return base;
+  const isCustomBackend = "onSearch" in options;
+  if (isCustomBackend) {
+    const { onSearch, onSearchNext } = options;
+    const handleSearch2 = (term) => {
+      setSearchTerm(term);
+      if (!term) {
+        setMatches([]);
+        resetMatches();
+        return;
+      }
+      onSearch(term);
+      setCurrentMatchIdx(0);
+    };
+    const handleSearchNext2 = () => {
+      if (matchCount === 0) return;
+      const nextIdx = (currentMatchIdx + 1) % matchCount;
+      setCurrentMatchIdx(nextIdx);
+      onSearchNext();
+    };
+    return {
+      ...base,
+      matches: [],
+      activeMatchCharIdx: -1,
+      contentRef,
+      handleSearch: handleSearch2,
+      handleSearchNext: handleSearchNext2
+    };
+  }
+  const { text } = options;
+  const scrollToLine = (charIdx) => {
+    if (!text) return;
+    const lineNum = text.slice(0, charIdx).split("\n").length - 1;
+    const parseLineHeight = (el) => {
+      const raw = globalThis.getComputedStyle(el).lineHeight;
+      return raw === "normal" ? 20 : Number.parseFloat(raw) || 20;
+    };
+    const textarea = contentRef.current?.querySelector("textarea[data-yaml-editor]");
+    if (textarea) {
+      textarea.scrollTop = Math.max(
+        0,
+        lineNum * parseLineHeight(textarea) - textarea.clientHeight / 2
+      );
+      return;
+    }
+    const scrollableDiv = contentRef.current?.querySelector("[data-yaml-scroll]");
+    if (scrollableDiv) {
+      scrollableDiv.scrollTop = Math.max(
+        0,
+        lineNum * parseLineHeight(scrollableDiv) - scrollableDiv.clientHeight / 2
+      );
+    }
+  };
+  const handleSearch = (term) => {
+    setSearchTerm(term);
+    if (!term || !text) {
+      setMatches([]);
+      resetMatches();
+      return;
+    }
+    const lowerText = text.toLowerCase();
+    const lowerTerm = term.toLowerCase();
+    const found = [];
+    let idx = 0;
+    let pos;
+    while ((pos = lowerText.indexOf(lowerTerm, idx)) !== -1) {
+      found.push(pos);
+      idx = pos + lowerTerm.length;
+    }
+    setMatches(found);
+    setMatchCount(found.length);
+    setCurrentMatchIdx(0);
+    if (found.length > 0) scrollToLine(found[0]);
+  };
+  const handleSearchNext = () => {
+    if (!matches.length) return;
+    const nextIdx = (currentMatchIdx + 1) % matches.length;
+    setCurrentMatchIdx(nextIdx);
+    scrollToLine(matches[nextIdx]);
+  };
+  return {
+    ...base,
+    matches,
+    activeMatchCharIdx: matches.length > 0 ? matches[currentMatchIdx] : -1,
+    contentRef,
+    handleSearch,
+    handleSearchNext
+  };
+}
+
+export { FullTextSearchInput, useFullTextSearch };

package/dist/chunk-NFJMUQY6.js

@@ -0,0 +1,41 @@
+import { cn } from './chunk-QUNCRUSO.js';
+import { jsx, Fragment } from 'react/jsx-runtime';
+
+var SplitAndHighlightText = ({
+  text,
+  term,
+  absoluteStart,
+  activeMatchCharIdx
+}) => {
+  if (!term) return /* @__PURE__ */ jsx(Fragment, { children: text });
+  const lower = text.toLowerCase();
+  const lowerTerm = term.toLowerCase();
+  const segments = [];
+  let lastIdx = 0;
+  let idx = lower.indexOf(lowerTerm, 0);
+  while (idx !== -1) {
+    if (idx > lastIdx)
+      segments.push(/* @__PURE__ */ jsx("span", { children: text.slice(lastIdx, idx) }, `text-${lastIdx}`));
+    const isActive = absoluteStart !== void 0 && activeMatchCharIdx !== void 0 && activeMatchCharIdx >= 0 && absoluteStart + idx === activeMatchCharIdx;
+    segments.push(
+      /* @__PURE__ */ jsx(
+        "mark",
+        {
+          className: cn(
+            "inline rounded-none bg-transparent px-0.5 py-0 text-inherit",
+            isActive ? "border border-orange-400" : "border border-yellow-300"
+          ),
+          children: text.slice(idx, idx + term.length)
+        },
+        `match-${idx}-${text.slice(idx, idx + term.length)}`
+      )
+    );
+    lastIdx = idx + term.length;
+    idx = lower.indexOf(lowerTerm, lastIdx);
+  }
+  if (lastIdx < text.length)
+    segments.push(/* @__PURE__ */ jsx("span", { children: text.slice(lastIdx) }, `text-${lastIdx}`));
+  return /* @__PURE__ */ jsx(Fragment, { children: segments.length > 0 ? segments : text });
+};
+
+export { SplitAndHighlightText };