@expcat/tigercat-react 2.1.1 → 2.1.3

package/dist/chunk-6H5Y7Y6E.mjs

@@ -1,148 +0,0 @@
-import {
-  renderOverlayPortal,
-  useAnchoredOverlay
-} from "./chunk-HKAZXG74.mjs";
-
-// src/components/Mentions.tsx
-import { useState, useMemo, useCallback, useRef } from "react";
-import { classNames } from "@expcat/tigercat-core";
-import {
-  getMentionsInputClasses,
-  mentionsDropdownClasses,
-  getMentionsOptionClasses,
-  extractMentionQuery,
-  getCyclicIndex
-} from "@expcat/tigercat-core";
-import { jsx, jsxs } from "react/jsx-runtime";
-var Mentions = ({
-  value = "",
-  prefix: triggerPrefix = "@",
-  options = [],
-  placeholder,
-  disabled = false,
-  size = "md",
-  rows = 3,
-  onChange,
-  onSelect,
-  className
-}) => {
-  const [isOpen, setIsOpen] = useState(false);
-  const [activeIndex, setActiveIndex] = useState(0);
-  const [query, setQuery] = useState("");
-  const mentionStartRef = useRef(-1);
-  const textareaRef = useRef(null);
-  const dropdownRef = useRef(null);
-  const containerRef = useRef(null);
-  const filteredOptions = useMemo(() => {
-    if (!query) return options;
-    const q = query.toLowerCase();
-    return options.filter((o) => !o.disabled && o.label.toLowerCase().includes(q));
-  }, [options, query]);
-  const overlay = useAnchoredOverlay({
-    enabled: isOpen && filteredOptions.length > 0,
-    referenceRef: textareaRef,
-    floatingRef: dropdownRef,
-    containerRef,
-    placement: "bottom-start",
-    offset: 4,
-    dismissOnOutside: true,
-    dismissOnEscape: true,
-    restoreFocusOnDismiss: true,
-    onDismiss: () => setIsOpen(false)
-  });
-  const handleInput = useCallback(
-    (e) => {
-      const newValue = e.target.value;
-      onChange?.(newValue);
-      const cursorPos = e.target.selectionStart ?? newValue.length;
-      const result = extractMentionQuery(newValue, cursorPos, triggerPrefix);
-      if (result && options.length > 0) {
-        setQuery(result.query);
-        mentionStartRef.current = result.startPos;
-        setIsOpen(true);
-        setActiveIndex(0);
-      } else {
-        setIsOpen(false);
-      }
-    },
-    [onChange, triggerPrefix, options.length]
-  );
-  const selectOption = useCallback(
-    (option) => {
-      if (option.disabled) return;
-      const before = value.slice(0, mentionStartRef.current);
-      const cursorPos = textareaRef.current?.selectionStart ?? value.length;
-      const after = value.slice(cursorPos);
-      const newValue = `${before}${triggerPrefix}${option.value} ${after}`;
-      onChange?.(newValue);
-      onSelect?.(option);
-      setIsOpen(false);
-    },
-    [value, triggerPrefix, onChange, onSelect]
-  );
-  const handleKeydown = useCallback(
-    (e) => {
-      if (!isOpen) return;
-      if (e.key === "ArrowDown") {
-        e.preventDefault();
-        setActiveIndex((prev) => getCyclicIndex(filteredOptions.length, prev, 1));
-      } else if (e.key === "ArrowUp") {
-        e.preventDefault();
-        setActiveIndex((prev) => getCyclicIndex(filteredOptions.length, prev, -1));
-      } else if (e.key === "Enter") {
-        e.preventDefault();
-        const opt = filteredOptions[activeIndex];
-        if (opt) selectOption(opt);
-      } else if (e.key === "Escape") {
-        setIsOpen(false);
-      }
-    },
-    [isOpen, filteredOptions, activeIndex, selectOption]
-  );
-  const wrapperClass = classNames("relative", className);
-  return /* @__PURE__ */ jsxs("div", { ref: containerRef, className: wrapperClass, children: [
-    /* @__PURE__ */ jsx(
-      "textarea",
-      {
-        ref: textareaRef,
-        value,
-        className: getMentionsInputClasses(size, disabled),
-        placeholder,
-        disabled,
-        rows,
-        onChange: handleInput,
-        onKeyDown: handleKeydown
-      }
-    ),
-    renderOverlayPortal(
-      isOpen && filteredOptions.length > 0 ? /* @__PURE__ */ jsx(
-        "div",
-        {
-          ref: dropdownRef,
-          className: classNames(mentionsDropdownClasses, overlay.floatingClasses),
-          style: overlay.floatingStyles,
-          "data-positioned": overlay.positioned,
-          role: "listbox",
-          children: filteredOptions.map((opt, i) => /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: getMentionsOptionClasses(i === activeIndex, !!opt.disabled),
-              role: "option",
-              "aria-selected": i === activeIndex,
-              onClick: () => selectOption(opt),
-              children: opt.label
-            },
-            opt.value
-          ))
-        }
-      ) : null,
-      overlay.target
-    )
-  ] });
-};
-var Mentions_default = Mentions;
-
-export {
-  Mentions,
-  Mentions_default
-};

