@expcat/tigercat-react 0.0.68 → 0.1.6

package/dist/chunk-AQQRWISY.js

@@ -0,0 +1,184 @@
+'use strict';
+
+var tigercatCore = require('@expcat/tigercat-core');
+var React = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+// src/components/StepsItem.tsx
+var StepsContext = React.createContext(null);
+function useStepsContext() {
+  return React.useContext(StepsContext);
+}
+var Steps = ({
+  current = 0,
+  status = "process",
+  direction = "horizontal",
+  size = "default",
+  simple = false,
+  clickable = false,
+  className,
+  style,
+  onChange,
+  children,
+  ...props
+}) => {
+  const containerClasses = tigercatCore.classNames(tigercatCore.getStepsContainerClasses(direction), className);
+  const handleStepClick = (index) => {
+    if (!clickable) {
+      return;
+    }
+    onChange?.(index);
+  };
+  const contextValue = {
+    current,
+    status,
+    direction,
+    size,
+    simple,
+    clickable,
+    handleStepClick: clickable ? handleStepClick : void 0
+  };
+  const totalCount = React__default.default.Children.count(children);
+  const stepsWithProps = React__default.default.Children.map(children, (child, index) => {
+    if (React__default.default.isValidElement(child) && child.type === StepsItem) {
+      return React__default.default.cloneElement(child, {
+        stepIndex: index,
+        isLast: index === totalCount - 1
+      });
+    }
+    return child;
+  });
+  const mergedStyle = {
+    ...style ?? {}
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(StepsContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsx("ol", { ...props, className: containerClasses, style: mergedStyle, children: stepsWithProps }) });
+};
+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 = tigercatCore.calculateStepStatus(
+    stepIndex,
+    stepsContext.current,
+    stepsContext.status,
+    customStatus
+  );
+  const isClickable = !!stepsContext.handleStepClick && !disabled;
+  const itemClasses = tigercatCore.classNames(
+    tigercatCore.getStepItemClasses(stepsContext.direction, isLast, stepsContext.simple),
+    className
+  );
+  const iconClasses = tigercatCore.getStepIconClasses(stepStatus, stepsContext.size, stepsContext.simple, !!icon);
+  const tailClasses = tigercatCore.getStepTailClasses(stepsContext.direction, stepStatus, isLast);
+  const contentClasses = tigercatCore.getStepContentClasses(stepsContext.direction, stepsContext.simple);
+  const titleClasses = tigercatCore.getStepTitleClasses(stepStatus, stepsContext.size, isClickable);
+  const descriptionClasses = tigercatCore.getStepDescriptionClasses(stepStatus, stepsContext.size);
+  const handleClick = (event) => {
+    if (!isClickable) {
+      return;
+    }
+    stepsContext.handleStepClick?.(stepIndex);
+  };
+  const renderIcon = () => {
+    if (icon) {
+      return /* @__PURE__ */ jsxRuntime.jsx("div", { className: iconClasses, children: icon });
+    }
+    if (stepStatus === "finish") {
+      return /* @__PURE__ */ jsxRuntime.jsx("div", { className: iconClasses, children: /* @__PURE__ */ jsxRuntime.jsx(
+        "svg",
+        {
+          className: tigercatCore.stepFinishIconSvgClasses,
+          fill: "none",
+          stroke: "currentColor",
+          viewBox: tigercatCore.stepFinishIconViewBox,
+          "aria-hidden": "true",
+          focusable: "false",
+          children: /* @__PURE__ */ jsxRuntime.jsx(
+            "path",
+            {
+              strokeLinecap: tigercatCore.stepFinishIconPathStrokeLinecap,
+              strokeLinejoin: tigercatCore.stepFinishIconPathStrokeLinejoin,
+              strokeWidth: tigercatCore.stepFinishIconPathStrokeWidth,
+              d: tigercatCore.stepFinishIconPathD
+            }
+          )
+        }
+      ) });
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: iconClasses, children: stepIndex + 1 });
+  };
+  const renderContent = () => {
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: contentClasses, children: [
+      stepsContext.clickable ? /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          className: titleClasses,
+          onClick: handleClick,
+          disabled: !isClickable,
+          "aria-disabled": disabled || void 0,
+          children: title
+        }
+      ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: titleClasses, children: title }),
+      !stepsContext.simple && description && /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClasses, children: description })
+    ] });
+  };
+  if (stepsContext.direction === "vertical") {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "li",
+      {
+        ...props,
+        className: itemClasses,
+        style,
+        "aria-current": stepIndex === stepsContext.current ? "step" : void 0,
+        "aria-disabled": disabled || void 0,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+            renderIcon(),
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: tailClasses })
+          ] }),
+          renderContent()
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "li",
+    {
+      ...props,
+      className: itemClasses,
+      style,
+      "aria-current": stepIndex === stepsContext.current ? "step" : void 0,
+      "aria-disabled": disabled || void 0,
+      children: [
+        renderIcon(),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: tailClasses }),
+        renderContent()
+      ]
+    }
+  );
+};
+
+exports.Steps = Steps;
+exports.StepsItem = StepsItem;
+exports.useStepsContext = useStepsContext;

package/dist/{chunk-7KRBDT2Z.mjs → chunk-BJU5N7WU.mjs}

@@ -1,5 +1,5 @@
 import { Select } from './chunk-YYKJ63LD.mjs';
-import { Button } from './chunk-KMQOLVWP.mjs';
+import { Button } from './chunk-STEIWBMF.mjs';
 import { useState, useMemo } from 'react';
 import { getSpinnerSVG, paginateData, calculatePagination, classNames, getListClasses, listSizeClasses, listGridContainerClasses, getGridColumnClasses, listWrapperClasses, listLoadingOverlayClasses, getListHeaderFooterClasses, listEmptyStateClasses, listPaginationContainerClasses, getLoadingOverlaySpinnerClasses, getListItemClasses, listItemAvatarClasses, listItemTitleClasses, listItemDescriptionClasses, listItemContentClasses, listItemMetaClasses, listItemExtraClasses } from '@expcat/tigercat-core';
 import { jsxs, jsx } from 'react/jsx-runtime';