@expcat/tigercat-react 2.1.2 → 2.1.4

package/dist/{chunk-2YBLMVDT.mjs → chunk-3QSO6YK5.mjs}

@@ -1,12 +1,13 @@
 import {
   ChartCanvas
-} from "./chunk-CUAXRBKO.mjs";
+} from "./chunk-OP77MPGN.mjs";
+import {
+  useTigerConfig
+} from "./chunk-RUIFGSVN.mjs";
 
 // src/components/Gantt.tsx
 import { useEffect, useMemo, useRef, useState } from "react";
 import {
-  applyGanttTaskDateOverlay,
-  classNames,
   clampGanttDragDeltaX,
   computeGanttLayout,
   ganttAxisTextClasses,
@@ -16,7 +17,10 @@ import {
   ganttProgressClasses,
   ganttRowClasses,
   ganttTodayLineClasses,
-  getChartInnerRect,
+  getCartesianChartShellClasses,
+  getChartLabels,
+  mergeTigerLocale,
+  normalizeChartPadding,
   getGanttTaskAriaLabel,
   getGanttTaskClasses,
   isBrowser,
@@ -44,12 +48,14 @@ function Gantt({
   selectable = false,
   selectedId,
   activeOpacity = 1,
-  inactiveOpacity = 0.35,
+  inactiveOpacity = 0.25,
+  draggable = false,
   dateFormatter,
+  weekStartsOn,
   colors,
   title,
   desc,
-  ariaLabel = "Gantt chart",
+  ariaLabel,
   className,
   onTaskClick,
   onTaskHover,
@@ -57,11 +63,10 @@ function Gantt({
   onTaskChange,
   onDataChange
 }) {
+  const config = useTigerConfig();
+  const labels = useMemo(() => getChartLabels(mergeTigerLocale(config.locale)), [config.locale]);
   const [innerSelectedId, setInnerSelectedId] = useState(null);
   const [hoveredId, setHoveredId] = useState(null);
-  const [dateOverlay, setDateOverlay] = useState(
-    () => /* @__PURE__ */ new Map()
-  );
   const [dragPreview, setDragPreview] = useState(
     null
   );
@@ -82,8 +87,6 @@ function Gantt({
   }).current;
   const dataRef = useRef(data);
   dataRef.current = data;
-  const dateOverlayRef = useRef(dateOverlay);
-  dateOverlayRef.current = dateOverlay;
   const onTaskChangeRef = useRef(onTaskChange);
   onTaskChangeRef.current = onTaskChange;
   const onDataChangeRef = useRef(onDataChange);
@@ -109,17 +112,12 @@ function Gantt({
     },
     [onDocumentPointerEnd, onDocumentPointerMove]
   );
-  const resolvedData = useMemo(
-    () => applyGanttTaskDateOverlay(data, dateOverlay),
-    [data, dateOverlay]
-  );
-  const innerRect = useMemo(
-    () => getChartInnerRect(width, height, padding),
-    [height, padding, width]
-  );
+  const canDrag = draggable || Boolean(onTaskChange) || Boolean(onDataChange);
+  const resolvedPadding = normalizeChartPadding(padding);
+  const minPlotWidth = width;
   const layout = useMemo(
-    () => computeGanttLayout(resolvedData, {
-      width: innerRect.width,
+    () => computeGanttLayout(data, {
+      width: Math.max(0, minPlotWidth - resolvedPadding.left - resolvedPadding.right),
       rowHeight,
       barHeight,
       taskLabelWidth,
@@ -130,27 +128,34 @@ function Gantt({
       scale,
       colors,
       today: showToday ? /* @__PURE__ */ new Date() : void 0,
-      dateFormatter
+      dateFormatter,
+      weekStartsOn
     }),
     [
       barHeight,
       colors,
+      data,
       dateFormatter,
-      innerRect.width,
       maxDate,
       minBarWidth,
       minDate,
-      resolvedData,
+      minPlotWidth,
+      resolvedPadding.left,
+      resolvedPadding.right,
       rowHeight,
       scale,
       showToday,
       taskLabelWidth,
-      timelineHeight
+      timelineHeight,
+      weekStartsOn
     ]
   );
+  const plotWidth = Math.max(width, layout.width + resolvedPadding.left + resolvedPadding.right);
+  const plotHeight = Math.max(height, layout.height + resolvedPadding.top + resolvedPadding.bottom);
   const activeId = resolvedSelectedId ?? hoveredId;
   const selectTask = (task) => {
-    if (selectableRef.current && !task.task.disabled) {
+    if (task.task.disabled) return;
+    if (selectableRef.current) {
       const nextId = resolvedSelectedIdRef.current === task.id ? null : task.id;
       if (selectedIdRef.current === void 0) setInnerSelectedId(nextId);
       onSelectedIdChangeRef.current?.(nextId);
@@ -232,17 +237,7 @@ function Gantt({
       selectTask(session.task);
       return;
     }
-    const incoming = dataRef.current.find((item) => item.id === nextTask.id);
-    const previous = dateOverlayRef.current.get(nextTask.id);
-    const nextOverlay = new Map(dateOverlayRef.current);
-    nextOverlay.set(nextTask.id, {
-      start: nextTask.start,
-      end: nextTask.end,
-      baseStart: previous?.baseStart ?? incoming?.start ?? session.sourceTask.start,
-      baseEnd: previous?.baseEnd ?? incoming?.end ?? session.sourceTask.end
-    });
-    setDateOverlay(nextOverlay);
-    const nextData = applyGanttTaskDateOverlay(dataRef.current, nextOverlay);
+    const nextData = dataRef.current.map((item) => item.id === nextTask.id ? nextTask : item);
     onTaskChangeRef.current?.(nextTask);
     onDataChangeRef.current?.(nextData);
   };
@@ -256,7 +251,7 @@ function Gantt({
     documentPointerListeningRef.current = true;
   };
   const startBarDrag = (event, task) => {
-    if (task.task.disabled || dragSessionRef.current) return;
+    if (!canDrag || task.task.disabled || dragSessionRef.current) return;
     if (event.button !== void 0 && event.button !== 0) return;
     event.preventDefault();
     const captureTarget = event.currentTarget instanceof Element ? event.currentTarget : null;
@@ -289,17 +284,15 @@ function Gantt({
     }
     selectTask(task);
   };
-  return /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx("div", { className: getCartesianChartShellClasses({ showLegend: false, className }), children: /* @__PURE__ */ jsx(
     ChartCanvas,
     {
-      width,
-      height,
+      width: plotWidth,
+      height: plotHeight,
       padding,
       title,
       desc,
-      className: classNames(className),
-      role: "img",
-      "aria-label": ariaLabel,
+      "aria-label": ariaLabel ?? (title ? void 0 : labels.ganttAriaLabel),
       children: /* @__PURE__ */ jsxs("g", { "data-series-type": "gantt", children: [
         /* @__PURE__ */ jsxs("g", { "data-gantt-axis": "true", children: [
           /* @__PURE__ */ jsx(
@@ -359,8 +352,8 @@ function Gantt({
         )) }) : null,
         /* @__PURE__ */ jsx("g", { "data-gantt-tasks": "true", children: layout.tasks.map((task) => {
           const selected = resolvedSelectedId === task.id;
-          const interactive = (hoverable || selectable) && !task.task.disabled;
-          const movable = !task.task.disabled;
+          const interactive = (hoverable || selectable || Boolean(onTaskClick)) && !task.task.disabled;
+          const movable = canDrag && !task.task.disabled;
           const grabbing = dragPreview?.id === task.id;
           const previewDeltaX = grabbing ? dragPreview?.deltaX ?? 0 : 0;
           return /* @__PURE__ */ jsxs("g", { opacity: getTaskOpacity(task), children: [
@@ -419,7 +412,7 @@ function Gantt({
         }) })
       ] })
     }
-  );
+  ) });
 }
 Gantt.displayName = "Gantt";
 

package/dist/chunk-3QXXNK5X.mjs

@@ -0,0 +1,274 @@
+import {
+  useFormItemControlContext
+} from "./chunk-F6T3OLTQ.mjs";
+import {
+  useControlledState
+} from "./chunk-UJTAHHQT.mjs";
+import {
+  renderOverlayPortal,
+  useBodyScrollLock,
+  useEscapeKey,
+  useFocusTrap
+} from "./chunk-OU2AV7DY.mjs";
+import {
+  useTigerConfig
+} from "./chunk-RUIFGSVN.mjs";
+
+// src/components/NumberKeyboard.tsx
+import { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from "react";
+import {
+  applyNumberKeyboardKey,
+  classNames,
+  getNumberKeyboardInteractiveIndexes,
+  getNumberKeyboardKeyClasses,
+  getNumberKeyboardKeys,
+  getNumberKeyboardLabels,
+  mergeAriaDescribedBy,
+  mergeTigerLocale,
+  moveNumberKeyboardIndex,
+  numberKeyboardEmptyKeyClasses,
+  numberKeyboardGridClasses,
+  numberKeyboardRootClasses,
+  numberKeyboardScrimClasses,
+  numberKeyboardSheetClasses,
+  postNumberKeyboardValue,
+  resolveAnchoredOverlayTarget,
+  resolveNumberKeyboardPhysicalKey
+} from "@expcat/tigercat-core";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var NumberKeyboard = forwardRef(
+  function NumberKeyboard2({
+    value,
+    defaultValue,
+    mode = "number",
+    maxLength,
+    precision,
+    decimalSeparator = ".",
+    disabled = false,
+    readonly = false,
+    confirmText,
+    deleteText,
+    ariaLabel,
+    showConfirm = true,
+    open,
+    defaultOpen,
+    name,
+    id,
+    status: statusProp,
+    locale,
+    labels: labelsOverride,
+    className,
+    style,
+    onChange,
+    onOpenChange,
+    onKeyPress,
+    onDelete,
+    onConfirm,
+    onBlur,
+    ...rest
+  }, ref) {
+    const config = useTigerConfig();
+    const formItemControl = useFormItemControlContext();
+    const mergedLocale = useMemo(
+      () => mergeTigerLocale(config.locale, locale),
+      [config.locale, locale]
+    );
+    const labels = useMemo(
+      () => getNumberKeyboardLabels(mergedLocale, {
+        ...labelsOverride,
+        ariaLabel: ariaLabel?.trim() || labelsOverride?.ariaLabel,
+        deleteText: deleteText?.trim() || labelsOverride?.deleteText,
+        confirmText: confirmText?.trim()
+      }),
+      [ariaLabel, confirmText, deleteText, labelsOverride, mergedLocale]
+    );
+    const effectiveDisabled = Boolean(disabled || formItemControl?.disabled);
+    const status = statusProp ?? formItemControl?.status ?? "default";
+    const effectiveId = id ?? formItemControl?.id;
+    const effectiveName = name ?? formItemControl?.name;
+    const describedBy = mergeAriaDescribedBy(
+      typeof rest["aria-describedby"] === "string" ? rest["aria-describedby"] : void 0,
+      formItemControl?.describedBy
+    );
+    const labelledby = typeof rest["aria-labelledby"] === "string" && rest["aria-labelledby"].trim() ? rest["aria-labelledby"] : formItemControl?.labelId;
+    const parsedValue = value !== void 0 ? value : formItemControl?.value;
+    const overlayMode = open !== void 0 || defaultOpen !== void 0;
+    const [currentValue, setCurrentValue] = useControlledState({
+      value: value !== void 0 || formItemControl?.value !== void 0 ? parsedValue : void 0,
+      defaultValue: defaultValue ?? "",
+      onChange: (next, payload) => {
+        onChange?.(next, payload);
+        formItemControl?.onChange?.(next);
+      },
+      postState: (next) => postNumberKeyboardValue(next, mode)
+    });
+    const [isOpen, setOpen] = useControlledState({
+      value: open,
+      defaultValue: defaultOpen ?? false,
+      onChange: onOpenChange
+    });
+    const rootRef = useRef(null);
+    const sheetRef = useRef(null);
+    const setRootRef = (node) => {
+      rootRef.current = node;
+      if (typeof ref === "function") ref(node);
+      else if (ref) ref.current = node;
+    };
+    const keys = useMemo(
+      () => getNumberKeyboardKeys({
+        mode,
+        decimalSeparator,
+        showConfirm,
+        labels
+      }),
+      [decimalSeparator, labels, mode, showConfirm]
+    );
+    const interactive = useMemo(() => getNumberKeyboardInteractiveIndexes(keys), [keys]);
+    const [activeIndex, setActiveIndex] = useState(() => interactive[0] ?? 0);
+    useEffect(() => {
+      if (!interactive.includes(activeIndex)) setActiveIndex(interactive[0] ?? 0);
+    }, [activeIndex, interactive]);
+    const overlayEnabled = overlayMode && isOpen && !effectiveDisabled;
+    useFocusTrap({ enabled: overlayEnabled, containerRef: sheetRef, inert: true });
+    useBodyScrollLock({ enabled: overlayEnabled });
+    useEscapeKey({
+      enabled: overlayEnabled,
+      onEscape: () => setOpen(false),
+      layerRef: sheetRef
+    });
+    const inputOptions = {
+      mode,
+      maxLength,
+      precision,
+      decimalSeparator
+    };
+    const closeSheet = useCallback(() => {
+      if (overlayMode) setOpen(false);
+    }, [overlayMode, setOpen]);
+    function applyKey(key) {
+      if (effectiveDisabled || readonly || key.type === "empty") return;
+      const result = applyNumberKeyboardKey(currentValue, key, inputOptions);
+      const payload = {
+        value: result.nextValue,
+        key: key.value,
+        action: result.action,
+        mode
+      };
+      onKeyPress?.(key, payload);
+      if (result.action === "confirm") {
+        onConfirm?.(currentValue, { ...payload, value: currentValue });
+        closeSheet();
+        return;
+      }
+      if (result.action === "delete") onDelete?.(result.nextValue, payload);
+      if (result.changed) setCurrentValue(result.nextValue, payload);
+    }
+    function handleGroupKeyDown(event) {
+      if (effectiveDisabled) return;
+      if (event.key === "ArrowLeft" || event.key === "ArrowRight" || event.key === "ArrowUp" || event.key === "ArrowDown" || event.key === "Home" || event.key === "End") {
+        event.preventDefault();
+        setActiveIndex((index) => moveNumberKeyboardIndex(keys, index, event.key));
+        return;
+      }
+      if (event.key === " ") {
+        event.preventDefault();
+        const key = keys[activeIndex];
+        if (key) applyKey(key);
+        return;
+      }
+      const physical = resolveNumberKeyboardPhysicalKey(event.key, inputOptions);
+      if (!physical) return;
+      event.preventDefault();
+      const match = keys.find((key) => key.type === physical.type && key.value === physical.value) ?? {
+        type: physical.type,
+        value: physical.value,
+        label: physical.value,
+        ariaLabel: physical.value
+      };
+      applyKey(match);
+    }
+    function handleFocusOut(event) {
+      const next = event.relatedTarget;
+      const root = overlayMode ? sheetRef.current : rootRef.current;
+      if (root && next && root.contains(next)) return;
+      formItemControl?.onBlur?.();
+      onBlur?.(event);
+    }
+    const { "aria-describedby": _describedBy, "aria-labelledby": _labelledby, ...rootRest } = rest;
+    const group = (sheet) => /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: sheet ? sheetRef : setRootRef,
+        className: classNames(
+          sheet ? numberKeyboardSheetClasses : numberKeyboardRootClasses,
+          className
+        ),
+        style: sheet ? void 0 : style,
+        role: sheet ? "dialog" : "group",
+        "aria-modal": sheet || void 0,
+        id: effectiveId,
+        tabIndex: effectiveDisabled ? -1 : 0,
+        "aria-label": labelledby ? void 0 : labels.ariaLabel,
+        "aria-labelledby": labelledby,
+        "aria-describedby": describedBy,
+        "aria-disabled": effectiveDisabled || void 0,
+        "aria-readonly": readonly || void 0,
+        "aria-invalid": status === "error" ? true : void 0,
+        "aria-required": formItemControl?.required || void 0,
+        "data-tiger-number-keyboard": "",
+        onKeyDown: handleGroupKeyDown,
+        onBlur: handleFocusOut,
+        ...rootRest,
+        children: [
+          effectiveName ? /* @__PURE__ */ jsx("input", { type: "hidden", name: effectiveName, value: currentValue }) : null,
+          /* @__PURE__ */ jsx("div", { className: numberKeyboardGridClasses, children: keys.map(
+            (key, index) => key.type === "empty" ? /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: numberKeyboardEmptyKeyClasses,
+                "aria-hidden": "true"
+              },
+              `${key.type}-${index}`
+            ) : /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                tabIndex: -1,
+                className: getNumberKeyboardKeyClasses(key, effectiveDisabled),
+                disabled: effectiveDisabled,
+                "aria-label": key.ariaLabel,
+                "data-key": key.value,
+                "data-active": index === activeIndex ? "" : void 0,
+                onClick: () => {
+                  setActiveIndex(index);
+                  applyKey(key);
+                },
+                children: key.label
+              },
+              `${key.type}-${key.value}-${index}`
+            )
+          ) })
+        ]
+      }
+    );
+    if (!overlayMode) return group(false);
+    const portalTarget = resolveAnchoredOverlayTarget(rootRef.current);
+    return /* @__PURE__ */ jsxs("div", { ref: setRootRef, className: classNames("contents", className), style, children: [
+      effectiveName ? /* @__PURE__ */ jsx("input", { type: "hidden", name: effectiveName, value: currentValue }) : null,
+      overlayEnabled ? renderOverlayPortal(
+        /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx("div", { className: numberKeyboardScrimClasses, onClick: closeSheet }),
+          group(true)
+        ] }),
+        portalTarget
+      ) : null
+    ] });
+  }
+);
+NumberKeyboard.displayName = "NumberKeyboard";
+var NumberKeyboard_default = NumberKeyboard;
+
+export {
+  NumberKeyboard,
+  NumberKeyboard_default
+};

package/dist/{chunk-YJ5T4XZN.mjs → chunk-3WP4PGHF.mjs}

@@ -1,20 +1,22 @@
 import {
   useTigerConfig
-} from "./chunk-YSIXURBW.mjs";
+} from "./chunk-RUIFGSVN.mjs";
 
 // src/components/Code.tsx
-import { useEffect, useMemo, useState } from "react";
+import { forwardRef, useEffect, useMemo, useRef, useState } from "react";
 import {
+  codeBlockCopyStatusLiveClasses,
   codeBlockPreClasses,
   copyTextToClipboard,
+  createCopyStatusReset,
   getCodeBlockContainerClasses,
   getCodeBlockCopyButtonClasses,
   getCodeLabels,
   mergeTigerLocale,
   resolveLocaleText
 } from "@expcat/tigercat-core";
-import { jsx, jsxs } from "react/jsx-runtime";
-var Code = ({
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var Code = forwardRef(function Code2({
   code,
   copyable = true,
   copyLabel,
@@ -25,7 +27,7 @@ var Code = ({
   onCopy,
   className,
   ...props
-}) => {
+}, ref) {
   const config = useTigerConfig();
   const mergedLocale = useMemo(
     () => mergeTigerLocale(config.locale, locale),
@@ -39,40 +41,37 @@ var Code = ({
   const resolvedCopiedLabel = resolveLocaleText(labels.copiedLabel, copiedLabel);
   const resolvedCopyFailedLabel = resolveLocaleText(labels.copyFailedLabel, copyFailedLabel);
   const [copyStatus, setCopyStatus] = useState("idle");
+  const resetRef = useRef(null);
+  if (resetRef.current == null) {
+    resetRef.current = createCopyStatusReset(setCopyStatus);
+  }
   useEffect(() => {
-    if (copyStatus === "idle") return;
-    const timer = window.setTimeout(() => {
-      setCopyStatus("idle");
-    }, 1500);
-    return () => window.clearTimeout(timer);
-  }, [copyStatus]);
+    const machine = resetRef.current;
+    return () => machine?.dispose();
+  }, []);
   const handleCopy = async () => {
     if (!copyable) return;
     const ok = await copyTextToClipboard(code);
     if (ok) {
-      setCopyStatus("copied");
+      resetRef.current?.schedule("copied");
       onCopy?.(code);
     } else {
-      setCopyStatus("failed");
+      resetRef.current?.schedule("failed");
     }
   };
   const containerClasses = getCodeBlockContainerClasses(className);
   const copyButtonClasses = getCodeBlockCopyButtonClasses(copyStatus);
   const buttonLabel = copyStatus === "failed" ? resolvedCopyFailedLabel : copyStatus === "copied" ? resolvedCopiedLabel : resolvedCopyLabel;
-  return /* @__PURE__ */ jsxs("div", { className: containerClasses, ...props, children: [
+  const liveText = copyStatus === "idle" ? "" : buttonLabel;
+  return /* @__PURE__ */ jsxs("div", { ref, className: containerClasses, ...props, children: [
     /* @__PURE__ */ jsx("pre", { className: codeBlockPreClasses, children: /* @__PURE__ */ jsx("code", { className: "block", children: code }) }),
-    copyable && /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        className: copyButtonClasses,
-        onClick: handleCopy,
-        "aria-label": buttonLabel,
-        children: buttonLabel
-      }
-    )
+    copyable && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("button", { type: "button", className: copyButtonClasses, onClick: handleCopy, children: buttonLabel }),
+      /* @__PURE__ */ jsx("span", { className: codeBlockCopyStatusLiveClasses, "aria-live": "polite", children: liveText })
+    ] })
   ] });
-};
+});
+Code.displayName = "Code";
 var Code_default = Code;
 
 export {