package/dist/chunk-6SEPT4C5.mjs

@@ -1,57 +0,0 @@
-// src/components/PrintLayout.tsx
-import React, { useMemo, useContext } from "react";
-import {
-  classNames,
-  getPrintLayoutClasses,
-  printLayoutHeaderClasses,
-  printLayoutFooterClasses,
-  printLayoutPageBreakClasses
-} from "@expcat/tigercat-core";
-import { jsx, jsxs } from "react/jsx-runtime";
-var PrintLayoutContext = React.createContext({
-  showPageBreaks: true
-});
-var PrintLayout = ({
-  pageSize = "A4",
-  orientation = "portrait",
-  showHeader = false,
-  showFooter = false,
-  headerText,
-  footerText,
-  headerRender,
-  footerRender,
-  showPageBreaks = true,
-  className,
-  children,
-  ...rest
-}) => {
-  const classes = useMemo(
-    () => getPrintLayoutClasses(pageSize, orientation, className),
-    [pageSize, orientation, className]
-  );
-  const contextValue = useMemo(() => ({ showPageBreaks }), [showPageBreaks]);
-  return /* @__PURE__ */ jsx(PrintLayoutContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxs("div", { ...rest, className: classes, children: [
-    showHeader && (headerRender || headerText) && /* @__PURE__ */ jsx("div", { className: printLayoutHeaderClasses, children: headerRender || headerText }),
-    /* @__PURE__ */ jsx("div", { className: "tiger-print-content", children }),
-    showFooter && (footerRender || footerText) && /* @__PURE__ */ jsx("div", { className: printLayoutFooterClasses, children: footerRender || footerText })
-  ] }) });
-};
-var PrintPageBreak = (props) => {
-  const { showPageBreaks } = useContext(PrintLayoutContext);
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      ...props,
-      className: classNames(
-        showPageBreaks && printLayoutPageBreakClasses,
-        "print:break-before-page"
-      ),
-      "aria-hidden": "true"
-    }
-  );
-};
-
-export {
-  PrintLayout,
-  PrintPageBreak
-};

package/dist/chunk-6UIVNRAR.mjs

