@expcat/tigercat-react 2.1.2 → 2.1.4

package/dist/chunk-RRGPDFDI.mjs

@@ -1,255 +0,0 @@
-import {
-  Steps,
-  StepsItem
-} from "./chunk-6UIVNRAR.mjs";
-import {
-  Button
-} from "./chunk-5TE7KLE5.mjs";
-import {
-  useTigerConfig
-} from "./chunk-YSIXURBW.mjs";
-
-// src/components/FormWizard.tsx
-import { useCallback, useEffect, useMemo, useState } from "react";
-import {
-  classNames,
-  getFormWizardLabels,
-  mergeTigerLocale,
-  resolveLocaleText,
-  clampStepIndex,
-  findNextUnskippedStep,
-  runStepValidation
-} from "@expcat/tigercat-core";
-import { jsx, jsxs } from "react/jsx-runtime";
-var ArrowLeftIcon = () => /* @__PURE__ */ jsx(
-  "svg",
-  {
-    className: "w-3.5 h-3.5 transition-transform duration-300 group-hover:-translate-x-0.5",
-    fill: "none",
-    stroke: "currentColor",
-    strokeWidth: "2",
-    viewBox: "0 0 24 24",
-    "aria-hidden": "true",
-    children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M10.5 19.5L3 12m0 0l7.5-7.5M3 12h18" })
-  }
-);
-var ArrowRightIcon = () => /* @__PURE__ */ jsx(
-  "svg",
-  {
-    className: "w-3.5 h-3.5 transition-transform duration-300 group-hover:translate-x-0.5",
-    fill: "none",
-    stroke: "currentColor",
-    strokeWidth: "2",
-    viewBox: "0 0 24 24",
-    "aria-hidden": "true",
-    children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M13.5 4.5L21 12m0 0l-7.5 7.5M21 12H3" })
-  }
-);
-var CheckIcon = () => /* @__PURE__ */ jsx(
-  "svg",
-  {
-    className: "w-3.5 h-3.5 transition-transform duration-300 group-hover:scale-110",
-    fill: "none",
-    stroke: "currentColor",
-    strokeWidth: "2.5",
-    viewBox: "0 0 24 24",
-    "aria-hidden": "true",
-    children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M4.5 12.75l6 6 9-13.5" })
-  }
-);
-var FormWizard = ({
-  steps = [],
-  current,
-  defaultCurrent = 0,
-  clickable = false,
-  direction = "horizontal",
-  size = "default",
-  simple = false,
-  bordered = true,
-  showSteps = true,
-  showActions = true,
-  prevText,
-  nextText,
-  finishText,
-  locale,
-  labels: labelsOverride,
-  beforeNext,
-  autoSave,
-  onChange,
-  onFinish,
-  renderStep,
-  className,
-  style,
-  ...props
-}) => {
-  const config = useTigerConfig();
-  const mergedLocale = useMemo(
-    () => mergeTigerLocale(config.locale, locale),
-    [config.locale, locale]
-  );
-  const labels = useMemo(
-    () => getFormWizardLabels(mergedLocale, labelsOverride),
-    [mergedLocale, labelsOverride]
-  );
-  const [innerCurrent, setInnerCurrent] = useState(defaultCurrent);
-  useEffect(() => {
-    if (current !== void 0) setInnerCurrent(current);
-  }, [current]);
-  const totalCount = steps.length;
-  const currentIndex = current ?? innerCurrent;
-  const currentStep = steps[currentIndex];
-  const isFirst = currentIndex <= 0;
-  const isLast = currentIndex >= totalCount - 1;
-  const wrapperClasses = classNames(
-    "tiger-form-wizard w-full overflow-hidden transition-all duration-300",
-    bordered ? "rounded-[var(--tiger-radius-md,0.5rem)] border border-[var(--tiger-border,#e5e7eb)] bg-[var(--tiger-surface,#ffffff)] shadow-sm" : "bg-transparent",
-    className
-  );
-  const setCurrent = useCallback(
-    (next) => {
-      const clamped = clampStepIndex(next, totalCount);
-      if (current === void 0) {
-        setInnerCurrent(clamped);
-      }
-      onChange?.(clamped, currentIndex);
-      if (autoSave && steps[clamped]) {
-        autoSave(clamped, steps[clamped]);
-      }
-    },
-    [current, currentIndex, onChange, totalCount, autoSave, steps]
-  );
-  const runBeforeNext = useCallback(
-    () => runStepValidation(currentIndex, currentStep, steps, beforeNext),
-    [beforeNext, currentIndex, currentStep, steps]
-  );
-  const findNextUnskipped = useCallback(
-    (from, dir) => findNextUnskippedStep(from, dir, steps, currentIndex),
-    [steps, currentIndex]
-  );
-  const handlePrev = useCallback(() => {
-    if (currentIndex <= 0) return;
-    const target = findNextUnskipped(currentIndex - 1, -1);
-    if (target === currentIndex) return;
-    setCurrent(target);
-  }, [currentIndex, setCurrent, findNextUnskipped]);
-  const handleNext = useCallback(async () => {
-    if (totalCount === 0) return;
-    const ok = await runBeforeNext();
-    if (!ok) return;
-    if (isLast) {
-      onFinish?.(currentIndex, steps);
-      return;
-    }
-    const target = findNextUnskipped(currentIndex + 1, 1);
-    if (target === currentIndex) return;
-    setCurrent(target);
-  }, [
-    currentIndex,
-    totalCount,
-    isLast,
-    onFinish,
-    runBeforeNext,
-    setCurrent,
-    steps,
-    findNextUnskipped
-  ]);
-  const handleStepChange = useCallback(
-    async (nextIndex) => {
-      if (nextIndex === currentIndex) return;
-      const direction2 = nextIndex > currentIndex ? 1 : -1;
-      if (direction2 === 1) {
-        const ok = await runBeforeNext();
-        if (!ok) return;
-      }
-      const target = findNextUnskipped(nextIndex, direction2);
-      if (target === currentIndex) return;
-      setCurrent(target);
-    },
-    [currentIndex, runBeforeNext, setCurrent, findNextUnskipped]
-  );
-  const contentNode = useMemo(() => {
-    if (!currentStep) return null;
-    if (renderStep) return renderStep(currentStep, currentIndex);
-    return currentStep.content ?? null;
-  }, [currentIndex, currentStep, renderStep]);
-  const stepsNodes = useMemo(
-    () => steps.map((step, index) => /* @__PURE__ */ jsx(
-      StepsItem,
-      {
-        title: step.title,
-        description: step.description,
-        status: step.status,
-        icon: step.icon,
-        disabled: step.disabled
-      },
-      step.key ?? index
-    )),
-    [steps]
-  );
-  return /* @__PURE__ */ jsxs("div", { className: wrapperClasses, style, "data-tiger-form-wizard": true, ...props, children: [
-    showSteps && steps.length > 0 && /* @__PURE__ */ jsx(
-      "div",
-      {
-        className: classNames(
-          "px-6 py-5 bg-[var(--tiger-surface-muted,#f9fafb)]/95 backdrop-blur-sm transition-all duration-300",
-          bordered ? "border-b border-[var(--tiger-border,#e5e7eb)]" : ""
-        ),
-        children: /* @__PURE__ */ jsx(
-          Steps,
-          {
-            current: currentIndex,
-            direction,
-            size,
-            simple,
-            clickable,
-            onChange: handleStepChange,
-            children: stepsNodes
-          }
-        )
-      }
-    ),
-    /* @__PURE__ */ jsx("div", { className: "px-8 py-6 flex flex-col items-center w-full min-h-[120px] transition-all duration-300", children: contentNode }),
-    showActions && /* @__PURE__ */ jsxs(
-      "div",
-      {
-        className: classNames(
-          "flex items-center justify-between gap-3 px-8 py-4 bg-[var(--tiger-surface-muted,#f9fafb)]/95 backdrop-blur-sm transition-all duration-300",
-          bordered ? "border-t border-[var(--tiger-border,#e5e7eb)]" : ""
-        ),
-        children: [
-          !isFirst ? /* @__PURE__ */ jsx(
-            Button,
-            {
-              htmlType: "button",
-              variant: "secondary",
-              className: "group",
-              onClick: handlePrev,
-              size: size === "small" ? "sm" : "md",
-              icon: /* @__PURE__ */ jsx(ArrowLeftIcon, {}),
-              children: resolveLocaleText(labels.prevText, prevText)
-            }
-          ) : /* @__PURE__ */ jsx("div", {}),
-          /* @__PURE__ */ jsx(
-            Button,
-            {
-              htmlType: "button",
-              variant: "primary",
-              className: "group",
-              onClick: handleNext,
-              size: size === "small" ? "sm" : "md",
-              icon: isLast ? /* @__PURE__ */ jsx(CheckIcon, {}) : /* @__PURE__ */ jsx(ArrowRightIcon, {}),
-              iconPosition: isLast ? "left" : "right",
-              children: isLast ? resolveLocaleText(labels.finishText, finishText) : resolveLocaleText(labels.nextText, nextText)
-            }
-          )
-        ]
-      }
-    )
-  ] });
-};
-var FormWizard_default = FormWizard;
-
-export {
-  FormWizard,
-  FormWizard_default
-};

