@aloudata/aloudata-design 3.0.7 → 3.0.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (41) hide show
  1. package/dist/Alert/index.js +2 -2
  2. package/dist/Alert/index.js.map +1 -1
  3. package/dist/Avatar/component/Avatar/index.js +7 -1
  4. package/dist/Avatar/component/Avatar/index.js.map +1 -1
  5. package/dist/Button/index.js +2 -1
  6. package/dist/Button/index.js.map +1 -1
  7. package/dist/Card/index.js +2 -2
  8. package/dist/Card/index.js.map +1 -1
  9. package/dist/Collapse/index.js +18 -8
  10. package/dist/Collapse/index.js.map +1 -1
  11. package/dist/ConfigProvider/index.d.ts +5 -2
  12. package/dist/ConfigProvider/index.js +25 -3
  13. package/dist/ConfigProvider/index.js.map +1 -1
  14. package/dist/DatePicker/index.js +12 -1
  15. package/dist/DatePicker/index.js.map +1 -1
  16. package/dist/Dropdown/index.js +7 -9
  17. package/dist/Dropdown/index.js.map +1 -1
  18. package/dist/Empty/index.js +1 -2
  19. package/dist/Empty/index.js.map +1 -1
  20. package/dist/Input/components/Input/index.js +7 -3
  21. package/dist/Input/components/Input/index.js.map +1 -1
  22. package/dist/Popconfirm/index.js +3 -2
  23. package/dist/Popconfirm/index.js.map +1 -1
  24. package/dist/Radio/components/Radio/index.js +8 -2
  25. package/dist/Radio/components/Radio/index.js.map +1 -1
  26. package/dist/Select/BaseSelect.js +3 -1
  27. package/dist/Select/BaseSelect.js.map +1 -1
  28. package/dist/Select/components/Suffix.d.ts +2 -1
  29. package/dist/Select/components/Suffix.js +14 -5
  30. package/dist/Select/components/Suffix.js.map +1 -1
  31. package/dist/Slider/index.js +2 -2
  32. package/dist/Slider/index.js.map +1 -1
  33. package/dist/Steps/components/Step/index.d.ts +1 -0
  34. package/dist/Steps/components/Step/index.js.map +1 -1
  35. package/dist/Steps/index.d.ts +1 -1
  36. package/dist/Steps/index.js +4 -2
  37. package/dist/Steps/index.js.map +1 -1
  38. package/dist/Tooltip/index.js +5 -4
  39. package/dist/Tooltip/index.js.map +1 -1
  40. package/dist/aloudata-design.css +1 -1
  41. package/package.json +1 -1
@@ -1,11 +1,12 @@
1
1
  import { default as React } from 'react';
2
2
  import { DisplayValueType } from '../interface';