@@ -1,188 +0,0 @@
-// src/components/Steps.tsx
-import React, { createContext, useContext, useMemo, useCallback } from "react";
-import {
-  classNames,
-  getStepContentClasses,
-  getStepDescriptionClasses,
-  getStepIconClasses,
-  getStepItemClasses,
-  getStepTailClasses,
-  getStepTitleClasses,
-  getStepsContainerClasses,
-  calculateStepStatus,
-  stepFinishIconViewBox,
-  stepFinishIconStrokeWidth,
-  stepFinishIconPathD
-} from "@expcat/tigercat-core";
-import { jsx, jsxs } from "react/jsx-runtime";
-var StepsContext = createContext(null);
-function useStepsContext() {
-  return useContext(StepsContext);
-}
-var StepsItem = ({
-  title,
-  description,
-  icon,
-  status: customStatus,
-  disabled = false,
-  stepIndex = 0,
-  isLast = false,
-  className,
-  style,
-  ...props
-}) => {
-  const stepsContext = useStepsContext() || {
-    current: 0,
-    status: "process",
-    direction: "horizontal",
-    size: "default",
-    simple: false,
-    clickable: false
-  };
-  const stepStatus = calculateStepStatus(
-    stepIndex,
-    stepsContext.current,
-    stepsContext.status,
-    customStatus
-  );
-  const isClickable = !!stepsContext.handleStepClick && !disabled;
-  const itemClasses = classNames(getStepItemClasses(stepsContext.direction, isLast), className);
-  const iconClasses = getStepIconClasses(stepStatus, stepsContext.size, stepsContext.simple, !!icon);
-  const tailClasses = getStepTailClasses(
-    stepsContext.direction,
-    stepStatus,
-    isLast,
-    stepsContext.size,
-    stepsContext.simple
-  );
-  const contentClasses = getStepContentClasses(stepsContext.direction);
-  const titleClasses = getStepTitleClasses(stepStatus, stepsContext.size, isClickable);
-  const descriptionClasses = getStepDescriptionClasses(stepStatus, stepsContext.size);
-  const handleClick = () => {
-    if (!isClickable) return;
-    stepsContext.handleStepClick?.(stepIndex);
-  };
-  const renderIcon = () => {
-    if (icon) {
-      return /* @__PURE__ */ jsx("div", { className: iconClasses, children: icon });
-    }
-    if (stepStatus === "finish") {
-      return /* @__PURE__ */ jsx("div", { className: iconClasses, "aria-hidden": "true", children: /* @__PURE__ */ jsx(
-        "svg",
-        {
-          className: "w-4 h-4 shrink-0 transition-transform duration-300 animate-fade-in",
-          fill: "none",
-          stroke: "currentColor",
-          strokeWidth: stepFinishIconStrokeWidth,
-          viewBox: stepFinishIconViewBox,
-          children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: stepFinishIconPathD })
-        }
-      ) });
-    }
-    return /* @__PURE__ */ jsx("div", { className: iconClasses, children: stepIndex + 1 });
-  };
-  const renderContent = () => {
-    return /* @__PURE__ */ jsxs("div", { className: contentClasses, children: [
-      stepsContext.clickable ? /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          className: titleClasses,
-          onClick: handleClick,
-          disabled: !isClickable,
-          "aria-disabled": disabled || void 0,
-          children: title
-        }
-      ) : /* @__PURE__ */ jsx("div", { className: titleClasses, children: title }),
-      !stepsContext.simple && description && /* @__PURE__ */ jsx("div", { className: descriptionClasses, children: description })
-    ] });
-  };
-  if (stepsContext.direction === "vertical") {
-    return /* @__PURE__ */ jsxs(
-      "li",
-      {
-        ...props,
-        className: itemClasses,
-        style,
-        "aria-current": stepIndex === stepsContext.current ? "step" : void 0,
-        "aria-disabled": disabled || void 0,
-        children: [
-          /* @__PURE__ */ jsxs("div", { className: "relative", children: [
-            renderIcon(),
-            /* @__PURE__ */ jsx("div", { className: tailClasses })
-          ] }),
-          renderContent()
-        ]
-      }
-    );
-  }
-  return /* @__PURE__ */ jsxs(
-    "li",
-    {
-      ...props,
-      className: itemClasses,
-      style,
-      "aria-current": stepIndex === stepsContext.current ? "step" : void 0,
-      "aria-disabled": disabled || void 0,
-      children: [
-        renderIcon(),
-        /* @__PURE__ */ jsx("div", { className: tailClasses }),
-        renderContent()
-      ]
-    }
-  );
-};
-var Steps = ({
-  current = 0,
-  status = "process",
-  direction = "horizontal",
-  size = "default",
-  simple = false,
-  clickable = false,
-  className,
-  style,
-  onChange,
-  children,
-  ...props
-}) => {
-  const containerClasses = useMemo(
-    () => classNames(getStepsContainerClasses(direction), className),
-    [direction, className]
-  );
-  const handleStepClick = useCallback(
-    (index) => {
-      if (!clickable) return;
-      onChange?.(index);
-    },
-    [clickable, onChange]
-  );
-  const contextValue = useMemo(
-    () => ({
-      current,
-      status,
-      direction,
-      size,
-      simple,
-      clickable,
-      handleStepClick: clickable ? handleStepClick : void 0
-    }),
-    [current, status, direction, size, simple, clickable, handleStepClick]
-  );
-  const totalCount = React.Children.count(children);
-  const stepsWithProps = React.Children.map(children, (child, index) => {
-    if (React.isValidElement(child) && child.type === StepsItem) {
-      return React.cloneElement(child, {
-        stepIndex: index,
-        isLast: index === totalCount - 1
-      });
-    }
-    return child;
-  });
-  return /* @__PURE__ */ jsx(StepsContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx("ol", { ...props, className: containerClasses, style, children: stepsWithProps }) });
-};
-
-export {
-  useStepsContext,
-  StepsItem,
-  Steps
-};