package/dist/chunk-RUQ3F3MV.mjs

@@ -1,333 +0,0 @@
-import {
-  useFormContext
-} from "./chunk-OQLP452R.mjs";
-import {
-  FormItemControlProvider
-} from "./chunk-F6T3OLTQ.mjs";
-import {
-  renderOverlayPortal,
-  useAnchoredOverlay
-} from "./chunk-HKAZXG74.mjs";
-
-// src/components/FormItem.tsx
-import React, { useMemo, useEffect, useState, useCallback, useId, useRef } from "react";
-import {
-  classNames,
-  getFormItemClasses,
-  getFormItemLabelClasses,
-  getFormItemContentClasses,
-  getFormItemFieldClasses,
-  getFormItemErrorClasses,
-  getFormItemAsteriskClasses
-} from "@expcat/tigercat-core";
-import { jsx, jsxs } from "react/jsx-runtime";
-function isEventTarget(value) {
-  return value !== null && typeof value === "object";
-}
-function extractFormChangeValue(argument) {
-  if (argument === void 0) {
-    return { found: false };
-  }
-  if (argument !== null && typeof argument === "object" && "target" in argument) {
-    const target = argument.target;
-    if (isEventTarget(target)) {
-      const type = typeof target.type === "string" ? target.type.toLowerCase() : "";
-      if (type === "checkbox" || type === "radio") {
-        return { found: true, value: target.checked };
-      }
-      return { found: true, value: target.value };
-    }
-  }
-  return { found: true, value: argument };
-}
-function hasRequiredRule(maybeRules) {
-  if (!maybeRules) return false;
-  const ruleArr = Array.isArray(maybeRules) ? maybeRules : [maybeRules];
-  return ruleArr.some((rule) => !!rule && typeof rule === "object" && !!rule.required);
-}
-function mergeAriaDescribedBy(existing, next) {
-  if (!existing) return next;
-  if (!next) return existing;
-  const parts = new Set(
-    `${existing} ${next}`.split(" ").map((s) => s.trim()).filter(Boolean)
-  );
-  return Array.from(parts).join(" ");
-}
-var FIELD_CLASSES = getFormItemFieldClasses();
-var ASTERISK_CLASSES = getFormItemAsteriskClasses();
-var FormItem = ({
-  name,
-  label,
-  labelWidth,
-  required,
-  rules,
-  error: controlledError,
-  showMessage = true,
-  errorDisplayMode = "inline",
-  size,
-  children,
-  className,
-  condition
-}) => {
-  const formContext = useFormContext();
-  const [errorMessage, setErrorMessage] = useState("");
-  const [shakeTrigger, setShakeTrigger] = useState(0);
-  const prevFormErrorRef = useRef("");
-  const contentRef = useRef(null);
-  const errorRef = useRef(null);
-  const reactId = useId();
-  const baseId = `tiger-form-item-${reactId}`;
-  const labelId = `${baseId}-label`;
-  const fieldId = `${baseId}-field`;
-  const errorId = `${baseId}-error`;
-  const actualSize = size || formContext?.size || "md";
-  const labelPosition = formContext?.labelPosition || "right";
-  const labelAlign = formContext?.labelAlign || "right";
-  const conditionState = useMemo(() => {
-    if (!name || !formContext) {
-      return { shown: true, disabled: false, required: false };
-    }
-    return formContext.getFieldConditionState(name, condition);
-  }, [name, formContext, condition]);
-  const actualLabelWidth = useMemo(() => {
-    const width = labelWidth || formContext?.labelWidth;
-    if (typeof width === "number") {
-      return `${width}px`;
-    }
-    return width;
-  }, [labelWidth, formContext?.labelWidth]);
-  const showRequiredAsterisk = useMemo(() => {
-    if (required !== void 0) {
-      return required;
-    }
-    if (rules) {
-      return hasRequiredRule(rules);
-    }
-    if (name && formContext?.rules) {
-      const fieldRules = formContext.rules[name];
-      if (fieldRules) {
-        return hasRequiredRule(fieldRules);
-      }
-    }
-    return false;
-  }, [required, rules, name, formContext?.rules]);
-  const isRequired = useMemo(
-    () => (showRequiredAsterisk || conditionState.required) && (formContext?.showRequiredAsterisk ?? true),
-    [showRequiredAsterisk, conditionState.required, formContext?.showRequiredAsterisk]
-  );
-  useEffect(() => {
-    if (name && formContext?.errorsByField) {
-      const error = formContext.errorsByField[name] || "";
-      setErrorMessage(error);
-      if (error && error !== prevFormErrorRef.current) {
-        setShakeTrigger((prev) => prev + 1);
-      }
-      prevFormErrorRef.current = error;
-    }
-  }, [name, formContext?.errorsByField]);
-  useEffect(() => {
-    if (controlledError !== void 0) {
-      setErrorMessage(controlledError);
-    }
-  }, [controlledError]);
-  useEffect(() => {
-    if (!name || !formContext) {
-      return;
-    }
-    if (rules) {
-      formContext.registerFieldRules(name, rules);
-    }
-    formContext.registerFieldCondition(name, condition);
-    return () => {
-      formContext.registerFieldRules(name, void 0);
-      formContext.registerFieldCondition(name, void 0);
-    };
-  }, [name, rules, condition, formContext]);
-  const handleBlur = useCallback(() => {
-    if (name && formContext) {
-      formContext.validateField(name, rules, "blur");
-    }
-  }, [name, formContext, rules]);
-  const handleChange = useCallback(
-    (argument) => {
-      if (!name || !formContext) {
-        return;
-      }
-      const extracted = extractFormChangeValue(argument);
-      if (extracted.found) {
-        formContext.updateValue(name, extracted.value);
-      }
-      formContext.validateField(name, rules, "change");
-    },
-    [name, formContext, rules]
-  );
-  const hasError = !!errorMessage;
-  const popupErrorVisible = showMessage && hasError && errorDisplayMode === "popup";
-  const overlay = useAnchoredOverlay({
-    enabled: popupErrorVisible,
-    referenceRef: contentRef,
-    floatingRef: errorRef,
-    placement: "bottom-start",
-    offset: 4
-  });
-  const describedById = useMemo(
-    () => showMessage && hasError ? errorId : void 0,
-    [showMessage, hasError, errorId]
-  );
-  const onlyChild = useMemo(() => {
-    const count = React.Children.count(children);
-    if (count !== 1) {
-      return null;
-    }
-    return React.Children.toArray(children)[0] ?? null;
-  }, [children]);
-  const isClonableChild = React.isValidElement(onlyChild);
-  const isNativeElement = isClonableChild && typeof onlyChild.type === "string";
-  const childId = isClonableChild ? onlyChild.props.id : void 0;
-  const effectiveFieldId = childId ?? fieldId;
-  const enhancedChild = useMemo(() => {
-    if (!isClonableChild) {
-      return children;
-    }
-    const nextProps = {
-      id: effectiveFieldId,
-      "aria-invalid": hasError ? true : onlyChild.props["aria-invalid"],
-      "aria-required": isRequired ? true : onlyChild.props["aria-required"],
-      disabled: conditionState.disabled || formContext?.disabled ? true : onlyChild.props.disabled,
-      "aria-describedby": mergeAriaDescribedBy(onlyChild.props["aria-describedby"], describedById),
-      onBlur: (event) => {
-        onlyChild.props.onBlur?.(event);
-        handleBlur();
-      },
-      onChange: (...args) => {
-        onlyChild.props.onChange?.(...args);
-        handleChange(args[0]);
-      }
-    };
-    if (!isNativeElement) {
-      nextProps.status = hasError ? "error" : onlyChild.props.status;
-    }
-    return React.cloneElement(onlyChild, nextProps);
-  }, [
-    isClonableChild,
-    children,
-    onlyChild,
-    effectiveFieldId,
-    hasError,
-    isRequired,
-    conditionState.disabled,
-    formContext?.disabled,
-    isNativeElement,
-    describedById,
-    handleBlur,
-    handleChange
-  ]);
-  const controlValue = useMemo(
-    () => ({
-      status: hasError ? "error" : void 0,
-      errorMessage: hasError && !showMessage ? errorMessage : void 0,
-      shakeTrigger: hasError ? shakeTrigger : void 0
-    }),
-    [hasError, showMessage, errorMessage, shakeTrigger]
-  );
-  const formItemClasses = useMemo(
-    () => classNames(
-      getFormItemClasses({
-        size: actualSize,
-        labelPosition,
-        hasError,
-        disabled: formContext?.disabled || conditionState.disabled
-      }),
-      className
-    ),
-    [actualSize, labelPosition, hasError, formContext?.disabled, conditionState.disabled, className]
-  );
-  const labelClasses = useMemo(
-    () => getFormItemLabelClasses({
-      size: actualSize,
-      labelAlign,
-      labelPosition,
-      isRequired
-    }),
-    [actualSize, labelAlign, labelPosition, isRequired]
-  );
-  const labelStyles = useMemo(() => {
-    if (labelPosition === "top") {
-      return {};
-    }
-    return actualLabelWidth ? { width: actualLabelWidth } : {};
-  }, [labelPosition, actualLabelWidth]);
-  const errorClasses = useMemo(
-    () => classNames(getFormItemErrorClasses(actualSize), hasError && "opacity-100"),
-    [actualSize, hasError]
-  );
-  const contentClasses = useMemo(
-    () => classNames(
-      getFormItemContentClasses(labelPosition),
-      errorDisplayMode === "popup" && "relative"
-    ),
-    [labelPosition, errorDisplayMode]
-  );
-  if (!conditionState.shown) {
-    return null;
-  }
-  return /* @__PURE__ */ jsxs("div", { className: formItemClasses, children: [
-    label && /* @__PURE__ */ jsxs(
-      "label",
-      {
-        id: labelId,
-        className: labelClasses,
-        style: labelStyles,
-        htmlFor: isClonableChild ? effectiveFieldId : void 0,
-        children: [
-          isRequired && /* @__PURE__ */ jsx("span", { className: ASTERISK_CLASSES, children: "*" }),
-          label
-        ]
-      }
-    ),
-    /* @__PURE__ */ jsxs("div", { ref: contentRef, className: contentClasses, children: [
-      /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: FIELD_CLASSES,
-          role: "group",
-          "aria-labelledby": label ? labelId : void 0,
-          "aria-describedby": describedById,
-          "aria-invalid": hasError ? true : void 0,
-          onBlur: isClonableChild ? void 0 : handleBlur,
-          onChange: isClonableChild ? void 0 : handleChange,
-          children: /* @__PURE__ */ jsx(FormItemControlProvider, { value: controlValue, children: enhancedChild })
-        }
-      ),
-      showMessage && renderOverlayPortal(
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            ref: errorRef,
-            id: hasError ? errorId : void 0,
-            role: hasError ? "alert" : void 0,
-            className: errorDisplayMode === "block" ? classNames(
-              "mt-1 p-2 rounded bg-red-50 border border-red-200 text-red-600 text-sm",
-              !hasError && "hidden"
-            ) : errorDisplayMode === "popup" ? classNames(
-              "px-2 py-1 rounded bg-red-600 text-white text-xs shadow-lg",
-              overlay.floatingClasses,
-              !hasError && "hidden"
-            ) : errorClasses,
-            style: errorDisplayMode === "popup" ? overlay.floatingStyles : void 0,
-            "data-positioned": errorDisplayMode === "popup" ? overlay.positioned : void 0,
-            "aria-hidden": hasError ? void 0 : true,
-            children: hasError ? errorMessage : ""
-          }
-        ),
-        overlay.target,
-        errorDisplayMode !== "popup"
-      )
-    ] })
-  ] });
-};
-FormItem.displayName = "TigerFormItem";
-
-export {
-  FormItem
-};