@aloudata/aloudata-design 3.0.2 → 3.0.4

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.
@@ -36,7 +36,7 @@ function Checkbox(props) {
36
36
  };
37
37
  return /* @__PURE__ */ jsxs("label", {
38
38
  onClick: handleLabelClick,
39
- className: cn("ald-checkbox-wrapper ald-checkbox tw-inline-flex tw-cursor-pointer tw-items-center tw-gap-1 tw-leading-5", mergedDisabled && "tw-cursor-default", size === "small" && "ald-checkbox-small", !mergedDisabled && "[&:hover_.ald-checkbox-inner]:tw-border-2 [&:hover_.ald-checkbox-inner]:tw-border-[var(--interaction-border-hover)]", !mergedDisabled && checked && "[&:hover_.ald-checkbox-inner]:tw-border-transparent [&:hover_.ald-checkbox-inner]:tw-bg-[var(--interaction-default-hover)]", className),
39
+ className: cn("ald-checkbox-wrapper ald-checkbox tw-inline-flex tw-cursor-pointer tw-items-center tw-gap-2 tw-leading-5", mergedDisabled && "tw-cursor-default", size === "small" && "ald-checkbox-small", !mergedDisabled && "[&:hover_.ald-checkbox-inner]:tw-border-2 [&:hover_.ald-checkbox-inner]:tw-border-[var(--interaction-border-hover)]", !mergedDisabled && checked && "[&:hover_.ald-checkbox-inner]:tw-border-transparent [&:hover_.ald-checkbox-inner]:tw-bg-[var(--interaction-default-hover)]", className),
40
40
  style,
41
41
  children: [/* @__PURE__ */ jsxs("span", {
42
42
  className: cn("ald-checkbox-inner tw-relative tw-box-border tw-flex tw-size-4 tw-min-h-4 tw-min-w-4 tw-items-center tw-justify-center tw-rounded-r-50 tw-border-2 tw-border-solid tw-transition-all tw-duration-200", checked && "ald-checkbox-checked tw-border-transparent tw-bg-[var(--interaction-default-normal)]", mergedDisabled && "tw-opacity-50", !checked && !indeterminate && !alert && "tw-border-[var(--interaction-border-neutral-normal)] tw-bg-[var(--interaction-background-form-field)]", !checked && !indeterminate && alert && "tw-border-[var(--interaction-border-alert)] tw-bg-[var(--interaction-background-form-field)]", indeterminate && !checked && "ald-checkbox-indeterminate tw-border-transparent tw-bg-[var(--interaction-default-normal)]"),
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../../src/Checkbox/index.tsx"],"sourcesContent":["import React, { useContext, useEffect, useRef, useState } from 'react';\nimport DisabledContext from '../ConfigProvider/DisabledContext';\nimport { cn } from '../lib/utils';\nimport {\n CheckboxChangeEvent,\n CheckboxValueType,\n ICheckboxGroupProps,\n ICheckboxProps,\n} from './type';\n\nexport type { CheckboxChangeEvent, CheckboxValueType };\nexport type { CheckboxOptionType } from './type';\nexport type { ICheckboxProps, ICheckboxGroupProps };\n\nfunction Checkbox(props: ICheckboxProps) {\n const {\n className,\n disabled: customDisabled,\n alert,\n bold,\n size,\n checked: controlledChecked,\n defaultChecked,\n indeterminate,\n onChange,\n onClick,\n autoFocus,\n children,\n value,\n name,\n style,\n } = props;\n\n const disabled = useContext(DisabledContext);\n const mergedDisabled = customDisabled ?? disabled;\n\n const isControlled = 'checked' in props;\n const [innerChecked, setInnerChecked] = useState(defaultChecked ?? false);\n const checked = isControlled ? controlledChecked : innerChecked;\n\n const inputRef = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n if (inputRef.current) {\n inputRef.current.indeterminate = !!indeterminate;\n }\n }, [indeterminate]);\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n if (mergedDisabled) return;\n const newChecked = e.target.checked;\n if (!isControlled) {\n setInnerChecked(newChecked);\n }\n onChange?.({\n target: { checked: newChecked, value },\n nativeEvent: e.nativeEvent,\n });\n };\n\n const handleLabelClick = (e: React.MouseEvent) => {\n if (mergedDisabled) return;\n if (onClick) {\n // Table row selection uses onClick — prevent label from also toggling input\n e.preventDefault();\n e.stopPropagation();\n onClick(e);\n }\n };\n\n return (\n <label\n onClick={handleLabelClick}\n className={cn(\n 'ald-checkbox-wrapper ald-checkbox tw-inline-flex tw-cursor-pointer tw-items-center tw-gap-1 tw-leading-5',\n mergedDisabled && 'tw-cursor-default',\n size === 'small' && 'ald-checkbox-small',\n !mergedDisabled &&\n '[&:hover_.ald-checkbox-inner]:tw-border-2 [&:hover_.ald-checkbox-inner]:tw-border-[var(--interaction-border-hover)]',\n !mergedDisabled &&\n checked &&\n '[&:hover_.ald-checkbox-inner]:tw-border-transparent [&:hover_.ald-checkbox-inner]:tw-bg-[var(--interaction-default-hover)]',\n className,\n )}\n style={style}\n >\n <span\n className={cn(\n 'ald-checkbox-inner tw-relative tw-box-border tw-flex tw-size-4 tw-min-h-4 tw-min-w-4 tw-items-center tw-justify-center tw-rounded-r-50 tw-border-2 tw-border-solid tw-transition-all tw-duration-200',\n checked &&\n 'ald-checkbox-checked tw-border-transparent tw-bg-[var(--interaction-default-normal)]',\n mergedDisabled && 'tw-opacity-50',\n !checked &&\n !indeterminate &&\n !alert &&\n 'tw-border-[var(--interaction-border-neutral-normal)] tw-bg-[var(--interaction-background-form-field)]',\n !checked &&\n !indeterminate &&\n alert &&\n 'tw-border-[var(--interaction-border-alert)] tw-bg-[var(--interaction-background-form-field)]',\n indeterminate &&\n !checked &&\n 'ald-checkbox-indeterminate tw-border-transparent tw-bg-[var(--interaction-default-normal)]',\n )}\n >\n <input\n ref={inputRef}\n type=\"checkbox\"\n className=\"tw-absolute tw-inset-0 tw-m-0 tw-cursor-pointer tw-opacity-0 disabled:tw-cursor-default\"\n checked={!!checked}\n disabled={mergedDisabled}\n onChange={handleChange}\n autoFocus={autoFocus}\n name={name}\n value={value as string}\n />\n {(checked || (indeterminate && !checked)) && (\n <span\n className=\"tw-absolute tw-inset-0 tw-bg-center tw-bg-no-repeat\"\n style={{\n backgroundImage:\n indeterminate && !checked\n ? 'url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iMiIgdmlld0JveD0iMCAwIDEwIDIiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGlkPSJWZWN0b3IgMSAoU3Ryb2tlKSIgZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0wLjc1IDFDMC43NSAwLjU4NTc4NiAxLjA4NTc5IDAuMjUgMS41IDAuMjVIOC41QzguOTE0MjEgMC4yNSA5LjI1IDAuNTg1Nzg2IDkuMjUgMUM5LjI1IDEuNDE0MjEgOC45MTQyMSAxLjc1IDguNSAxLjc1SDEuNUMxLjA4NTc5IDEuNzUgMC43NSAxLjQxNDIxIDAuNzUgMVoiIGZpbGw9IndoaXRlIi8+Cjwvc3ZnPgo=\")'\n : 'url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDEwIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGlkPSJJY29uIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTkuNTMwMzMgMC45Njk2N0M5LjgyMzIyIDEuMjYyNTYgOS44MjMyMiAxLjczNzQ0IDkuNTMwMzMgMi4wMzAzM0w0LjUzMDMzIDcuMDMwMzNDNC4yMzc0NCA3LjMyMzIyIDMuNzYyNTYgNy4zMjMyMiAzLjQ2OTY3IDcuMDMwMzNMMC45Njk2NyA0LjUzMDMzQzAuNjc2Nzc3IDQuMjM3NDQgMC42NzY3NzcgMy43NjI1NiAwLjk2OTY3IDMuNDY5NjdDMS4yNjI1NiAzLjE3Njc4IDEuNzM3NDQgMy4xNzY3OCAyLjAzMDMzIDMuNDY5NjdMNCA1LjQzOTM0TDguNDY5NjcgMC45Njk2N0M4Ljc2MjU2IDAuNjc2Nzc3IDkuMjM3NDQgMC42NzY3NzcgOS41MzAzMyAwLjk2OTY3WiIgZmlsbD0id2hpdGUiLz4KPC9zdmc+Cg==\")',\n backgroundSize:\n indeterminate && !checked ? '10px 2px' : '10px 8px',\n }}\n />\n )}\n </span>\n {children && (\n <span\n className={cn(\n 'ald-checkbox-label tw-inline-flex tw-select-none tw-items-center tw-gap-1 tw-text-[var(--alias-colors-text-default)] [&_svg]:tw-inline-block [&_svg]:tw-shrink-0',\n size === 'small' ? 'tw-text-xs' : 'tw-text-sm',\n bold && 'tw-font-medium',\n mergedDisabled && 'tw-cursor-default',\n )}\n >\n {children}\n </span>\n )}\n </label>\n );\n}\n\nfunction CheckboxGroup(props: ICheckboxGroupProps) {\n const {\n className,\n disabled: customDisabled,\n size,\n options,\n value: controlledValue,\n defaultValue,\n onChange,\n direction,\n name,\n children,\n } = props;\n\n const disabled = useContext(DisabledContext);\n const mergedDisabled = customDisabled ?? disabled;\n\n const isControlled = 'value' in props;\n const [innerValue, setInnerValue] = useState<CheckboxValueType[]>(\n defaultValue ?? [],\n );\n const value = isControlled ? controlledValue ?? [] : innerValue;\n\n const handleGroupChange = (\n itemValue: CheckboxValueType,\n itemChecked: boolean,\n ) => {\n const newValue = itemChecked\n ? [...value, itemValue]\n : value.filter((v) => v !== itemValue);\n if (!isControlled) {\n setInnerValue(newValue);\n }\n onChange?.(newValue);\n };\n\n const renderOptions = () => {\n if (!options) return children;\n return options.map((opt) => {\n const optObj =\n typeof opt === 'object' ? opt : { label: String(opt), value: opt };\n return (\n <Checkbox\n key={String(optObj.value)}\n value={optObj.value}\n disabled={mergedDisabled || optObj.disabled}\n checked={value.includes(optObj.value)}\n size={size}\n name={name}\n onChange={(e) => handleGroupChange(optObj.value, e.target.checked)}\n >\n {optObj.label}\n </Checkbox>\n );\n });\n };\n\n return (\n <div\n className={cn(\n 'ald-checkbox-group tw-flex tw-flex-wrap tw-gap-3',\n direction === 'vertical' && 'ald-checkbox-group-vertical tw-flex-col',\n size === 'small' && 'ald-checkbox-group-small',\n className,\n )}\n >\n {renderOptions()}\n </div>\n );\n}\n\nCheckbox.Group = CheckboxGroup;\n\nexport default Checkbox;\n"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../src/Checkbox/index.tsx"],"sourcesContent":["import React, { useContext, useEffect, useRef, useState } from 'react';\nimport DisabledContext from '../ConfigProvider/DisabledContext';\nimport { cn } from '../lib/utils';\nimport {\n CheckboxChangeEvent,\n CheckboxValueType,\n ICheckboxGroupProps,\n ICheckboxProps,\n} from './type';\n\nexport type { CheckboxChangeEvent, CheckboxValueType };\nexport type { CheckboxOptionType } from './type';\nexport type { ICheckboxProps, ICheckboxGroupProps };\n\nfunction Checkbox(props: ICheckboxProps) {\n const {\n className,\n disabled: customDisabled,\n alert,\n bold,\n size,\n checked: controlledChecked,\n defaultChecked,\n indeterminate,\n onChange,\n onClick,\n autoFocus,\n children,\n value,\n name,\n style,\n } = props;\n\n const disabled = useContext(DisabledContext);\n const mergedDisabled = customDisabled ?? disabled;\n\n const isControlled = 'checked' in props;\n const [innerChecked, setInnerChecked] = useState(defaultChecked ?? false);\n const checked = isControlled ? controlledChecked : innerChecked;\n\n const inputRef = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n if (inputRef.current) {\n inputRef.current.indeterminate = !!indeterminate;\n }\n }, [indeterminate]);\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n if (mergedDisabled) return;\n const newChecked = e.target.checked;\n if (!isControlled) {\n setInnerChecked(newChecked);\n }\n onChange?.({\n target: { checked: newChecked, value },\n nativeEvent: e.nativeEvent,\n });\n };\n\n const handleLabelClick = (e: React.MouseEvent) => {\n if (mergedDisabled) return;\n if (onClick) {\n // Table row selection uses onClick — prevent label from also toggling input\n e.preventDefault();\n e.stopPropagation();\n onClick(e);\n }\n };\n\n return (\n <label\n onClick={handleLabelClick}\n className={cn(\n 'ald-checkbox-wrapper ald-checkbox tw-inline-flex tw-cursor-pointer tw-items-center tw-gap-2 tw-leading-5',\n mergedDisabled && 'tw-cursor-default',\n size === 'small' && 'ald-checkbox-small',\n !mergedDisabled &&\n '[&:hover_.ald-checkbox-inner]:tw-border-2 [&:hover_.ald-checkbox-inner]:tw-border-[var(--interaction-border-hover)]',\n !mergedDisabled &&\n checked &&\n '[&:hover_.ald-checkbox-inner]:tw-border-transparent [&:hover_.ald-checkbox-inner]:tw-bg-[var(--interaction-default-hover)]',\n className,\n )}\n style={style}\n >\n <span\n className={cn(\n 'ald-checkbox-inner tw-relative tw-box-border tw-flex tw-size-4 tw-min-h-4 tw-min-w-4 tw-items-center tw-justify-center tw-rounded-r-50 tw-border-2 tw-border-solid tw-transition-all tw-duration-200',\n checked &&\n 'ald-checkbox-checked tw-border-transparent tw-bg-[var(--interaction-default-normal)]',\n mergedDisabled && 'tw-opacity-50',\n !checked &&\n !indeterminate &&\n !alert &&\n 'tw-border-[var(--interaction-border-neutral-normal)] tw-bg-[var(--interaction-background-form-field)]',\n !checked &&\n !indeterminate &&\n alert &&\n 'tw-border-[var(--interaction-border-alert)] tw-bg-[var(--interaction-background-form-field)]',\n indeterminate &&\n !checked &&\n 'ald-checkbox-indeterminate tw-border-transparent tw-bg-[var(--interaction-default-normal)]',\n )}\n >\n <input\n ref={inputRef}\n type=\"checkbox\"\n className=\"tw-absolute tw-inset-0 tw-m-0 tw-cursor-pointer tw-opacity-0 disabled:tw-cursor-default\"\n checked={!!checked}\n disabled={mergedDisabled}\n onChange={handleChange}\n autoFocus={autoFocus}\n name={name}\n value={value as string}\n />\n {(checked || (indeterminate && !checked)) && (\n <span\n className=\"tw-absolute tw-inset-0 tw-bg-center tw-bg-no-repeat\"\n style={{\n backgroundImage:\n indeterminate && !checked\n ? 'url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iMiIgdmlld0JveD0iMCAwIDEwIDIiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGlkPSJWZWN0b3IgMSAoU3Ryb2tlKSIgZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0wLjc1IDFDMC43NSAwLjU4NTc4NiAxLjA4NTc5IDAuMjUgMS41IDAuMjVIOC41QzguOTE0MjEgMC4yNSA5LjI1IDAuNTg1Nzg2IDkuMjUgMUM5LjI1IDEuNDE0MjEgOC45MTQyMSAxLjc1IDguNSAxLjc1SDEuNUMxLjA4NTc5IDEuNzUgMC43NSAxLjQxNDIxIDAuNzUgMVoiIGZpbGw9IndoaXRlIi8+Cjwvc3ZnPgo=\")'\n : 'url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDEwIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGlkPSJJY29uIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTkuNTMwMzMgMC45Njk2N0M5LjgyMzIyIDEuMjYyNTYgOS44MjMyMiAxLjczNzQ0IDkuNTMwMzMgMi4wMzAzM0w0LjUzMDMzIDcuMDMwMzNDNC4yMzc0NCA3LjMyMzIyIDMuNzYyNTYgNy4zMjMyMiAzLjQ2OTY3IDcuMDMwMzNMMC45Njk2NyA0LjUzMDMzQzAuNjc2Nzc3IDQuMjM3NDQgMC42NzY3NzcgMy43NjI1NiAwLjk2OTY3IDMuNDY5NjdDMS4yNjI1NiAzLjE3Njc4IDEuNzM3NDQgMy4xNzY3OCAyLjAzMDMzIDMuNDY5NjdMNCA1LjQzOTM0TDguNDY5NjcgMC45Njk2N0M4Ljc2MjU2IDAuNjc2Nzc3IDkuMjM3NDQgMC42NzY3NzcgOS41MzAzMyAwLjk2OTY3WiIgZmlsbD0id2hpdGUiLz4KPC9zdmc+Cg==\")',\n backgroundSize:\n indeterminate && !checked ? '10px 2px' : '10px 8px',\n }}\n />\n )}\n </span>\n {children && (\n <span\n className={cn(\n 'ald-checkbox-label tw-inline-flex tw-select-none tw-items-center tw-gap-1 tw-text-[var(--alias-colors-text-default)] [&_svg]:tw-inline-block [&_svg]:tw-shrink-0',\n size === 'small' ? 'tw-text-xs' : 'tw-text-sm',\n bold && 'tw-font-medium',\n mergedDisabled && 'tw-cursor-default',\n )}\n >\n {children}\n </span>\n )}\n </label>\n );\n}\n\nfunction CheckboxGroup(props: ICheckboxGroupProps) {\n const {\n className,\n disabled: customDisabled,\n size,\n options,\n value: controlledValue,\n defaultValue,\n onChange,\n direction,\n name,\n children,\n } = props;\n\n const disabled = useContext(DisabledContext);\n const mergedDisabled = customDisabled ?? disabled;\n\n const isControlled = 'value' in props;\n const [innerValue, setInnerValue] = useState<CheckboxValueType[]>(\n defaultValue ?? [],\n );\n const value = isControlled ? controlledValue ?? [] : innerValue;\n\n const handleGroupChange = (\n itemValue: CheckboxValueType,\n itemChecked: boolean,\n ) => {\n const newValue = itemChecked\n ? [...value, itemValue]\n : value.filter((v) => v !== itemValue);\n if (!isControlled) {\n setInnerValue(newValue);\n }\n onChange?.(newValue);\n };\n\n const renderOptions = () => {\n if (!options) return children;\n return options.map((opt) => {\n const optObj =\n typeof opt === 'object' ? opt : { label: String(opt), value: opt };\n return (\n <Checkbox\n key={String(optObj.value)}\n value={optObj.value}\n disabled={mergedDisabled || optObj.disabled}\n checked={value.includes(optObj.value)}\n size={size}\n name={name}\n onChange={(e) => handleGroupChange(optObj.value, e.target.checked)}\n >\n {optObj.label}\n </Checkbox>\n );\n });\n };\n\n return (\n <div\n className={cn(\n 'ald-checkbox-group tw-flex tw-flex-wrap tw-gap-3',\n direction === 'vertical' && 'ald-checkbox-group-vertical tw-flex-col',\n size === 'small' && 'ald-checkbox-group-small',\n className,\n )}\n >\n {renderOptions()}\n </div>\n );\n}\n\nCheckbox.Group = CheckboxGroup;\n\nexport default Checkbox;\n"],"mappings":"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"}
@@ -50,7 +50,7 @@ function CollapsePanelInternal(props) {
50
50
  className: "tw-overflow-hidden",
51
51
  children: rendered && /* @__PURE__ */ jsx("div", {
52
52
  ref: contentRef,
53
- className: cn("ald-collapse-content ant-collapse-content tw-flex tw-items-start tw-gap-2.5 tw-self-stretch", bordered ? "tw-bg-[var(--background-default)] tw-p-4" : "tw-pb-4 tw-pl-10 tw-pr-4 tw-pt-0"),
53
+ className: cn("ald-collapse-content ant-collapse-content tw-flex tw-flex-col tw-items-stretch tw-gap-2.5 tw-self-stretch", bordered ? "tw-bg-[var(--background-default)] tw-p-4" : "tw-px-4 tw-pb-4 tw-pt-0"),
54
54
  children
55
55
  })
56
56
  })
@@ -119,13 +119,13 @@ var Collapse = (props) => {
119
119
  forceRender: item.forceRender,
120
120
  expandIcon,
121
121
  expandIconPosition: resolvedPosition,
122
- bordered,
122
+ bordered: bordered && !ghost,
123
123
  children: item.children
124
124
  })] }, item.key));