package/dist/chunk-72CJNKDY.mjs

@@ -1,222 +0,0 @@
-import {
-  ChartTooltip
-} from "./chunk-YORCCCQX.mjs";
-import {
-  ChartCanvas
-} from "./chunk-CUAXRBKO.mjs";
-
-// src/components/GaugeChart.tsx
-import React, { useId, useMemo, useState, useRef, useEffect } from "react";
-import {
-  classNames,
-  createGaugeArcPath,
-  createGaugeNeedlePath,
-  valueToGaugeAngle,
-  computeGaugeTicks,
-  getChartInnerRect,
-  chartAxisTickTextClasses,
-  getStableChartGradientPrefix,
-  createGaugeAnimation
-} from "@expcat/tigercat-core";
-import { jsx, jsxs } from "react/jsx-runtime";
-var GaugeChart = ({
-  width = 280,
-  height = 200,
-  padding = 24,
-  value,
-  min = 0,
-  max = 100,
-  startAngle = 135,
-  endAngle = 405,
-  arcWidth = 20,
-  showTicks = true,
-  tickCount = 5,
-  valueFormatter,
-  tooltipFormatter,
-  label,
-  segments,
-  trackColor = "var(--tiger-border,#e5e7eb)",
-  color = "var(--tiger-primary,#2563eb)",
-  gradient = false,
-  showTooltip = true,
-  title: chartTitle,
-  desc,
-  className
-}) => {
-  const innerRect = useMemo(
-    () => getChartInnerRect(width, height, padding),
-    [width, height, padding]
-  );
-  const radius = useMemo(
-    () => Math.min(innerRect.width, innerRect.height) / 2 - 4,
-    [innerRect.width, innerRect.height]
-  );
-  const cx = innerRect.width / 2;
-  const cy = innerRect.height / 2;
-  const needleAngle = useMemo(
-    () => valueToGaugeAngle(value, min, max, startAngle, endAngle),
-    [value, min, max, startAngle, endAngle]
-  );
-  const [animatedAngle, setAnimatedAngle] = useState(needleAngle);
-  const prevAngleRef = useRef(needleAngle);
-  useEffect(() => {
-    const from = prevAngleRef.current;
-    const to = needleAngle;
-    prevAngleRef.current = to;
-    if (from === to) return;
-    const ctrl = createGaugeAnimation({
-      from,
-      to,
-      onUpdate: (v) => setAnimatedAngle(v)
-    });
-    return () => ctrl.stop();
-  }, [needleAngle]);
-  const ticks = useMemo(
-    () => showTicks ? computeGaugeTicks(cx, cy, radius, min, max, startAngle, endAngle, tickCount) : [],
-    [showTicks, cx, cy, radius, min, max, startAngle, endAngle, tickCount]
-  );
-  const trackPath = createGaugeArcPath(cx, cy, radius, startAngle, endAngle, arcWidth);
-  const valuePath = animatedAngle > startAngle ? createGaugeArcPath(cx, cy, radius, startAngle, animatedAngle, arcWidth) : null;
-  const needlePath = createGaugeNeedlePath(cx, cy, radius - arcWidth - 6, animatedAngle);
-  const formattedValue = valueFormatter ? valueFormatter(value) : `${value}`;
-  const [tooltip, setTooltip] = useState({
-    open: false,
-    x: 0,
-    y: 0
-  });
-  const tooltipContent = tooltipFormatter ? tooltipFormatter(value) : label ? `${label}: ${formattedValue}` : formattedValue;
-  const handleTooltipMove = (e) => {
-    if (!showTooltip) return;
-    setTooltip({ open: true, x: e.clientX, y: e.clientY });
-  };
-  const handleTooltipLeave = () => setTooltip((t) => ({ ...t, open: false }));
-  const gradientId = useId();
-  const gradientPrefix = useMemo(
-    () => getStableChartGradientPrefix("gauge", gradientId),
-    [gradientId]
-  );
-  const valueGradientId = `${gradientPrefix}-value`;
-  const wrapperRef = useRef(null);
-  const handleTooltipFocus = () => {
-    if (!showTooltip) return;
-    const rect = wrapperRef.current?.getBoundingClientRect();
-    if (rect)
-      setTooltip({ open: true, x: rect.left + rect.width / 2, y: rect.top + rect.height / 2 });
-  };
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      ref: wrapperRef,
-      className: "inline-block relative",
-      tabIndex: showTooltip ? 0 : void 0,
-      role: "img",
-      "aria-label": label ? `${label}: ${formattedValue}` : formattedValue,
-      onMouseMove: handleTooltipMove,
-      onMouseLeave: handleTooltipLeave,
-      onFocus: handleTooltipFocus,
-      onBlur: handleTooltipLeave,
-      children: [
-        /* @__PURE__ */ jsxs(
-          ChartCanvas,
-          {
-            width,
-            height,
-            padding,
-            title: chartTitle,
-            desc,
-            className: classNames(className),
-            children: [
-              gradient && !segments && valuePath && /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("linearGradient", { id: valueGradientId, x1: 0, y1: 0, x2: 0, y2: 1, children: [
-                /* @__PURE__ */ jsx("stop", { offset: "0%", stopColor: color, stopOpacity: 1 }),
-                /* @__PURE__ */ jsx("stop", { offset: "100%", stopColor: color, stopOpacity: 0.55 })
-              ] }) }),
-              /* @__PURE__ */ jsx("path", { d: trackPath, fill: trackColor, strokeWidth: 0 }),
-              segments ? segments.map((seg, i) => {
-                const sStart = valueToGaugeAngle(seg.range[0], min, max, startAngle, endAngle);
-                const sEnd = valueToGaugeAngle(seg.range[1], min, max, startAngle, endAngle);
-                return /* @__PURE__ */ jsx(
-                  "path",
-                  {
-                    d: createGaugeArcPath(cx, cy, radius, sStart, sEnd, arcWidth),
-                    fill: seg.color,
-                    strokeWidth: 0
-                  },
-                  `seg-${i}`
-                );
-              }) : valuePath && /* @__PURE__ */ jsx(
-                "path",
-                {
-                  d: valuePath,
-                  fill: gradient ? `url(#${valueGradientId})` : color,
-                  strokeWidth: 0
-                }
-              ),
-              ticks.map((tick, i) => /* @__PURE__ */ jsxs(React.Fragment, { children: [
-                /* @__PURE__ */ jsx(
-                  "line",
-                  {
-                    x1: tick.x1,
-                    y1: tick.y1,
-                    x2: tick.x2,
-                    y2: tick.y2,
-                    stroke: "var(--tiger-text-secondary,#6b7280)",
-                    strokeWidth: 1
-                  }
-                ),
-                /* @__PURE__ */ jsx(
-                  "text",
-                  {
-                    x: tick.x2 + (tick.x2 - tick.x1) * 1.5,
-                    y: tick.y2 + (tick.y2 - tick.y1) * 1.5,
-                    className: chartAxisTickTextClasses,
-                    textAnchor: "middle",
-                    dominantBaseline: "middle",
-                    style: { fontSize: "10px" },
-                    children: tick.label
-                  }
-                )
-              ] }, `tick-${i}`)),
-              /* @__PURE__ */ jsx("path", { d: needlePath, fill: "var(--tiger-text,#374151)" }),
-              /* @__PURE__ */ jsx("circle", { cx, cy, r: 5, fill: "var(--tiger-text,#374151)" }),
-              /* @__PURE__ */ jsx(
-                "text",
-                {
-                  x: cx,
-                  y: cy + radius * 0.35,
-                  className: "fill-[color:var(--tiger-text,#374151)] text-lg font-semibold tabular-nums",
-                  textAnchor: "middle",
-                  dominantBaseline: "middle",
-                  children: formattedValue
-                }
-              ),
-              label && /* @__PURE__ */ jsx(
-                "text",
-                {
-                  x: cx,
-                  y: cy + radius * 0.35 + 20,
-                  className: chartAxisTickTextClasses,
-                  textAnchor: "middle",
-                  dominantBaseline: "middle",
-                  children: label
-                }
-              )
-            ]
-          }
-        ),
-        showTooltip && /* @__PURE__ */ jsx(
-          ChartTooltip,
-          {
-            content: tooltipContent,
-            open: tooltip.open && tooltipContent !== "",
-            x: tooltip.x,
-            y: tooltip.y
-          }
-        )
-      ]
-    }
-  );
-};
-
-export {
-  GaugeChart
-};

