@arbidocs/blocks 0.4.16 → 0.4.18

package/dist/chunk-V4ISCZJ7.cjs

@@ -1,207 +0,0 @@
-"use client";
-'use strict';
-
-var chunkPPCATBOY_cjs = require('./chunk-PPCATBOY.cjs');
-var chunkMHVNT4J3_cjs = require('./chunk-MHVNT4J3.cjs');
-var react = require('react');
-var lucideReact = require('lucide-react');
-var ui = require('@arbidocs/react/ui');
-var jsxRuntime = require('react/jsx-runtime');
-
-var NARROW_BELOW_PX = 480;
-var DEFAULT_SELECTION_BAR_LABELS = {
-  selected: "selected",
-  clearSelection: "Clear selection",
-  review: "Review",
-  selectionActions: "Selection actions"
-};
-function SelectionBar(props) {
-  if (props.count === 0 && !props.status) return null;
-  return /* @__PURE__ */ jsxRuntime.jsx(SelectionBarInner, { ...props });
-}
-function SelectionBarInner({
-  count,
-  onClear,
-  onReview,
-  actions,
-  children,
-  status,
-  selectedLabel,
-  labels,
-  testIds,
-  className
-}) {
-  const l = { ...DEFAULT_SELECTION_BAR_LABELS, ...labels };
-  const hasSelection = count > 0;
-  const rootRef = react.useRef(null);
-  const actionsRef = react.useRef(null);
-  const [isCompact, setIsCompact] = react.useState(false);
-  const [isNarrow, setIsNarrow] = react.useState(false);
-  const overflowRootWidthRef = react.useRef(Number.POSITIVE_INFINITY);
-  const measureRef = react.useRef(() => {
-  });
-  measureRef.current = () => {
-    const root = rootRef.current;
-    const el = actionsRef.current;
-    if (!root || !el) return;
-    const available = root.parentElement?.clientWidth ?? 0;
-    setIsNarrow(available > 0 && available < NARROW_BELOW_PX);
-    if (!isCompact) {
-      if (el.scrollWidth > el.clientWidth + 1) {
-        overflowRootWidthRef.current = root.clientWidth;
-        setIsCompact(true);
-      }
-    } else if (root.clientWidth > overflowRootWidthRef.current + 64) {
-      setIsCompact(false);
-    }
-  };
-  react.useLayoutEffect(() => {
-    measureRef.current();
-    const root = rootRef.current;
-    if (!root) return;
-    return chunkPPCATBOY_cjs.observeResize(root, () => measureRef.current());
-  }, []);
-  react.useLayoutEffect(() => {
-    measureRef.current();
-    const inner = actionsRef.current;
-    if (!inner || typeof ResizeObserver === "undefined") return;
-    const observer = new ResizeObserver(() => measureRef.current());
-    inner.querySelectorAll("button").forEach((button) => observer.observe(button));
-    return () => observer.disconnect();
-  });
-  react.useLayoutEffect(() => {
-    let isCancelled = false;
-    void document.fonts?.ready.then(() => {
-      if (!isCancelled) measureRef.current();
-    });
-    return () => {
-      isCancelled = true;
-    };
-  }, []);
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      "data-slot": "selection-bar",
-      className: ui.cn("pointer-events-none sticky bottom-0 z-30 h-0", className),
-      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-x-0 bottom-4 flex justify-center px-3", children: /* @__PURE__ */ jsxRuntime.jsx(
-        "div",
-        {
-          ref: rootRef,
-          role: "toolbar",
-          "aria-label": l.selectionActions,
-          "data-testid": chunkMHVNT4J3_cjs.testIdOr(testIds?.toolbar, { testId: "bulk-actions-toolbar" }),
-          "data-narrow": isNarrow || void 0,
-          className: "pointer-events-auto flex min-h-12 max-w-full items-center rounded-lg border border-border bg-popover px-2 py-1.5 shadow-xl",
-          children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-1 items-center gap-2 px-1", children: [
-            /* @__PURE__ */ jsxRuntime.jsxs(
-              "div",
-              {
-                "data-testid": chunkMHVNT4J3_cjs.testIdOr(testIds?.count, { testId: "bulk-selected-count" }),
-                "aria-live": "polite",
-                className: ui.cn(
-                  "flex shrink-0 items-center rounded-full bg-accent text-sm font-semibold tabular-nums text-accent-foreground",
-                  isCompact ? "gap-1 px-2.5 py-1" : "gap-2 px-3 py-1"
-                ),
-                children: [
-                  /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
-                    count,
-                    !isCompact && ` ${selectedLabel ?? l.selected}`
-                  ] }),
-                  hasSelection && /* @__PURE__ */ jsxRuntime.jsx(
-                    "button",
-                    {
-                      type: "button",
-                      onClick: onClear,
-                      "aria-label": l.clearSelection,
-                      "data-testid": chunkMHVNT4J3_cjs.testIdOr(testIds?.clear, { testId: "bulk-clear-selection-button" }),
-                      className: "rounded-full p-0.5 transition-colors hover:bg-foreground/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring pointer-coarse:p-[15px]",
-                      children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "size-3.5" })
-                    }
-                  )
-                ]
-              }
-            ),
-            onReview && /* @__PURE__ */ jsxRuntime.jsxs(
-              "button",
-              {
-                type: "button",
-                onClick: onReview,
-                "aria-label": isNarrow ? l.review : void 0,
-                "data-testid": chunkMHVNT4J3_cjs.testIdOr(testIds?.review, { testId: "bulk-review-button" }),
-                className: "flex h-8 shrink-0 items-center gap-1.5 rounded-md bg-accent px-2.5 text-sm font-medium text-accent-foreground transition-colors hover:bg-accent/70 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring pointer-coarse:h-11",
-                children: [
-                  /* @__PURE__ */ jsxRuntime.jsx(lucideReact.BookOpen, { className: "size-3.5" }),
-                  !isNarrow && l.review
-                ]
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-6 w-px shrink-0 bg-border" }),
-            /* @__PURE__ */ jsxRuntime.jsxs(
-              "div",
-              {
-                ref: actionsRef,
-                className: "flex min-w-0 flex-1 items-center gap-2 overflow-x-auto overscroll-x-contain [scrollbar-width:none]",
-                children: [
-                  status && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex shrink-0 items-center gap-2", children: status }),
-                  /* @__PURE__ */ jsxRuntime.jsxs(
-                    "div",
-                    {
-                      className: ui.cn(
-                        "flex min-w-0 items-center gap-2",
-                        !hasSelection && "pointer-events-none opacity-40"
-                      ),
-                      children: [
-                        actions?.map((a) => /* @__PURE__ */ jsxRuntime.jsx(SelectionBarAction, { ...a, isCompact }, a.id)),
-                        typeof children === "function" ? children(isCompact, isNarrow) : children
-                      ]
-                    }
-                  )
-                ]
-              }
-            )
-          ] })
-        }
-      ) })
-    }
-  );
-}
-function SelectionBarAction({
-  icon: Icon,
-  label,
-  onClick,
-  disabled = false,
-  variant = "ghost",
-  tooltip,
-  testId,
-  className,
-  isCompact = false
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Tooltip, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(ui.TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
-      ui.Button,
-      {
-        variant,
-        size: "sm",
-        onClick,
-        disabled,
-        "aria-label": isCompact ? label : void 0,
-        "data-testid": testId,
-        className: ui.cn(
-          "h-8 shrink-0 gap-1.5 whitespace-nowrap px-2 disabled:opacity-50 pointer-coarse:h-11",
-          className
-        ),
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: "size-4" }),
-          !isCompact && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm", children: label })
-        ]
-      }
-    ) }),
-    /* @__PURE__ */ jsxRuntime.jsx(ui.TooltipContent, { children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: tooltip ?? label }) })
-  ] });
-}
-
-exports.DEFAULT_SELECTION_BAR_LABELS = DEFAULT_SELECTION_BAR_LABELS;
-exports.SelectionBar = SelectionBar;
-exports.SelectionBarAction = SelectionBarAction;
-//# sourceMappingURL=chunk-V4ISCZJ7.cjs.map
-//# sourceMappingURL=chunk-V4ISCZJ7.cjs.map