125
125
  return children;
126
126
  };
127
127
  return /* @__PURE__ */ jsx("div", {
128
- className: cn("ald-collapse ant-collapse tw-flex tw-flex-col tw-items-start tw-overflow-hidden tw-rounded-r-75 [&>.ald-collapse-divider]:tw-h-px [&>.ald-collapse-divider]:tw-w-full [&>.ald-collapse-divider]:tw-bg-[var(--border-default)]", !bordered && !ghost && "tw-bg-[var(--background-neutral-subtle)]", bordered && "tw-border tw-border-solid tw-border-[var(--border-default)] tw-bg-[var(--background-neutral-subtle)]", className),
128
+ className: cn("ald-collapse ant-collapse tw-flex tw-flex-col tw-items-stretch tw-overflow-hidden tw-rounded-r-75 [&>.ald-collapse-divider]:tw-h-px [&>.ald-collapse-divider]:tw-w-full [&>.ald-collapse-divider]:tw-bg-[var(--border-default)]", !ghost && !bordered && "tw-bg-[var(--background-neutral-subtle)]", !ghost && bordered && "tw-border tw-border-solid tw-border-[var(--border-default)] tw-bg-[var(--background-neutral-subtle)]", className),
129
129
  style,
130
130
  children: renderItems()
131
131
  });
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../../src/Collapse/index.tsx"],"sourcesContent":["import React, { useRef, useState } from 'react';\nimport { ArrowRightLightLine } from '../Icon';\nimport { cn } from '../lib/utils';\n\nexport interface CollapsePanelProps {\n key: string;\n header?: React.ReactNode;\n className?: string;\n style?: React.CSSProperties;\n children?: React.ReactNode;\n disabled?: boolean;\n extra?: React.ReactNode;\n forceRender?: boolean;\n collapsible?: 'header' | 'icon' | 'disabled';\n showArrow?: boolean;\n ref?: React.Ref<HTMLDivElement>;\n}\n\nexport interface CollapseProps {\n activeKey?: string | string[];\n defaultActiveKey?: string | string[];\n accordion?: boolean;\n onChange?: (key: string | string[]) => void;\n className?: string;\n style?: React.CSSProperties;\n bordered?: boolean;\n expandIconPosition?: 'start' | 'end' | 'left' | 'right';\n expandIcon?: (props: { isActive: boolean }) => React.ReactNode;\n ghost?: boolean;\n size?: 'large' | 'middle' | 'small';\n collapsible?: 'header' | 'icon' | 'disabled';\n children?: React.ReactNode;\n items?: Array<{\n key: string;\n label: React.ReactNode;\n children?: React.ReactNode;\n className?: string;\n style?: React.CSSProperties;\n extra?: React.ReactNode;\n disabled?: boolean;\n collapsible?: 'header' | 'icon' | 'disabled';\n forceRender?: boolean;\n }>;\n}\n\n/** Internal rendering component for a single panel */\nfunction CollapsePanelInternal(props: {\n panelKey: string;\n header: React.ReactNode;\n isActive: boolean;\n onToggle: () => void;\n disabled?: boolean;\n extra?: React.ReactNode;\n className?: string;\n style?: React.CSSProperties;\n children?: React.ReactNode;\n forceRender?: boolean;\n expandIcon?: (props: { isActive: boolean }) => React.ReactNode;\n expandIconPosition?: 'start' | 'end';\n bordered?: boolean;\n}) {\n const {\n header,\n isActive,\n onToggle,\n disabled,\n extra,\n className,\n style,\n children,\n forceRender,\n expandIcon,\n expandIconPosition = 'start',\n bordered,\n } = props;\n\n const contentRef = useRef<HTMLDivElement>(null);\n const [rendered, setRendered] = useState(isActive || !!forceRender);\n\n // Ensure content is in DOM before expanding so transition can play\n if (isActive && !rendered) {\n setRendered(true);\n }\n\n const handleTransitionEnd = () => {\n if (!isActive && !forceRender) {\n setRendered(false);\n }\n };\n\n const iconNode = expandIcon ? (\n expandIcon({ isActive })\n ) : (\n <ArrowRightLightLine size={20} color=\"var(--alias-colors-icon-subtle)\" />\n );\n\n // antd 兼容:保留 ant-collapse-expand-icon class,消费方 CSS 可能依赖该选择器\n const iconElement = (\n <span\n className=\"ald-collapse-expand-icon ant-collapse-expand-icon tw-flex tw-items-center\"\n style={{\n transform: isActive ? 'rotate(90deg)' : 'rotate(0deg)',\n transition: 'transform 200ms',\n }}\n >\n {iconNode}\n </span>\n );\n\n return (\n <div\n className={cn(\n // antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器\n 'ald-collapse-item ant-collapse-item tw-w-full',\n isActive && 'ald-collapse-item-active',\n disabled && 'tw-pointer-events-none tw-opacity-50',\n className,\n )}\n style={style}\n >\n <div\n // antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器\n className=\"ald-collapse-header ant-collapse-header tw-flex tw-cursor-pointer tw-items-center tw-gap-2 tw-p-3\"\n onClick={disabled ? undefined : onToggle}\n >\n {expandIconPosition === 'start' && iconElement}\n {/* antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器 */}\n <span className=\"ald-collapse-header-text ant-collapse-header-text tw-flex-1 tw-text-sm tw-font-medium tw-leading-5 tw-text-[var(--content-primary)]\">\n {header}\n </span>\n {/* antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器 */}\n {extra && (\n <span className=\"ald-collapse-extra ant-collapse-extra\">{extra}</span>\n )}\n {expandIconPosition === 'end' && iconElement}\n </div>\n <div\n className=\"tw-grid tw-transition-[grid-template-rows] tw-duration-200\"\n style={{ gridTemplateRows: isActive ? '1fr' : '0fr' }}\n onTransitionEnd={handleTransitionEnd}\n >\n <div className=\"tw-overflow-hidden\">\n {rendered && (\n <div\n ref={contentRef}\n // antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器\n className={cn(\n 'ald-collapse-content ant-collapse-content tw-flex tw-items-start tw-gap-2.5 tw-self-stretch',\n bordered\n ? 'tw-bg-[var(--background-default)] tw-p-4'\n : 'tw-pb-4 tw-pl-10 tw-pr-4 tw-pt-0',\n )}\n >\n {children}\n </div>\n )}\n </div>\n </div>\n </div>\n );\n}\n\n/**\n * Checks whether a React element is a Collapse.Panel.\n * We tag the Panel component with a `__COLLAPSE_PANEL` flag\n * so we can detect it regardless of module wrapper differences.\n */\nfunction isPanelElement(\n child: React.ReactNode,\n): child is React.ReactElement<CollapsePanelProps> {\n if (!React.isValidElement(child)) return false;\n return (child.type as any)?.__COLLAPSE_PANEL === true;\n}\n\n/**\n * Convert Collapse.Panel children into the internal items format.\n */\nfunction panelChildrenToItems(children: React.ReactNode) {\n const items: Array<{\n key: string;\n label: React.ReactNode;\n children?: React.ReactNode;\n className?: string;\n style?: React.CSSProperties;\n extra?: React.ReactNode;\n disabled?: boolean;\n collapsible?: 'header' | 'icon' | 'disabled';\n forceRender?: boolean;\n }> = [];\n\n React.Children.forEach(children, (child) => {\n if (!isPanelElement(child)) return;\n const {\n header,\n children: panelChildren,\n className,\n style,\n extra,\n disabled,\n collapsible,\n forceRender,\n } = child.props;\n\n // The `key` prop is not part of child.props in React — access it from child.key\n const panelKey =\n child.key !== null && child.key !== undefined ? String(child.key) : '';\n\n items.push({\n key: panelKey,\n label: header,\n children: panelChildren,\n className,\n style,\n extra,\n disabled,\n collapsible,\n forceRender,\n });\n });\n\n return items;\n}\n\nconst Collapse = (props: CollapseProps) => {\n const {\n defaultActiveKey = [],\n activeKey: controlledActiveKey,\n accordion,\n onChange,\n className,\n style,\n bordered = true,\n ghost,\n expandIconPosition,\n expandIcon,\n items: itemsProp,\n children,\n } = props;\n\n const resolvedPosition =\n expandIconPosition === 'left'\n ? 'start'\n : expandIconPosition === 'right'\n ? 'end'\n : expandIconPosition ?? 'start';\n\n const normalizeKeys = (keys: string | string[] | undefined): string[] => {\n if (!keys) return [];\n return Array.isArray(keys) ? keys : [keys];\n };\n\n const [internalActiveKey, setInternalActiveKey] = useState<string[]>(\n normalizeKeys(defaultActiveKey),\n );\n\n const activeKeys =\n controlledActiveKey !== undefined\n ? normalizeKeys(controlledActiveKey)\n : internalActiveKey;\n\n const toggleKey = (key: string) => {\n let newKeys: string[];\n if (accordion) {\n newKeys = activeKeys.includes(key) ? [] : [key];\n } else {\n newKeys = activeKeys.includes(key)\n ? activeKeys.filter((k) => k !== key)\n : [...activeKeys, key];\n }\n if (controlledActiveKey === undefined) {\n setInternalActiveKey(newKeys);\n }\n onChange?.(accordion ? newKeys[0] || '' : newKeys);\n };\n\n // Resolve items: from `items` prop, or by converting Panel children\n const items =\n itemsProp || (children ? panelChildrenToItems(children) : undefined);\n\n const renderItems = () => {\n if (items && items.length > 0) {\n return items.map((item, index) => (\n <React.Fragment key={item.key}>\n {index > 0 && <div className=\"ald-collapse-divider\" />}\n <CollapsePanelInternal\n panelKey={item.key}\n header={item.label}\n isActive={activeKeys.includes(item.key)}\n onToggle={() => toggleKey(item.key)}\n disabled={item.disabled || item.collapsible === 'disabled'}\n extra={item.extra}\n className={item.className}\n style={item.style}\n forceRender={item.forceRender}\n expandIcon={expandIcon}\n expandIconPosition={resolvedPosition}\n bordered={bordered}\n >\n {item.children}\n </CollapsePanelInternal>\n </React.Fragment>\n ));\n }\n // If children are not Panel elements (rare fallback), render them as-is\n return children;\n };\n\n return (\n <div\n className={cn(\n // antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器\n 'ald-collapse ant-collapse tw-flex tw-flex-col tw-items-start tw-overflow-hidden tw-rounded-r-75 [&>.ald-collapse-divider]:tw-h-px [&>.ald-collapse-divider]:tw-w-full [&>.ald-collapse-divider]:tw-bg-[var(--border-default)]',\n !bordered && !ghost && 'tw-bg-[var(--background-neutral-subtle)]',\n bordered &&\n 'tw-border tw-border-solid tw-border-[var(--border-default)] tw-bg-[var(--background-neutral-subtle)]',\n className,\n )}\n style={style}\n >\n {renderItems()}\n </div>\n );\n};\n\n/**\n * Collapse.Panel — legacy sub-component for backwards compatibility.\n * When used as a child of <Collapse>, the parent extracts its props\n * and renders the panels via the internal CollapsePanelInternal component.\n * Panel itself never renders directly; the parent handles rendering.\n */\nconst Panel: React.FC<CollapsePanelProps> = ({ children }) => {\n // This component should never render on its own — Collapse extracts\n // its props. But if used outside of Collapse, render children as fallback.\n return <>{children}</>;\n};\n\n// Tag for detection by isPanelElement\n(Panel as any).__COLLAPSE_PANEL = true;\n\nCollapse.Panel = Panel;\n\nexport default Collapse;\n"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../src/Collapse/index.tsx"],"sourcesContent":["import React, { useRef, useState } from 'react';\nimport { ArrowRightLightLine } from '../Icon';\nimport { cn } from '../lib/utils';\n\nexport interface CollapsePanelProps {\n key: string;\n header?: React.ReactNode;\n className?: string;\n style?: React.CSSProperties;\n children?: React.ReactNode;\n disabled?: boolean;\n extra?: React.ReactNode;\n forceRender?: boolean;\n collapsible?: 'header' | 'icon' | 'disabled';\n showArrow?: boolean;\n ref?: React.Ref<HTMLDivElement>;\n}\n\nexport interface CollapseProps {\n activeKey?: string | string[];\n defaultActiveKey?: string | string[];\n accordion?: boolean;\n onChange?: (key: string | string[]) => void;\n className?: string;\n style?: React.CSSProperties;\n bordered?: boolean;\n expandIconPosition?: 'start' | 'end' | 'left' | 'right';\n expandIcon?: (props: { isActive: boolean }) => React.ReactNode;\n ghost?: boolean;\n size?: 'large' | 'middle' | 'small';\n collapsible?: 'header' | 'icon' | 'disabled';\n children?: React.ReactNode;\n items?: Array<{\n key: string;\n label: React.ReactNode;\n children?: React.ReactNode;\n className?: string;\n style?: React.CSSProperties;\n extra?: React.ReactNode;\n disabled?: boolean;\n collapsible?: 'header' | 'icon' | 'disabled';\n forceRender?: boolean;\n }>;\n}\n\n/** Internal rendering component for a single panel */\nfunction CollapsePanelInternal(props: {\n panelKey: string;\n header: React.ReactNode;\n isActive: boolean;\n onToggle: () => void;\n disabled?: boolean;\n extra?: React.ReactNode;\n className?: string;\n style?: React.CSSProperties;\n children?: React.ReactNode;\n forceRender?: boolean;\n expandIcon?: (props: { isActive: boolean }) => React.ReactNode;\n expandIconPosition?: 'start' | 'end';\n bordered?: boolean;\n}) {\n const {\n header,\n isActive,\n onToggle,\n disabled,\n extra,\n className,\n style,\n children,\n forceRender,\n expandIcon,\n expandIconPosition = 'start',\n bordered,\n } = props;\n\n const contentRef = useRef<HTMLDivElement>(null);\n const [rendered, setRendered] = useState(isActive || !!forceRender);\n\n // Ensure content is in DOM before expanding so transition can play\n if (isActive && !rendered) {\n setRendered(true);\n }\n\n const handleTransitionEnd = () => {\n if (!isActive && !forceRender) {\n setRendered(false);\n }\n };\n\n const iconNode = expandIcon ? (\n expandIcon({ isActive })\n ) : (\n <ArrowRightLightLine size={20} color=\"var(--alias-colors-icon-subtle)\" />\n );\n\n // antd 兼容:保留 ant-collapse-expand-icon class,消费方 CSS 可能依赖该选择器\n const iconElement = (\n <span\n className=\"ald-collapse-expand-icon ant-collapse-expand-icon tw-flex tw-items-center\"\n style={{\n transform: isActive ? 'rotate(90deg)' : 'rotate(0deg)',\n transition: 'transform 200ms',\n }}\n >\n {iconNode}\n </span>\n );\n\n return (\n <div\n className={cn(\n // antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器\n 'ald-collapse-item ant-collapse-item tw-w-full',\n isActive && 'ald-collapse-item-active',\n disabled && 'tw-pointer-events-none tw-opacity-50',\n className,\n )}\n style={style}\n >\n <div\n // antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器\n className=\"ald-collapse-header ant-collapse-header tw-flex tw-cursor-pointer tw-items-center tw-gap-2 tw-p-3\"\n onClick={disabled ? undefined : onToggle}\n >\n {expandIconPosition === 'start' && iconElement}\n {/* antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器 */}\n <span className=\"ald-collapse-header-text ant-collapse-header-text tw-flex-1 tw-text-sm tw-font-medium tw-leading-5 tw-text-[var(--content-primary)]\">\n {header}\n </span>\n {/* antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器 */}\n {extra && (\n <span className=\"ald-collapse-extra ant-collapse-extra\">{extra}</span>\n )}\n {expandIconPosition === 'end' && iconElement}\n </div>\n <div\n className=\"tw-grid tw-transition-[grid-template-rows] tw-duration-200\"\n style={{ gridTemplateRows: isActive ? '1fr' : '0fr' }}\n onTransitionEnd={handleTransitionEnd}\n >\n <div className=\"tw-overflow-hidden\">\n {rendered && (\n <div\n ref={contentRef}\n // antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器\n className={cn(\n // 默认列方向 + items-stretch,使 block 级子元素能撑满宽度(与 antd\n // Collapse 内容区行为一致)。row 布局由消费方自行包裹,避免在这里\n // 把\"label 靠左 / 控件靠右\"这种 space-between 行布局压缩掉。\n 'ald-collapse-content ant-collapse-content tw-flex tw-flex-col tw-items-stretch tw-gap-2.5 tw-self-stretch',\n bordered\n ? 'tw-bg-[var(--background-default)] tw-p-4'\n : 'tw-px-4 tw-pb-4 tw-pt-0',\n )}\n >\n {children}\n </div>\n )}\n </div>\n </div>\n </div>\n );\n}\n\n/**\n * Checks whether a React element is a Collapse.Panel.\n * We tag the Panel component with a `__COLLAPSE_PANEL` flag\n * so we can detect it regardless of module wrapper differences.\n */\nfunction isPanelElement(\n child: React.ReactNode,\n): child is React.ReactElement<CollapsePanelProps> {\n if (!React.isValidElement(child)) return false;\n return (child.type as any)?.__COLLAPSE_PANEL === true;\n}\n\n/**\n * Convert Collapse.Panel children into the internal items format.\n */\nfunction panelChildrenToItems(children: React.ReactNode) {\n const items: Array<{\n key: string;\n label: React.ReactNode;\n children?: React.ReactNode;\n className?: string;\n style?: React.CSSProperties;\n extra?: React.ReactNode;\n disabled?: boolean;\n collapsible?: 'header' | 'icon' | 'disabled';\n forceRender?: boolean;\n }> = [];\n\n React.Children.forEach(children, (child) => {\n if (!isPanelElement(child)) return;\n const {\n header,\n children: panelChildren,\n className,\n style,\n extra,\n disabled,\n collapsible,\n forceRender,\n } = child.props;\n\n // The `key` prop is not part of child.props in React — access it from child.key\n const panelKey =\n child.key !== null && child.key !== undefined ? String(child.key) : '';\n\n items.push({\n key: panelKey,\n label: header,\n children: panelChildren,\n className,\n style,\n extra,\n disabled,\n collapsible,\n forceRender,\n });\n });\n\n return items;\n}\n\nconst Collapse = (props: CollapseProps) => {\n const {\n defaultActiveKey = [],\n activeKey: controlledActiveKey,\n accordion,\n onChange,\n className,\n style,\n bordered = true,\n ghost,\n expandIconPosition,\n expandIcon,\n items: itemsProp,\n children,\n } = props;\n\n const resolvedPosition =\n expandIconPosition === 'left'\n ? 'start'\n : expandIconPosition === 'right'\n ? 'end'\n : expandIconPosition ?? 'start';\n\n const normalizeKeys = (keys: string | string[] | undefined): string[] => {\n if (!keys) return [];\n return Array.isArray(keys) ? keys : [keys];\n };\n\n const [internalActiveKey, setInternalActiveKey] = useState<string[]>(\n normalizeKeys(defaultActiveKey),\n );\n\n const activeKeys =\n controlledActiveKey !== undefined\n ? normalizeKeys(controlledActiveKey)\n : internalActiveKey;\n\n const toggleKey = (key: string) => {\n let newKeys: string[];\n if (accordion) {\n newKeys = activeKeys.includes(key) ? [] : [key];\n } else {\n newKeys = activeKeys.includes(key)\n ? activeKeys.filter((k) => k !== key)\n : [...activeKeys, key];\n }\n if (controlledActiveKey === undefined) {\n setInternalActiveKey(newKeys);\n }\n onChange?.(accordion ? newKeys[0] || '' : newKeys);\n };\n\n // Resolve items: from `items` prop, or by converting Panel children\n const items =\n itemsProp || (children ? panelChildrenToItems(children) : undefined);\n\n const renderItems = () => {\n if (items && items.length > 0) {\n return items.map((item, index) => (\n <React.Fragment key={item.key}>\n {index > 0 && <div className=\"ald-collapse-divider\" />}\n <CollapsePanelInternal\n panelKey={item.key}\n header={item.label}\n isActive={activeKeys.includes(item.key)}\n onToggle={() => toggleKey(item.key)}\n disabled={item.disabled || item.collapsible === 'disabled'}\n extra={item.extra}\n className={item.className}\n style={item.style}\n forceRender={item.forceRender}\n expandIcon={expandIcon}\n expandIconPosition={resolvedPosition}\n bordered={bordered && !ghost}\n >\n {item.children}\n </CollapsePanelInternal>\n </React.Fragment>\n ));\n }\n // If children are not Panel elements (rare fallback), render them as-is\n return children;\n };\n\n return (\n <div\n className={cn(\n // antd 兼容:保留 ant-* class,消费方 CSS 可能依赖该选择器\n 'ald-collapse ant-collapse tw-flex tw-flex-col tw-items-stretch tw-overflow-hidden tw-rounded-r-75 [&>.ald-collapse-divider]:tw-h-px [&>.ald-collapse-divider]:tw-w-full [&>.ald-collapse-divider]:tw-bg-[var(--border-default)]',\n !ghost && !bordered && 'tw-bg-[var(--background-neutral-subtle)]',\n !ghost &&\n bordered &&\n 'tw-border tw-border-solid tw-border-[var(--border-default)] tw-bg-[var(--background-neutral-subtle)]',\n className,\n )}\n style={style}\n >\n {renderItems()}\n </div>\n );\n};\n\n/**\n * Collapse.Panel — legacy sub-component for backwards compatibility.\n * When used as a child of <Collapse>, the parent extracts its props\n * and renders the panels via the internal CollapsePanelInternal component.\n * Panel itself never renders directly; the parent handles rendering.\n */\nconst Panel: React.FC<CollapsePanelProps> = ({ children }) => {\n // This component should never render on its own — Collapse extracts\n // its props. But if used outside of Collapse, render children as fallback.\n return <>{children}</>;\n};\n\n// Tag for detection by isPanelElement\n(Panel as any).__COLLAPSE_PANEL = true;\n\nCollapse.Panel = Panel;\n\nexport default Collapse;\n"],"mappings":"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"}
@@ -148,7 +148,10 @@ function FormItemLayout({ label, children, meta, help, extra, required, rules, h
148
148
  value: itemInputContextValue,
149
149
  children: /* @__PURE__ */ jsx("div", {
150
150
  className: "ald-form-item-control-input",
151
- children
151
+ children: /* @__PURE__ */ jsx("div", {
152
+ className: "ald-form-item-control-input-content",
153
+ children
154
+ })
152
155
  })
153
156
  }),
154
157
  /* @__PURE__ */ jsx("div", {
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../../src/Form/index.tsx"],"sourcesContent":["import RcForm, {\n Field,\n FormInstance as RcFormInstance,\n FormProvider,\n List,\n useForm as rcUseForm,\n useWatch,\n} from 'rc-field-form';\nimport type { FormProps as RcFormProps } from 'rc-field-form';\nimport FieldContext from 'rc-field-form/es/FieldContext';\nimport type { Rule, RuleObject, RuleRender } from 'rc-field-form/es/interface';\nimport type { Meta, NamePath } from 'rc-field-form/es/interface';\nimport React, { forwardRef, useContext, useMemo } from 'react';\nimport SizeContext, {\n SizeContextProvider,\n} from '../ConfigProvider/sizeContext';\nimport DisabledContext from '../ConfigProvider/DisabledContext';\nimport { cn } from '../lib/utils';\nimport {\n FormContext,\n FormItemInputContext,\n type ValidateStatus,\n} from './FormItemContext';\n\n/**\n * Loose NamePath: accepts string, number, or array of them.\n * antd v4 uses loose paths; rc-field-form v2 uses strict DeepNamePath.\n * We override to keep backward compatibility.\n */\ntype LooseNamePath = string | number | (string | number)[];\n\n/**\n * FormInstance — extends rc-field-form FormInstance with loose-typed overloads\n * to maintain antd v4 backward compatibility. Uses intersection so that both\n * strict DeepNamePath and loose LooseNamePath signatures are accepted.\n */\nexport type FormInstance<Values = any> = RcFormInstance<Values> & {\n getFieldValue(name: LooseNamePath): any;\n setFieldValue(name: LooseNamePath, value: any): void;\n setFieldsValue(values: Record<string, any>): void;\n getFieldsValue(): Values;\n getFieldsValue(\n nameList: LooseNamePath[] | true,\n filterFunc?: (meta: Meta) => boolean,\n ): any;\n getFieldError(name: LooseNamePath): string[];\n getFieldsError(\n nameList?: LooseNamePath[],\n ): { name: (string | number)[]; errors: string[] }[];\n getFieldWarning(name: LooseNamePath): string[];\n isFieldTouched(name: LooseNamePath): boolean;\n isFieldsTouched(\n nameList?: LooseNamePath[],\n allFieldsTouched?: boolean,\n ): boolean;\n isFieldValidating(name: LooseNamePath): boolean;\n isFieldsValidating(nameList?: LooseNamePath[]): boolean;\n setFields(fields: FieldData[]): void;\n resetFields(fields?: LooseNamePath[]): void;\n validateFields(nameList?: LooseNamePath[]): Promise<Values>;\n /** Scroll to field position (antd-compatible extension) */\n scrollToField?(\n name: LooseNamePath,\n options?: { behavior?: 'smooth' | 'auto' },\n ): void;\n};\n\n// FormProps compatible with antd\nexport interface FormProps<Values = any> extends Omit<RcFormProps, 'form'> {\n form?: FormInstance<Values>;\n layout?: 'horizontal' | 'vertical' | 'inline';\n size?: 'small' | 'middle' | 'large';\n colon?: boolean;\n disabled?: boolean;\n labelCol?: { span?: number; offset?: number };\n wrapperCol?: { span?: number; offset?: number };\n className?: string;\n style?: React.CSSProperties;\n requiredMark?: boolean | 'optional';\n labelWidth?: number;\n labelAlign?: 'left' | 'right';\n}\n\n// FormItemProps\nexport interface FormItemProps {\n name?: NamePath;\n label?: React.ReactNode;\n rules?: Rule[];\n children?: React.ReactNode | ((form: RcFormInstance) => React.ReactNode);\n className?: string;\n style?: React.CSSProperties;\n required?: boolean;\n hidden?: boolean;\n initialValue?: any;\n dependencies?: NamePath[];\n shouldUpdate?: boolean | ((prevValues: any, curValues: any) => boolean);\n help?: React.ReactNode;\n extra?: React.ReactNode;\n validateTrigger?: string | string[];\n valuePropName?: string;\n getValueFromEvent?: (...args: any[]) => any;\n noStyle?: boolean;\n labelWidth?: number;\n tooltip?:\n | React.ReactNode\n | { title?: React.ReactNode; icon?: React.ReactNode };\n labelCol?: { span?: number; offset?: number; [key: string]: any };\n wrapperCol?: { span?: number; offset?: number; [key: string]: any };\n validateStatus?: ValidateStatus;\n colon?: boolean;\n trigger?: string;\n normalize?: (value: any, prevValue: any, allValues: any) => any;\n getValueProps?: (value: any) => Record<string, any>;\n}\n\n/** antd v4 compat: FormLabelAlign */\nexport type FormLabelAlign = 'left' | 'right';\n\n/** antd v4 compat: FieldData */\nexport type FieldData = {\n name: NamePath;\n value?: any;\n touched?: boolean;\n validating?: boolean;\n errors?: string[];\n};\n\nexport interface ErrorListProps {\n errors?: React.ReactNode[];\n help?: React.ReactNode;\n className?: string;\n}\n\nexport type FormListFieldData = {\n name: number;\n key: number;\n isListField: boolean;\n};\n\nexport type FormListOperation = {\n add: (defaultValue?: any, insertIndex?: number) => void;\n remove: (index: number | number[]) => void;\n move: (from: number, to: number) => void;\n};\n\nexport type FormListProps = {\n name: NamePath;\n rules?: Rule[];\n children: (\n fields: FormListFieldData[],\n operation: FormListOperation,\n meta: { errors: React.ReactNode[] },\n ) => React.ReactNode;\n initialValue?: any[];\n};\n\n// ============== Helpers ==============\n\n/** Convert a 24-column span/offset to Tailwind-compatible inline styles */\nfunction colStyle(col?: {\n span?: number;\n offset?: number;\n}): React.CSSProperties | undefined {\n if (!col) return undefined;\n const s: React.CSSProperties = {};\n if (col.span !== null && col.span !== undefined) {\n // 24-column grid: width = span / 24 * 100%\n s.width = `${(col.span / 24) * 100}%`;\n s.flex = `0 0 ${(col.span / 24) * 100}%`;\n }\n if (col.offset !== null && col.offset !== undefined && col.offset > 0) {\n s.marginLeft = `${(col.offset / 24) * 100}%`;\n }\n return s;\n}\n\nfunction mergeControlProps(\n childProps: Record<string, any>,\n control: Record<string, any>,\n) {\n const mergedControl = { ...control };\n\n Object.keys(control).forEach((key) => {\n const controlHandler = control[key];\n const childHandler = childProps[key];\n\n if (\n typeof controlHandler === 'function' &&\n typeof childHandler === 'function'\n ) {\n mergedControl[key] = (...args: any[]) => {\n controlHandler(...args);\n childHandler(...args);\n };\n }\n });\n\n return mergedControl;\n}\n\n// ============== Form ==============\n\nconst AldForm = forwardRef((props: any, ref: any) => {\n const contextSize = useContext(SizeContext);\n const {\n children,\n size = contextSize,\n labelWidth,\n style = {},\n className,\n layout = 'horizontal',\n disabled,\n labelCol,\n wrapperCol,\n colon = false,\n requiredMark,\n labelAlign,\n ...restProps\n } = props;\n const customStyle = {\n ...style,\n ...(labelWidth ? { '--label-width': `${labelWidth}px` } : {}),\n ...(labelAlign ? { '--label-align': labelAlign } : {}),\n };\n\n const formContextValue = useMemo(\n () => ({\n layout,\n labelCol,\n wrapperCol,\n colon,\n requiredMark,\n labelWidth,\n labelAlign,\n }),\n [layout, labelCol, wrapperCol, colon, requiredMark, labelWidth, labelAlign],\n );\n\n return (\n <FormContext.Provider value={formContextValue}>\n <DisabledContext.Provider value={disabled}>\n <SizeContextProvider size={size}>\n <RcForm\n style={customStyle}\n className={cn(\n 'ald-form ant-form',\n `ald-form-${layout}`,\n `ant-form-${layout}`,\n className,\n )}\n {...restProps}\n ref={ref}\n >\n {children}\n </RcForm>\n </SizeContextProvider>\n </DisabledContext.Provider>\n </FormContext.Provider>\n );\n}) as <Values = any>(\n props: React.PropsWithChildren<FormProps<Values>> & {\n ref?: React.Ref<FormInstance<Values>>;\n labelWidth?: number;\n },\n) => React.ReactElement;\n\n// ============== Form.Item ==============\n\ninterface IFormItemProps extends FormItemProps {\n labelWidth?: number;\n labelAlign?: 'left' | 'right';\n}\n\n/** Derive status from meta or manual validateStatus */\nfunction deriveStatus(\n meta?: Meta,\n validateStatus?: ValidateStatus,\n): ValidateStatus {\n if (validateStatus) return validateStatus;\n if (!meta) return '';\n if (meta.validating) return 'validating';\n if (meta.errors && meta.errors.length > 0) return 'error';\n if (meta.warnings && meta.warnings.length > 0) return 'warning';\n if (meta.touched) return 'success';\n return '';\n}\n\n/** Status-based border class for the control wrapper */\nfunction statusClassName(status: ValidateStatus): string {\n switch (status) {\n case 'error':\n return 'ald-form-item-has-error';\n case 'warning':\n return 'ald-form-item-has-warning';\n case 'success':\n return 'ald-form-item-has-success';\n case 'validating':\n return 'ald-form-item-is-validating';\n default:\n return '';\n }\n}\n\n/** Render the inner label + control layout, receiving meta from Field */\nfunction FormItemLayout({\n label,\n children,\n meta,\n help,\n extra,\n required,\n rules,\n hidden,\n className,\n customStyle,\n noStyle,\n labelCol: itemLabelCol,\n wrapperCol: itemWrapperCol,\n validateStatus: manualStatus,\n colon: itemColon,\n formContext,\n}: {\n label?: React.ReactNode;\n children: React.ReactNode;\n meta?: Meta;\n help?: React.ReactNode;\n extra?: React.ReactNode;\n required?: boolean;\n rules?: Rule[];\n hidden?: boolean;\n className?: string;\n customStyle?: React.CSSProperties;\n noStyle?: boolean;\n labelCol?: { span?: number; offset?: number };\n wrapperCol?: { span?: number; offset?: number };\n validateStatus?: ValidateStatus;\n colon?: boolean;\n formContext: {\n layout?: string;\n labelCol?: { span?: number; offset?: number };\n wrapperCol?: { span?: number; offset?: number };\n colon?: boolean;\n requiredMark?: boolean | 'optional';\n labelWidth?: number;\n };\n}) {\n const status = deriveStatus(meta, manualStatus);\n const errors = useMemo(() => meta?.errors ?? [], [meta?.errors]);\n const warnings = useMemo(() => meta?.warnings ?? [], [meta?.warnings]);\n\n // Provide status context to child controls\n const itemInputContextValue = useMemo(\n () => ({\n status,\n isFormItemInput: true,\n errors,\n warnings,\n }),\n [status, errors, warnings],\n );\n\n if (noStyle) {\n return <>{children}</>;\n }\n\n // Determine if we should show required mark\n const { requiredMark } = formContext;\n const rulesRequired =\n rules && rules.some((r: any) => typeof r === 'object' && r && r.required);\n const isRequired =\n required || rulesRequired || (meta && (meta as any).required);\n const showRequired = requiredMark !== false && isRequired;\n const showOptional = requiredMark === 'optional' && !isRequired;\n\n // Resolve cols: item-level overrides form-level\n const resolvedLabelCol = itemLabelCol ?? formContext.labelCol;\n const resolvedWrapperCol = itemWrapperCol ?? formContext.wrapperCol;\n const layout = formContext.layout || 'horizontal';\n const showColon =\n (itemColon ?? formContext.colon) !== false && layout === 'horizontal';\n\n // Decide whether to use grid-style layout\n const useGridLayout =\n layout === 'horizontal' && (resolvedLabelCol || resolvedWrapperCol);\n\n // Determine display errors: if help is provided, show help instead of validation errors\n const displayMessages = help !== null && help !== undefined ? [help] : errors;\n const hasError = status === 'error' || (errors.length > 0 && help === null);\n const hasWarning =\n status === 'warning' || (warnings.length > 0 && help === null);\n const hasLabel = label !== null && label !== undefined && label !== '';\n\n const labelNode = hasLabel ? (\n <div\n className={cn(\n 'ald-form-item-label ant-form-item-label',\n // tw-block 不能省:label 容器同时挂了 ant-form-item-label 兼容 class,\n // 消费方残留的 antd 样式会把它设为 inline-block,导致 vertical 布局下\n // label 缩成内容宽而非整行铺在控件上方\n layout === 'vertical' && 'tw-mb-1 tw-block',\n layout === 'horizontal' && 'tw-mr-3 tw-shrink-0',\n )}\n style={useGridLayout ? colStyle(resolvedLabelCol) : undefined}\n >\n <label\n className={cn(\n 'tw-text-sm tw-font-medium tw-text-[var(--alias-colors-text-subtle,var(--content-secondary))]',\n !showColon && 'ant-form-item-no-colon',\n )}\n >\n {showRequired && (\n <span className=\"tw-mr-1 tw-text-[var(--content-negative-primary)]\">\n *\n </span>\n )}\n {label}\n {showOptional && (\n <span className=\"tw-ml-1 tw-text-xs tw-font-normal tw-text-[var(--content-secondary)]\">\n (optional)\n </span>\n )}\n {showColon && label ? ':' : null}\n </label>\n </div>\n ) : null;\n\n const controlNode = (\n <div\n className={cn(\n 'ald-form-item-control ant-form-item-control',\n layout === 'horizontal' && 'tw-flex-1',\n )}\n style={useGridLayout ? colStyle(resolvedWrapperCol) : undefined}\n >\n <FormItemInputContext.Provider value={itemInputContextValue}>\n <div className=\"ald-form-item-control-input\">{children}</div>\n </FormItemInputContext.Provider>\n {/* 始终渲染错误容器,避免 DOM 增删触发 Radix FocusScope MutationObserver 劫持焦点 */}\n <div\n className={cn(\n 'ald-form-item-explain ant-form-item-explain tw-text-xs tw-transition-all tw-duration-200',\n displayMessages.length > 0 && 'tw-mt-1',\n hasError && 'tw-text-[var(--content-negative-secondary)]',\n hasWarning &&\n !hasError &&\n 'tw-text-[color:var(--content-warning-primary,#faad14)]',\n !hasError &&\n !hasWarning &&\n help !== null &&\n help !== undefined &&\n 'tw-text-[var(--content-secondary)]',\n )}\n style={displayMessages.length === 0 ? { display: 'none' } : undefined}\n >\n {displayMessages.map((msg, i) => (\n <div key={i}>{msg}</div>\n ))}\n </div>\n {extra && (\n <div className=\"ald-form-item-extra tw-mt-1 tw-text-xs tw-text-[var(--content-secondary)]\">\n {extra}\n </div>\n )}\n </div>\n );\n\n return (\n <div\n className={cn(\n 'ald-form-item ant-form-item ant-row tw-mb-6',\n hidden && 'tw-hidden',\n showRequired && 'ald-form-item-required',\n statusClassName(status),\n layout === 'horizontal' && 'tw-flex tw-flex-row tw-items-start',\n layout === 'inline' &&\n 'tw-mr-4 tw-inline-flex tw-flex-row tw-items-start',\n className,\n )}\n style={customStyle as React.CSSProperties}\n >\n {labelNode}\n {controlNode}\n </div>\n );\n}\n\nconst AldFormItem = function (props: IFormItemProps) {\n const {\n labelWidth,\n style = {},\n label,\n name,\n rules,\n children,\n className,\n required,\n hidden,\n initialValue,\n dependencies,\n shouldUpdate,\n help,\n extra,\n validateTrigger,\n valuePropName,\n getValueFromEvent,\n normalize,\n getValueProps,\n noStyle,\n labelCol,\n wrapperCol,\n validateStatus,\n colon,\n trigger,\n } = props;\n\n const formContext = useContext(FormContext);\n\n const customStyle = {\n ...style,\n ...(labelWidth ? { '--label-width': `${labelWidth}px` } : {}),\n ...(props.labelAlign ? { '--label-align': props.labelAlign } : {}),\n };\n\n // If no name is provided (e.g. a submit button wrapper), we don't need Field\n // Also when shouldUpdate or dependencies are used without name, Field is still needed for re-render\n const needField =\n (name !== null && name !== undefined) ||\n (shouldUpdate !== null && shouldUpdate !== undefined) ||\n (dependencies !== null && dependencies !== undefined);\n\n if (!needField) {\n return (\n <FormItemLayout\n label={label}\n help={help}\n extra={extra}\n required={required}\n rules={rules}\n hidden={hidden}\n className={className}\n customStyle={customStyle as React.CSSProperties}\n noStyle={noStyle}\n labelCol={labelCol}\n wrapperCol={wrapperCol}\n validateStatus={validateStatus}\n colon={colon}\n formContext={formContext}\n >\n {children as React.ReactNode}\n </FormItemLayout>\n );\n }\n\n return (\n <Field\n name={name}\n rules={rules}\n initialValue={initialValue}\n dependencies={dependencies}\n shouldUpdate={shouldUpdate}\n validateTrigger={validateTrigger}\n trigger={trigger}\n valuePropName={valuePropName}\n getValueFromEvent={getValueFromEvent}\n normalize={normalize}\n getValueProps={getValueProps}\n >\n {(control, meta, form) => {\n // If children is a render function (shouldUpdate / dependencies pattern),\n // call it with the form instance and wrap in layout\n if (typeof children === 'function') {\n const childContent = (\n children as (form: RcFormInstance) => React.ReactNode\n )(form);\n if (noStyle) {\n return childContent;\n }\n return (\n <FormItemLayout\n label={label}\n meta={meta}\n help={help}\n extra={extra}\n required={required}\n rules={rules}\n hidden={hidden}\n className={className}\n customStyle={customStyle as React.CSSProperties}\n noStyle={noStyle}\n labelCol={labelCol}\n wrapperCol={wrapperCol}\n validateStatus={validateStatus}\n colon={colon}\n formContext={formContext}\n >\n {childContent}\n </FormItemLayout>\n );\n }\n\n // For noStyle, just clone with control props\n if (noStyle) {\n if (React.isValidElement(children)) {\n return React.cloneElement(\n children as React.ReactElement<any>,\n mergeControlProps(\n (children as React.ReactElement<any>).props,\n control,\n ),\n );\n }\n return children;\n }\n\n // Clone control props onto the single child element\n let childNode: React.ReactNode = children;\n if (React.isValidElement(children)) {\n childNode = React.cloneElement(\n children as React.ReactElement<any>,\n mergeControlProps(\n (children as React.ReactElement<any>).props,\n control,\n ),\n );\n }\n\n return (\n <FormItemLayout\n label={label}\n meta={meta}\n help={help}\n extra={extra}\n required={required}\n rules={rules}\n hidden={hidden}\n className={className}\n customStyle={customStyle as React.CSSProperties}\n labelCol={labelCol}\n wrapperCol={wrapperCol}\n validateStatus={validateStatus}\n colon={colon}\n formContext={formContext}\n >\n {childNode}\n </FormItemLayout>\n );\n }}\n </Field>\n );\n};\n\nfunction useFormItemStatus() {\n const ctx = useContext(FormItemInputContext);\n return {\n status: ctx.status,\n errors: ctx.errors ?? [],\n warnings: ctx.warnings ?? [],\n };\n}\n\nAldFormItem.useStatus = useFormItemStatus;\n\n// ============== ErrorList ==============\n\nfunction ErrorListComponent(props: ErrorListProps) {\n const { errors, className } = props;\n if (!errors || errors.length === 0) return null;\n return (\n <div className={cn('ald-form-error-list', className)}>\n {errors.map((err, i) => (\n <div\n key={i}\n className=\"tw-text-xs tw-text-[var(--content-negative-secondary)]\"\n >\n {err}\n </div>\n ))}\n </div>\n );\n}\n\n// ============== useFormInstance ==============\n\nfunction useFormInstance<T = any>(): FormInstance<T> {\n const form = useContext(FieldContext);\n return form as unknown as FormInstance<T>;\n}\n\n// ============== Compound component ==============\n\ntype InternalFormType = typeof AldForm;\ntype CompoundedComponent = InternalFormType & {\n useForm: <T = any>(...args: any[]) => [FormInstance<T>];\n useFormInstance: typeof useFormInstance;\n /** Loose-typed useWatch for antd v4 compat */\n useWatch: <T = any>(name: LooseNamePath, form?: FormInstance) => T;\n Item: typeof AldFormItem;\n List: typeof List;\n ErrorList: typeof ErrorListComponent;\n Provider: typeof FormProvider;\n create: () => void;\n};\n\nconst Form = AldForm as CompoundedComponent;\n\nForm.Item = AldFormItem;\nForm.List = List;\nForm.ErrorList = ErrorListComponent;\nForm.useForm = rcUseForm as CompoundedComponent['useForm'];\nForm.useFormInstance = useFormInstance;\nForm.useWatch = useWatch;\nForm.Provider = FormProvider;\nForm.create = () => {\n console.warn('Form.create is deprecated. Please use Form.useForm() instead.');\n};\n\nexport type { Rule, RuleObject, RuleRender };\nexport default Form;\n"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../src/Form/index.tsx"],"sourcesContent":["import RcForm, {\n Field,\n FormInstance as RcFormInstance,\n FormProvider,\n List,\n useForm as rcUseForm,\n useWatch,\n} from 'rc-field-form';\nimport type { FormProps as RcFormProps } from 'rc-field-form';\nimport FieldContext from 'rc-field-form/es/FieldContext';\nimport type { Rule, RuleObject, RuleRender } from 'rc-field-form/es/interface';\nimport type { Meta, NamePath } from 'rc-field-form/es/interface';\nimport React, { forwardRef, useContext, useMemo } from 'react';\nimport SizeContext, {\n SizeContextProvider,\n} from '../ConfigProvider/sizeContext';\nimport DisabledContext from '../ConfigProvider/DisabledContext';\nimport { cn } from '../lib/utils';\nimport {\n FormContext,\n FormItemInputContext,\n type ValidateStatus,\n} from './FormItemContext';\n\n/**\n * Loose NamePath: accepts string, number, or array of them.\n * antd v4 uses loose paths; rc-field-form v2 uses strict DeepNamePath.\n * We override to keep backward compatibility.\n */\ntype LooseNamePath = string | number | (string | number)[];\n\n/**\n * FormInstance — extends rc-field-form FormInstance with loose-typed overloads\n * to maintain antd v4 backward compatibility. Uses intersection so that both\n * strict DeepNamePath and loose LooseNamePath signatures are accepted.\n */\nexport type FormInstance<Values = any> = RcFormInstance<Values> & {\n getFieldValue(name: LooseNamePath): any;\n setFieldValue(name: LooseNamePath, value: any): void;\n setFieldsValue(values: Record<string, any>): void;\n getFieldsValue(): Values;\n getFieldsValue(\n nameList: LooseNamePath[] | true,\n filterFunc?: (meta: Meta) => boolean,\n ): any;\n getFieldError(name: LooseNamePath): string[];\n getFieldsError(\n nameList?: LooseNamePath[],\n ): { name: (string | number)[]; errors: string[] }[];\n getFieldWarning(name: LooseNamePath): string[];\n isFieldTouched(name: LooseNamePath): boolean;\n isFieldsTouched(\n nameList?: LooseNamePath[],\n allFieldsTouched?: boolean,\n ): boolean;\n isFieldValidating(name: LooseNamePath): boolean;\n isFieldsValidating(nameList?: LooseNamePath[]): boolean;\n setFields(fields: FieldData[]): void;\n resetFields(fields?: LooseNamePath[]): void;\n validateFields(nameList?: LooseNamePath[]): Promise<Values>;\n /** Scroll to field position (antd-compatible extension) */\n scrollToField?(\n name: LooseNamePath,\n options?: { behavior?: 'smooth' | 'auto' },\n ): void;\n};\n\n// FormProps compatible with antd\nexport interface FormProps<Values = any> extends Omit<RcFormProps, 'form'> {\n form?: FormInstance<Values>;\n layout?: 'horizontal' | 'vertical' | 'inline';\n size?: 'small' | 'middle' | 'large';\n colon?: boolean;\n disabled?: boolean;\n labelCol?: { span?: number; offset?: number };\n wrapperCol?: { span?: number; offset?: number };\n className?: string;\n style?: React.CSSProperties;\n requiredMark?: boolean | 'optional';\n labelWidth?: number;\n labelAlign?: 'left' | 'right';\n}\n\n// FormItemProps\nexport interface FormItemProps {\n name?: NamePath;\n label?: React.ReactNode;\n rules?: Rule[];\n children?: React.ReactNode | ((form: RcFormInstance) => React.ReactNode);\n className?: string;\n style?: React.CSSProperties;\n required?: boolean;\n hidden?: boolean;\n initialValue?: any;\n dependencies?: NamePath[];\n shouldUpdate?: boolean | ((prevValues: any, curValues: any) => boolean);\n help?: React.ReactNode;\n extra?: React.ReactNode;\n validateTrigger?: string | string[];\n valuePropName?: string;\n getValueFromEvent?: (...args: any[]) => any;\n noStyle?: boolean;\n labelWidth?: number;\n tooltip?:\n | React.ReactNode\n | { title?: React.ReactNode; icon?: React.ReactNode };\n labelCol?: { span?: number; offset?: number; [key: string]: any };\n wrapperCol?: { span?: number; offset?: number; [key: string]: any };\n validateStatus?: ValidateStatus;\n colon?: boolean;\n trigger?: string;\n normalize?: (value: any, prevValue: any, allValues: any) => any;\n getValueProps?: (value: any) => Record<string, any>;\n}\n\n/** antd v4 compat: FormLabelAlign */\nexport type FormLabelAlign = 'left' | 'right';\n\n/** antd v4 compat: FieldData */\nexport type FieldData = {\n name: NamePath;\n value?: any;\n touched?: boolean;\n validating?: boolean;\n errors?: string[];\n};\n\nexport interface ErrorListProps {\n errors?: React.ReactNode[];\n help?: React.ReactNode;\n className?: string;\n}\n\nexport type FormListFieldData = {\n name: number;\n key: number;\n isListField: boolean;\n};\n\nexport type FormListOperation = {\n add: (defaultValue?: any, insertIndex?: number) => void;\n remove: (index: number | number[]) => void;\n move: (from: number, to: number) => void;\n};\n\nexport type FormListProps = {\n name: NamePath;\n rules?: Rule[];\n children: (\n fields: FormListFieldData[],\n operation: FormListOperation,\n meta: { errors: React.ReactNode[] },\n ) => React.ReactNode;\n initialValue?: any[];\n};\n\n// ============== Helpers ==============\n\n/** Convert a 24-column span/offset to Tailwind-compatible inline styles */\nfunction colStyle(col?: {\n span?: number;\n offset?: number;\n}): React.CSSProperties | undefined {\n if (!col) return undefined;\n const s: React.CSSProperties = {};\n if (col.span !== null && col.span !== undefined) {\n // 24-column grid: width = span / 24 * 100%\n s.width = `${(col.span / 24) * 100}%`;\n s.flex = `0 0 ${(col.span / 24) * 100}%`;\n }\n if (col.offset !== null && col.offset !== undefined && col.offset > 0) {\n s.marginLeft = `${(col.offset / 24) * 100}%`;\n }\n return s;\n}\n\nfunction mergeControlProps(\n childProps: Record<string, any>,\n control: Record<string, any>,\n) {\n const mergedControl = { ...control };\n\n Object.keys(control).forEach((key) => {\n const controlHandler = control[key];\n const childHandler = childProps[key];\n\n if (\n typeof controlHandler === 'function' &&\n typeof childHandler === 'function'\n ) {\n mergedControl[key] = (...args: any[]) => {\n controlHandler(...args);\n childHandler(...args);\n };\n }\n });\n\n return mergedControl;\n}\n\n// ============== Form ==============\n\nconst AldForm = forwardRef((props: any, ref: any) => {\n const contextSize = useContext(SizeContext);\n const {\n children,\n size = contextSize,\n labelWidth,\n style = {},\n className,\n layout = 'horizontal',\n disabled,\n labelCol,\n wrapperCol,\n colon = false,\n requiredMark,\n labelAlign,\n ...restProps\n } = props;\n const customStyle = {\n ...style,\n ...(labelWidth ? { '--label-width': `${labelWidth}px` } : {}),\n ...(labelAlign ? { '--label-align': labelAlign } : {}),\n };\n\n const formContextValue = useMemo(\n () => ({\n layout,\n labelCol,\n wrapperCol,\n colon,\n requiredMark,\n labelWidth,\n labelAlign,\n }),\n [layout, labelCol, wrapperCol, colon, requiredMark, labelWidth, labelAlign],\n );\n\n return (\n <FormContext.Provider value={formContextValue}>\n <DisabledContext.Provider value={disabled}>\n <SizeContextProvider size={size}>\n <RcForm\n style={customStyle}\n className={cn(\n 'ald-form ant-form',\n `ald-form-${layout}`,\n `ant-form-${layout}`,\n className,\n )}\n {...restProps}\n ref={ref}\n >\n {children}\n </RcForm>\n </SizeContextProvider>\n </DisabledContext.Provider>\n </FormContext.Provider>\n );\n}) as <Values = any>(\n props: React.PropsWithChildren<FormProps<Values>> & {\n ref?: React.Ref<FormInstance<Values>>;\n labelWidth?: number;\n },\n) => React.ReactElement;\n\n// ============== Form.Item ==============\n\ninterface IFormItemProps extends FormItemProps {\n labelWidth?: number;\n labelAlign?: 'left' | 'right';\n}\n\n/** Derive status from meta or manual validateStatus */\nfunction deriveStatus(\n meta?: Meta,\n validateStatus?: ValidateStatus,\n): ValidateStatus {\n if (validateStatus) return validateStatus;\n if (!meta) return '';\n if (meta.validating) return 'validating';\n if (meta.errors && meta.errors.length > 0) return 'error';\n if (meta.warnings && meta.warnings.length > 0) return 'warning';\n if (meta.touched) return 'success';\n return '';\n}\n\n/** Status-based border class for the control wrapper */\nfunction statusClassName(status: ValidateStatus): string {\n switch (status) {\n case 'error':\n return 'ald-form-item-has-error';\n case 'warning':\n return 'ald-form-item-has-warning';\n case 'success':\n return 'ald-form-item-has-success';\n case 'validating':\n return 'ald-form-item-is-validating';\n default:\n return '';\n }\n}\n\n/** Render the inner label + control layout, receiving meta from Field */\nfunction FormItemLayout({\n label,\n children,\n meta,\n help,\n extra,\n required,\n rules,\n hidden,\n className,\n customStyle,\n noStyle,\n labelCol: itemLabelCol,\n wrapperCol: itemWrapperCol,\n validateStatus: manualStatus,\n colon: itemColon,\n formContext,\n}: {\n label?: React.ReactNode;\n children: React.ReactNode;\n meta?: Meta;\n help?: React.ReactNode;\n extra?: React.ReactNode;\n required?: boolean;\n rules?: Rule[];\n hidden?: boolean;\n className?: string;\n customStyle?: React.CSSProperties;\n noStyle?: boolean;\n labelCol?: { span?: number; offset?: number };\n wrapperCol?: { span?: number; offset?: number };\n validateStatus?: ValidateStatus;\n colon?: boolean;\n formContext: {\n layout?: string;\n labelCol?: { span?: number; offset?: number };\n wrapperCol?: { span?: number; offset?: number };\n colon?: boolean;\n requiredMark?: boolean | 'optional';\n labelWidth?: number;\n };\n}) {\n const status = deriveStatus(meta, manualStatus);\n const errors = useMemo(() => meta?.errors ?? [], [meta?.errors]);\n const warnings = useMemo(() => meta?.warnings ?? [], [meta?.warnings]);\n\n // Provide status context to child controls\n const itemInputContextValue = useMemo(\n () => ({\n status,\n isFormItemInput: true,\n errors,\n warnings,\n }),\n [status, errors, warnings],\n );\n\n if (noStyle) {\n return <>{children}</>;\n }\n\n // Determine if we should show required mark\n const { requiredMark } = formContext;\n const rulesRequired =\n rules && rules.some((r: any) => typeof r === 'object' && r && r.required);\n const isRequired =\n required || rulesRequired || (meta && (meta as any).required);\n const showRequired = requiredMark !== false && isRequired;\n const showOptional = requiredMark === 'optional' && !isRequired;\n\n // Resolve cols: item-level overrides form-level\n const resolvedLabelCol = itemLabelCol ?? formContext.labelCol;\n const resolvedWrapperCol = itemWrapperCol ?? formContext.wrapperCol;\n const layout = formContext.layout || 'horizontal';\n const showColon =\n (itemColon ?? formContext.colon) !== false && layout === 'horizontal';\n\n // Decide whether to use grid-style layout\n const useGridLayout =\n layout === 'horizontal' && (resolvedLabelCol || resolvedWrapperCol);\n\n // Determine display errors: if help is provided, show help instead of validation errors\n const displayMessages = help !== null && help !== undefined ? [help] : errors;\n const hasError = status === 'error' || (errors.length > 0 && help === null);\n const hasWarning =\n status === 'warning' || (warnings.length > 0 && help === null);\n const hasLabel = label !== null && label !== undefined && label !== '';\n\n const labelNode = hasLabel ? (\n <div\n className={cn(\n 'ald-form-item-label ant-form-item-label',\n // tw-block 不能省:label 容器同时挂了 ant-form-item-label 兼容 class,\n // 消费方残留的 antd 样式会把它设为 inline-block,导致 vertical 布局下\n // label 缩成内容宽而非整行铺在控件上方\n layout === 'vertical' && 'tw-mb-1 tw-block',\n layout === 'horizontal' && 'tw-mr-3 tw-shrink-0',\n )}\n style={useGridLayout ? colStyle(resolvedLabelCol) : undefined}\n >\n <label\n className={cn(\n 'tw-text-sm tw-font-medium tw-text-[var(--alias-colors-text-subtle,var(--content-secondary))]',\n !showColon && 'ant-form-item-no-colon',\n )}\n >\n {showRequired && (\n <span className=\"tw-mr-1 tw-text-[var(--content-negative-primary)]\">\n *\n </span>\n )}\n {label}\n {showOptional && (\n <span className=\"tw-ml-1 tw-text-xs tw-font-normal tw-text-[var(--content-secondary)]\">\n (optional)\n </span>\n )}\n {showColon && label ? ':' : null}\n </label>\n </div>\n ) : null;\n\n const controlNode = (\n <div\n className={cn(\n 'ald-form-item-control ant-form-item-control',\n layout === 'horizontal' && 'tw-flex-1',\n )}\n style={useGridLayout ? colStyle(resolvedWrapperCol) : undefined}\n >\n <FormItemInputContext.Provider value={itemInputContextValue}>\n <div className=\"ald-form-item-control-input\">\n <div className=\"ald-form-item-control-input-content\">{children}</div>\n </div>\n </FormItemInputContext.Provider>\n {/* 始终渲染错误容器,避免 DOM 增删触发 Radix FocusScope MutationObserver 劫持焦点 */}\n <div\n className={cn(\n 'ald-form-item-explain ant-form-item-explain tw-text-xs tw-transition-all tw-duration-200',\n displayMessages.length > 0 && 'tw-mt-1',\n hasError && 'tw-text-[var(--content-negative-secondary)]',\n hasWarning &&\n !hasError &&\n 'tw-text-[color:var(--content-warning-primary,#faad14)]',\n !hasError &&\n !hasWarning &&\n help !== null &&\n help !== undefined &&\n 'tw-text-[var(--content-secondary)]',\n )}\n style={displayMessages.length === 0 ? { display: 'none' } : undefined}\n >\n {displayMessages.map((msg, i) => (\n <div key={i}>{msg}</div>\n ))}\n </div>\n {extra && (\n <div className=\"ald-form-item-extra tw-mt-1 tw-text-xs tw-text-[var(--content-secondary)]\">\n {extra}\n </div>\n )}\n </div>\n );\n\n return (\n <div\n className={cn(\n 'ald-form-item ant-form-item ant-row tw-mb-6',\n hidden && 'tw-hidden',\n showRequired && 'ald-form-item-required',\n statusClassName(status),\n layout === 'horizontal' && 'tw-flex tw-flex-row tw-items-start',\n layout === 'inline' &&\n 'tw-mr-4 tw-inline-flex tw-flex-row tw-items-start',\n className,\n )}\n style={customStyle as React.CSSProperties}\n >\n {labelNode}\n {controlNode}\n </div>\n );\n}\n\nconst AldFormItem = function (props: IFormItemProps) {\n const {\n labelWidth,\n style = {},\n label,\n name,\n rules,\n children,\n className,\n required,\n hidden,\n initialValue,\n dependencies,\n shouldUpdate,\n help,\n extra,\n validateTrigger,\n valuePropName,\n getValueFromEvent,\n normalize,\n getValueProps,\n noStyle,\n labelCol,\n wrapperCol,\n validateStatus,\n colon,\n trigger,\n } = props;\n\n const formContext = useContext(FormContext);\n\n const customStyle = {\n ...style,\n ...(labelWidth ? { '--label-width': `${labelWidth}px` } : {}),\n ...(props.labelAlign ? { '--label-align': props.labelAlign } : {}),\n };\n\n // If no name is provided (e.g. a submit button wrapper), we don't need Field\n // Also when shouldUpdate or dependencies are used without name, Field is still needed for re-render\n const needField =\n (name !== null && name !== undefined) ||\n (shouldUpdate !== null && shouldUpdate !== undefined) ||\n (dependencies !== null && dependencies !== undefined);\n\n if (!needField) {\n return (\n <FormItemLayout\n label={label}\n help={help}\n extra={extra}\n required={required}\n rules={rules}\n hidden={hidden}\n className={className}\n customStyle={customStyle as React.CSSProperties}\n noStyle={noStyle}\n labelCol={labelCol}\n wrapperCol={wrapperCol}\n validateStatus={validateStatus}\n colon={colon}\n formContext={formContext}\n >\n {children as React.ReactNode}\n </FormItemLayout>\n );\n }\n\n return (\n <Field\n name={name}\n rules={rules}\n initialValue={initialValue}\n dependencies={dependencies}\n shouldUpdate={shouldUpdate}\n validateTrigger={validateTrigger}\n trigger={trigger}\n valuePropName={valuePropName}\n getValueFromEvent={getValueFromEvent}\n normalize={normalize}\n getValueProps={getValueProps}\n >\n {(control, meta, form) => {\n // If children is a render function (shouldUpdate / dependencies pattern),\n // call it with the form instance and wrap in layout\n if (typeof children === 'function') {\n const childContent = (\n children as (form: RcFormInstance) => React.ReactNode\n )(form);\n if (noStyle) {\n return childContent;\n }\n return (\n <FormItemLayout\n label={label}\n meta={meta}\n help={help}\n extra={extra}\n required={required}\n rules={rules}\n hidden={hidden}\n className={className}\n customStyle={customStyle as React.CSSProperties}\n noStyle={noStyle}\n labelCol={labelCol}\n wrapperCol={wrapperCol}\n validateStatus={validateStatus}\n colon={colon}\n formContext={formContext}\n >\n {childContent}\n </FormItemLayout>\n );\n }\n\n // For noStyle, just clone with control props\n if (noStyle) {\n if (React.isValidElement(children)) {\n return React.cloneElement(\n children as React.ReactElement<any>,\n mergeControlProps(\n (children as React.ReactElement<any>).props,\n control,\n ),\n );\n }\n return children;\n }\n\n // Clone control props onto the single child element\n let childNode: React.ReactNode = children;\n if (React.isValidElement(children)) {\n childNode = React.cloneElement(\n children as React.ReactElement<any>,\n mergeControlProps(\n (children as React.ReactElement<any>).props,\n control,\n ),\n );\n }\n\n return (\n <FormItemLayout\n label={label}\n meta={meta}\n help={help}\n extra={extra}\n required={required}\n rules={rules}\n hidden={hidden}\n className={className}\n customStyle={customStyle as React.CSSProperties}\n labelCol={labelCol}\n wrapperCol={wrapperCol}\n validateStatus={validateStatus}\n colon={colon}\n formContext={formContext}\n >\n {childNode}\n </FormItemLayout>\n );\n }}\n </Field>\n );\n};\n\nfunction useFormItemStatus() {\n const ctx = useContext(FormItemInputContext);\n return {\n status: ctx.status,\n errors: ctx.errors ?? [],\n warnings: ctx.warnings ?? [],\n };\n}\n\nAldFormItem.useStatus = useFormItemStatus;\n\n// ============== ErrorList ==============\n\nfunction ErrorListComponent(props: ErrorListProps) {\n const { errors, className } = props;\n if (!errors || errors.length === 0) return null;\n return (\n <div className={cn('ald-form-error-list', className)}>\n {errors.map((err, i) => (\n <div\n key={i}\n className=\"tw-text-xs tw-text-[var(--content-negative-secondary)]\"\n >\n {err}\n </div>\n ))}\n </div>\n );\n}\n\n// ============== useFormInstance ==============\n\nfunction useFormInstance<T = any>(): FormInstance<T> {\n const form = useContext(FieldContext);\n return form as unknown as FormInstance<T>;\n}\n\n// ============== Compound component ==============\n\ntype InternalFormType = typeof AldForm;\ntype CompoundedComponent = InternalFormType & {\n useForm: <T = any>(...args: any[]) => [FormInstance<T>];\n useFormInstance: typeof useFormInstance;\n /** Loose-typed useWatch for antd v4 compat */\n useWatch: <T = any>(name: LooseNamePath, form?: FormInstance) => T;\n Item: typeof AldFormItem;\n List: typeof List;\n ErrorList: typeof ErrorListComponent;\n Provider: typeof FormProvider;\n create: () => void;\n};\n\nconst Form = AldForm as CompoundedComponent;\n\nForm.Item = AldFormItem;\nForm.List = List;\nForm.ErrorList = ErrorListComponent;\nForm.useForm = rcUseForm as CompoundedComponent['useForm'];\nForm.useFormInstance = useFormInstance;\nForm.useWatch = useWatch;\nForm.Provider = FormProvider;\nForm.create = () => {\n console.warn('Form.create is deprecated. Please use Form.useForm() instead.');\n};\n\nexport type { Rule, RuleObject, RuleRender };\nexport default Form;\n"],"mappings":"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"}
@@ -78,7 +78,7 @@ function InputNumber(props) {
78
78
  const sizeClasses = cn(size === "large" && "ald-input-number-large tw-h-9 tw-text-base", size === "small" && "ald-input-number-small tw-h-7 tw-text-xs", size !== "large" && size !== "small" && "ald-input-number-middle tw-h-8 tw-text-sm");
79
79
  const radiusClasses = cn(size === "large" && "tw-rounded-[8px]", size === "small" && "tw-rounded-[4px]", size !== "large" && size !== "small" && "tw-rounded-[6px]");
80
80
  const inputBox = /* @__PURE__ */ jsxs("div", {
81
- className: cn("ald-input-number tw-inline-flex tw-min-w-0 tw-items-center tw-overflow-hidden", bordered && "tw-border tw-border-solid tw-border-[var(--interaction-border-neutral-normal)]", mergedDisabled ? "ald-input-number-disabled tw-cursor-not-allowed tw-bg-[var(--global-cool-gray-alpha-50)] tw-text-[var(--content-secondary)]" : "tw-bg-[var(--interaction-background-form-field)] tw-text-[var(--content-primary)] hover:tw-border-[var(--interaction-border-hover)]", !hasAddon && sizeClasses, hasAddon ? "tw-h-auto tw-flex-1 tw-self-stretch tw-rounded-none" : radiusClasses, status === "error" && "tw-border-[var(--border-negative-strong)]", status === "warning" && "tw-border-[var(--border-warning-subtle)]", "focus-within:tw-border-[var(--interaction-border-hover)] focus-within:tw-outline focus-within:tw-outline-1 focus-within:tw-outline-[var(--global-blue-500)]", !hasAddon && className),
81
+ className: cn("ald-input-number tw-inline-flex tw-w-[90px] tw-min-w-0 tw-items-center tw-overflow-hidden", bordered && "tw-border tw-border-solid tw-border-[var(--interaction-border-neutral-normal)]", mergedDisabled ? "ald-input-number-disabled tw-cursor-not-allowed tw-bg-[var(--global-cool-gray-alpha-50)] tw-text-[var(--content-secondary)]" : "tw-bg-[var(--interaction-background-form-field)] tw-text-[var(--content-primary)] hover:tw-border-[var(--interaction-border-hover)]", !hasAddon && sizeClasses, hasAddon ? "tw-h-auto tw-flex-1 tw-self-stretch tw-rounded-none" : radiusClasses, status === "error" && "tw-border-[var(--border-negative-strong)]", status === "warning" && "tw-border-[var(--border-warning-subtle)]", "focus-within:tw-border-[var(--interaction-border-hover)] focus-within:tw-outline focus-within:tw-outline-1 focus-within:tw-outline-[var(--global-blue-500)]", !hasAddon && className),
82
82
  style: !hasAddon ? style : void 0,
83
83
  children: [prefix && /* @__PURE__ */ jsx("span", {
84
84
  className: "tw-px-2 tw-text-[var(--content-secondary)]",
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../../src/InputNumber/index.tsx"],"sourcesContent":["import React, {\n useCallback,\n useContext,\n useEffect,\n useRef,\n useState,\n} from 'react';\nimport DisabledContext from '../ConfigProvider/DisabledContext';\nimport SizeContext from '../ConfigProvider/sizeContext';\nimport { cn } from '../lib/utils';\nimport { IInputNumberProps } from './type';\n\nexport default function InputNumber(props: IInputNumberProps) {\n const {\n className,\n disabled: customDisabled,\n size: customSize,\n status,\n value: controlledValue,\n defaultValue,\n min = -Infinity,\n max = Infinity,\n step = 1,\n precision,\n onChange,\n onPressEnter,\n onBlur,\n onFocus,\n formatter,\n parser,\n prefix,\n addonBefore,\n addonAfter,\n placeholder,\n autoFocus,\n bordered = true,\n keyboard = true,\n readonly: readOnly,\n style,\n id,\n } = props;\n\n const contentSize = useContext(SizeContext);\n const size = customSize || contentSize || 'middle';\n const disabled = useContext(DisabledContext);\n const mergedDisabled = customDisabled ?? disabled;\n\n const isControlled = 'value' in props;\n const [innerValue, setInnerValue] = useState<number | null | undefined>(\n defaultValue ?? null,\n );\n const currentValue = isControlled ? controlledValue : innerValue;\n\n const [inputStr, setInputStr] = useState(\n currentValue !== null && currentValue !== undefined\n ? String(currentValue)\n : '',\n );\n const inputRef = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n if (currentValue !== null && currentValue !== undefined) {\n setInputStr(String(currentValue));\n } else {\n setInputStr('');\n }\n }, [currentValue]);\n\n const clamp = useCallback(\n (val: number) => {\n let v = Math.max(min, Math.min(max, val));\n if (precision !== undefined) {\n v = Number(v.toFixed(precision));\n }\n return v;\n },\n [min, max, precision],\n );\n\n const updateValue = useCallback(\n (newVal: number | null) => {\n const clamped = newVal !== null ? clamp(newVal) : null;\n if (!isControlled) setInnerValue(clamped);\n onChange?.(clamped);\n },\n [clamp, isControlled, onChange],\n );\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const raw = e.target.value;\n setInputStr(raw);\n if (raw === '' || raw === '-') return;\n const parsed = parser ? parser(raw) : Number(raw);\n if (!isNaN(parsed)) {\n updateValue(parsed);\n }\n };\n\n const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n if (inputStr === '' || inputStr === '-') {\n updateValue(null);\n setInputStr('');\n } else {\n const parsed = parser ? parser(inputStr) : Number(inputStr);\n if (!isNaN(parsed)) {\n const clamped = clamp(parsed);\n updateValue(clamped);\n setInputStr(String(clamped));\n }\n }\n onBlur?.(e);\n };\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === 'Enter') {\n onPressEnter?.(e);\n }\n if (!keyboard) return;\n const numStep = typeof step === 'string' ? Number(step) : step;\n if (e.key === 'ArrowUp') {\n e.preventDefault();\n updateValue(clamp((currentValue ?? 0) + numStep));\n } else if (e.key === 'ArrowDown') {\n e.preventDefault();\n updateValue(clamp((currentValue ?? 0) - numStep));\n }\n };\n\n const displayValue = formatter\n ? formatter(currentValue ?? undefined, {\n userTyping: document.activeElement === inputRef.current,\n input: inputStr,\n })\n : inputStr;\n\n const hasAddon = addonBefore || addonAfter;\n\n const sizeClasses = cn(\n size === 'large' && 'ald-input-number-large tw-h-9 tw-text-base',\n size === 'small' && 'ald-input-number-small tw-h-7 tw-text-xs',\n size !== 'large' &&\n size !== 'small' &&\n 'ald-input-number-middle tw-h-8 tw-text-sm',\n );\n\n const radiusClasses = cn(\n size === 'large' && 'tw-rounded-[8px]',\n size === 'small' && 'tw-rounded-[4px]',\n size !== 'large' && size !== 'small' && 'tw-rounded-[6px]',\n );\n\n const inputBox = (\n <div\n className={cn(\n 'ald-input-number tw-inline-flex tw-min-w-0 tw-items-center tw-overflow-hidden',\n bordered &&\n 'tw-border tw-border-solid tw-border-[var(--interaction-border-neutral-normal)]',\n mergedDisabled\n ? 'ald-input-number-disabled tw-cursor-not-allowed tw-bg-[var(--global-cool-gray-alpha-50)] tw-text-[var(--content-secondary)]'\n : 'tw-bg-[var(--interaction-background-form-field)] tw-text-[var(--content-primary)] hover:tw-border-[var(--interaction-border-hover)]',\n !hasAddon && sizeClasses,\n hasAddon\n ? 'tw-h-auto tw-flex-1 tw-self-stretch tw-rounded-none'\n : radiusClasses,\n status === 'error' && 'tw-border-[var(--border-negative-strong)]',\n status === 'warning' && 'tw-border-[var(--border-warning-subtle)]',\n 'focus-within:tw-border-[var(--interaction-border-hover)] focus-within:tw-outline focus-within:tw-outline-1 focus-within:tw-outline-[var(--global-blue-500)]',\n !hasAddon && className,\n )}\n style={!hasAddon ? style : undefined}\n >\n {prefix && (\n <span className=\"tw-px-2 tw-text-[var(--content-secondary)]\">\n {prefix}\n </span>\n )}\n <input\n ref={inputRef}\n id={id}\n type=\"text\"\n inputMode=\"numeric\"\n // size=1 让 <input> 的 intrinsic 宽度坍缩到 1 个字符,\n // 在 flex 父容器中按 width / flex-1 受控,避免默认 size=20 把 inline-flex 外层撑出 ~150px 内容宽度。\n size={1}\n className={cn(\n 'tw-min-w-0 tw-flex-1 tw-border-0 tw-bg-transparent tw-px-[7px] tw-text-inherit tw-outline-none',\n mergedDisabled &&\n 'tw-cursor-not-allowed tw-text-[var(--content-secondary)]',\n )}\n value={displayValue}\n onChange={handleChange}\n onBlur={handleBlur}\n onFocus={onFocus}\n onKeyDown={handleKeyDown}\n disabled={mergedDisabled}\n readOnly={readOnly}\n autoFocus={autoFocus}\n placeholder={placeholder}\n />\n </div>\n );\n\n if (!hasAddon) return inputBox;\n\n return (\n <div\n className={cn(\n 'ald-input-number-group tw-inline-flex tw-w-full tw-items-stretch',\n sizeClasses,\n radiusClasses,\n mergedDisabled && 'ald-input-number-disabled',\n className,\n )}\n style={style}\n >\n {addonBefore && (\n <span\n className={cn(\n 'ald-input-number-addon tw-flex tw-shrink-0 tw-items-center tw-border tw-border-r-0 tw-border-solid tw-border-[var(--interaction-border-neutral-normal)] tw-bg-[var(--background-neutral-subtle)] tw-px-3 tw-text-[var(--content-secondary)]',\n size === 'large' && 'tw-rounded-l-[8px]',\n size === 'small' && 'tw-rounded-l-[4px]',\n size !== 'large' && size !== 'small' && 'tw-rounded-l-[6px]',\n )}\n >\n {addonBefore}\n </span>\n )}\n {inputBox}\n {addonAfter && (\n <span\n className={cn(\n 'ald-input-number-addon tw-flex tw-shrink-0 tw-items-center tw-border tw-border-l-0 tw-border-solid tw-border-[var(--interaction-border-neutral-normal)] tw-bg-[var(--background-neutral-subtle)] tw-px-3 tw-text-[var(--content-secondary)]',\n size === 'large' && 'tw-rounded-r-[8px]',\n size === 'small' && 'tw-rounded-r-[4px]',\n size !== 'large' && size !== 'small' && 'tw-rounded-r-[6px]',\n )}\n >\n {addonAfter}\n </span>\n )}\n </div>\n );\n}\n\nexport type { IInputNumberProps };\n"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../src/InputNumber/index.tsx"],"sourcesContent":["import React, {\n useCallback,\n useContext,\n useEffect,\n useRef,\n useState,\n} from 'react';\nimport DisabledContext from '../ConfigProvider/DisabledContext';\nimport SizeContext from '../ConfigProvider/sizeContext';\nimport { cn } from '../lib/utils';\nimport { IInputNumberProps } from './type';\n\nexport default function InputNumber(props: IInputNumberProps) {\n const {\n className,\n disabled: customDisabled,\n size: customSize,\n status,\n value: controlledValue,\n defaultValue,\n min = -Infinity,\n max = Infinity,\n step = 1,\n precision,\n onChange,\n onPressEnter,\n onBlur,\n onFocus,\n formatter,\n parser,\n prefix,\n addonBefore,\n addonAfter,\n placeholder,\n autoFocus,\n bordered = true,\n keyboard = true,\n readonly: readOnly,\n style,\n id,\n } = props;\n\n const contentSize = useContext(SizeContext);\n const size = customSize || contentSize || 'middle';\n const disabled = useContext(DisabledContext);\n const mergedDisabled = customDisabled ?? disabled;\n\n const isControlled = 'value' in props;\n const [innerValue, setInnerValue] = useState<number | null | undefined>(\n defaultValue ?? null,\n );\n const currentValue = isControlled ? controlledValue : innerValue;\n\n const [inputStr, setInputStr] = useState(\n currentValue !== null && currentValue !== undefined\n ? String(currentValue)\n : '',\n );\n const inputRef = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n if (currentValue !== null && currentValue !== undefined) {\n setInputStr(String(currentValue));\n } else {\n setInputStr('');\n }\n }, [currentValue]);\n\n const clamp = useCallback(\n (val: number) => {\n let v = Math.max(min, Math.min(max, val));\n if (precision !== undefined) {\n v = Number(v.toFixed(precision));\n }\n return v;\n },\n [min, max, precision],\n );\n\n const updateValue = useCallback(\n (newVal: number | null) => {\n const clamped = newVal !== null ? clamp(newVal) : null;\n if (!isControlled) setInnerValue(clamped);\n onChange?.(clamped);\n },\n [clamp, isControlled, onChange],\n );\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const raw = e.target.value;\n setInputStr(raw);\n if (raw === '' || raw === '-') return;\n const parsed = parser ? parser(raw) : Number(raw);\n if (!isNaN(parsed)) {\n updateValue(parsed);\n }\n };\n\n const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n if (inputStr === '' || inputStr === '-') {\n updateValue(null);\n setInputStr('');\n } else {\n const parsed = parser ? parser(inputStr) : Number(inputStr);\n if (!isNaN(parsed)) {\n const clamped = clamp(parsed);\n updateValue(clamped);\n setInputStr(String(clamped));\n }\n }\n onBlur?.(e);\n };\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === 'Enter') {\n onPressEnter?.(e);\n }\n if (!keyboard) return;\n const numStep = typeof step === 'string' ? Number(step) : step;\n if (e.key === 'ArrowUp') {\n e.preventDefault();\n updateValue(clamp((currentValue ?? 0) + numStep));\n } else if (e.key === 'ArrowDown') {\n e.preventDefault();\n updateValue(clamp((currentValue ?? 0) - numStep));\n }\n };\n\n const displayValue = formatter\n ? formatter(currentValue ?? undefined, {\n userTyping: document.activeElement === inputRef.current,\n input: inputStr,\n })\n : inputStr;\n\n const hasAddon = addonBefore || addonAfter;\n\n const sizeClasses = cn(\n size === 'large' && 'ald-input-number-large tw-h-9 tw-text-base',\n size === 'small' && 'ald-input-number-small tw-h-7 tw-text-xs',\n size !== 'large' &&\n size !== 'small' &&\n 'ald-input-number-middle tw-h-8 tw-text-sm',\n );\n\n const radiusClasses = cn(\n size === 'large' && 'tw-rounded-[8px]',\n size === 'small' && 'tw-rounded-[4px]',\n size !== 'large' && size !== 'small' && 'tw-rounded-[6px]',\n );\n\n const inputBox = (\n <div\n className={cn(\n // 默认宽度 90px 与 antd InputNumber 对齐:input 上 size={1} 会让 intrinsic\n // 宽度坍缩到 1 字符,若 wrapper 也不给宽度,整个组件在 flex / inline 上下\n // 文里就只剩 ~9px。消费方可通过 className(`w-[xxx]`)或 style 覆盖。\n 'ald-input-number tw-inline-flex tw-w-[90px] tw-min-w-0 tw-items-center tw-overflow-hidden',\n bordered &&\n 'tw-border tw-border-solid tw-border-[var(--interaction-border-neutral-normal)]',\n mergedDisabled\n ? 'ald-input-number-disabled tw-cursor-not-allowed tw-bg-[var(--global-cool-gray-alpha-50)] tw-text-[var(--content-secondary)]'\n : 'tw-bg-[var(--interaction-background-form-field)] tw-text-[var(--content-primary)] hover:tw-border-[var(--interaction-border-hover)]',\n !hasAddon && sizeClasses,\n hasAddon\n ? 'tw-h-auto tw-flex-1 tw-self-stretch tw-rounded-none'\n : radiusClasses,\n status === 'error' && 'tw-border-[var(--border-negative-strong)]',\n status === 'warning' && 'tw-border-[var(--border-warning-subtle)]',\n 'focus-within:tw-border-[var(--interaction-border-hover)] focus-within:tw-outline focus-within:tw-outline-1 focus-within:tw-outline-[var(--global-blue-500)]',\n !hasAddon && className,\n )}\n style={!hasAddon ? style : undefined}\n >\n {prefix && (\n <span className=\"tw-px-2 tw-text-[var(--content-secondary)]\">\n {prefix}\n </span>\n )}\n <input\n ref={inputRef}\n id={id}\n type=\"text\"\n inputMode=\"numeric\"\n // size=1 让 <input> 的 intrinsic 宽度坍缩到 1 个字符,\n // 在 flex 父容器中按 width / flex-1 受控,避免默认 size=20 把 inline-flex 外层撑出 ~150px 内容宽度。\n size={1}\n className={cn(\n 'tw-min-w-0 tw-flex-1 tw-border-0 tw-bg-transparent tw-px-[7px] tw-text-inherit tw-outline-none',\n mergedDisabled &&\n 'tw-cursor-not-allowed tw-text-[var(--content-secondary)]',\n )}\n value={displayValue}\n onChange={handleChange}\n onBlur={handleBlur}\n onFocus={onFocus}\n onKeyDown={handleKeyDown}\n disabled={mergedDisabled}\n readOnly={readOnly}\n autoFocus={autoFocus}\n placeholder={placeholder}\n />\n </div>\n );\n\n if (!hasAddon) return inputBox;\n\n return (\n <div\n className={cn(\n 'ald-input-number-group tw-inline-flex tw-w-full tw-items-stretch',\n sizeClasses,\n radiusClasses,\n mergedDisabled && 'ald-input-number-disabled',\n className,\n )}\n style={style}\n >\n {addonBefore && (\n <span\n className={cn(\n 'ald-input-number-addon tw-flex tw-shrink-0 tw-items-center tw-border tw-border-r-0 tw-border-solid tw-border-[var(--interaction-border-neutral-normal)] tw-bg-[var(--background-neutral-subtle)] tw-px-3 tw-text-[var(--content-secondary)]',\n size === 'large' && 'tw-rounded-l-[8px]',\n size === 'small' && 'tw-rounded-l-[4px]',\n size !== 'large' && size !== 'small' && 'tw-rounded-l-[6px]',\n )}\n >\n {addonBefore}\n </span>\n )}\n {inputBox}\n {addonAfter && (\n <span\n className={cn(\n 'ald-input-number-addon tw-flex tw-shrink-0 tw-items-center tw-border tw-border-l-0 tw-border-solid tw-border-[var(--interaction-border-neutral-normal)] tw-bg-[var(--background-neutral-subtle)] tw-px-3 tw-text-[var(--content-secondary)]',\n size === 'large' && 'tw-rounded-r-[8px]',\n size === 'small' && 'tw-rounded-r-[4px]',\n size !== 'large' && size !== 'small' && 'tw-rounded-r-[6px]',\n )}\n >\n {addonAfter}\n </span>\n )}\n </div>\n );\n}\n\nexport type { IInputNumberProps };\n"],"mappings":"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"}
@@ -28,7 +28,6 @@ function Menu(props) {
28
28
  className: "ald-menu-item-label",
29
29
  title: titleStr,
30
30
  children: [
31
- isSelectableGroup ? /* @__PURE__ */ jsx("div", { className: "ald-menu-item-selection-slot" }) : null,
32
31
  item.icon ? /* @__PURE__ */ jsx("div", {
33
32
  className: "ald-menu-item-label-icon",
34
33
  children: item.icon
@@ -37,9 +36,9 @@ function Menu(props) {
37
36
  className: "ald-menu-item-label-text",
38
37
  children: item.label
39
38
  }),
40
- /* @__PURE__ */ jsx("div", {
39
+ /* @__PURE__ */ jsxs("div", {
41
40
  className: "ald-menu-item-right",
42
- children: /* @__PURE__ */ jsx(Memo$1, { size: 16 })
41
+ children: [isSelectableGroup ? /* @__PURE__ */ jsx("div", { className: "ald-menu-item-selection-slot" }) : null, /* @__PURE__ */ jsx(Memo$1, { size: 16 })]
43
42
  })
44
43
  ]
45
44
  }),
@@ -77,10 +76,6 @@ function Menu(props) {
77
76
  className: "ald-menu-item-label",
78
77
  title: titleStr,
79
78
  children: [
80
- isSelectableGroup ? /* @__PURE__ */ jsx("div", {
81
- className: cn("ald-menu-item-selection-slot", isSelected && "ald-menu-item-selection-slot-selected ald-menu-item-selected-icon"),
82
- children: isSelected ? /* @__PURE__ */ jsx(Memo, {}) : null
83
- }) : null,
84
79
  item.icon ? /* @__PURE__ */ jsx("div", {
85
80
  className: "ald-menu-item-label-icon",
86
81
  children: item.icon
@@ -88,7 +83,14 @@ function Menu(props) {
88
83
  /* @__PURE__ */ jsx("div", {
89
84
  className: "ald-menu-item-label-text",
90
85
  children: item.label
91
- })
86
+ }),
87
+ isSelectableGroup ? /* @__PURE__ */ jsx("div", {
88
+ className: "ald-menu-item-right",
89
+ children: /* @__PURE__ */ jsx("div", {
90
+ className: cn("ald-menu-item-selection-slot", isSelected && "ald-menu-item-selection-slot-selected ald-menu-item-selected-icon"),
91
+ children: isSelected ? /* @__PURE__ */ jsx(Memo, {}) : null
92
+ })
93
+ }) : null
92
94
  ]
93
95
  })
94
96
  }, item.key);
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../../src/Menu/index.tsx"],"sourcesContent":["import {\n ControlledMenu,\n MenuDivider,\n MenuHeader,\n MenuItem,\n SubMenu,\n} from '@szhsin/react-menu';\nimport { cn } from '../lib/utils';\nimport _ from 'lodash';\nimport React, { useRef } from 'react';\nimport { CheckLightLine, ChevronRightLine } from '../Icon';\nimport './menu.css';\n\nexport interface MenuProps {\n onClick?: (info: MenuInfo) => void;\n onBeforeLeafItemClick?: () => void;\n className?: string;\n items: MenuItemType[];\n selectedKeys?: string[];\n menuStyle?: React.CSSProperties;\n rootClosing?: boolean;\n /** @internal 由 Dropdown 注入,禁用内部定位/overflow 计算。不支持含 SubMenu 的菜单 */\n externalOverflow?: boolean;\n}\n\nexport default function Menu(props: MenuProps) {\n const {\n className,\n items,\n onClick: onMenuClick,\n onBeforeLeafItemClick,\n selectedKeys,\n menuStyle,\n rootClosing = false,\n externalOverflow,\n } = props;\n const selectedKeySet = new Set(selectedKeys || []);\n\n const hasDirectSelectedItem = (items: MenuItemType[]): boolean =>\n items.some((item) => {\n if (isSubMenuItem(item)) {\n return selectedKeySet.has(item.key);\n }\n if (isHeaderMenuItem(item) || isDivideMenuItem(item)) {\n return false;\n }\n return selectedKeySet.has(item.key);\n });\n\n const getMenuItems = (items: MenuItemType[], parentPath: string[] = []) => {\n const isSelectableGroup = hasDirectSelectedItem(items);\n\n return items.map((item, index) => {\n if (isDivideMenuItem(item)) {\n return <MenuDivider key={`divider_${index}`} />;\n }\n if (isHeaderMenuItem(item)) {\n return <MenuHeader key={`header_${index}`}>{item.label}</MenuHeader>;\n }\n const currPath = [...parentPath, item.key];\n const titleStr = _.isString(item.label) ? item.label : '';\n const isSelected = selectedKeys?.includes(item.key);\n\n if (isSubMenuItem(item)) {\n const subMenuItemLabel = (\n <div className=\"ald-menu-item-label\" title={titleStr}>\n {isSelectableGroup ? (\n <div className=\"ald-menu-item-selection-slot\" />\n ) : null}\n {item.icon ? (\n <div className=\"ald-menu-item-label-icon\">{item.icon}</div>\n ) : null}\n <div className=\"ald-menu-item-label-text\">{item.label}</div>\n <div className=\"ald-menu-item-right\">\n <ChevronRightLine size={16} />\n </div>\n </div>\n );\n\n return (\n <SubMenu\n key={item.key}\n label={subMenuItemLabel}\n disabled={item.disabled}\n align=\"start\"\n direction=\"right\"\n gap={-8}\n position=\"anchor\"\n shift={0}\n menuStyle={{\n ...menuStyle,\n overflow: isLeafMenu(item.children) ? 'auto' : undefined,\n }}\n menuClassName={cn(\n 'ald-menu-submenu-popup',\n item.popupClassName,\n rootClosing && 'ald-menu-submenu-popup-root-closing',\n )}\n overflow={isLeafMenu(item.children) ? 'auto' : undefined}\n >\n {getMenuItems(item.children, currPath)}\n </SubMenu>\n );\n }\n\n return (\n <MenuItem\n key={item.key}\n className={cn(item.className, {\n 'ald-menu-item-danger': item.danger,\n 'ald-menu-item-selected': isSelected,\n })}\n disabled={item.disabled}\n onClick={({ syntheticEvent }) => {\n onBeforeLeafItemClick?.();\n const menuInfo = {\n key: item.key,\n keyPath: currPath,\n domEvent: syntheticEvent,\n };\n if (item.onClick) {\n item.onClick(menuInfo);\n }\n if (onMenuClick) {\n onMenuClick(menuInfo);\n }\n }}\n >\n <div className=\"ald-menu-item-label\" title={titleStr}>\n {isSelectableGroup ? (\n <div\n className={cn(\n 'ald-menu-item-selection-slot',\n isSelected &&\n 'ald-menu-item-selection-slot-selected ald-menu-item-selected-icon',\n )}\n >\n {isSelected ? <CheckLightLine /> : null}\n </div>\n ) : null}\n {item.icon ? (\n <div className=\"ald-menu-item-label-icon\">{item.icon}</div>\n ) : null}\n <div className=\"ald-menu-item-label-text\">{item.label}</div>\n </div>\n </MenuItem>\n );\n });\n };\n\n const ref = useRef(null);\n\n const leafOverflow = isLeafMenu(items) ? 'auto' : undefined;\n\n return (\n <>\n <div style={{ display: 'none' }} ref={ref} />\n <ControlledMenu\n state=\"open\"\n transition={{ open: true, close: true }}\n transitionTimeout={200}\n submenuOpenDelay={0}\n submenuCloseDelay={0}\n menuStyle={{\n ...menuStyle,\n overflow: externalOverflow ? undefined : leafOverflow,\n }}\n anchorRef={ref}\n className={cn(className, 'ald-menu')}\n position={externalOverflow ? 'initial' : 'auto'}\n captureFocus={false}\n viewScroll={externalOverflow ? 'initial' : 'auto'}\n overflow={externalOverflow ? 'visible' : leafOverflow}\n >\n {getMenuItems(items || [])}\n </ControlledMenu>\n </>\n );\n}\n\nexport function isHeaderMenuItem(\n menuItem: MenuItemType,\n): menuItem is MenuHeaderType {\n return 'type' in menuItem && menuItem.type === 'header';\n}\n\nexport function isDivideMenuItem(\n menuItem: MenuItemType,\n): menuItem is MenuDividerType {\n return 'type' in menuItem && menuItem.type === 'divider';\n}\n\nexport function isSubMenuItem(menuItem: MenuItemType): menuItem is SubMenuType {\n return 'children' in menuItem && !!menuItem.children;\n}\n\nexport function isLeafMenu(menuItems: MenuItemType[]) {\n return !_.some(menuItems, (item) => isSubMenuItem(item));\n}\n\nexport type MenuItemType =\n | ItemType\n | MenuDividerType\n | SubMenuType\n | MenuHeaderType;\n\nexport interface ItemType {\n key: string;\n label: React.ReactNode;\n icon?: React.ReactNode;\n onClick?: (info: MenuInfo) => void;\n danger?: boolean;\n disabled?: boolean;\n className?: string;\n}\n\nexport interface MenuDividerType {\n key?: string;\n type: 'divider';\n}\n\nexport interface MenuHeaderType {\n key?: string;\n type: 'header';\n label: string;\n}\n\nexport interface SubMenuType {\n children: MenuItemType[];\n key: string;\n label: React.ReactNode;\n icon?: React.ReactNode;\n popupClassName?: string;\n disabled?: boolean;\n}\n\nexport interface MenuInfo {\n key: string;\n keyPath: string[];\n domEvent: MouseEvent | KeyboardEvent;\n // 阻止菜单关闭\n keepOpen?: boolean;\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../src/Menu/index.tsx"],"sourcesContent":["import {\n ControlledMenu,\n MenuDivider,\n MenuHeader,\n MenuItem,\n SubMenu,\n} from '@szhsin/react-menu';\nimport { cn } from '../lib/utils';\nimport _ from 'lodash';\nimport React, { useRef } from 'react';\nimport { CheckLightLine, ChevronRightLine } from '../Icon';\nimport './menu.css';\n\nexport interface MenuProps {\n onClick?: (info: MenuInfo) => void;\n onBeforeLeafItemClick?: () => void;\n className?: string;\n items: MenuItemType[];\n selectedKeys?: string[];\n menuStyle?: React.CSSProperties;\n rootClosing?: boolean;\n /** @internal 由 Dropdown 注入,禁用内部定位/overflow 计算。不支持含 SubMenu 的菜单 */\n externalOverflow?: boolean;\n}\n\nexport default function Menu(props: MenuProps) {\n const {\n className,\n items,\n onClick: onMenuClick,\n onBeforeLeafItemClick,\n selectedKeys,\n menuStyle,\n rootClosing = false,\n externalOverflow,\n } = props;\n const selectedKeySet = new Set(selectedKeys || []);\n\n const hasDirectSelectedItem = (items: MenuItemType[]): boolean =>\n items.some((item) => {\n if (isSubMenuItem(item)) {\n return selectedKeySet.has(item.key);\n }\n if (isHeaderMenuItem(item) || isDivideMenuItem(item)) {\n return false;\n }\n return selectedKeySet.has(item.key);\n });\n\n const getMenuItems = (items: MenuItemType[], parentPath: string[] = []) => {\n const isSelectableGroup = hasDirectSelectedItem(items);\n\n return items.map((item, index) => {\n if (isDivideMenuItem(item)) {\n return <MenuDivider key={`divider_${index}`} />;\n }\n if (isHeaderMenuItem(item)) {\n return <MenuHeader key={`header_${index}`}>{item.label}</MenuHeader>;\n }\n const currPath = [...parentPath, item.key];\n const titleStr = _.isString(item.label) ? item.label : '';\n const isSelected = selectedKeys?.includes(item.key);\n\n if (isSubMenuItem(item)) {\n const subMenuItemLabel = (\n <div className=\"ald-menu-item-label\" title={titleStr}>\n {item.icon ? (\n <div className=\"ald-menu-item-label-icon\">{item.icon}</div>\n ) : null}\n <div className=\"ald-menu-item-label-text\">{item.label}</div>\n <div className=\"ald-menu-item-right\">\n {isSelectableGroup ? (\n <div className=\"ald-menu-item-selection-slot\" />\n ) : null}\n <ChevronRightLine size={16} />\n </div>\n </div>\n );\n\n return (\n <SubMenu\n key={item.key}\n label={subMenuItemLabel}\n disabled={item.disabled}\n align=\"start\"\n direction=\"right\"\n gap={-8}\n position=\"anchor\"\n shift={0}\n menuStyle={{\n ...menuStyle,\n overflow: isLeafMenu(item.children) ? 'auto' : undefined,\n }}\n menuClassName={cn(\n 'ald-menu-submenu-popup',\n item.popupClassName,\n rootClosing && 'ald-menu-submenu-popup-root-closing',\n )}\n overflow={isLeafMenu(item.children) ? 'auto' : undefined}\n >\n {getMenuItems(item.children, currPath)}\n </SubMenu>\n );\n }\n\n return (\n <MenuItem\n key={item.key}\n className={cn(item.className, {\n 'ald-menu-item-danger': item.danger,\n 'ald-menu-item-selected': isSelected,\n })}\n disabled={item.disabled}\n onClick={({ syntheticEvent }) => {\n onBeforeLeafItemClick?.();\n const menuInfo = {\n key: item.key,\n keyPath: currPath,\n domEvent: syntheticEvent,\n };\n if (item.onClick) {\n item.onClick(menuInfo);\n }\n if (onMenuClick) {\n onMenuClick(menuInfo);\n }\n }}\n >\n <div className=\"ald-menu-item-label\" title={titleStr}>\n {item.icon ? (\n <div className=\"ald-menu-item-label-icon\">{item.icon}</div>\n ) : null}\n <div className=\"ald-menu-item-label-text\">{item.label}</div>\n {isSelectableGroup ? (\n <div className=\"ald-menu-item-right\">\n <div\n className={cn(\n 'ald-menu-item-selection-slot',\n isSelected &&\n 'ald-menu-item-selection-slot-selected ald-menu-item-selected-icon',\n )}\n >\n {isSelected ? <CheckLightLine /> : null}\n </div>\n </div>\n ) : null}\n </div>\n </MenuItem>\n );\n });\n };\n\n const ref = useRef(null);\n\n const leafOverflow = isLeafMenu(items) ? 'auto' : undefined;\n\n return (\n <>\n <div style={{ display: 'none' }} ref={ref} />\n <ControlledMenu\n state=\"open\"\n transition={{ open: true, close: true }}\n transitionTimeout={200}\n submenuOpenDelay={0}\n submenuCloseDelay={0}\n menuStyle={{\n ...menuStyle,\n overflow: externalOverflow ? undefined : leafOverflow,\n }}\n anchorRef={ref}\n className={cn(className, 'ald-menu')}\n position={externalOverflow ? 'initial' : 'auto'}\n captureFocus={false}\n viewScroll={externalOverflow ? 'initial' : 'auto'}\n overflow={externalOverflow ? 'visible' : leafOverflow}\n >\n {getMenuItems(items || [])}\n </ControlledMenu>\n </>\n );\n}\n\nexport function isHeaderMenuItem(\n menuItem: MenuItemType,\n): menuItem is MenuHeaderType {\n return 'type' in menuItem && menuItem.type === 'header';\n}\n\nexport function isDivideMenuItem(\n menuItem: MenuItemType,\n): menuItem is MenuDividerType {\n return 'type' in menuItem && menuItem.type === 'divider';\n}\n\nexport function isSubMenuItem(menuItem: MenuItemType): menuItem is SubMenuType {\n return 'children' in menuItem && !!menuItem.children;\n}\n\nexport function isLeafMenu(menuItems: MenuItemType[]) {\n return !_.some(menuItems, (item) => isSubMenuItem(item));\n}\n\nexport type MenuItemType =\n | ItemType\n | MenuDividerType\n | SubMenuType\n | MenuHeaderType;\n\nexport interface ItemType {\n key: string;\n label: React.ReactNode;\n icon?: React.ReactNode;\n onClick?: (info: MenuInfo) => void;\n danger?: boolean;\n disabled?: boolean;\n className?: string;\n}\n\nexport interface MenuDividerType {\n key?: string;\n type: 'divider';\n}\n\nexport interface MenuHeaderType {\n key?: string;\n type: 'header';\n label: string;\n}\n\nexport interface SubMenuType {\n children: MenuItemType[];\n key: string;\n label: React.ReactNode;\n icon?: React.ReactNode;\n popupClassName?: string;\n disabled?: boolean;\n}\n\nexport interface MenuInfo {\n key: string;\n keyPath: string[];\n domEvent: MouseEvent | KeyboardEvent;\n // 阻止菜单关闭\n keepOpen?: boolean;\n}\n"],"mappings":";;;;;;;;;AAyBA,SAAwB,KAAK,OAAkB;CAC7C,MAAM,EACJ,WACA,OACA,SAAS,aACT,uBACA,cACA,WACA,cAAc,OACd,qBACE;CACJ,MAAM,iBAAiB,IAAI,IAAI,gBAAgB,EAAE,CAAC;CAElD,MAAM,yBAAyB,UAC7B,MAAM,MAAM,SAAS;AACnB,MAAI,cAAc,KAAK,CACrB,QAAO,eAAe,IAAI,KAAK,IAAI;AAErC,MAAI,iBAAiB,KAAK,IAAI,iBAAiB,KAAK,CAClD,QAAO;AAET,SAAO,eAAe,IAAI,KAAK,IAAI;GACnC;CAEJ,MAAM,gBAAgB,OAAuB,aAAuB,EAAE,KAAK;EACzE,MAAM,oBAAoB,sBAAsB,MAAM;AAEtD,SAAO,MAAM,KAAK,MAAM,UAAU;AAChC,OAAI,iBAAiB,KAAK,CACxB,QAAO,oBAAC,aAAD,EAAwC,EAAtB,WAAW,QAAW;AAEjD,OAAI,iBAAiB,KAAK,CACxB,QAAO,oBAAC,YAAD,EAAA,UAAqC,KAAK,OAAmB,EAA5C,UAAU,QAAkC;GAEtE,MAAM,WAAW,CAAC,GAAG,YAAY,KAAK,IAAI;GAC1C,MAAM,WAAW,EAAE,SAAS,KAAK,MAAM,GAAG,KAAK,QAAQ;GACvD,MAAM,aAAa,cAAc,SAAS,KAAK,IAAI;AAEnD,OAAI,cAAc,KAAK,CAgBrB,QACE,oBAAC,SAAD;IAEE,OAjBF,qBAAC,OAAD;KAAK,WAAU;KAAsB,OAAO;eAA5C;MACG,KAAK,OACJ,oBAAC,OAAD;OAAK,WAAU;iBAA4B,KAAK;OAAW,CAAA,GACzD;MACJ,oBAAC,OAAD;OAAK,WAAU;iBAA4B,KAAK;OAAY,CAAA;MAC5D,qBAAC,OAAD;OAAK,WAAU;iBAAf,CACG,oBACC,oBAAC,OAAD,EAAK,WAAU,gCAAiC,CAAA,GAC9C,MACJ,oBAAC,QAAD,EAAkB,MAAM,IAAM,CAAA,CAC1B;;MACF;;IAOJ,UAAU,KAAK;IACf,OAAM;IACN,WAAU;IACV,KAAK;IACL,UAAS;IACT,OAAO;IACP,WAAW;KACT,GAAG;KACH,UAAU,WAAW,KAAK,SAAS,GAAG,SAAS;KAChD;IACD,eAAe,GACb,0BACA,KAAK,gBACL,eAAe,sCAChB;IACD,UAAU,WAAW,KAAK,SAAS,GAAG,SAAS;cAE9C,aAAa,KAAK,UAAU,SAAS;IAC9B,EApBH,KAAK,IAoBF;AAId,UACE,oBAAC,UAAD;IAEE,WAAW,GAAG,KAAK,WAAW;KAC5B,wBAAwB,KAAK;KAC7B,0BAA0B;KAC3B,CAAC;IACF,UAAU,KAAK;IACf,UAAU,EAAE,qBAAqB;AAC/B,8BAAyB;KACzB,MAAM,WAAW;MACf,KAAK,KAAK;MACV,SAAS;MACT,UAAU;MACX;AACD,SAAI,KAAK,QACP,MAAK,QAAQ,SAAS;AAExB,SAAI,YACF,aAAY,SAAS;;cAIzB,qBAAC,OAAD;KAAK,WAAU;KAAsB,OAAO;eAA5C;MACG,KAAK,OACJ,oBAAC,OAAD;OAAK,WAAU;iBAA4B,KAAK;OAAW,CAAA,GACzD;MACJ,oBAAC,OAAD;OAAK,WAAU;iBAA4B,KAAK;OAAY,CAAA;MAC3D,oBACC,oBAAC,OAAD;OAAK,WAAU;iBACb,oBAAC,OAAD;QACE,WAAW,GACT,gCACA,cACE,oEACH;kBAEA,aAAa,oBAAC,MAAD,EAAkB,CAAA,GAAG;QAC/B,CAAA;OACF,CAAA,GACJ;MACA;;IACG,EAxCJ,KAAK,IAwCD;IAEb;;CAGJ,MAAM,MAAM,OAAO,KAAK;CAExB,MAAM,eAAe,WAAW,MAAM,GAAG,SAAS;AAElD,QACE,qBAAA,UAAA,EAAA,UAAA,CACE,oBAAC,OAAD;EAAK,OAAO,EAAE,SAAS,QAAQ;EAAO;EAAO,CAAA,EAC7C,oBAAC,gBAAD;EACE,OAAM;EACN,YAAY;GAAE,MAAM;GAAM,OAAO;GAAM;EACvC,mBAAmB;EACnB,kBAAkB;EAClB,mBAAmB;EACnB,WAAW;GACT,GAAG;GACH,UAAU,mBAAmB,SAAY;GAC1C;EACD,WAAW;EACX,WAAW,GAAG,WAAW,WAAW;EACpC,UAAU,mBAAmB,YAAY;EACzC,cAAc;EACd,YAAY,mBAAmB,YAAY;EAC3C,UAAU,mBAAmB,YAAY;YAExC,aAAa,SAAS,EAAE,CAAC;EACX,CAAA,CAChB,EAAA,CAAA;;AAIP,SAAgB,iBACd,UAC4B;AAC5B,QAAO,UAAU,YAAY,SAAS,SAAS;;AAGjD,SAAgB,iBACd,UAC6B;AAC7B,QAAO,UAAU,YAAY,SAAS,SAAS;;AAGjD,SAAgB,cAAc,UAAiD;AAC7E,QAAO,cAAc,YAAY,CAAC,CAAC,SAAS;;AAG9C,SAAgB,WAAW,WAA2B;AACpD,QAAO,CAAC,EAAE,KAAK,YAAY,SAAS,cAAc,KAAK,CAAC"}
@@ -0,0 +1,16 @@
1
+ import { default as React } from 'react';
2
+ export interface FixedOverflowProps<T> {
3
+ prefixCls?: string;
4
+ data: T[];
5
+ renderItem: (item: T, info: {
6
+ index: number;
7
+ }) => React.ReactNode;
8
+ itemKey: (item: T) => React.Key;
9
+ renderRest: (omittedItems: T[]) => React.ReactNode;
10
+ className?: string;
11
+ onVisibleChange?: (count: number) => void;
12
+ }
13
+ declare const FixedOverflow: <T>(props: FixedOverflowProps<T> & {
14
+ ref?: React.Ref<HTMLDivElement> | undefined;
15
+ }) => React.ReactElement;
16
+ export default FixedOverflow;