@expcat/tigercat-react 1.0.7 → 1.2.0

package/dist/chunk-7QZ4XT2P.mjs

@@ -1,8 +1,15 @@
-import { useControlledState } from './chunk-UQMPEMY7.mjs';
-import { forwardRef, useRef, useLayoutEffect, useMemo } from 'react';
-import { autoResizeTextarea, classNames, getInputClasses } from '@expcat/tigercat-core';
-import { jsxs, jsx } from 'react/jsx-runtime';
+import {
+  useControlledState
+} from "./chunk-UQMPEMY7.mjs";
 
+// src/components/Textarea.tsx
+import { forwardRef, useLayoutEffect, useMemo, useRef } from "react";
+import {
+  autoResizeTextarea,
+  classNames,
+  getInputClasses
+} from "@expcat/tigercat-core";
+import { jsx, jsxs } from "react/jsx-runtime";
 var Textarea = forwardRef(
   ({
     size = "md",
@@ -86,4 +93,6 @@ var Textarea = forwardRef(
 );
 Textarea.displayName = "Textarea";
 
-export { Textarea };
+export {
+  Textarea
+};

package/dist/{chunk-R3QWJ7GT.mjs → chunk-7U6VWD4H.mjs}

@@ -1,11 +1,30 @@
-import { useChartInteraction } from './chunk-3CDAG4HD.mjs';
-import { ChartLegend } from './chunk-Z6F67MJE.mjs';
-import { ChartTooltip } from './chunk-LVC43YX2.mjs';
-import { ChartCanvas } from './chunk-IS467WAO.mjs';
-import { useMemo } from 'react';
-import { getChartInnerRect, resolveChartPalette, computeFunnelSegments, buildChartLegendItems, resolveChartTooltipContent, classNames, getChartElementOpacity, chartAxisTickTextClasses } from '@expcat/tigercat-core';
-import { jsxs, jsx } from 'react/jsx-runtime';
+import {
+  useChartInteraction
+} from "./chunk-6QML6T3Y.mjs";
+import {
+  ChartLegend
+} from "./chunk-UBP7HZSU.mjs";
+import {
+  ChartTooltip
+} from "./chunk-NASC6XHN.mjs";
+import {
+  ChartCanvas
+} from "./chunk-DKNVSQSV.mjs";
 
+// src/components/FunnelChart.tsx
+import { useId, useMemo } from "react";
+import {
+  classNames,
+  computeFunnelSegments,
+  getChartElementOpacity,
+  getChartInnerRect,
+  getStableChartGradientPrefix,
+  resolveChartPalette,
+  buildChartLegendItems,
+  resolveChartTooltipContent,
+  chartAxisTickTextClasses
+} from "@expcat/tigercat-core";
+import { jsx, jsxs } from "react/jsx-runtime";
 var FunnelChart = ({
   width = 320,
   height = 300,
@@ -15,6 +34,7 @@ var FunnelChart = ({
   gap = 2,
   pinch = false,
   colors,
+  gradient = false,
   hoverable = false,
   hoveredIndex: hoveredIndexProp,
   activeOpacity = 1,
@@ -80,6 +100,11 @@ var FunnelChart = ({
     [data, innerRect.width, innerRect.height, gap, pinch, palette]
   );
   const total = useMemo(() => data.reduce((s, d) => s + d.value, 0), [data]);
+  const gradientId = useId();
+  const gradientPrefix = useMemo(
+    () => getStableChartGradientPrefix("funnel", gradientId),
+    [gradientId]
+  );
   const legendItems = useMemo(
     () => buildChartLegendItems({
       data,
@@ -109,6 +134,21 @@ var FunnelChart = ({
       desc,
       className: classNames(className),
       children: [
+        gradient && /* @__PURE__ */ jsx("defs", { children: segments.map((seg) => /* @__PURE__ */ jsxs(
+          "linearGradient",
+          {
+            id: `${gradientPrefix}-${seg.index}`,
+            x1: 0,
+            y1: 0,
+            x2: 0,
+            y2: 1,
+            children: [
+              /* @__PURE__ */ jsx("stop", { offset: "0%", stopColor: seg.color, stopOpacity: 1 }),
+              /* @__PURE__ */ jsx("stop", { offset: "100%", stopColor: seg.color, stopOpacity: 0.55 })
+            ]
+          },
+          `grad-${seg.index}`
+        )) }),
         /* @__PURE__ */ jsx("g", { "data-series-type": "funnel", children: segments.map((seg) => {
           const opacity = getChartElementOpacity(seg.index, activeIndex, {
             activeOpacity,
@@ -118,10 +158,12 @@ var FunnelChart = ({
             "path",
             {
               d: seg.path,
-              fill: seg.color,
+              fill: gradient ? `url(#${gradientPrefix}-${seg.index})` : seg.color,
               opacity,
               className: classNames(interactive && "cursor-pointer"),
-              style: { transition: "opacity 0.2s ease-out" },
+              style: {
+                transition: "opacity var(--tiger-motion-duration-base,0.2s) var(--tiger-motion-ease-decelerate,ease-out)"
+              },
               tabIndex: selectable ? 0 : void 0,
               role: selectable ? "button" : "img",
               "aria-label": seg.label,
@@ -183,4 +225,6 @@ var FunnelChart = ({
   ] });
 };
 
-export { FunnelChart };
+export {
+  FunnelChart
+};

package/dist/chunk-7Z64GEMN.js

@@ -1,11 +1,18 @@
-'use strict';
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }// src/components/Slider.tsx
+var _react = require('react');
 
-var react = require('react');
-var tigercatCore = require('@expcat/tigercat-core');
-var jsxRuntime = require('react/jsx-runtime');
 
-// src/components/Slider.tsx
-var Thumb = react.memo(
+
+
+
+
+
+
+
+
+var _tigercatcore = require('@expcat/tigercat-core');
+var _jsxruntime = require('react/jsx-runtime');
+var Thumb = _react.memo.call(void 0, 
   ({
     value,
     thumbType = null,
@@ -28,7 +35,7 @@ var Thumb = react.memo(
   }) => {
     const left = getPercentage(value);
     const showThumbTooltip = showTooltip && (thumbType === activeThumb || thumbType === null);
-    return /* @__PURE__ */ jsxRuntime.jsx(
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
       "div",
       {
         className: thumbClasses,
@@ -52,7 +59,7 @@ var Thumb = react.memo(
           if (!isDragging) setShowTooltip(false);
         },
         onKeyDown: (e) => handleKeyDown(e, value, thumbType),
-        children: showThumbTooltip && tooltip && /* @__PURE__ */ jsxRuntime.jsx("div", { className: tooltipClasses, children: value })
+        children: showThumbTooltip && tooltip && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: tooltipClasses, children: value })
       }
     );
   }
@@ -83,36 +90,36 @@ var Slider = ({
     if (defaultValue !== void 0) return defaultValue;
     return range ? [min, max] : min;
   };
-  const [internalValue, setInternalValue] = react.useState(getInitialValue());
-  const [isDragging, setIsDragging] = react.useState(false);
-  const [activeThumb, setActiveThumb] = react.useState(null);
-  const [showTooltip, setShowTooltip] = react.useState(false);
-  const trackRef = react.useRef(null);
-  react.useEffect(() => {
+  const [internalValue, setInternalValue] = _react.useState.call(void 0, getInitialValue());
+  const [isDragging, setIsDragging] = _react.useState.call(void 0, false);
+  const [activeThumb, setActiveThumb] = _react.useState.call(void 0, null);
+  const [showTooltip, setShowTooltip] = _react.useState.call(void 0, false);
+  const trackRef = _react.useRef.call(void 0, null);
+  _react.useEffect.call(void 0, () => {
     if (controlledValue !== void 0) {
       setInternalValue(controlledValue);
     }
   }, [controlledValue]);
-  const getPercentage = react.useCallback(
-    (val) => tigercatCore.sliderGetPercentage(val, min, max),
+  const getPercentage = _react.useCallback.call(void 0, 
+    (val) => _tigercatcore.sliderGetPercentage.call(void 0, val, min, max),
     [min, max]
   );
-  const getValueFromPosition = react.useCallback(
+  const getValueFromPosition = _react.useCallback.call(void 0, 
     (clientX) => {
       if (!trackRef.current) return min;
       const rect = trackRef.current.getBoundingClientRect();
-      return tigercatCore.sliderGetValueFromPosition(clientX - rect.left, rect.width, min, max, step);
+      return _tigercatcore.sliderGetValueFromPosition.call(void 0, clientX - rect.left, rect.width, min, max, step);
     },
     [min, max, step]
   );
-  const updateValue = react.useCallback(
+  const updateValue = _react.useCallback.call(void 0, 
     (newValue) => {
       setInternalValue(newValue);
-      onChange?.(newValue);
+      _optionalChain([onChange, 'optionalCall', _ => _(newValue)]);
     },
     [onChange]
   );
-  const handleMove = react.useCallback(
+  const handleMove = _react.useCallback.call(void 0, 
     (event) => {
       if (disabled || !isDragging) return;
       const clientX = "touches" in event ? event.touches[0].clientX : event.clientX;
@@ -130,12 +137,12 @@ var Slider = ({
     },
     [disabled, isDragging, activeThumb, range, internalValue, getValueFromPosition, updateValue]
   );
-  const handleEnd = react.useCallback(() => {
+  const handleEnd = _react.useCallback.call(void 0, () => {
     setIsDragging(false);
     setActiveThumb(null);
     setShowTooltip(false);
   }, []);
-  react.useEffect(() => {
+  _react.useEffect.call(void 0, () => {
     if (isDragging) {
       const handleMouseMove = (e) => handleMove(e);
       const handleTouchMove = (e) => handleMove(e);
@@ -151,7 +158,7 @@ var Slider = ({
       };
     }
   }, [isDragging, handleMove, handleEnd]);
-  const handleStart = react.useCallback(
+  const handleStart = _react.useCallback.call(void 0, 
     (event, thumb) => {
       if (disabled) return;
       event.preventDefault();
@@ -177,10 +184,10 @@ var Slider = ({
       updateValue(newValue);
     }
   };
-  const handleKeyDown = react.useCallback(
+  const handleKeyDown = _react.useCallback.call(void 0, 
     (e, value, thumbType) => {
       if (disabled) return;
-      const newValue = tigercatCore.sliderGetKeyboardValue(e.key, value, min, max, step);
+      const newValue = _tigercatcore.sliderGetKeyboardValue.call(void 0, e.key, value, min, max, step);
       if (newValue === null) return;
       e.preventDefault();
       if (range && Array.isArray(internalValue)) {
@@ -196,8 +203,8 @@ var Slider = ({
     },
     [disabled, min, max, step, range, internalValue, updateValue]
   );
-  const trackClasses = react.useMemo(() => tigercatCore.getSliderTrackClasses(size, disabled), [size, disabled]);
-  const rangeStyles = react.useMemo(() => {
+  const trackClasses = _react.useMemo.call(void 0, () => _tigercatcore.getSliderTrackClasses.call(void 0, size, disabled), [size, disabled]);
+  const rangeStyles = _react.useMemo.call(void 0, () => {
     if (range && Array.isArray(internalValue)) {
       const left = getPercentage(internalValue[0]);
       return { left: `${left}%`, width: `${getPercentage(internalValue[1]) - left}%` };
@@ -205,15 +212,15 @@ var Slider = ({
     const val = typeof internalValue === "number" ? internalValue : internalValue[0];
     return { left: "0%", width: `${getPercentage(val)}%` };
   }, [range, internalValue, getPercentage]);
-  const thumbClasses = react.useMemo(() => tigercatCore.getSliderThumbClasses(size, disabled), [size, disabled]);
-  const tooltipClasses = react.useMemo(() => tigercatCore.getSliderTooltipClasses(size), [size]);
+  const thumbClasses = _react.useMemo.call(void 0, () => _tigercatcore.getSliderThumbClasses.call(void 0, size, disabled), [size, disabled]);
+  const tooltipClasses = _react.useMemo.call(void 0, () => _tigercatcore.getSliderTooltipClasses.call(void 0, size), [size]);
   const renderMarks = () => {
     if (!marks) return null;
     const marksObj = typeof marks === "boolean" ? {} : marks;
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute w-full top-full mt-2", children: Object.entries(marksObj).map(([key, label]) => {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "absolute w-full top-full mt-2", children: Object.entries(marksObj).map(([key, label]) => {
       const value = Number(key);
       const left = getPercentage(value);
-      return /* @__PURE__ */ jsxRuntime.jsx(
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
         "div",
         {
           className: "absolute text-xs text-[var(--tiger-text-muted,#6b7280)]",
@@ -224,16 +231,16 @@ var Slider = ({
       );
     }) });
   };
-  return /* @__PURE__ */ jsxRuntime.jsxs(
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
     "div",
     {
-      className: tigercatCore.classNames(tigercatCore.sliderBaseClasses, disabled && "cursor-not-allowed", className),
+      className: _tigercatcore.classNames.call(void 0, _tigercatcore.sliderBaseClasses, disabled && "cursor-not-allowed", className),
       ...divProps,
       children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: trackRef, className: trackClasses, onClick: handleTrackClick, children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: tigercatCore.sliderRangeClasses, style: rangeStyles }),
-          range && Array.isArray(internalValue) ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { ref: trackRef, className: trackClasses, onClick: handleTrackClick, children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _tigercatcore.sliderRangeClasses, style: rangeStyles }),
+          range && Array.isArray(internalValue) ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
               Thumb,
               {
                 value: internalValue[0],
@@ -256,7 +263,7 @@ var Slider = ({
                 getPercentage
               }
             ),
-            /* @__PURE__ */ jsxRuntime.jsx(
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
               Thumb,
               {
                 value: internalValue[1],
@@ -279,7 +286,7 @@ var Slider = ({
                 getPercentage
               }
             )
-          ] }) : /* @__PURE__ */ jsxRuntime.jsx(
+          ] }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
             Thumb,
             {
               value: typeof internalValue === "number" ? internalValue : internalValue[0],
@@ -308,4 +315,6 @@ var Slider = ({
   );
 };
 
+
+
 exports.Slider = Slider;

package/dist/{chunk-VAQDUVBP.mjs → chunk-A42OLED6.mjs}

@@ -1,8 +1,39 @@
-import React, { useState, useMemo } from 'react';
-import { getSpinnerSVG, paginateData, calculatePagination, classNames, getListClasses, listSizeClasses, listGridContainerClasses, getGridColumnClasses, listWrapperClasses, listLoadingOverlayClasses, getListHeaderFooterClasses, listEmptyStateClasses, getSimplePaginationContainerClasses, getSimplePaginationTotalClasses, getSimplePaginationControlsClasses, getSimplePaginationSelectClasses, getSimplePaginationButtonsWrapperClasses, getSimplePaginationButtonClasses, getSimplePaginationPageIndicatorClasses, getLoadingOverlaySpinnerClasses, getListItemClasses, listItemAvatarClasses, listItemTitleClasses, listItemDescriptionClasses, listItemContentClasses, listItemMetaClasses, listItemExtraClasses } from '@expcat/tigercat-core';
-import { jsxs, jsx } from 'react/jsx-runtime';
+import {
+  VirtualList
+} from "./chunk-7DUHHRAU.mjs";
 
 // src/components/List.tsx
+import React, { useMemo, useState } from "react";
+import {
+  classNames,
+  getListClasses,
+  getListItemClasses,
+  getListHeaderFooterClasses,
+  getGridColumnClasses,
+  paginateData,
+  calculatePagination,
+  listWrapperClasses,
+  listSizeClasses,
+  listEmptyStateClasses,
+  listLoadingOverlayClasses,
+  listItemMetaClasses,
+  listItemAvatarClasses,
+  listItemContentClasses,
+  listItemTitleClasses,
+  listItemDescriptionClasses,
+  listItemExtraClasses,
+  listGridContainerClasses,
+  getSpinnerSVG,
+  getLoadingOverlaySpinnerClasses,
+  getSimplePaginationContainerClasses,
+  getSimplePaginationTotalClasses,
+  getSimplePaginationControlsClasses,
+  getSimplePaginationSelectClasses,
+  getSimplePaginationButtonClasses,
+  getSimplePaginationPageIndicatorClasses,
+  getSimplePaginationButtonsWrapperClasses
+} from "@expcat/tigercat-core";
+import { jsx, jsxs } from "react/jsx-runtime";
 var spinnerSvg = getSpinnerSVG("spinner");
 var LoadingSpinner = () => /* @__PURE__ */ jsx(
   "svg",
@@ -30,6 +61,10 @@ var List = ({
   footer,
   pagination = false,
   grid,
+  virtual = false,
+  virtualHeight = 400,
+  virtualItemHeight = 40,
+  virtualOverscan = 5,
   rowKey = "key",
   hoverable = false,
   renderItem,
@@ -187,7 +222,7 @@ var List = ({
         onDragEnd: isDraggable ? () => {
           dragIndexRef.current = null;
         } : void 0,
-        children: renderItem ? renderItem(item, index) : renderDefaultListItem(item)
+        children: renderItem ? renderItem(item, index) : renderDefaultListItem(item, index)
       },
       key
     );
@@ -211,6 +246,18 @@ var List = ({
         }
       );
     }
+    if (virtual) {
+      return /* @__PURE__ */ jsx(
+        VirtualList,
+        {
+          itemCount: paginatedData.length,
+          itemHeight: virtualItemHeight,
+          height: virtualHeight,
+          overscan: virtualOverscan,
+          renderItem: ({ index }) => renderListItem(paginatedData[index], index)
+        }
+      );
+    }
     return items;
   };
   const renderPagination = () => {
@@ -277,4 +324,6 @@ var List = ({
   ] });
 };
 
-export { List };
+export {
+  List
+};