package/dist/chunk-V4ISCZJ7.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/files/SelectionBar.tsx"],"names":["jsx","useRef","useState","useLayoutEffect","observeResize","cn","testIdOr","jsxs","X","BookOpen","Tooltip","TooltipTrigger","Button","TooltipContent"],"mappings":"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","file":"chunk-V4ISCZJ7.cjs","sourcesContent":["import { useLayoutEffect, useRef, useState } from 'react'\nimport type { ReactNode } from 'react'\nimport type { LucideIcon } from 'lucide-react'\nimport { BookOpen, X } from 'lucide-react'\nimport { Button, Tooltip, TooltipContent, TooltipTrigger, cn } from '@arbidocs/react/ui'\nimport { testIdOr } from '../chat/test-id'\nimport { observeResize } from '../lib/observe-resize'\n\nexport interface SelectionBarActionItem {\n  id: string\n  icon: LucideIcon\n  label: string\n  onClick: () => void\n  disabled?: boolean\n  variant?: 'default' | 'outline' | 'destructive' | 'ghost' | 'secondary'\n  /** Tooltip text; falls back to `label`. */\n  tooltip?: string\n  testId?: string\n  className?: string\n}\n\n/** Container width below which the bar is \"narrow\" (phones): only the essentials stay inline. */\nconst NARROW_BELOW_PX = 480\n\n/** Every fixed string of the selection bar. Pass a partial `labels` to translate or reword. */\nexport interface SelectionBarLabels {\n  selected: string\n  clearSelection: string\n  review: string\n  selectionActions: string\n}\n\nexport const DEFAULT_SELECTION_BAR_LABELS: SelectionBarLabels = {\n  selected: 'selected',\n  clearSelection: 'Clear selection',\n  review: 'Review',\n  selectionActions: 'Selection actions',\n}\n\nexport interface SelectionBarTestIds {\n  toolbar: string\n  count: string\n  clear: string\n  review: string\n}\n\nexport interface SelectionBarProps {\n  /** Number of selected rows. The bar renders only while this is > 0 (or `status` is set). */\n  count: number\n  onClear: () => void\n  /** Primary-in-bar \"Review\" shortcut (tonal, not the view's filled primary). */\n  onReview?: () => void\n  /** Actions as data. Rendered icon-only automatically when the bar is narrow. */\n  actions?: SelectionBarActionItem[]\n  /**\n   * Free-form actions; a function receives `isCompact` (icon-only) and `isNarrow` (a phone-width\n   * container: fold secondary actions into an overflow menu). Rendered after `actions`.\n   */\n  children?: ReactNode | ((isCompact: boolean, isNarrow: boolean) => ReactNode)\n  /** Always-legible content before the actions (e.g. a running budget); never dimmed. */\n  status?: ReactNode\n  /** Singular noun shown after the count; wins over `labels.selected`. */\n  selectedLabel?: string\n  labels?: Partial<SelectionBarLabels>\n  /** Overrides for the control test ids (defaults keep the current ids). */\n  testIds?: Partial<SelectionBarTestIds>\n  className?: string\n}\n\n/**\n * SelectionBar: the floating bar that appears while rows are selected.\n *\n * Stays on ONE row: when the actions overflow it flips to compact mode (icon-only actions and a\n * count-only badge) instead of wrapping. Sticky zero-height anchor, so showing/hiding it never\n * reflows the content beneath. Every control is always visible (nothing hover-only) and 44px on\n * coarse pointers.\n */\nexport function SelectionBar(props: SelectionBarProps) {\n  if (props.count === 0 && !props.status) return null\n  return <SelectionBarInner {...props} />\n}\n\nfunction SelectionBarInner({\n  count,\n  onClear,\n  onReview,\n  actions,\n  children,\n  status,\n  selectedLabel,\n  labels,\n  testIds,\n  className,\n}: SelectionBarProps) {\n  const l = { ...DEFAULT_SELECTION_BAR_LABELS, ...labels }\n  const hasSelection = count > 0\n  const rootRef = useRef<HTMLDivElement>(null)\n  const actionsRef = useRef<HTMLDivElement>(null)\n  const [isCompact, setIsCompact] = useState(false)\n  const [isNarrow, setIsNarrow] = useState(false)\n  // Root width at which the labelled actions last overflowed. Compared against the (stable) root\n  // width, never the actions' own width, which changes when we collapse labels and would oscillate.\n  const overflowRootWidthRef = useRef(Number.POSITIVE_INFINITY)\n\n  const measureRef = useRef<() => void>(() => {})\n  measureRef.current = () => {\n    const root = rootRef.current\n    const el = actionsRef.current\n    if (!root || !el) return\n    // The bar is content-sized, so judge narrowness by the space it is given (its anchor).\n    const available = root.parentElement?.clientWidth ?? 0\n    setIsNarrow(available > 0 && available < NARROW_BELOW_PX)\n    if (!isCompact) {\n      if (el.scrollWidth > el.clientWidth + 1) {\n        overflowRootWidthRef.current = root.clientWidth\n        setIsCompact(true)\n      }\n    } else if (root.clientWidth > overflowRootWidthRef.current + 64) {\n      setIsCompact(false)\n    }\n  }\n\n  useLayoutEffect(() => {\n    measureRef.current()\n    const root = rootRef.current\n    if (!root) return\n    return observeResize(root, () => measureRef.current())\n  }, [])\n  // The bar is capped by its anchor, so its own size does not change when the actions overflow, and\n  // the actions' text widens once the web font loads. Re-measure after every render and whenever\n  // an action changes size. The measurement only sets state on a change, so this cannot loop.\n  useLayoutEffect(() => {\n    measureRef.current()\n    const inner = actionsRef.current\n    if (!inner || typeof ResizeObserver === 'undefined') return\n    const observer = new ResizeObserver(() => measureRef.current())\n    inner.querySelectorAll('button').forEach((button) => observer.observe(button))\n    return () => observer.disconnect()\n  })\n  useLayoutEffect(() => {\n    let isCancelled = false\n    void document.fonts?.ready.then(() => {\n      if (!isCancelled) measureRef.current()\n    })\n    return () => {\n      isCancelled = true\n    }\n  }, [])\n\n  return (\n    <div\n      data-slot=\"selection-bar\"\n      className={cn('pointer-events-none sticky bottom-0 z-30 h-0', className)}\n    >\n      <div className=\"absolute inset-x-0 bottom-4 flex justify-center px-3\">\n        <div\n          ref={rootRef}\n          role=\"toolbar\"\n          aria-label={l.selectionActions}\n          data-testid={testIdOr(testIds?.toolbar, { testId: 'bulk-actions-toolbar' })}\n          data-narrow={isNarrow || undefined}\n          className=\"pointer-events-auto flex min-h-12 max-w-full items-center rounded-lg border border-border bg-popover px-2 py-1.5 shadow-xl\"\n        >\n          <div className=\"flex min-w-0 flex-1 items-center gap-2 px-1\">\n            <div\n              data-testid={testIdOr(testIds?.count, { testId: 'bulk-selected-count' })}\n              aria-live=\"polite\"\n              className={cn(\n                'flex shrink-0 items-center rounded-full bg-accent text-sm font-semibold tabular-nums text-accent-foreground',\n                isCompact ? 'gap-1 px-2.5 py-1' : 'gap-2 px-3 py-1'\n              )}\n            >\n              <span>\n                {count}\n                {!isCompact && ` ${selectedLabel ?? l.selected}`}\n              </span>\n              {hasSelection && (\n                <button\n                  type=\"button\"\n                  onClick={onClear}\n                  aria-label={l.clearSelection}\n                  data-testid={testIdOr(testIds?.clear, { testId: 'bulk-clear-selection-button' })}\n                  className=\"rounded-full p-0.5 transition-colors hover:bg-foreground/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring pointer-coarse:p-[15px]\"\n                >\n                  <X className=\"size-3.5\" />\n                </button>\n              )}\n            </div>\n\n            {onReview && (\n              <button\n                type=\"button\"\n                onClick={onReview}\n                aria-label={isNarrow ? l.review : undefined}\n                data-testid={testIdOr(testIds?.review, { testId: 'bulk-review-button' })}\n                className=\"flex h-8 shrink-0 items-center gap-1.5 rounded-md bg-accent px-2.5 text-sm font-medium text-accent-foreground transition-colors hover:bg-accent/70 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring pointer-coarse:h-11\"\n              >\n                <BookOpen className=\"size-3.5\" />\n                {!isNarrow && l.review}\n              </button>\n            )}\n\n            <div className=\"h-6 w-px shrink-0 bg-border\" />\n\n            <div\n              ref={actionsRef}\n              className=\"flex min-w-0 flex-1 items-center gap-2 overflow-x-auto overscroll-x-contain [scrollbar-width:none]\"\n            >\n              {status && <div className=\"flex shrink-0 items-center gap-2\">{status}</div>}\n              <div\n                className={cn(\n                  'flex min-w-0 items-center gap-2',\n                  !hasSelection && 'pointer-events-none opacity-40'\n                )}\n              >\n                {actions?.map((a) => (\n                  <SelectionBarAction key={a.id} {...a} isCompact={isCompact} />\n                ))}\n                {typeof children === 'function' ? children(isCompact, isNarrow) : children}\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\n\nexport interface SelectionBarActionProps extends Omit<SelectionBarActionItem, 'id'> {\n  /** Icon-only (the bar passes this when narrow). */\n  isCompact?: boolean\n}\n\n/** One action button in the bar: icon + label, icon-only when compact, always with a tooltip. */\nexport function SelectionBarAction({\n  icon: Icon,\n  label,\n  onClick,\n  disabled = false,\n  variant = 'ghost',\n  tooltip,\n  testId,\n  className,\n  isCompact = false,\n}: SelectionBarActionProps) {\n  return (\n    <Tooltip>\n      <TooltipTrigger asChild>\n        <Button\n          variant={variant}\n          size=\"sm\"\n          onClick={onClick}\n          disabled={disabled}\n          aria-label={isCompact ? label : undefined}\n          data-testid={testId}\n          className={cn(\n            'h-8 shrink-0 gap-1.5 whitespace-nowrap px-2 disabled:opacity-50 pointer-coarse:h-11',\n            className\n          )}\n        >\n          <Icon className=\"size-4\" />\n          {!isCompact && <span className=\"text-sm\">{label}</span>}\n        </Button>\n      </TooltipTrigger>\n      <TooltipContent>\n        <p>{tooltip ?? label}</p>\n      </TooltipContent>\n    </Tooltip>\n  )\n}\n"]}