@work-rjkashyap/unified-ui 0.3.4 → 0.3.6

package/dist/components/virtual-list.mjs

@@ -0,0 +1,136 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "../utils/cn.mjs";
+import {
+  forwardRef,
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  useState
+} from "react";
+const VirtualList = forwardRef(function VirtualList2({
+  items,
+  itemHeight,
+  renderItem,
+  height = 400,
+  overscan = 5,
+  getItemKey,
+  onEndReached,
+  endReachedThreshold = 100,
+  loading = false,
+  loadingIndicator,
+  emptyContent,
+  className,
+  itemClassName
+}, ref) {
+  const containerRef = useRef(null);
+  const [scrollTop, setScrollTop] = useState(0);
+  const totalHeight = items.length * itemHeight;
+  const { startIndex, endIndex } = useMemo(() => {
+    const visCount = Math.ceil(height / itemHeight);
+    const start = Math.max(0, Math.floor(scrollTop / itemHeight) - overscan);
+    const end = Math.min(
+      items.length - 1,
+      Math.floor(scrollTop / itemHeight) + visCount + overscan
+    );
+    return {
+      startIndex: start,
+      endIndex: end,
+      visibleCount: visCount
+    };
+  }, [scrollTop, height, itemHeight, items.length, overscan]);
+  const handleScroll = useCallback(
+    (e) => {
+      const target = e.currentTarget;
+      setScrollTop(target.scrollTop);
+      if (onEndReached) {
+        const distanceFromBottom = target.scrollHeight - target.scrollTop - target.clientHeight;
+        if (distanceFromBottom < endReachedThreshold) {
+          onEndReached();
+        }
+      }
+    },
+    [onEndReached, endReachedThreshold]
+  );
+  useEffect(() => {
+    if (!ref) return;
+    const node = containerRef.current;
+    if (typeof ref === "function") {
+      ref(node);
+    } else if (ref && "current" in ref) {
+      ref.current = node;
+    }
+  }, [ref]);
+  if (items.length === 0 && emptyContent) {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref: containerRef,
+        className: cn(
+          "flex items-center justify-center rounded-lg border border-border bg-background shadow-sm not-prose",
+          className
+        ),
+        style: { height },
+        "data-ds": "",
+        "data-ds-component": "virtual-list",
+        children: emptyContent
+      }
+    );
+  }
+  const visibleItems = [];
+  for (let i = startIndex; i <= endIndex && i < items.length; i++) {
+    const key = getItemKey ? getItemKey(items[i], i) : i;
+    visibleItems.push(
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: cn(
+            "absolute left-0 right-0 flex items-center",
+            "transition-colors duration-fast ease-standard",
+            "hover:bg-muted/50",
+            "border-b border-border/50",
+            "[&_p]:m-0 [&_p]:leading-tight [&_span]:leading-tight",
+            itemClassName
+          ),
+          style: {
+            height: itemHeight,
+            top: i * itemHeight
+          },
+          role: "listitem",
+          "aria-setsize": items.length,
+          "aria-posinset": i + 1,
+          children: renderItem(items[i], i)
+        },
+        key
+      )
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref: containerRef,
+      className: cn(
+        "relative overflow-auto rounded-lg border border-border bg-background",
+        "shadow-sm not-prose",
+        "[scrollbar-width:thin] [scrollbar-color:hsl(var(--border))_transparent]",
+        "[&::-webkit-scrollbar]:w-1.5",
+        "[&::-webkit-scrollbar-track]:bg-transparent",
+        "[&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-thumb]:bg-border",
+        className
+      ),
+      style: { height },
+      onScroll: handleScroll,
+      role: "list",
+      "data-ds": "",
+      "data-ds-component": "virtual-list",
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "relative w-full", style: { height: totalHeight }, children: visibleItems }),
+        loading && /* @__PURE__ */ jsx("div", { className: "sticky bottom-0 flex items-center justify-center py-3 bg-background/80 backdrop-blur-sm border-t border-border/50", children: loadingIndicator ?? /* @__PURE__ */ jsx("div", { className: "size-5 animate-spin rounded-full border-2 border-border border-t-primary" }) })
+      ]
+    }
+  );
+});
+export {
+  VirtualList
+};

package/dist/components/visually-hidden.cjs

@@ -0,0 +1,43 @@
+"use strict";
+"use client";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var visually_hidden_exports = {};
+__export(visually_hidden_exports, {
+  VisuallyHidden: () => VisuallyHidden
+});
+module.exports = __toCommonJS(visually_hidden_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_radix_ui = require("radix-ui");
+var import_react = require("react");
+const VisuallyHidden = (0, import_react.forwardRef)(function VisuallyHidden2(props, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_radix_ui.VisuallyHidden.Root,
+    {
+      ref,
+      "data-ds": "",
+      "data-ds-component": "visually-hidden",
+      ...props
+    }
+  );
+});
+VisuallyHidden.displayName = "VisuallyHidden";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  VisuallyHidden
+});

package/dist/components/visually-hidden.d.cts

@@ -0,0 +1,9 @@
+import * as react from 'react';
+import { ComponentPropsWithoutRef } from 'react';
+import { VisuallyHidden as VisuallyHidden$1 } from 'radix-ui';
+
+interface VisuallyHiddenProps extends ComponentPropsWithoutRef<typeof VisuallyHidden$1.Root> {
+}
+declare const VisuallyHidden: react.ForwardRefExoticComponent<VisuallyHiddenProps & react.RefAttributes<HTMLSpanElement>>;
+
+export { VisuallyHidden, type VisuallyHiddenProps };

package/dist/components/visually-hidden.d.ts

@@ -0,0 +1,9 @@
+import * as react from 'react';
+import { ComponentPropsWithoutRef } from 'react';
+import { VisuallyHidden as VisuallyHidden$1 } from 'radix-ui';
+
+interface VisuallyHiddenProps extends ComponentPropsWithoutRef<typeof VisuallyHidden$1.Root> {
+}
+declare const VisuallyHidden: react.ForwardRefExoticComponent<VisuallyHiddenProps & react.RefAttributes<HTMLSpanElement>>;
+
+export { VisuallyHidden, type VisuallyHiddenProps };

package/dist/components/visually-hidden.mjs

@@ -0,0 +1,21 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { VisuallyHidden as VisuallyHiddenPrimitive } from "radix-ui";
+import {
+  forwardRef
+} from "react";
+const VisuallyHidden = forwardRef(function VisuallyHidden2(props, ref) {
+  return /* @__PURE__ */ jsx(
+    VisuallyHiddenPrimitive.Root,
+    {
+      ref,
+      "data-ds": "",
+      "data-ds-component": "visually-hidden",
+      ...props
+    }
+  );
+});
+VisuallyHidden.displayName = "VisuallyHidden";
+export {
+  VisuallyHidden
+};