3
- export default function Suffix({ showArrow, allowClear, isActive, isHover, icon, onClear, displayValues, disabled, }: {
3
+ export default function Suffix({ showArrow, allowClear, isActive, isHover, icon, onClear, displayValues, disabled, loading, }: {
4
4
  showArrow?: boolean;
5
5
  allowClear?: boolean;
6
6
  isActive?: boolean;
7
7
  isHover?: boolean;
8
8
  disabled?: boolean;
9
+ loading?: boolean;
9
10
  icon: React.ReactNode;
10
11
  onClear?: () => void;
11
12
  displayValues: DisplayValueType[];
@@ -1,11 +1,20 @@
1
- import Memo from "../../Icon/components/ArrowDownRightFill.js";
2
- import Memo$1 from "../../Icon/components/CloseCircleRightFill.js";
1
+ import Memo from "../../Icon/components/LoadingLine.js";
2
+ import Memo$1 from "../../Icon/components/ArrowDownRightFill.js";
3
+ import Memo$2 from "../../Icon/components/CloseCircleRightFill.js";
3
4
  import prefixCls from "../../_utils/prefixCls.js";
4
5
  import "react";
5
6
  import { jsx } from "react/jsx-runtime";
6
7
  //#region src/Select/components/Suffix.tsx
7
- function Suffix({ showArrow, allowClear, isActive, isHover, icon, onClear, displayValues, disabled }) {
8
+ function Suffix({ showArrow, allowClear, isActive, isHover, icon, onClear, displayValues, disabled, loading }) {
8
9
  const classNames = prefixCls("select");
10
+ if (loading) return /* @__PURE__ */ jsx("div", {
11
+ className: `${classNames("suffix", "loading")} beta-ald-select-suffix-loading`,
12
+ children: /* @__PURE__ */ jsx(Memo, {
13
+ className: "ald-loading-spin tw-animate-spin",
14
+ size: 16,
15
+ color: "#6B7280"
16
+ })
17
+ });
9
18
  if ((isActive || isHover) && !disabled && allowClear && displayValues.length > 0) return /* @__PURE__ */ jsx("div", {
10
19
  className: classNames("suffix", "clear"),
11
20
  onClick: (event) => {
@@ -13,13 +22,13 @@ function Suffix({ showArrow, allowClear, isActive, isHover, icon, onClear, displ
13
22
  event.preventDefault();
14
23
  onClear?.();
15
24
  },
16
- children: /* @__PURE__ */ jsx(Memo$1, {
25
+ children: /* @__PURE__ */ jsx(Memo$2, {
17
26
  size: 16,
18
27
  color: "#6B7280"
19
28
  })
20
29
  });
21
30
  if (showArrow) {
22
- const dropdownIcon = icon || /* @__PURE__ */ jsx(Memo, {
31
+ const dropdownIcon = icon || /* @__PURE__ */ jsx(Memo$1, {
23
32
  color: "#6B7280",
24
33
  size: 16
25
34
  });
@@ -1 +1 @@
1
- {"version":3,"file":"Suffix.js","names":[],"sources":["../../../src/Select/components/Suffix.tsx"],"sourcesContent":["import React from 'react';\nimport prefixCls from '../../_utils/prefixCls';\nimport { ArrowDownRightFill, CloseCircleRightFill } from '../../Icon';\nimport { DisplayValueType } from '../interface';\n\nexport default function Suffix({\n showArrow,\n allowClear,\n isActive,\n isHover,\n icon,\n onClear,\n displayValues,\n disabled,\n}: {\n showArrow?: boolean;\n allowClear?: boolean;\n isActive?: boolean;\n isHover?: boolean;\n disabled?: boolean;\n icon: React.ReactNode;\n onClear?: () => void;\n displayValues: DisplayValueType[];\n}) {\n const classNames = prefixCls('select');\n\n if (\n (isActive || isHover) &&\n !disabled &&\n allowClear &&\n displayValues.length > 0\n ) {\n return (\n <div\n className={classNames('suffix', 'clear')}\n onClick={(event) => {\n event.stopPropagation();\n event.preventDefault();\n onClear?.();\n }}\n >\n <CloseCircleRightFill size={16} color=\"#6B7280\" />\n </div>\n );\n }\n if (showArrow) {\n const dropdownIcon = icon || (\n <ArrowDownRightFill color=\"#6B7280\" size={16} />\n );\n\n // antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器\n return (\n <div className={classNames('suffix', 'arrow') + ' ant-select-arrow'}>\n {dropdownIcon}\n </div>\n );\n }\n\n return null;\n}\n"],"mappings":";;;;;;AAKA,SAAwB,OAAO,EAC7B,WACA,YACA,UACA,SACA,MACA,SACA,eACA,YAUC;CACD,MAAM,aAAa,UAAU,SAAS;AAEtC,MACG,YAAY,YACb,CAAC,YACD,cACA,cAAc,SAAS,EAEvB,QACE,oBAAC,OAAD;EACE,WAAW,WAAW,UAAU,QAAQ;EACxC,UAAU,UAAU;AAClB,SAAM,iBAAiB;AACvB,SAAM,gBAAgB;AACtB,cAAW;;YAGb,oBAAC,QAAD;GAAsB,MAAM;GAAI,OAAM;GAAY,CAAA;EAC9C,CAAA;AAGV,KAAI,WAAW;EACb,MAAM,eAAe,QACnB,oBAAC,MAAD;GAAoB,OAAM;GAAU,MAAM;GAAM,CAAA;AAIlD,SACE,oBAAC,OAAD;GAAK,WAAW,WAAW,UAAU,QAAQ,GAAG;aAC7C;GACG,CAAA;;AAIV,QAAO"}
1
+ {"version":3,"file":"Suffix.js","names":[],"sources":["../../../src/Select/components/Suffix.tsx"],"sourcesContent":["import React from 'react';\nimport prefixCls from '../../_utils/prefixCls';\nimport {\n ArrowDownRightFill,\n CloseCircleRightFill,\n LoadingLine,\n} from '../../Icon';\nimport { DisplayValueType } from '../interface';\n\nexport default function Suffix({\n showArrow,\n allowClear,\n isActive,\n isHover,\n icon,\n onClear,\n displayValues,\n disabled,\n loading,\n}: {\n showArrow?: boolean;\n allowClear?: boolean;\n isActive?: boolean;\n isHover?: boolean;\n disabled?: boolean;\n loading?: boolean;\n icon: React.ReactNode;\n onClear?: () => void;\n displayValues: DisplayValueType[];\n}) {\n const classNames = prefixCls('select');\n\n if (loading) {\n return (\n <div\n className={`${classNames(\n 'suffix',\n 'loading',\n )} beta-ald-select-suffix-loading`}\n >\n <LoadingLine\n className=\"ald-loading-spin tw-animate-spin\"\n size={16}\n color=\"#6B7280\"\n />\n </div>\n );\n }\n\n if (\n (isActive || isHover) &&\n !disabled &&\n allowClear &&\n displayValues.length > 0\n ) {\n return (\n <div\n className={classNames('suffix', 'clear')}\n onClick={(event) => {\n event.stopPropagation();\n event.preventDefault();\n onClear?.();\n }}\n >\n <CloseCircleRightFill size={16} color=\"#6B7280\" />\n </div>\n );\n }\n if (showArrow) {\n const dropdownIcon = icon || (\n <ArrowDownRightFill color=\"#6B7280\" size={16} />\n );\n\n // antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器\n return (\n <div className={classNames('suffix', 'arrow') + ' ant-select-arrow'}>\n {dropdownIcon}\n </div>\n );\n }\n\n return null;\n}\n"],"mappings":";;;;;;;AASA,SAAwB,OAAO,EAC7B,WACA,YACA,UACA,SACA,MACA,SACA,eACA,UACA,WAWC;CACD,MAAM,aAAa,UAAU,SAAS;AAEtC,KAAI,QACF,QACE,oBAAC,OAAD;EACE,WAAW,GAAG,WACZ,UACA,UACD,CAAC;YAEF,oBAAC,MAAD;GACE,WAAU;GACV,MAAM;GACN,OAAM;GACN,CAAA;EACE,CAAA;AAIV,MACG,YAAY,YACb,CAAC,YACD,cACA,cAAc,SAAS,EAEvB,QACE,oBAAC,OAAD;EACE,WAAW,WAAW,UAAU,QAAQ;EACxC,UAAU,UAAU;AAClB,SAAM,iBAAiB;AACvB,SAAM,gBAAgB;AACtB,cAAW;;YAGb,oBAAC,QAAD;GAAsB,MAAM;GAAI,OAAM;GAAY,CAAA;EAC9C,CAAA;AAGV,KAAI,WAAW;EACb,MAAM,eAAe,QACnB,oBAAC,QAAD;GAAoB,OAAM;GAAU,MAAM;GAAM,CAAA;AAIlD,SACE,oBAAC,OAAD;GAAK,WAAW,WAAW,UAAU,QAAQ,GAAG;aAC7C;GACG,CAAA;;AAIV,QAAO"}
@@ -20,7 +20,7 @@ function SliderThumbWithTooltip({ tooltip, value, className }) {
20
20
  });
21
21
  }
22
22
  function Slider(props) {
23
- const { className, style, disabled, min = 0, max = 100, step = 1, range, vertical, marks, tooltip } = props;
23
+ const { className, style, disabled, min = 0, max = 100, step = 1, range, vertical, marks, included = true, tooltip } = props;
24
24
  const [currentValues, setCurrentValues] = useState(() => {
25
25
  if (range) return props.value || props.defaultValue || [min, max];
26
26
  const v = props.value;
@@ -61,7 +61,7 @@ function Slider(props) {
61
61
  children: [
62
62
  /* @__PURE__ */ jsx(SliderPrimitive.Track, {
63
63
  className: cn("tw-relative tw-grow tw-rounded-full tw-bg-[var(--interaction-neutral-subtle-normal)]", vertical ? "tw-w-1" : "tw-h-1"),
64
- children: /* @__PURE__ */ jsx(SliderPrimitive.Range, { className: "tw-absolute tw-rounded-full tw-bg-[var(--interaction-default-normal)] hover:tw-bg-[var(--interaction-default-hover)]" })
64
+ children: included && /* @__PURE__ */ jsx(SliderPrimitive.Range, { className: "ald-slider-range tw-absolute tw-rounded-full tw-bg-[var(--interaction-default-normal)] hover:tw-bg-[var(--interaction-default-hover)]" })
65
65
  }),
66
66
  tooltip ? /* @__PURE__ */ jsx(SliderThumbWithTooltip, {
67
67
  tooltip,
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../../src/Slider/index.tsx"],"sourcesContent":["import * as SliderPrimitive from '@radix-ui/react-slider';\nimport React, { useRef, useState } from 'react';\nimport { cn } from '../lib/utils';\n\ninterface SliderBaseProps {\n className?: string;\n style?: React.CSSProperties;\n disabled?: boolean;\n min?: number;\n max?: number;\n step?: number;\n vertical?: boolean;\n marks?: Record<\n number,\n React.ReactNode | { style?: React.CSSProperties; label?: React.ReactNode }\n >;\n included?: boolean;\n tooltip?: { open?: boolean; formatter?: (value?: number) => React.ReactNode };\n}\n\ninterface SliderSingleProps extends SliderBaseProps {\n range?: false;\n value?: number;\n defaultValue?: number;\n onChange?: (value: number) => void;\n onAfterChange?: (value: number) => void;\n}\n\ninterface SliderRangeProps extends SliderBaseProps {\n range: true;\n value?: [number, number];\n defaultValue?: [number, number];\n onChange?: (value: [number, number]) => void;\n onAfterChange?: (value: [number, number]) => void;\n}\n\nfunction SliderThumbWithTooltip({\n tooltip,\n value,\n className,\n}: {\n tooltip?: SliderBaseProps['tooltip'];\n value: number;\n className: string;\n}) {\n const [hovered, setHovered] = useState(false);\n const thumbRef = useRef<HTMLSpanElement>(null);\n\n const showTooltip = tooltip?.open !== undefined ? tooltip.open : hovered;\n const formattedValue = tooltip?.formatter ? tooltip.formatter(value) : value;\n\n return (\n <SliderPrimitive.Thumb\n ref={thumbRef}\n className={cn('tw-relative', className)}\n onPointerEnter={() => setHovered(true)}\n onPointerLeave={() => setHovered(false)}\n >\n {tooltip && showTooltip && (\n <div className=\"tw-absolute tw-bottom-full tw-left-1/2 tw-mb-2 -tw-translate-x-1/2 tw-whitespace-nowrap tw-rounded-r-50 tw-bg-[var(--alias-colors-bg-tooltip)] tw-px-2 tw-py-1 tw-text-xs tw-text-[var(--alias-colors-text-inverse-default)]\">\n {formattedValue}\n </div>\n )}\n </SliderPrimitive.Thumb>\n );\n}\n\nfunction Slider(props: SliderSingleProps | SliderRangeProps) {\n const {\n className,\n style,\n disabled,\n min = 0,\n max = 100,\n step = 1,\n range,\n vertical,\n marks,\n tooltip,\n } = props;\n\n const [currentValues, setCurrentValues] = useState<number[]>(() => {\n if (range) {\n return (\n (props as SliderRangeProps).value ||\n (props as SliderRangeProps).defaultValue || [min, max]\n );\n }\n const v = (props as SliderSingleProps).value;\n if (v !== undefined) return [v];\n return [(props as SliderSingleProps).defaultValue ?? min];\n });\n\n const handleValueChange = (values: number[]) => {\n setCurrentValues(values);\n if (range && 'onChange' in props && props.onChange) {\n (props.onChange as (v: [number, number]) => void)([values[0], values[1]]);\n } else if (!range && 'onChange' in props && props.onChange) {\n (props.onChange as (v: number) => void)(values[0]);\n }\n };\n\n const handleValueCommit = (values: number[]) => {\n if (range && 'onAfterChange' in props && props.onAfterChange) {\n (props.onAfterChange as (v: [number, number]) => void)([\n values[0],\n values[1],\n ]);\n } else if (!range && 'onAfterChange' in props && props.onAfterChange) {\n (props.onAfterChange as (v: number) => void)(values[0]);\n }\n };\n\n const defaultVal = range\n ? (props as SliderRangeProps).defaultValue || [min, max]\n : [(props as SliderSingleProps).defaultValue ?? min];\n\n const controlledVal = range\n ? (props as SliderRangeProps).value\n : (props as SliderSingleProps).value !== undefined\n ? [(props as SliderSingleProps).value!]\n : undefined;\n\n // Sync controlled values — use stringified key to detect content changes\n const controlledValKey = controlledVal ? controlledVal.join(',') : undefined;\n React.useEffect(() => {\n if (controlledValKey !== undefined) {\n setCurrentValues(controlledValKey.split(',').map(Number));\n }\n }, [controlledValKey]);\n\n const thumbClass =\n 'tw-block tw-size-[10px] tw-cursor-pointer tw-rounded-full tw-bg-[var(--interaction-default-normal)] tw-shadow-[0_0_0_1px_var(--interaction-default-normal)] hover:tw-shadow-[0_0_0_3px_var(--interaction-default-hover)] focus-visible:tw-shadow-[0_0_0_3px_var(--interaction-default-active)] focus-visible:tw-outline-none';\n\n const markEntries = marks ? Object.entries(marks) : [];\n\n return (\n <div className={cn('tw-relative', vertical ? 'tw-h-full' : 'tw-w-full')}>\n <SliderPrimitive.Root\n className={cn(\n 'ald-slider tw-relative tw-flex tw-touch-none tw-select-none tw-items-center',\n vertical ? 'tw-h-full tw-w-5 tw-flex-col' : 'tw-h-5 tw-w-full',\n disabled && 'tw-pointer-events-none tw-opacity-50',\n className,\n )}\n style={style}\n min={min}\n max={max}\n step={step}\n disabled={disabled}\n orientation={vertical ? 'vertical' : 'horizontal'}\n defaultValue={defaultVal}\n value={controlledVal}\n onValueChange={handleValueChange}\n onValueCommit={handleValueCommit}\n >\n <SliderPrimitive.Track\n className={cn(\n 'tw-relative tw-grow tw-rounded-full tw-bg-[var(--interaction-neutral-subtle-normal)]',\n vertical ? 'tw-w-1' : 'tw-h-1',\n )}\n >\n <SliderPrimitive.Range className=\"tw-absolute tw-rounded-full tw-bg-[var(--interaction-default-normal)] hover:tw-bg-[var(--interaction-default-hover)]\" />\n </SliderPrimitive.Track>\n {tooltip ? (\n <SliderThumbWithTooltip\n tooltip={tooltip}\n value={currentValues[0] ?? min}\n className={thumbClass}\n />\n ) : (\n <SliderPrimitive.Thumb className={thumbClass} />\n )}\n {range &&\n (tooltip ? (\n <SliderThumbWithTooltip\n tooltip={tooltip}\n value={currentValues[1] ?? max}\n className={thumbClass}\n />\n ) : (\n <SliderPrimitive.Thumb className={thumbClass} />\n ))}\n </SliderPrimitive.Root>\n {markEntries.length > 0 && (\n <div className=\"ald-slider-marks tw-relative tw-mt-2 tw-w-full\">\n {markEntries.map(([key, mark]) => {\n const numKey = Number(key);\n const percent = ((numKey - min) / (max - min)) * 100;\n const isNode =\n typeof mark === 'object' &&\n mark !== null &&\n 'label' in (mark as Record<string, unknown>);\n const label = isNode\n ? (mark as { label?: React.ReactNode }).label\n : (mark as React.ReactNode);\n const markStyle = isNode\n ? (mark as { style?: React.CSSProperties }).style\n : undefined;\n\n return (\n <span\n key={key}\n className=\"ald-slider-mark tw-absolute tw-text-xs tw-text-[var(--content-secondary)]\"\n style={{\n left: `${percent}%`,\n transform: 'translateX(-50%)',\n ...markStyle,\n }}\n >\n {label}\n </span>\n );\n })}\n </div>\n )}\n </div>\n );\n}\n\nexport default Slider;\n"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../src/Slider/index.tsx"],"sourcesContent":["import * as SliderPrimitive from '@radix-ui/react-slider';\nimport React, { useRef, useState } from 'react';\nimport { cn } from '../lib/utils';\n\ninterface SliderBaseProps {\n className?: string;\n style?: React.CSSProperties;\n disabled?: boolean;\n min?: number;\n max?: number;\n step?: number;\n vertical?: boolean;\n marks?: Record<\n number,\n React.ReactNode | { style?: React.CSSProperties; label?: React.ReactNode }\n >;\n included?: boolean;\n tooltip?: { open?: boolean; formatter?: (value?: number) => React.ReactNode };\n}\n\ninterface SliderSingleProps extends SliderBaseProps {\n range?: false;\n value?: number;\n defaultValue?: number;\n onChange?: (value: number) => void;\n onAfterChange?: (value: number) => void;\n}\n\ninterface SliderRangeProps extends SliderBaseProps {\n range: true;\n value?: [number, number];\n defaultValue?: [number, number];\n onChange?: (value: [number, number]) => void;\n onAfterChange?: (value: [number, number]) => void;\n}\n\nfunction SliderThumbWithTooltip({\n tooltip,\n value,\n className,\n}: {\n tooltip?: SliderBaseProps['tooltip'];\n value: number;\n className: string;\n}) {\n const [hovered, setHovered] = useState(false);\n const thumbRef = useRef<HTMLSpanElement>(null);\n\n const showTooltip = tooltip?.open !== undefined ? tooltip.open : hovered;\n const formattedValue = tooltip?.formatter ? tooltip.formatter(value) : value;\n\n return (\n <SliderPrimitive.Thumb\n ref={thumbRef}\n className={cn('tw-relative', className)}\n onPointerEnter={() => setHovered(true)}\n onPointerLeave={() => setHovered(false)}\n >\n {tooltip && showTooltip && (\n <div className=\"tw-absolute tw-bottom-full tw-left-1/2 tw-mb-2 -tw-translate-x-1/2 tw-whitespace-nowrap tw-rounded-r-50 tw-bg-[var(--alias-colors-bg-tooltip)] tw-px-2 tw-py-1 tw-text-xs tw-text-[var(--alias-colors-text-inverse-default)]\">\n {formattedValue}\n </div>\n )}\n </SliderPrimitive.Thumb>\n );\n}\n\nfunction Slider(props: SliderSingleProps | SliderRangeProps) {\n const {\n className,\n style,\n disabled,\n min = 0,\n max = 100,\n step = 1,\n range,\n vertical,\n marks,\n included = true,\n tooltip,\n } = props;\n\n const [currentValues, setCurrentValues] = useState<number[]>(() => {\n if (range) {\n return (\n (props as SliderRangeProps).value ||\n (props as SliderRangeProps).defaultValue || [min, max]\n );\n }\n const v = (props as SliderSingleProps).value;\n if (v !== undefined) return [v];\n return [(props as SliderSingleProps).defaultValue ?? min];\n });\n\n const handleValueChange = (values: number[]) => {\n setCurrentValues(values);\n if (range && 'onChange' in props && props.onChange) {\n (props.onChange as (v: [number, number]) => void)([values[0], values[1]]);\n } else if (!range && 'onChange' in props && props.onChange) {\n (props.onChange as (v: number) => void)(values[0]);\n }\n };\n\n const handleValueCommit = (values: number[]) => {\n if (range && 'onAfterChange' in props && props.onAfterChange) {\n (props.onAfterChange as (v: [number, number]) => void)([\n values[0],\n values[1],\n ]);\n } else if (!range && 'onAfterChange' in props && props.onAfterChange) {\n (props.onAfterChange as (v: number) => void)(values[0]);\n }\n };\n\n const defaultVal = range\n ? (props as SliderRangeProps).defaultValue || [min, max]\n : [(props as SliderSingleProps).defaultValue ?? min];\n\n const controlledVal = range\n ? (props as SliderRangeProps).value\n : (props as SliderSingleProps).value !== undefined\n ? [(props as SliderSingleProps).value!]\n : undefined;\n\n // Sync controlled values — use stringified key to detect content changes\n const controlledValKey = controlledVal ? controlledVal.join(',') : undefined;\n React.useEffect(() => {\n if (controlledValKey !== undefined) {\n setCurrentValues(controlledValKey.split(',').map(Number));\n }\n }, [controlledValKey]);\n\n const thumbClass =\n 'tw-block tw-size-[10px] tw-cursor-pointer tw-rounded-full tw-bg-[var(--interaction-default-normal)] tw-shadow-[0_0_0_1px_var(--interaction-default-normal)] hover:tw-shadow-[0_0_0_3px_var(--interaction-default-hover)] focus-visible:tw-shadow-[0_0_0_3px_var(--interaction-default-active)] focus-visible:tw-outline-none';\n\n const markEntries = marks ? Object.entries(marks) : [];\n\n return (\n <div className={cn('tw-relative', vertical ? 'tw-h-full' : 'tw-w-full')}>\n <SliderPrimitive.Root\n className={cn(\n 'ald-slider tw-relative tw-flex tw-touch-none tw-select-none tw-items-center',\n vertical ? 'tw-h-full tw-w-5 tw-flex-col' : 'tw-h-5 tw-w-full',\n disabled && 'tw-pointer-events-none tw-opacity-50',\n className,\n )}\n style={style}\n min={min}\n max={max}\n step={step}\n disabled={disabled}\n orientation={vertical ? 'vertical' : 'horizontal'}\n defaultValue={defaultVal}\n value={controlledVal}\n onValueChange={handleValueChange}\n onValueCommit={handleValueCommit}\n >\n <SliderPrimitive.Track\n className={cn(\n 'tw-relative tw-grow tw-rounded-full tw-bg-[var(--interaction-neutral-subtle-normal)]',\n vertical ? 'tw-w-1' : 'tw-h-1',\n )}\n >\n {included && (\n <SliderPrimitive.Range className=\"ald-slider-range tw-absolute tw-rounded-full tw-bg-[var(--interaction-default-normal)] hover:tw-bg-[var(--interaction-default-hover)]\" />\n )}\n </SliderPrimitive.Track>\n {tooltip ? (\n <SliderThumbWithTooltip\n tooltip={tooltip}\n value={currentValues[0] ?? min}\n className={thumbClass}\n />\n ) : (\n <SliderPrimitive.Thumb className={thumbClass} />\n )}\n {range &&\n (tooltip ? (\n <SliderThumbWithTooltip\n tooltip={tooltip}\n value={currentValues[1] ?? max}\n className={thumbClass}\n />\n ) : (\n <SliderPrimitive.Thumb className={thumbClass} />\n ))}\n </SliderPrimitive.Root>\n {markEntries.length > 0 && (\n <div className=\"ald-slider-marks tw-relative tw-mt-2 tw-w-full\">\n {markEntries.map(([key, mark]) => {\n const numKey = Number(key);\n const percent = ((numKey - min) / (max - min)) * 100;\n const isNode =\n typeof mark === 'object' &&\n mark !== null &&\n 'label' in (mark as Record<string, unknown>);\n const label = isNode\n ? (mark as { label?: React.ReactNode }).label\n : (mark as React.ReactNode);\n const markStyle = isNode\n ? (mark as { style?: React.CSSProperties }).style\n : undefined;\n\n return (\n <span\n key={key}\n className=\"ald-slider-mark tw-absolute tw-text-xs tw-text-[var(--content-secondary)]\"\n style={{\n left: `${percent}%`,\n transform: 'translateX(-50%)',\n ...markStyle,\n }}\n >\n {label}\n </span>\n );\n })}\n </div>\n )}\n </div>\n );\n}\n\nexport default Slider;\n"],"mappings":"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"}
@@ -2,6 +2,7 @@ import { ReactNode } from 'react';
2
2
  export type TStatus = 'wait' | 'process' | 'finish' | 'error';
3
3
  export interface IStepProps {
4
4
  description?: ReactNode;
5
+ disabled?: boolean;
5
6
  status?: TStatus;
6
7
  title?: ReactNode;
7
8
  }
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../../../../src/Steps/components/Step/index.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport { ProcessIcon } from '../ProcessIcon';\n\nexport type TStatus = 'wait' | 'process' | 'finish' | 'error';\n\nexport interface IStepProps {\n description?: ReactNode;\n status?: TStatus;\n title?: ReactNode;\n}\n\nexport function Step(props: IStepProps) {\n const { status } = props;\n return (\n <div className=\"ald-step\">\n <div className=\"ald-step-icon\">\n <ProcessIcon type={status || 'wait'} />\n </div>\n {props.title && <div className=\"ald-step-title\">{props.title}</div>}\n {props.description && (\n <div className=\"ald-step-description\">{props.description}</div>\n )}\n </div>\n );\n}\n"],"mappings":";;;;AAWA,SAAgB,KAAK,OAAmB;CACtC,MAAM,EAAE,WAAW;AACnB,QACE,qBAAC,OAAD;EAAK,WAAU;YAAf;GACE,oBAAC,OAAD;IAAK,WAAU;cACb,oBAAC,aAAD,EAAa,MAAM,UAAU,QAAU,CAAA;IACnC,CAAA;GACL,MAAM,SAAS,oBAAC,OAAD;IAAK,WAAU;cAAkB,MAAM;IAAY,CAAA;GAClE,MAAM,eACL,oBAAC,OAAD;IAAK,WAAU;cAAwB,MAAM;IAAkB,CAAA;GAE7D"}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../../../src/Steps/components/Step/index.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport { ProcessIcon } from '../ProcessIcon';\n\nexport type TStatus = 'wait' | 'process' | 'finish' | 'error';\n\nexport interface IStepProps {\n description?: ReactNode;\n disabled?: boolean;\n status?: TStatus;\n title?: ReactNode;\n}\n\nexport function Step(props: IStepProps) {\n const { status } = props;\n return (\n <div className=\"ald-step\">\n <div className=\"ald-step-icon\">\n <ProcessIcon type={status || 'wait'} />\n </div>\n {props.title && <div className=\"ald-step-title\">{props.title}</div>}\n {props.description && (\n <div className=\"ald-step-description\">{props.description}</div>\n )}\n </div>\n );\n}\n"],"mappings":";;;;AAYA,SAAgB,KAAK,OAAmB;CACtC,MAAM,EAAE,WAAW;AACnB,QACE,qBAAC,OAAD;EAAK,WAAU;YAAf;GACE,oBAAC,OAAD;IAAK,WAAU;cACb,oBAAC,aAAD,EAAa,MAAM,UAAU,QAAU,CAAA;IACnC,CAAA;GACL,MAAM,SAAS,oBAAC,OAAD;IAAK,WAAU;cAAkB,MAAM;IAAY,CAAA;GAClE,MAAM,eACL,oBAAC,OAAD;IAAK,WAAU;cAAwB,MAAM;IAAkB,CAAA;GAE7D"}
@@ -19,7 +19,7 @@ export interface IStepsProps {
19
19
  items?: IStepItem[];
20
20
  children?: ReactElement<IStepProps>[] | ReactElement<IStepProps>;
21
21
  }
22
- declare function Steps({ className, current, direction, status, items, children, }: IStepsProps): import("react/jsx-runtime").JSX.Element;
22
+ declare function Steps({ className, current: controlledCurrent, direction, defaultCurrent, status, items, children, }: IStepsProps): import("react/jsx-runtime").JSX.Element;
23
23
  declare namespace Steps {
24
24
  var Step: typeof import("./components/Step").Step;
25
25
  }
@@ -9,10 +9,12 @@ function getStepStatus(index, current, globalStatus) {
9
9
  if (index === current) return globalStatus || "process";
10
10
  return "wait";
11
11
  }
12
- function Steps({ className, current = 0, direction = "horizontal", status, items, children }) {
12
+ function Steps({ className, current: controlledCurrent, direction = "horizontal", defaultCurrent = 0, status, items, children }) {
13
+ const current = controlledCurrent ?? defaultCurrent;
13
14
  const resolvedItems = items || React.Children.toArray(children).filter(React.isValidElement).map((child) => ({
14
15
  title: child.props.title,
15
16
  description: child.props.description,
17
+ disabled: child.props.disabled,
16
18
  status: child.props.status,
17
19
  icon: child.props.icon
18
20
  }));
@@ -22,7 +24,7 @@ function Steps({ className, current = 0, direction = "horizontal", status, items
22
24
  const stepStatus = item.status || getStepStatus(index, current, status);
23
25
  const isLast = index === resolvedItems.length - 1;
24
26
  return /* @__PURE__ */ jsx("div", {
25
- className: cn("ald-steps-item tw-flex", direction === "horizontal" ? "tw-flex-1 tw-flex-col tw-items-center tw-text-center" : "tw-flex-row tw-gap-3 tw-py-2", `ald-steps-item-${stepStatus}`),
27
+ className: cn("ald-steps-item tw-flex", direction === "horizontal" ? "tw-flex-1 tw-flex-col tw-items-center tw-text-center" : "tw-flex-row tw-gap-3 tw-py-2", `ald-steps-item-${stepStatus}`, item.disabled && "ald-steps-item-disabled tw-pointer-events-none tw-opacity-50"),
26
28
  children: direction === "horizontal" ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs("div", {
27
29
  className: "tw-flex tw-w-full tw-items-center",
28
30
  children: [
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../../src/Steps/index.tsx"],"sourcesContent":["import React, { ReactElement, ReactNode } from 'react';\nimport { cn } from '../lib/utils';\nimport { ProcessIcon } from './components/ProcessIcon';\nimport { IStepProps, Step } from './components/Step';\n\nexport type { IStepProps };\nexport type TStatus = 'wait' | 'process' | 'finish' | 'error';\n\nexport interface IStepItem {\n description?: ReactNode;\n disabled?: boolean;\n icon?: ReactNode;\n status?: TStatus;\n subTitle?: ReactNode;\n title: ReactNode;\n}\n\nexport interface IStepsProps {\n className?: string;\n current?: number;\n direction?: 'horizontal' | 'vertical';\n defaultCurrent?: number;\n status?: TStatus;\n items?: IStepItem[];\n children?: ReactElement<IStepProps>[] | ReactElement<IStepProps>;\n}\n\nfunction getStepStatus(\n index: number,\n current: number,\n globalStatus?: TStatus,\n): TStatus {\n if (index < current) return 'finish';\n if (index === current) return globalStatus || 'process';\n return 'wait';\n}\n\nfunction Steps({\n className,\n current = 0,\n direction = 'horizontal',\n status,\n items,\n children,\n}: IStepsProps) {\n // Support children-based API: convert children to items\n const resolvedItems: IStepItem[] =\n items ||\n React.Children.toArray(children)\n .filter(React.isValidElement)\n .map((child: any) => ({\n title: child.props.title,\n description: child.props.description,\n status: child.props.status,\n icon: child.props.icon,\n }));\n\n return (\n <div\n className={cn(\n 'ald-steps tw-flex',\n direction === 'vertical' ? 'tw-flex-col' : 'tw-flex-row tw-items-start',\n className,\n )}\n >\n {resolvedItems.map((item, index) => {\n const stepStatus = item.status || getStepStatus(index, current, status);\n const isLast = index === resolvedItems.length - 1;\n\n return (\n <div\n key={index}\n className={cn(\n 'ald-steps-item tw-flex',\n direction === 'horizontal'\n ? 'tw-flex-1 tw-flex-col tw-items-center tw-text-center'\n : 'tw-flex-row tw-gap-3 tw-py-2',\n `ald-steps-item-${stepStatus}`,\n )}\n >\n {direction === 'horizontal' ? (\n <>\n <div className=\"tw-flex tw-w-full tw-items-center\">\n {index > 0 && (\n <div\n className={cn(\n 'tw-flex-1',\n index <= current\n ? 'tw-bg-[var(--alias-colors-border-selected)]'\n : 'tw-bg-[var(--alias-colors-border-default)]',\n )}\n style={{ height: 1.5 }}\n />\n )}\n <div className=\"ald-steps-item-icon tw-shrink-0\">\n {item.icon || <ProcessIcon type={stepStatus} />}\n </div>\n {!isLast && (\n <div\n className={cn(\n 'tw-flex-1',\n index < current\n ? 'tw-bg-[var(--alias-colors-border-selected)]'\n : 'tw-bg-[var(--alias-colors-border-default)]',\n )}\n style={{ height: 1.5 }}\n />\n )}\n </div>\n {/* antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器 */}\n <div className=\"ald-steps-item-content ant-steps-item-content tw-mt-2 tw-flex tw-flex-col tw-items-center\">\n <div\n className={cn(\n // antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器\n 'ald-steps-item-title ant-steps-item-title tw-text-sm tw-font-medium tw-leading-5',\n stepStatus === 'finish' &&\n 'tw-text-[var(--alias-colors-text-subtlest)]',\n stepStatus === 'process' &&\n 'tw-text-[var(--alias-colors-text-selected)]',\n stepStatus === 'wait' &&\n 'tw-text-[var(--alias-colors-text-default)]',\n stepStatus === 'error' &&\n 'tw-text-[var(--alias-colors-text-danger)]',\n )}\n >\n {item.title}\n </div>\n {item.description && (\n <div\n className={cn(\n // antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器\n 'ald-steps-item-description ant-steps-item-description tw-mt-1 tw-max-w-[264px] tw-break-all tw-text-xs tw-leading-4',\n stepStatus === 'finish' || stepStatus === 'error'\n ? 'tw-text-[var(--alias-colors-text-subtlest)]'\n : 'tw-text-[var(--alias-colors-text-subtle)]',\n )}\n >\n {item.description}\n </div>\n )}\n </div>\n </>\n ) : (\n <>\n <div className=\"tw-relative tw-flex tw-flex-col tw-items-center\">\n <div className=\"ald-steps-item-icon tw-shrink-0\">\n {item.icon || <ProcessIcon type={stepStatus} />}\n </div>\n {!isLast && (\n <div\n className={cn(\n 'tw-mt-1 tw-flex-1',\n index < current\n ? 'tw-bg-[var(--alias-colors-border-selected)]'\n : 'tw-bg-[var(--alias-colors-border-default)]',\n )}\n style={{ width: 1.5, minHeight: 24 }}\n />\n )}\n </div>\n {/* antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器 */}\n <div className=\"ald-steps-item-content ant-steps-item-content\">\n <div\n className={cn(\n // antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器\n 'ald-steps-item-title ant-steps-item-title tw-text-sm tw-font-medium tw-leading-5',\n stepStatus === 'finish' &&\n 'tw-text-[var(--alias-colors-text-subtlest)]',\n stepStatus === 'process' &&\n 'tw-text-[var(--alias-colors-text-selected)]',\n stepStatus === 'wait' &&\n 'tw-text-[var(--alias-colors-text-default)]',\n stepStatus === 'error' &&\n 'tw-text-[var(--alias-colors-text-danger)]',\n )}\n >\n {item.title}\n </div>\n {item.description && (\n <div\n className={cn(\n // antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器\n 'ald-steps-item-description ant-steps-item-description tw-mt-1 tw-max-w-[264px] tw-break-all tw-text-xs tw-leading-4 tw-text-[var(--content-secondary)]',\n )}\n >\n {item.description}\n </div>\n )}\n </div>\n </>\n )}\n </div>\n );\n })}\n </div>\n );\n}\n\nSteps.Step = Step;\n\nexport default Steps;\n"],"mappings":";;;;;;AA2BA,SAAS,cACP,OACA,SACA,cACS;AACT,KAAI,QAAQ,QAAS,QAAO;AAC5B,KAAI,UAAU,QAAS,QAAO,gBAAgB;AAC9C,QAAO;;AAGT,SAAS,MAAM,EACb,WACA,UAAU,GACV,YAAY,cACZ,QACA,OACA,YACc;CAEd,MAAM,gBACJ,SACA,MAAM,SAAS,QAAQ,SAAS,CAC7B,OAAO,MAAM,eAAe,CAC5B,KAAK,WAAgB;EACpB,OAAO,MAAM,MAAM;EACnB,aAAa,MAAM,MAAM;EACzB,QAAQ,MAAM,MAAM;EACpB,MAAM,MAAM,MAAM;EACnB,EAAE;AAEP,QACE,oBAAC,OAAD;EACE,WAAW,GACT,qBACA,cAAc,aAAa,gBAAgB,8BAC3C,UACD;YAEA,cAAc,KAAK,MAAM,UAAU;GAClC,MAAM,aAAa,KAAK,UAAU,cAAc,OAAO,SAAS,OAAO;GACvE,MAAM,SAAS,UAAU,cAAc,SAAS;AAEhD,UACE,oBAAC,OAAD;IAEE,WAAW,GACT,0BACA,cAAc,eACV,yDACA,gCACJ,kBAAkB,aACnB;cAEA,cAAc,eACb,qBAAA,UAAA,EAAA,UAAA,CACE,qBAAC,OAAD;KAAK,WAAU;eAAf;MACG,QAAQ,KACP,oBAAC,OAAD;OACE,WAAW,GACT,aACA,SAAS,UACL,gDACA,6CACL;OACD,OAAO,EAAE,QAAQ,KAAK;OACtB,CAAA;MAEJ,oBAAC,OAAD;OAAK,WAAU;iBACZ,KAAK,QAAQ,oBAAC,aAAD,EAAa,MAAM,YAAc,CAAA;OAC3C,CAAA;MACL,CAAC,UACA,oBAAC,OAAD;OACE,WAAW,GACT,aACA,QAAQ,UACJ,gDACA,6CACL;OACD,OAAO,EAAE,QAAQ,KAAK;OACtB,CAAA;MAEA;QAEN,qBAAC,OAAD;KAAK,WAAU;eAAf,CACE,oBAAC,OAAD;MACE,WAAW,GAET,oFACA,eAAe,YACb,+CACF,eAAe,aACb,+CACF,eAAe,UACb,8CACF,eAAe,WACb,4CACH;gBAEA,KAAK;MACF,CAAA,EACL,KAAK,eACJ,oBAAC,OAAD;MACE,WAAW,GAET,uHACA,eAAe,YAAY,eAAe,UACtC,gDACA,4CACL;gBAEA,KAAK;MACF,CAAA,CAEJ;OACL,EAAA,CAAA,GAEH,qBAAA,UAAA,EAAA,UAAA,CACE,qBAAC,OAAD;KAAK,WAAU;eAAf,CACE,oBAAC,OAAD;MAAK,WAAU;gBACZ,KAAK,QAAQ,oBAAC,aAAD,EAAa,MAAM,YAAc,CAAA;MAC3C,CAAA,EACL,CAAC,UACA,oBAAC,OAAD;MACE,WAAW,GACT,qBACA,QAAQ,UACJ,gDACA,6CACL;MACD,OAAO;OAAE,OAAO;OAAK,WAAW;OAAI;MACpC,CAAA,CAEA;QAEN,qBAAC,OAAD;KAAK,WAAU;eAAf,CACE,oBAAC,OAAD;MACE,WAAW,GAET,oFACA,eAAe,YACb,+CACF,eAAe,aACb,+CACF,eAAe,UACb,8CACF,eAAe,WACb,4CACH;gBAEA,KAAK;MACF,CAAA,EACL,KAAK,eACJ,oBAAC,OAAD;MACE,WAAW,GAET,yJACD;gBAEA,KAAK;MACF,CAAA,CAEJ;OACL,EAAA,CAAA;IAED,EAxHC,MAwHD;IAER;EACE,CAAA;;AAIV,MAAM,OAAO"}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../src/Steps/index.tsx"],"sourcesContent":["import React, { ReactElement, ReactNode } from 'react';\nimport { cn } from '../lib/utils';\nimport { ProcessIcon } from './components/ProcessIcon';\nimport { IStepProps, Step } from './components/Step';\n\nexport type { IStepProps };\nexport type TStatus = 'wait' | 'process' | 'finish' | 'error';\n\nexport interface IStepItem {\n description?: ReactNode;\n disabled?: boolean;\n icon?: ReactNode;\n status?: TStatus;\n subTitle?: ReactNode;\n title: ReactNode;\n}\n\nexport interface IStepsProps {\n className?: string;\n current?: number;\n direction?: 'horizontal' | 'vertical';\n defaultCurrent?: number;\n status?: TStatus;\n items?: IStepItem[];\n children?: ReactElement<IStepProps>[] | ReactElement<IStepProps>;\n}\n\nfunction getStepStatus(\n index: number,\n current: number,\n globalStatus?: TStatus,\n): TStatus {\n if (index < current) return 'finish';\n if (index === current) return globalStatus || 'process';\n return 'wait';\n}\n\nfunction Steps({\n className,\n current: controlledCurrent,\n direction = 'horizontal',\n defaultCurrent = 0,\n status,\n items,\n children,\n}: IStepsProps) {\n const current = controlledCurrent ?? defaultCurrent;\n // Support children-based API: convert children to items\n const resolvedItems: IStepItem[] =\n items ||\n React.Children.toArray(children)\n .filter(React.isValidElement)\n .map((child: any) => ({\n title: child.props.title,\n description: child.props.description,\n disabled: child.props.disabled,\n status: child.props.status,\n icon: child.props.icon,\n }));\n\n return (\n <div\n className={cn(\n 'ald-steps tw-flex',\n direction === 'vertical' ? 'tw-flex-col' : 'tw-flex-row tw-items-start',\n className,\n )}\n >\n {resolvedItems.map((item, index) => {\n const stepStatus = item.status || getStepStatus(index, current, status);\n const isLast = index === resolvedItems.length - 1;\n\n return (\n <div\n key={index}\n className={cn(\n 'ald-steps-item tw-flex',\n direction === 'horizontal'\n ? 'tw-flex-1 tw-flex-col tw-items-center tw-text-center'\n : 'tw-flex-row tw-gap-3 tw-py-2',\n `ald-steps-item-${stepStatus}`,\n item.disabled &&\n 'ald-steps-item-disabled tw-pointer-events-none tw-opacity-50',\n )}\n >\n {direction === 'horizontal' ? (\n <>\n <div className=\"tw-flex tw-w-full tw-items-center\">\n {index > 0 && (\n <div\n className={cn(\n 'tw-flex-1',\n index <= current\n ? 'tw-bg-[var(--alias-colors-border-selected)]'\n : 'tw-bg-[var(--alias-colors-border-default)]',\n )}\n style={{ height: 1.5 }}\n />\n )}\n <div className=\"ald-steps-item-icon tw-shrink-0\">\n {item.icon || <ProcessIcon type={stepStatus} />}\n </div>\n {!isLast && (\n <div\n className={cn(\n 'tw-flex-1',\n index < current\n ? 'tw-bg-[var(--alias-colors-border-selected)]'\n : 'tw-bg-[var(--alias-colors-border-default)]',\n )}\n style={{ height: 1.5 }}\n />\n )}\n </div>\n {/* antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器 */}\n <div className=\"ald-steps-item-content ant-steps-item-content tw-mt-2 tw-flex tw-flex-col tw-items-center\">\n <div\n className={cn(\n // antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器\n 'ald-steps-item-title ant-steps-item-title tw-text-sm tw-font-medium tw-leading-5',\n stepStatus === 'finish' &&\n 'tw-text-[var(--alias-colors-text-subtlest)]',\n stepStatus === 'process' &&\n 'tw-text-[var(--alias-colors-text-selected)]',\n stepStatus === 'wait' &&\n 'tw-text-[var(--alias-colors-text-default)]',\n stepStatus === 'error' &&\n 'tw-text-[var(--alias-colors-text-danger)]',\n )}\n >\n {item.title}\n </div>\n {item.description && (\n <div\n className={cn(\n // antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器\n 'ald-steps-item-description ant-steps-item-description tw-mt-1 tw-max-w-[264px] tw-break-all tw-text-xs tw-leading-4',\n stepStatus === 'finish' || stepStatus === 'error'\n ? 'tw-text-[var(--alias-colors-text-subtlest)]'\n : 'tw-text-[var(--alias-colors-text-subtle)]',\n )}\n >\n {item.description}\n </div>\n )}\n </div>\n </>\n ) : (\n <>\n <div className=\"tw-relative tw-flex tw-flex-col tw-items-center\">\n <div className=\"ald-steps-item-icon tw-shrink-0\">\n {item.icon || <ProcessIcon type={stepStatus} />}\n </div>\n {!isLast && (\n <div\n className={cn(\n 'tw-mt-1 tw-flex-1',\n index < current\n ? 'tw-bg-[var(--alias-colors-border-selected)]'\n : 'tw-bg-[var(--alias-colors-border-default)]',\n )}\n style={{ width: 1.5, minHeight: 24 }}\n />\n )}\n </div>\n {/* antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器 */}\n <div className=\"ald-steps-item-content ant-steps-item-content\">\n <div\n className={cn(\n // antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器\n 'ald-steps-item-title ant-steps-item-title tw-text-sm tw-font-medium tw-leading-5',\n stepStatus === 'finish' &&\n 'tw-text-[var(--alias-colors-text-subtlest)]',\n stepStatus === 'process' &&\n 'tw-text-[var(--alias-colors-text-selected)]',\n stepStatus === 'wait' &&\n 'tw-text-[var(--alias-colors-text-default)]',\n stepStatus === 'error' &&\n 'tw-text-[var(--alias-colors-text-danger)]',\n )}\n >\n {item.title}\n </div>\n {item.description && (\n <div\n className={cn(\n // antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器\n 'ald-steps-item-description ant-steps-item-description tw-mt-1 tw-max-w-[264px] tw-break-all tw-text-xs tw-leading-4 tw-text-[var(--content-secondary)]',\n )}\n >\n {item.description}\n </div>\n )}\n </div>\n </>\n )}\n </div>\n );\n })}\n </div>\n );\n}\n\nSteps.Step = Step;\n\nexport default Steps;\n"],"mappings":";;;;;;AA2BA,SAAS,cACP,OACA,SACA,cACS;AACT,KAAI,QAAQ,QAAS,QAAO;AAC5B,KAAI,UAAU,QAAS,QAAO,gBAAgB;AAC9C,QAAO;;AAGT,SAAS,MAAM,EACb,WACA,SAAS,mBACT,YAAY,cACZ,iBAAiB,GACjB,QACA,OACA,YACc;CACd,MAAM,UAAU,qBAAqB;CAErC,MAAM,gBACJ,SACA,MAAM,SAAS,QAAQ,SAAS,CAC7B,OAAO,MAAM,eAAe,CAC5B,KAAK,WAAgB;EACpB,OAAO,MAAM,MAAM;EACnB,aAAa,MAAM,MAAM;EACzB,UAAU,MAAM,MAAM;EACtB,QAAQ,MAAM,MAAM;EACpB,MAAM,MAAM,MAAM;EACnB,EAAE;AAEP,QACE,oBAAC,OAAD;EACE,WAAW,GACT,qBACA,cAAc,aAAa,gBAAgB,8BAC3C,UACD;YAEA,cAAc,KAAK,MAAM,UAAU;GAClC,MAAM,aAAa,KAAK,UAAU,cAAc,OAAO,SAAS,OAAO;GACvE,MAAM,SAAS,UAAU,cAAc,SAAS;AAEhD,UACE,oBAAC,OAAD;IAEE,WAAW,GACT,0BACA,cAAc,eACV,yDACA,gCACJ,kBAAkB,cAClB,KAAK,YACH,+DACH;cAEA,cAAc,eACb,qBAAA,UAAA,EAAA,UAAA,CACE,qBAAC,OAAD;KAAK,WAAU;eAAf;MACG,QAAQ,KACP,oBAAC,OAAD;OACE,WAAW,GACT,aACA,SAAS,UACL,gDACA,6CACL;OACD,OAAO,EAAE,QAAQ,KAAK;OACtB,CAAA;MAEJ,oBAAC,OAAD;OAAK,WAAU;iBACZ,KAAK,QAAQ,oBAAC,aAAD,EAAa,MAAM,YAAc,CAAA;OAC3C,CAAA;MACL,CAAC,UACA,oBAAC,OAAD;OACE,WAAW,GACT,aACA,QAAQ,UACJ,gDACA,6CACL;OACD,OAAO,EAAE,QAAQ,KAAK;OACtB,CAAA;MAEA;QAEN,qBAAC,OAAD;KAAK,WAAU;eAAf,CACE,oBAAC,OAAD;MACE,WAAW,GAET,oFACA,eAAe,YACb,+CACF,eAAe,aACb,+CACF,eAAe,UACb,8CACF,eAAe,WACb,4CACH;gBAEA,KAAK;MACF,CAAA,EACL,KAAK,eACJ,oBAAC,OAAD;MACE,WAAW,GAET,uHACA,eAAe,YAAY,eAAe,UACtC,gDACA,4CACL;gBAEA,KAAK;MACF,CAAA,CAEJ;OACL,EAAA,CAAA,GAEH,qBAAA,UAAA,EAAA,UAAA,CACE,qBAAC,OAAD;KAAK,WAAU;eAAf,CACE,oBAAC,OAAD;MAAK,WAAU;gBACZ,KAAK,QAAQ,oBAAC,aAAD,EAAa,MAAM,YAAc,CAAA;MAC3C,CAAA,EACL,CAAC,UACA,oBAAC,OAAD;MACE,WAAW,GACT,qBACA,QAAQ,UACJ,gDACA,6CACL;MACD,OAAO;OAAE,OAAO;OAAK,WAAW;OAAI;MACpC,CAAA,CAEA;QAEN,qBAAC,OAAD;KAAK,WAAU;eAAf,CACE,oBAAC,OAAD;MACE,WAAW,GAET,oFACA,eAAe,YACb,+CACF,eAAe,aACb,+CACF,eAAe,UACb,8CACF,eAAe,WACb,4CACH;gBAEA,KAAK;MACF,CAAA,EACL,KAAK,eACJ,oBAAC,OAAD;MACE,WAAW,GAET,yJACD;gBAEA,KAAK;MACF,CAAA,CAEJ;OACL,EAAA,CAAA;IAED,EA1HC,MA0HD;IAER;EACE,CAAA;;AAIV,MAAM,OAAO"}
@@ -76,13 +76,14 @@ function ClickTooltip({ children, title, open, onOpenChange, placement = "top",
76
76
  });
77
77
  }
78
78
  function Tooltip(props) {
79
- const { children, title, open, onOpenChange, placement = "top", mouseEnterDelay = 0, mouseLeaveDelay = 0, overlayClassName, trigger, getPopupContainer, getTooltipContainer, zIndex } = props;
79
+ const { children, title, content, open, onOpenChange, placement = "top", mouseEnterDelay = 0, mouseLeaveDelay = 0, overlayClassName, trigger, getPopupContainer, getTooltipContainer, zIndex } = props;
80
80
  const { triggerRef, container } = usePortalContainer(getPopupContainer, getTooltipContainer);
81
81
  const resolvedZIndex = useFloatingPopupZIndex(zIndex);
82
- if (!title && title !== 0) return /* @__PURE__ */ jsx(Fragment, { children });
82
+ const mergedTitle = title ?? content;
83
+ if (!mergedTitle && mergedTitle !== 0) return /* @__PURE__ */ jsx(Fragment, { children });
83
84
  if (isTriggerDisabled(trigger)) return /* @__PURE__ */ jsx(Fragment, { children });
84
85
  if (isClickTrigger(trigger)) return /* @__PURE__ */ jsx(ClickTooltip, {
85
- title,
86
+ title: mergedTitle,
86
87
  open,
87
88
  onOpenChange,
88
89
  placement,
@@ -114,7 +115,7 @@ function Tooltip(props) {
114
115
  sideOffset: 4,
115
116
  className: cn(contentClasses, overlayClassName),
116
117
  style: { zIndex: resolvedZIndex },
117
- children: [title, /* @__PURE__ */ jsx(TooltipPrimitive.Arrow, { className: "tw-fill-[var(--alias-colors-bg-skeleton-inverse-subtler)]" })]
118
+ children: [mergedTitle, /* @__PURE__ */ jsx(TooltipPrimitive.Arrow, { className: "tw-fill-[var(--alias-colors-bg-skeleton-inverse-subtler)]" })]
118
119
  })
119
120
  })]
120
121
  })
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../../src/Tooltip/index.tsx"],"sourcesContent":["import * as PopoverPrimitive from '@radix-ui/react-popover';\nimport * as TooltipPrimitive from '@radix-ui/react-tooltip';\nimport React from 'react';\nimport { useFloatingPopupZIndex } from '../_utils/floatingLayer';\nimport { cn } from '../lib/utils';\n\nexport type ActionType = 'hover' | 'focus' | 'click' | 'contextMenu';\n\nexport interface ITooltipProps {\n title?: React.ReactNode;\n /** Alias for title, for Popover-style usage */\n content?: React.ReactNode;\n destroyTooltipOnHide?: boolean;\n getPopupContainer?: (triggerNode: HTMLElement) => HTMLElement;\n mouseEnterDelay?: number;\n mouseLeaveDelay?: number;\n placement?:\n | 'top'\n | 'left'\n | 'right'\n | 'bottom'\n | 'topLeft'\n | 'topRight'\n | 'bottomLeft'\n | 'bottomRight'\n | 'leftTop'\n | 'leftBottom'\n | 'rightTop'\n | 'rightBottom';\n trigger?: ActionType | ActionType[];\n zIndex?: number;\n open?: boolean;\n onOpenChange?: (open: boolean) => void;\n overlayClassName?: string;\n /** Custom class for the root element */\n rootClassName?: string;\n getTooltipContainer?: (node: HTMLElement) => HTMLElement;\n children?: React.ReactNode;\n className?: string;\n style?: React.CSSProperties;\n}\n\nconst sideMap: Record<string, 'top' | 'bottom' | 'left' | 'right'> = {\n top: 'top',\n bottom: 'bottom',\n left: 'left',\n right: 'right',\n topLeft: 'top',\n topRight: 'top',\n bottomLeft: 'bottom',\n bottomRight: 'bottom',\n leftTop: 'left',\n leftBottom: 'left',\n rightTop: 'right',\n rightBottom: 'right',\n};\n\nconst alignMap: Record<string, 'start' | 'end' | 'center'> = {\n topLeft: 'start',\n topRight: 'end',\n bottomLeft: 'start',\n bottomRight: 'end',\n leftTop: 'start',\n leftBottom: 'end',\n rightTop: 'start',\n rightBottom: 'end',\n};\n\nfunction isClickTrigger(trigger?: ActionType | ActionType[]): boolean {\n if (!trigger) return false;\n if (Array.isArray(trigger)) return trigger.includes('click');\n return trigger === 'click';\n}\n\nfunction isTriggerDisabled(trigger?: ActionType | ActionType[]): boolean {\n return Array.isArray(trigger) && trigger.length === 0;\n}\n\nconst contentClasses =\n 'ald-tooltip-overlay tw-z-50 tw-min-h-[28px] tw-rounded-r-50 tw-px-2 tw-py-1.5 tw-text-xs tw-leading-4 tw-bg-[var(--alias-colors-bg-skeleton-inverse-subtler)] tw-text-[var(--alias-colors-text-inverse-strong)] tw-animate-in tw-fade-in-0 tw-zoom-in-95';\n\nfunction usePortalContainer(\n getPopupContainer?: (node: HTMLElement) => HTMLElement,\n getTooltipContainer?: (node: HTMLElement) => HTMLElement,\n) {\n const triggerRef = React.useRef<HTMLElement | null>(null);\n const [container, setContainer] = React.useState<HTMLElement | undefined>(\n undefined,\n );\n\n React.useEffect(() => {\n const getter = getPopupContainer || getTooltipContainer;\n if (getter && triggerRef.current) {\n setContainer(getter(triggerRef.current));\n }\n }, [getPopupContainer, getTooltipContainer]);\n\n return { triggerRef, container };\n}\n\nfunction ClickTooltip({\n children,\n title,\n open,\n onOpenChange,\n placement = 'top',\n overlayClassName,\n zIndex,\n container,\n triggerRef,\n}: Pick<\n ITooltipProps,\n | 'children'\n | 'title'\n | 'open'\n | 'onOpenChange'\n | 'placement'\n | 'overlayClassName'\n | 'zIndex'\n> & {\n container?: HTMLElement;\n triggerRef: React.RefObject<HTMLElement | null>;\n}) {\n const side = sideMap[placement] || 'top';\n const align = alignMap[placement] || 'center';\n\n return (\n <PopoverPrimitive.Root open={open} onOpenChange={onOpenChange}>\n <PopoverPrimitive.Trigger asChild>\n {React.isValidElement(children) ? (\n React.cloneElement(children as React.ReactElement, {\n ref: triggerRef,\n })\n ) : (\n <span ref={triggerRef as React.RefObject<HTMLSpanElement>}>\n {children}\n </span>\n )}\n </PopoverPrimitive.Trigger>\n <PopoverPrimitive.Portal container={container}>\n <PopoverPrimitive.Content\n side={side}\n align={align}\n sideOffset={4}\n className={cn(contentClasses, overlayClassName)}\n style={{ zIndex }}\n >\n {title}\n <PopoverPrimitive.Arrow className=\"tw-fill-[var(--alias-colors-bg-skeleton-inverse-subtler)]\" />\n </PopoverPrimitive.Content>\n </PopoverPrimitive.Portal>\n </PopoverPrimitive.Root>\n );\n}\n\nexport default function Tooltip(props: ITooltipProps) {\n const {\n children,\n title,\n open,\n onOpenChange,\n placement = 'top',\n mouseEnterDelay = 0,\n mouseLeaveDelay = 0,\n overlayClassName,\n trigger,\n getPopupContainer,\n getTooltipContainer,\n zIndex,\n } = props;\n\n const { triggerRef, container } = usePortalContainer(\n getPopupContainer,\n getTooltipContainer,\n );\n const resolvedZIndex = useFloatingPopupZIndex(zIndex);\n\n if (!title && title !== 0) {\n return <>{children}</>;\n }\n\n if (isTriggerDisabled(trigger)) {\n return <>{children}</>;\n }\n\n if (isClickTrigger(trigger)) {\n return (\n <ClickTooltip\n title={title}\n open={open}\n onOpenChange={onOpenChange}\n placement={placement}\n overlayClassName={overlayClassName}\n zIndex={resolvedZIndex}\n container={container}\n triggerRef={triggerRef}\n >\n {children}\n </ClickTooltip>\n );\n }\n\n const side = sideMap[placement] || 'top';\n const align = alignMap[placement] || 'center';\n\n return (\n <TooltipPrimitive.Provider\n delayDuration={mouseEnterDelay * 1000}\n skipDelayDuration={mouseLeaveDelay * 1000}\n >\n <TooltipPrimitive.Root open={open} onOpenChange={onOpenChange}>\n <TooltipPrimitive.Trigger asChild>\n {React.isValidElement(children) ? (\n React.cloneElement(children as React.ReactElement, {\n ref: triggerRef,\n })\n ) : (\n <span ref={triggerRef as React.RefObject<HTMLSpanElement>}>\n {children}\n </span>\n )}\n </TooltipPrimitive.Trigger>\n <TooltipPrimitive.Portal container={container}>\n <TooltipPrimitive.Content\n side={side}\n align={align}\n sideOffset={4}\n className={cn(contentClasses, overlayClassName)}\n style={{ zIndex: resolvedZIndex }}\n >\n {title}\n <TooltipPrimitive.Arrow className=\"tw-fill-[var(--alias-colors-bg-skeleton-inverse-subtler)]\" />\n </TooltipPrimitive.Content>\n </TooltipPrimitive.Portal>\n </TooltipPrimitive.Root>\n </TooltipPrimitive.Provider>\n );\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../src/Tooltip/index.tsx"],"sourcesContent":["import * as PopoverPrimitive from '@radix-ui/react-popover';\nimport * as TooltipPrimitive from '@radix-ui/react-tooltip';\nimport React from 'react';\nimport { useFloatingPopupZIndex } from '../_utils/floatingLayer';\nimport { cn } from '../lib/utils';\n\nexport type ActionType = 'hover' | 'focus' | 'click' | 'contextMenu';\n\nexport interface ITooltipProps {\n title?: React.ReactNode;\n /** Alias for title, for Popover-style usage */\n content?: React.ReactNode;\n destroyTooltipOnHide?: boolean;\n getPopupContainer?: (triggerNode: HTMLElement) => HTMLElement;\n mouseEnterDelay?: number;\n mouseLeaveDelay?: number;\n placement?:\n | 'top'\n | 'left'\n | 'right'\n | 'bottom'\n | 'topLeft'\n | 'topRight'\n | 'bottomLeft'\n | 'bottomRight'\n | 'leftTop'\n | 'leftBottom'\n | 'rightTop'\n | 'rightBottom';\n trigger?: ActionType | ActionType[];\n zIndex?: number;\n open?: boolean;\n onOpenChange?: (open: boolean) => void;\n overlayClassName?: string;\n /** Custom class for the root element */\n rootClassName?: string;\n getTooltipContainer?: (node: HTMLElement) => HTMLElement;\n children?: React.ReactNode;\n className?: string;\n style?: React.CSSProperties;\n}\n\nconst sideMap: Record<string, 'top' | 'bottom' | 'left' | 'right'> = {\n top: 'top',\n bottom: 'bottom',\n left: 'left',\n right: 'right',\n topLeft: 'top',\n topRight: 'top',\n bottomLeft: 'bottom',\n bottomRight: 'bottom',\n leftTop: 'left',\n leftBottom: 'left',\n rightTop: 'right',\n rightBottom: 'right',\n};\n\nconst alignMap: Record<string, 'start' | 'end' | 'center'> = {\n topLeft: 'start',\n topRight: 'end',\n bottomLeft: 'start',\n bottomRight: 'end',\n leftTop: 'start',\n leftBottom: 'end',\n rightTop: 'start',\n rightBottom: 'end',\n};\n\nfunction isClickTrigger(trigger?: ActionType | ActionType[]): boolean {\n if (!trigger) return false;\n if (Array.isArray(trigger)) return trigger.includes('click');\n return trigger === 'click';\n}\n\nfunction isTriggerDisabled(trigger?: ActionType | ActionType[]): boolean {\n return Array.isArray(trigger) && trigger.length === 0;\n}\n\nconst contentClasses =\n 'ald-tooltip-overlay tw-z-50 tw-min-h-[28px] tw-rounded-r-50 tw-px-2 tw-py-1.5 tw-text-xs tw-leading-4 tw-bg-[var(--alias-colors-bg-skeleton-inverse-subtler)] tw-text-[var(--alias-colors-text-inverse-strong)] tw-animate-in tw-fade-in-0 tw-zoom-in-95';\n\nfunction usePortalContainer(\n getPopupContainer?: (node: HTMLElement) => HTMLElement,\n getTooltipContainer?: (node: HTMLElement) => HTMLElement,\n) {\n const triggerRef = React.useRef<HTMLElement | null>(null);\n const [container, setContainer] = React.useState<HTMLElement | undefined>(\n undefined,\n );\n\n React.useEffect(() => {\n const getter = getPopupContainer || getTooltipContainer;\n if (getter && triggerRef.current) {\n setContainer(getter(triggerRef.current));\n }\n }, [getPopupContainer, getTooltipContainer]);\n\n return { triggerRef, container };\n}\n\nfunction ClickTooltip({\n children,\n title,\n open,\n onOpenChange,\n placement = 'top',\n overlayClassName,\n zIndex,\n container,\n triggerRef,\n}: Pick<\n ITooltipProps,\n | 'children'\n | 'title'\n | 'open'\n | 'onOpenChange'\n | 'placement'\n | 'overlayClassName'\n | 'zIndex'\n> & {\n container?: HTMLElement;\n triggerRef: React.RefObject<HTMLElement | null>;\n}) {\n const side = sideMap[placement] || 'top';\n const align = alignMap[placement] || 'center';\n\n return (\n <PopoverPrimitive.Root open={open} onOpenChange={onOpenChange}>\n <PopoverPrimitive.Trigger asChild>\n {React.isValidElement(children) ? (\n React.cloneElement(children as React.ReactElement, {\n ref: triggerRef,\n })\n ) : (\n <span ref={triggerRef as React.RefObject<HTMLSpanElement>}>\n {children}\n </span>\n )}\n </PopoverPrimitive.Trigger>\n <PopoverPrimitive.Portal container={container}>\n <PopoverPrimitive.Content\n side={side}\n align={align}\n sideOffset={4}\n className={cn(contentClasses, overlayClassName)}\n style={{ zIndex }}\n >\n {title}\n <PopoverPrimitive.Arrow className=\"tw-fill-[var(--alias-colors-bg-skeleton-inverse-subtler)]\" />\n </PopoverPrimitive.Content>\n </PopoverPrimitive.Portal>\n </PopoverPrimitive.Root>\n );\n}\n\nexport default function Tooltip(props: ITooltipProps) {\n const {\n children,\n title,\n content,\n open,\n onOpenChange,\n placement = 'top',\n mouseEnterDelay = 0,\n mouseLeaveDelay = 0,\n overlayClassName,\n trigger,\n getPopupContainer,\n getTooltipContainer,\n zIndex,\n } = props;\n\n const { triggerRef, container } = usePortalContainer(\n getPopupContainer,\n getTooltipContainer,\n );\n const resolvedZIndex = useFloatingPopupZIndex(zIndex);\n const mergedTitle = title ?? content;\n\n if (!mergedTitle && mergedTitle !== 0) {\n return <>{children}</>;\n }\n\n if (isTriggerDisabled(trigger)) {\n return <>{children}</>;\n }\n\n if (isClickTrigger(trigger)) {\n return (\n <ClickTooltip\n title={mergedTitle}\n open={open}\n onOpenChange={onOpenChange}\n placement={placement}\n overlayClassName={overlayClassName}\n zIndex={resolvedZIndex}\n container={container}\n triggerRef={triggerRef}\n >\n {children}\n </ClickTooltip>\n );\n }\n\n const side = sideMap[placement] || 'top';\n const align = alignMap[placement] || 'center';\n\n return (\n <TooltipPrimitive.Provider\n delayDuration={mouseEnterDelay * 1000}\n skipDelayDuration={mouseLeaveDelay * 1000}\n >\n <TooltipPrimitive.Root open={open} onOpenChange={onOpenChange}>\n <TooltipPrimitive.Trigger asChild>\n {React.isValidElement(children) ? (\n React.cloneElement(children as React.ReactElement, {\n ref: triggerRef,\n })\n ) : (\n <span ref={triggerRef as React.RefObject<HTMLSpanElement>}>\n {children}\n </span>\n )}\n </TooltipPrimitive.Trigger>\n <TooltipPrimitive.Portal container={container}>\n <TooltipPrimitive.Content\n side={side}\n align={align}\n sideOffset={4}\n className={cn(contentClasses, overlayClassName)}\n style={{ zIndex: resolvedZIndex }}\n >\n {mergedTitle}\n <TooltipPrimitive.Arrow className=\"tw-fill-[var(--alias-colors-bg-skeleton-inverse-subtler)]\" />\n </TooltipPrimitive.Content>\n </TooltipPrimitive.Portal>\n </TooltipPrimitive.Root>\n </TooltipPrimitive.Provider>\n );\n}\n"],"mappings":"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"}