package/dist/chunk-AKNWUI7K.mjs

@@ -1,82 +0,0 @@
-import {
-  useControlledState
-} from "./chunk-MEFARVQI.mjs";
-
-// src/components/RadioGroup.tsx
-import React, { useCallback, useMemo, useRef } from "react";
-import { getRadioGroupClasses } from "@expcat/tigercat-core";
-import { jsx } from "react/jsx-runtime";
-var RadioGroupContext = React.createContext(null);
-var RadioGroup = ({
-  value,
-  defaultValue,
-  name,
-  disabled = false,
-  size = "md",
-  onChange,
-  children,
-  className,
-  ...props
-}) => {
-  const [currentValue, setValue] = useControlledState(value, defaultValue);
-  const generatedNameRef = useRef(
-    `tiger-radio-group-${Date.now()}-${Math.random().toString(36).slice(2, 11)}`
-  );
-  const groupName = name || generatedNameRef.current;
-  const handleChange = useCallback(
-    (newValue) => {
-      if (disabled) return;
-      setValue(newValue);
-      onChange?.(newValue);
-    },
-    [disabled, setValue, onChange]
-  );
-  const handleKeyDown = (event) => {
-    if (disabled) return;
-    if (event.key !== "ArrowDown" && event.key !== "ArrowRight" && event.key !== "ArrowUp" && event.key !== "ArrowLeft") {
-      return;
-    }
-    const target = event.target;
-    const currentInput = target.closest('input[type="radio"]');
-    if (!currentInput) return;
-    const container = event.currentTarget;
-    const inputs = Array.from(
-      container.querySelectorAll('input[type="radio"]')
-    );
-    const enabledInputs = inputs.filter((input) => !input.disabled);
-    if (enabledInputs.length === 0) return;
-    const currentIndex = enabledInputs.indexOf(currentInput);
-    if (currentIndex === -1) return;
-    event.preventDefault();
-    const direction = event.key === "ArrowDown" || event.key === "ArrowRight" ? 1 : -1;
-    const nextIndex = (currentIndex + direction + enabledInputs.length) % enabledInputs.length;
-    const nextInput = enabledInputs[nextIndex];
-    nextInput.focus();
-    nextInput.click();
-  };
-  const contextValue = useMemo(
-    () => ({
-      value: currentValue,
-      name: groupName,
-      disabled,
-      size,
-      onChange: handleChange
-    }),
-    [currentValue, groupName, disabled, size, handleChange]
-  );
-  return /* @__PURE__ */ jsx(RadioGroupContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
-    "div",
-    {
-      className: getRadioGroupClasses({ className }),
-      role: "radiogroup",
-      onKeyDown: handleKeyDown,
-      ...props,
-      children
-    }
-  ) });
-};
-
-export {
-  RadioGroupContext,
-  RadioGroup
-};