fromsrc 0.0.2 → 0.0.22

package/dist/components/quote.d.ts

@@ -14,7 +14,7 @@ interface QuoteProps {
     /** Avatar image URL */
     avatar?: string;
 }
-declare function QuoteBase({ children, author, role, avatar }: QuoteProps): React.JSX.Element;
+declare function QuoteBase({ children, author, role, avatar, }: QuoteProps): React.JSX.Element;
 declare const Quote: react.MemoExoticComponent<typeof QuoteBase>;
 /**
  * Props for the Testimonials grid container
@@ -38,7 +38,7 @@ interface TestimonialProps {
     /** Avatar image URL */
     avatar?: string;
 }
-declare function TestimonialBase({ children, author, role, avatar }: TestimonialProps): React.JSX.Element;
+declare function TestimonialBase({ children, author, role, avatar, }: TestimonialProps): React.JSX.Element;
 declare const Testimonial: react.MemoExoticComponent<typeof TestimonialBase>;
 
 export { Quote, type QuoteProps, Testimonial, type TestimonialProps, Testimonials, type TestimonialsProps };

package/dist/components/quote.js

@@ -3,7 +3,12 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import Image from 'next/image';
 import { memo } from 'react';
 
-function QuoteBase({ children, author, role, avatar }) {
+function QuoteBase({
+  children,
+  author,
+  role,
+  avatar
+}) {
   return /* @__PURE__ */ jsxs("figure", { className: "my-6 p-6 rounded-xl border border-line bg-surface/30", children: [
     /* @__PURE__ */ jsxs("blockquote", { className: "text-lg text-fg italic leading-relaxed", children: [
       '"',
@@ -11,7 +16,16 @@ function QuoteBase({ children, author, role, avatar }) {
       '"'
     ] }),
     author && /* @__PURE__ */ jsxs("figcaption", { className: "mt-4 flex items-center gap-3", children: [
-      avatar && /* @__PURE__ */ jsx("div", { className: "w-10 h-10 rounded-full overflow-hidden relative", children: /* @__PURE__ */ jsx(Image, { src: avatar, alt: "", fill: true, className: "object-cover", "aria-hidden": "true" }) }),
+      avatar && /* @__PURE__ */ jsx("div", { className: "w-10 h-10 rounded-full overflow-hidden relative", children: /* @__PURE__ */ jsx(
+        Image,
+        {
+          src: avatar,
+          alt: "",
+          fill: true,
+          className: "object-cover",
+          "aria-hidden": "true"
+        }
+      ) }),
       /* @__PURE__ */ jsxs("div", { children: [
         /* @__PURE__ */ jsx("cite", { className: "text-sm font-medium text-fg not-italic", children: author }),
         role && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted", children: role })
@@ -24,11 +38,25 @@ function TestimonialsBase({ children }) {
   return /* @__PURE__ */ jsx("div", { className: "grid gap-4 md:grid-cols-2 my-6", children });
 }
 const Testimonials = memo(TestimonialsBase);
-function TestimonialBase({ children, author, role, avatar }) {
+function TestimonialBase({
+  children,
+  author,
+  role,
+  avatar
+}) {
   return /* @__PURE__ */ jsxs("figure", { className: "p-5 rounded-xl border border-line bg-surface/30", children: [
     /* @__PURE__ */ jsx("blockquote", { className: "text-sm text-muted leading-relaxed", children }),
     /* @__PURE__ */ jsxs("figcaption", { className: "mt-4 flex items-center gap-3", children: [
-      avatar && /* @__PURE__ */ jsx("div", { className: "w-8 h-8 rounded-full overflow-hidden relative", children: /* @__PURE__ */ jsx(Image, { src: avatar, alt: "", fill: true, className: "object-cover", "aria-hidden": "true" }) }),
+      avatar && /* @__PURE__ */ jsx("div", { className: "w-8 h-8 rounded-full overflow-hidden relative", children: /* @__PURE__ */ jsx(
+        Image,
+        {
+          src: avatar,
+          alt: "",
+          fill: true,
+          className: "object-cover",
+          "aria-hidden": "true"
+        }
+      ) }),
       /* @__PURE__ */ jsxs("div", { children: [
         /* @__PURE__ */ jsx("cite", { className: "text-sm font-medium text-fg not-italic", children: author }),
         role && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted", children: role })

package/dist/components/radio.js

@@ -5,14 +5,14 @@ import { getNextIndex } from '../hooks/arrownav';
 
 const RadioContext = createContext(null);
 const sizes = {
-  sm: { radio: "h-3.5 w-3.5", label: "text-xs" },
-  md: { radio: "h-4 w-4", label: "text-sm" },
-  lg: { radio: "h-5 w-5", label: "text-base" }
+  lg: { label: "text-base", radio: "h-5 w-5" },
+  md: { label: "text-sm", radio: "h-4 w-4" },
+  sm: { label: "text-xs", radio: "h-3.5 w-3.5" }
 };
 const dotSizes = {
-  sm: "h-1.5 w-1.5",
+  lg: "h-2.5 w-2.5",
   md: "h-2 w-2",
-  lg: "h-2.5 w-2.5"
+  sm: "h-1.5 w-1.5"
 };
 function RadioBase({
   value,
@@ -21,17 +21,23 @@ function RadioBase({
   className = ""
 }) {
   const ctx = useContext(RadioContext);
-  if (!ctx) throw new Error("Radio must be used within RadioGroup");
+  if (!ctx) {
+    throw new Error("Radio must be used within RadioGroup");
+  }
   const id = useId();
   const checked = ctx.value === value;
   const disabled = localDisabled || ctx.disabled;
   const handleClick = () => {
-    if (!disabled) ctx.onChange(value);
+    if (!disabled) {
+      ctx.onChange(value);
+    }
   };
   const handleKeyDown = (e) => {
     if (e.key === " " || e.key === "Enter") {
       e.preventDefault();
-      if (!disabled) ctx.onChange(value);
+      if (!disabled) {
+        ctx.onChange(value);
+      }
     }
   };
   return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", "data-radio-value": value, children: [
@@ -57,7 +63,13 @@ function RadioBase({
 					${sizes[ctx.size].radio}
 					${className}
 				`.trim(),
-        children: checked && /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: `rounded-full bg-accent ${dotSizes[ctx.size]}` })
+        children: checked && /* @__PURE__ */ jsx(
+          "span",
+          {
+            "aria-hidden": "true",
+            className: `rounded-full bg-accent ${dotSizes[ctx.size]}`
+          }
+        )
       }
     ),
     label && /* @__PURE__ */ jsx(
@@ -92,34 +104,40 @@ function RadioGroupBase({
   const isControlled = controlledValue !== void 0;
   const value = isControlled ? controlledValue : internalValue;
   const handleChange = (newValue) => {
-    if (!isControlled) setInternalValue(newValue);
+    if (!isControlled) {
+      setInternalValue(newValue);
+    }
     onChange?.(newValue);
   };
   const handleKeyDown = (e) => {
-    const radios = Array.from(
-      e.currentTarget.querySelectorAll('[role="radio"]:not([disabled])')
-    );
+    const radios = [
+      ...e.currentTarget.querySelectorAll('[role="radio"]:not([disabled])')
+    ];
     const currentIndex = radios.findIndex((r) => r === document.activeElement);
     const nextIndex = getNextIndex(e.key, {
       count: radios.length,
-      current: currentIndex >= 0 ? currentIndex : 0,
+      current: Math.max(currentIndex, 0),
       direction: "both",
       wrap: true
     });
-    if (nextIndex === currentIndex) return;
+    if (nextIndex === currentIndex) {
+      return;
+    }
     e.preventDefault();
     const nextRadio = radios[nextIndex];
     if (nextRadio) {
       nextRadio.focus();
       const wrapper = nextRadio.closest("[data-radio-value]");
-      const radioValue = wrapper?.getAttribute("data-radio-value");
-      if (radioValue) handleChange(radioValue);
+      const radioValue = wrapper?.dataset.radioValue;
+      if (radioValue) {
+        handleChange(radioValue);
+      }
     }
   };
   return /* @__PURE__ */ jsx(
     RadioContext.Provider,
     {
-      value: { name: groupName, value, size, disabled, onChange: handleChange },
+      value: { disabled, name: groupName, onChange: handleChange, size, value },
       children: /* @__PURE__ */ jsx(
         "div",
         {

package/dist/components/rating.js

@@ -37,7 +37,9 @@ function RatingBase({
   }, []);
   const handleKeyDown = useCallback(
     (e, index) => {
-      if (readonly) return;
+      if (readonly) {
+        return;
+      }
       if (e.key === " " || e.key === "Enter") {
         e.preventDefault();
         onChange?.(index + 1);
@@ -49,7 +51,9 @@ function RatingBase({
         direction: "both",
         wrap: true
       });
-      if (next === index) return;
+      if (next === index) {
+        return;
+      }
       e.preventDefault();
       setFocus(next);
       refs.current[next]?.focus();
@@ -87,7 +91,14 @@ function RatingBase({
             onMouseEnter: () => handleMouseEnter(index),
             onMouseLeave: handleMouseLeave,
             className: `transition-colors ${readonly ? "cursor-default" : "cursor-pointer hover:text-yellow-400"} ${filled ? "text-yellow-400" : "text-muted/30"}`,
-            children: /* @__PURE__ */ jsx(IconStar, { "aria-hidden": "true", size: 20, fill: filled ? "currentColor" : "none" })
+            children: /* @__PURE__ */ jsx(
+              IconStar,
+              {
+                "aria-hidden": "true",
+                size: 20,
+                fill: filled ? "currentColor" : "none"
+              }
+            )
           },
           i
         );

package/dist/components/recent.d.ts

@@ -7,6 +7,6 @@ interface RecentProps {
     onSelect: (query: string) => void;
 }
 declare function getRecentOptionId(index: number): string;
-declare function Recent({ listId, items, selected, onSelect }: RecentProps): JSX.Element | null;
+declare function Recent({ listId, items, selected, onSelect, }: RecentProps): JSX.Element | null;
 
 export { Recent, type RecentProps, getRecentOptionId };

package/dist/components/recent.js

@@ -4,19 +4,35 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 function getRecentOptionId(index) {
   return `search-recent-option-${index}`;
 }
-function Recent({ listId, items, selected, onSelect }) {
-  if (items.length === 0) return null;
+function Recent({
+  listId,
+  items,
+  selected,
+  onSelect
+}) {
+  if (items.length === 0) {
+    return null;
+  }
   return /* @__PURE__ */ jsxs("div", { className: "p-2", children: [
     /* @__PURE__ */ jsx("div", { className: "px-3 py-1.5 text-[10px] uppercase tracking-wider text-dim", children: "recent" }),
-    /* @__PURE__ */ jsx("ul", { id: listId, role: "listbox", children: items.map((item, index) => /* @__PURE__ */ jsx("li", { id: getRecentOptionId(index), role: "option", "aria-selected": index === selected, children: /* @__PURE__ */ jsx(
-      "button",
+    /* @__PURE__ */ jsx("ul", { id: listId, role: "listbox", children: items.map((item, index) => /* @__PURE__ */ jsx(
+      "li",
       {
-        type: "button",
-        onClick: () => onSelect(item),
-        className: `w-full text-left px-3 py-2 rounded-lg text-sm transition-colors focus:outline-none focus:ring-1 focus:ring-line ${index === selected ? "bg-bg border border-line text-fg" : "text-muted hover:bg-bg/50"}`,
-        children: item
-      }
-    ) }, item)) })
+        id: getRecentOptionId(index),
+        role: "option",
+        "aria-selected": index === selected,
+        children: /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: () => onSelect(item),
+            className: `w-full text-left px-3 py-2 rounded-lg text-sm transition-colors focus:outline-none focus:ring-1 focus:ring-line ${index === selected ? "bg-bg border border-line text-fg" : "text-muted hover:bg-bg/50"}`,
+            children: item
+          }
+        )
+      },
+      item
+    )) })
   ] });
 }
 

package/dist/components/responsive.js

@@ -3,18 +3,22 @@ import { jsx } from 'react/jsx-runtime';
 import { memo } from 'react';
 
 const aboveClasses = {
-  sm: "hidden sm:block",
-  md: "hidden md:block",
   lg: "hidden lg:block",
+  md: "hidden md:block",
+  sm: "hidden sm:block",
   xl: "hidden xl:block"
 };
 const belowClasses = {
-  sm: "sm:hidden",
-  md: "md:hidden",
   lg: "lg:hidden",
+  md: "md:hidden",
+  sm: "sm:hidden",
   xl: "xl:hidden"
 };
-const Show = memo(function Show2({ above, below, children }) {
+const Show = memo(function Show2({
+  above,
+  below,
+  children
+}) {
   let className = "";
   if (above) {
     className = aboveClasses[above];
@@ -30,28 +34,32 @@ const colClasses = {
   4: "grid-cols-1 md:grid-cols-2 lg:grid-cols-4"
 };
 const gapClasses = {
-  sm: "gap-2",
+  lg: "gap-6",
   md: "gap-4",
-  lg: "gap-6"
+  sm: "gap-2"
 };
-const Grid = memo(function Grid2({ cols = 2, gap = "md", children }) {
+const Grid = memo(function Grid2({
+  cols = 2,
+  gap = "md",
+  children
+}) {
   return /* @__PURE__ */ jsx("div", { className: `grid ${colClasses[cols]} ${gapClasses[gap]} my-6`, children });
 });
 const directionClasses = {
-  row: "flex-row",
-  col: "flex-col"
+  col: "flex-col",
+  row: "flex-row"
 };
 const alignClasses = {
-  start: "items-start",
   center: "items-center",
   end: "items-end",
+  start: "items-start",
   stretch: "items-stretch"
 };
 const justifyClasses = {
-  start: "justify-start",
+  between: "justify-between",
   center: "justify-center",
   end: "justify-end",
-  between: "justify-between"
+  start: "justify-start"
 };
 const Flex = memo(function Flex2({
   direction = "row",

package/dist/components/results.js

@@ -3,12 +3,16 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import { useMemo } from 'react';
 
 function highlightMatch(text, query) {
-  if (!query.trim()) return text;
+  if (!query.trim()) {
+    return text;
+  }
   const words = query.trim().split(/\s+/).filter(Boolean);
-  const escaped = words.map((w) => w.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")).join("|");
+  const escaped = words.map((w) => w.replaceAll(/[.*+?^${}()|[\]\\]/g, "\\$&")).join("|");
   const pattern = new RegExp(`(${escaped})`, "gi");
   const parts = text.split(pattern);
-  if (parts.length === 1) return text;
+  if (parts.length === 1) {
+    return text;
+  }
   const matcher = new RegExp(`^(?:${escaped})$`, "i");
   return parts.map(
     (part, i) => matcher.test(part) ? /* @__PURE__ */ jsx("mark", { className: "bg-transparent text-fg font-medium", children: part }, i) : part
@@ -43,7 +47,7 @@ function Results({
 }) {
   const grouped = useMemo(() => groupResults(results), [results]);
   let idx = 0;
-  return /* @__PURE__ */ jsx("ul", { ref: listRef, id: listId, role: "listbox", className: "p-2", children: Array.from(grouped.entries()).map(([category, items]) => /* @__PURE__ */ jsxs("li", { role: "presentation", children: [
+  return /* @__PURE__ */ jsx("ul", { ref: listRef, id: listId, role: "listbox", className: "p-2", children: [...grouped.entries()].map(([category, items]) => /* @__PURE__ */ jsxs("li", { role: "presentation", children: [
     /* @__PURE__ */ jsx("div", { className: "px-3 pt-2 pb-1 text-[10px] font-medium text-dim uppercase tracking-wider", children: category }),
     /* @__PURE__ */ jsx("ul", { role: "group", children: items.map((result) => {
       const i = idx++;

package/dist/components/screenshot.js

@@ -9,27 +9,67 @@ const Screenshot = memo(function Screenshot2({
   browser = true,
   className = ""
 }) {
-  return /* @__PURE__ */ jsxs("figure", { className: `my-6 ${className}`, role: "figure", "aria-label": caption || alt, children: [
-    browser ? /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-line overflow-hidden bg-surface", children: [
-      /* @__PURE__ */ jsxs(
-        "div",
-        {
-          className: "flex items-center gap-2 px-4 py-2.5 border-b border-line bg-bg",
-          "aria-hidden": "true",
-          children: [
-            /* @__PURE__ */ jsxs("div", { className: "flex gap-1.5", children: [
-              /* @__PURE__ */ jsx("span", { className: "w-3 h-3 rounded-full bg-red-500/80", "aria-hidden": "true" }),
-              /* @__PURE__ */ jsx("span", { className: "w-3 h-3 rounded-full bg-yellow-500/80", "aria-hidden": "true" }),
-              /* @__PURE__ */ jsx("span", { className: "w-3 h-3 rounded-full bg-green-500/80", "aria-hidden": "true" })
-            ] }),
-            /* @__PURE__ */ jsx("div", { className: "flex-1 mx-8", children: /* @__PURE__ */ jsx("div", { className: "h-6 rounded bg-surface/80 border border-line", "aria-hidden": "true" }) })
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsx("div", { className: "relative w-full aspect-video", children: /* @__PURE__ */ jsx(Image, { src, alt, fill: true, className: "object-cover object-top" }) })
-    ] }) : /* @__PURE__ */ jsx("div", { className: "relative w-full aspect-video rounded-lg border border-line overflow-hidden", children: /* @__PURE__ */ jsx(Image, { src, alt, fill: true, className: "object-cover object-top" }) }),
-    caption && /* @__PURE__ */ jsx("figcaption", { className: "mt-2 text-center text-sm text-muted", children: caption })
-  ] });
+  return /* @__PURE__ */ jsxs(
+    "figure",
+    {
+      className: `my-6 ${className}`,
+      role: "figure",
+      "aria-label": caption || alt,
+      children: [
+        browser ? /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-line overflow-hidden bg-surface", children: [
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: "flex items-center gap-2 px-4 py-2.5 border-b border-line bg-bg",
+              "aria-hidden": "true",
+              children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex gap-1.5", children: [
+                  /* @__PURE__ */ jsx(
+                    "span",
+                    {
+                      className: "w-3 h-3 rounded-full bg-red-500/80",
+                      "aria-hidden": "true"
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(
+                    "span",
+                    {
+                      className: "w-3 h-3 rounded-full bg-yellow-500/80",
+                      "aria-hidden": "true"
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(
+                    "span",
+                    {
+                      className: "w-3 h-3 rounded-full bg-green-500/80",
+                      "aria-hidden": "true"
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsx("div", { className: "flex-1 mx-8", children: /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    className: "h-6 rounded bg-surface/80 border border-line",
+                    "aria-hidden": "true"
+                  }
+                ) })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx("div", { className: "relative w-full aspect-video", children: /* @__PURE__ */ jsx(
+            Image,
+            {
+              src,
+              alt,
+              fill: true,
+              className: "object-cover object-top"
+            }
+          ) })
+        ] }) : /* @__PURE__ */ jsx("div", { className: "relative w-full aspect-video rounded-lg border border-line overflow-hidden", children: /* @__PURE__ */ jsx(Image, { src, alt, fill: true, className: "object-cover object-top" }) }),
+        caption && /* @__PURE__ */ jsx("figcaption", { className: "mt-2 text-center text-sm text-muted", children: caption })
+      ]
+    }
+  );
 });
 const Frame = memo(function Frame2({
   children,

package/dist/components/scrollprogress.js

@@ -10,9 +10,11 @@ function ScrollProgressBase({
   const [progress, setProgress] = useState(0);
   const rafRef = useRef(0);
   const handleScroll = useCallback(() => {
-    if (rafRef.current) return;
+    if (rafRef.current) {
+      return;
+    }
     rafRef.current = requestAnimationFrame(() => {
-      const scrollTop = document.documentElement.scrollTop;
+      const { scrollTop } = document.documentElement;
       const scrollHeight = document.documentElement.scrollHeight - window.innerHeight;
       const newProgress = scrollHeight > 0 ? scrollTop / scrollHeight * 100 : 0;
       setProgress(newProgress);
@@ -24,7 +26,9 @@ function ScrollProgressBase({
     window.addEventListener("scroll", handleScroll, { passive: true });
     return () => {
       window.removeEventListener("scroll", handleScroll);
-      if (rafRef.current) cancelAnimationFrame(rafRef.current);
+      if (rafRef.current) {
+        cancelAnimationFrame(rafRef.current);
+      }
     };
   }, [handleScroll]);
   const rounded = Math.round(progress);
@@ -43,8 +47,8 @@ function ScrollProgressBase({
         {
           className: "h-full transition-[width] duration-100",
           style: {
-            width: `${progress}%`,
-            backgroundColor: color
+            backgroundColor: color,
+            width: `${progress}%`
           }
         }
       )

package/dist/components/scrollspy.d.ts

@@ -1,7 +1,7 @@
 import * as react from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
-type ScrollSpyProps = {
+interface ScrollSpyProps {
     items: {
         id: string;
         label: string;
@@ -11,7 +11,7 @@ type ScrollSpyProps = {
     activeClassName?: string;
     offset?: number;
     as?: React.ElementType;
-};
+}
 declare function ScrollSpy({ items, className, activeClassName, offset, as: Tag, }: ScrollSpyProps): react_jsx_runtime.JSX.Element;
 declare const ScrollSpyComponent: react.MemoExoticComponent<typeof ScrollSpy>;
 

package/dist/components/scrollspy.js

@@ -12,10 +12,14 @@ function ScrollSpy({
   const [activeId, setActiveId] = useState("");
   useEffect(() => {
     const elements = items.map((item) => document.getElementById(item.id)).filter((item) => item instanceof HTMLElement);
-    if (elements.length === 0) return;
+    if (elements.length === 0) {
+      return;
+    }
     const observer = new IntersectionObserver(
       (entries) => {
-        const visible = entries.filter((e) => e.isIntersecting).sort((a, b) => a.boundingClientRect.top - b.boundingClientRect.top);
+        const visible = entries.filter((e) => e.isIntersecting).sort(
+          (a, b) => a.boundingClientRect.top - b.boundingClientRect.top
+        );
         const first = visible[0];
         if (first?.target instanceof HTMLElement) {
           setActiveId(first.target.id);
@@ -33,7 +37,9 @@ function ScrollSpy({
   return /* @__PURE__ */ jsx(Tag, { className, children: /* @__PURE__ */ jsx("ul", { children: items.map((item) => /* @__PURE__ */ jsx(
     "li",
     {
-      style: { paddingLeft: item.depth ? `${item.depth * 0.75}rem` : void 0 },
+      style: {
+        paddingLeft: item.depth ? `${item.depth * 0.75}rem` : void 0
+      },
       children: /* @__PURE__ */ jsx(
         "a",
         {