@aloudata/aloudata-design 3.1.0 → 3.1.1
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.
- package/dist/AProgress/index.js +10 -0
- package/dist/AProgress/index.js.map +1 -1
- package/dist/Alert/index.js +3 -1
- package/dist/Alert/index.js.map +1 -1
- package/dist/Badge/index.js +37 -11
- package/dist/Badge/index.js.map +1 -1
- package/dist/Breadcrumb/index.js +12 -2
- package/dist/Breadcrumb/index.js.map +1 -1
- package/dist/Button/index.d.ts +1 -1
- package/dist/Button/index.js +20 -6
- package/dist/Button/index.js.map +1 -1
- package/dist/Card/index.js +1 -1
- package/dist/Card/index.js.map +1 -1
- package/dist/Carousel/index.js +9 -1
- package/dist/Carousel/index.js.map +1 -1
- package/dist/Checkbox/index.js +17 -2
- package/dist/Checkbox/index.js.map +1 -1
- package/dist/Checkbox/type.d.ts +10 -2
- package/dist/ColorPicker/index.js +112 -46
- package/dist/ColorPicker/index.js.map +1 -1
- package/dist/DataPreviewTable/components/Body/Cell.d.ts +2 -0
- package/dist/DataPreviewTable/components/Body/Cell.js +9 -1
- package/dist/DataPreviewTable/components/Body/Cell.js.map +1 -1
- package/dist/DataPreviewTable/components/Body/index.d.ts +1 -0
- package/dist/DataPreviewTable/components/Body/index.js +35 -23
- package/dist/DataPreviewTable/components/Body/index.js.map +1 -1
- package/dist/DataPreviewTable/components/Header/index.d.ts +1 -0
- package/dist/DataPreviewTable/components/Header/index.js +36 -28
- package/dist/DataPreviewTable/components/Header/index.js.map +1 -1
- package/dist/DataPreviewTable/index.js +19 -2
- package/dist/DataPreviewTable/index.js.map +1 -1
- package/dist/Drawer/index.d.ts +4 -0
- package/dist/Drawer/index.js +91 -78
- package/dist/Drawer/index.js.map +1 -1
- package/dist/Dropdown/index.d.ts +1 -1
- package/dist/Dropdown/index.js +64 -13
- package/dist/Dropdown/index.js.map +1 -1
- package/dist/Form/FormItemContext.d.ts +1 -1
- package/dist/Form/FormItemContext.js.map +1 -1
- package/dist/Form/index.js +50 -7
- package/dist/Form/index.js.map +1 -1
- package/dist/IconButton/index.d.ts +2 -2
- package/dist/IconButton/index.js +9 -3
- package/dist/IconButton/index.js.map +1 -1
- package/dist/Input/components/Input/index.js +18 -8
- package/dist/Input/components/Input/index.js.map +1 -1
- package/dist/Input/components/TextArea/index.js +18 -7
- package/dist/Input/components/TextArea/index.js.map +1 -1
- package/dist/Input/privateSemanticOwner.d.ts +2 -0
- package/dist/Input/privateSemanticOwner.js +1 -0
- package/dist/InputNumber/index.js +16 -9
- package/dist/InputNumber/index.js.map +1 -1
- package/dist/InputNumber/type.d.ts +2 -2
- package/dist/LogicTree/components/LogicItem/index.d.ts +2 -1
- package/dist/LogicTree/components/LogicItem/index.js +13 -2
- package/dist/LogicTree/components/LogicItem/index.js.map +1 -1
- package/dist/LogicTree/index.js +2 -0
- package/dist/LogicTree/index.js.map +1 -1
- package/dist/MemberPicker/components/MemberSelection.d.ts +1 -0
- package/dist/MemberPicker/components/MemberSelection.js +83 -94
- package/dist/MemberPicker/components/MemberSelection.js.map +1 -1
- package/dist/MemberPicker/components/MultipleOption.js +12 -0
- package/dist/MemberPicker/components/MultipleOption.js.map +1 -1
- package/dist/MemberPicker/components/Panel.d.ts +1 -0
- package/dist/MemberPicker/components/Panel.js +4 -1
- package/dist/MemberPicker/components/Panel.js.map +1 -1
- package/dist/MemberPicker/components/SelectedMemberTags.js +14 -6
- package/dist/MemberPicker/components/SelectedMemberTags.js.map +1 -1
- package/dist/MemberPicker/components/SingleOption.js +12 -0
- package/dist/MemberPicker/components/SingleOption.js.map +1 -1
- package/dist/MemberPicker/components/UserGroupSelection.d.ts +2 -1
- package/dist/MemberPicker/components/UserGroupSelection.js +61 -48
- package/dist/MemberPicker/components/UserGroupSelection.js.map +1 -1
- package/dist/MemberPicker/index.js +134 -108
- package/dist/MemberPicker/index.js.map +1 -1
- package/dist/Menu/index.d.ts +8 -0
- package/dist/Menu/index.js +33 -3
- package/dist/Menu/index.js.map +1 -1
- package/dist/Modal/index.d.ts +4 -0
- package/dist/Modal/index.js +55 -66
- package/dist/Modal/index.js.map +1 -1
- package/dist/OverflowCount/index.js +10 -0
- package/dist/OverflowCount/index.js.map +1 -1
- package/dist/Pagination/index.js +1 -0
- package/dist/Pagination/index.js.map +1 -1
- package/dist/Popconfirm/index.js +9 -1
- package/dist/Popconfirm/index.js.map +1 -1
- package/dist/Popover/index.js +52 -1
- package/dist/Popover/index.js.map +1 -1
- package/dist/Progress/index.js +4 -0
- package/dist/Progress/index.js.map +1 -1
- package/dist/Radio/components/Group/index.d.ts +5 -1
- package/dist/Radio/components/Group/index.js +7 -2
- package/dist/Radio/components/Group/index.js.map +1 -1
- package/dist/Radio/components/Radio/index.js +26 -0
- package/dist/Radio/components/Radio/index.js.map +1 -1
- package/dist/Radio/interface/radio.d.ts +7 -0
- package/dist/Radio/interface/radioGroup.d.ts +2 -0
- package/dist/RenameInput/index.js +11 -0
- package/dist/RenameInput/index.js.map +1 -1
- package/dist/Select/BaseSelect.d.ts +3 -0
- package/dist/Select/BaseSelect.js +229 -32
- package/dist/Select/BaseSelect.js.map +1 -1
- package/dist/Select/SelectTrigger.d.ts +2 -0
- package/dist/Select/SelectTrigger.js +13 -5
- package/dist/Select/SelectTrigger.js.map +1 -1
- package/dist/Select/components/OptionCollection.d.ts +41 -0
- package/dist/Select/components/OptionCollection.js +124 -0
- package/dist/Select/components/OptionCollection.js.map +1 -0
- package/dist/Select/index.js +45 -3
- package/dist/Select/index.js.map +1 -1
- package/dist/Select/interface.d.ts +1 -1
- package/dist/Skeleton/index.js +1 -1
- package/dist/Skeleton/index.js.map +1 -1
- package/dist/Spin/index.d.ts +1 -1
- package/dist/Spin/index.js +22 -7
- package/dist/Spin/index.js.map +1 -1
- package/dist/Switch/index.d.ts +5 -0
- package/dist/Switch/index.js +15 -5
- package/dist/Switch/index.js.map +1 -1
- package/dist/Table/components/Header.js +0 -1
- package/dist/Table/components/Header.js.map +1 -1
- package/dist/Table/index.js +42 -27
- package/dist/Table/index.js.map +1 -1
- package/dist/Tabs/index.js +1 -0
- package/dist/Tabs/index.js.map +1 -1
- package/dist/Tag/index.js +20 -1
- package/dist/Tag/index.js.map +1 -1
- package/dist/Tooltip/index.js +34 -5
- package/dist/Tooltip/index.js.map +1 -1
- package/dist/Tour/index.js +13 -1
- package/dist/Tour/index.js.map +1 -1
- package/dist/Tree/Tree2.js +2 -0
- package/dist/Tree/Tree2.js.map +1 -1
- package/dist/_utils/dialogAccessibility.d.ts +17 -0
- package/dist/_utils/dialogAccessibility.js +110 -0
- package/dist/_utils/dialogAccessibility.js.map +1 -0
- package/dist/_utils/formControlSemanticOwner.d.ts +3 -0
- package/dist/_utils/formControlSemanticOwner.js +17 -0
- package/dist/_utils/formControlSemanticOwner.js.map +1 -0
- package/dist/_utils/overlayCoordinator.js +1 -11
- package/dist/_utils/overlayCoordinator.js.map +1 -1
- package/dist/aloudata-design.css +1 -1
- package/dist/theme/contract/baselineResolvedTokenValueManifest.d.ts +1 -1
- package/dist/theme/contract/darkResolvedTokenValueManifest.d.ts +1 -1
- package/dist/theme/generator/acceptedColorValues.d.ts +2 -1
- package/dist/theme/generator/baselineTokenValueDelivery.d.ts +9 -1
- package/dist/theme/generator/minimalAcceptedColorValues.d.ts +2 -2
- package/dist/theme/generator/neutralSourceResolver.d.ts +28 -0
- package/dist/theme/generator/neutralSourceResolver.js +2 -0
- package/dist/theme/generator/neutralSourceValues.d.ts +27 -0
- package/dist/theme/generator/neutralSourceValues.js +2 -0
- package/dist/theme/index.d.ts +2 -0
- package/dist/theme/index.js +1 -0
- package/dist/theme/neutralSourceContract.d.ts +3 -0
- package/dist/theme/neutralSourceContract.js +11 -0
- package/dist/theme/neutralSourceContract.js.map +1 -0
- package/dist/theme/runtime/colorValueMode/generated/darkBaselineDeclarations.d.ts +1 -1
- package/dist/theme/runtime/colorValueMode/generated/darkBaselineDeclarations.js +45 -45
- package/dist/theme/runtime/colorValueMode/generated/darkBaselineDeclarations.js.map +1 -1
- package/dist/theme/runtime/colorValueMode/generated/slateDarkDeclarations.d.ts +3 -0
- package/dist/theme/runtime/colorValueMode/generated/slateDarkDeclarations.js +2 -0
- package/dist/theme/runtime/colorValueMode/generated/slateLightDeclarations.d.ts +3 -0
- package/dist/theme/runtime/colorValueMode/generated/slateLightDeclarations.js +2 -0
- package/dist/theme/runtime/colorValueMode/generated/stoneDarkDeclarations.d.ts +3 -0
- package/dist/theme/runtime/colorValueMode/generated/stoneDarkDeclarations.js +2 -0
- package/dist/theme/runtime/colorValueMode/generated/stoneLightDeclarations.d.ts +3 -0
- package/dist/theme/runtime/colorValueMode/generated/stoneLightDeclarations.js +2 -0
- package/dist/theme/runtime/colorValueMode/generated/v3BaselineDeclarations.d.ts +1 -1
- package/dist/theme/runtime/colorValueMode/generated/v3BaselineDeclarations.js +41 -41
- package/dist/theme/runtime/colorValueMode/generated/v3BaselineDeclarations.js.map +1 -1
- package/dist/theme/runtime/colorValueMode/index.js +2 -12
- package/dist/theme/runtime/colorValueMode/index.js.map +1 -1
- package/dist/theme/runtime/colorValueMode/legacyNeutralCompatibility.d.ts +2 -0
- package/dist/theme/runtime/colorValueMode/legacyNeutralCompatibility.js +48 -0
- package/dist/theme/runtime/colorValueMode/legacyNeutralCompatibility.js.map +1 -0
- package/dist/theme/runtime/colorValueMode/registry.d.ts +1 -1
- package/dist/theme/runtime/colorValueMode/registry.js +2 -1
- package/dist/theme/runtime/colorValueMode/registry.js.map +1 -1
- package/dist/theme/runtime/initAldTheme.js +1 -3
- package/dist/theme/runtime/initAldTheme.js.map +1 -1
- package/dist/theme/runtime/neutralSource/index.d.ts +6 -0
- package/dist/theme/runtime/neutralSource/index.js +11 -0
- package/dist/theme/runtime/neutralSource/index.js.map +1 -0
- package/dist/theme/runtime/neutralSource.d.ts +2 -0
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../src/Skeleton/index.tsx"],"sourcesContent":["import React from 'react';\nimport { cn } from '../lib/utils';\n\nexport interface SkeletonProps {\n active?: boolean;\n loading?: boolean;\n className?: string;\n style?: React.CSSProperties;\n children?: React.ReactNode;\n avatar?:\n | boolean\n | {\n size?: number | 'small' | 'default' | 'large';\n shape?: 'circle' | 'square';\n };\n title?: boolean | { width?: number | string };\n paragraph?:\n | boolean\n | { rows?: number; width?: number | string | (number | string)[] };\n round?: boolean;\n}\n\n// --- Shared types for sub-components ---\n\ntype SkeletonElementSize = 'small' | 'default' | 'large';\n\ninterface SkeletonElementBaseProps {\n active?: boolean;\n size?: SkeletonElementSize;\n className?: string;\n style?: React.CSSProperties;\n}\n\ninterface SkeletonButtonProps extends SkeletonElementBaseProps {\n shape?: 'circle' | 'round' | 'square';\n block?: boolean;\n}\n\ninterface SkeletonAvatarProps extends SkeletonElementBaseProps {\n shape?: 'circle' | 'square';\n}\n\ninterface SkeletonInputProps extends SkeletonElementBaseProps {\n block?: boolean;\n}\n\ninterface SkeletonImageProps {\n active?: boolean;\n className?: string;\n style?: React.CSSProperties;\n}\n\n// --- Size maps ---\n\nconst BUTTON_SIZE_MAP: Record<\n SkeletonElementSize,\n { width: number; height: number }\n> = {\n small: { width: 64, height: 24 },\n default: { width: 80, height: 32 },\n large: { width: 96, height: 40 },\n};\n\nconst AVATAR_SIZE_MAP: Record<SkeletonElementSize, number> = {\n small: 24,\n default: 32,\n large: 40,\n};\n\nconst INPUT_SIZE_MAP: Record<SkeletonElementSize, number> = {\n small: 24,\n default: 32,\n large: 40,\n};\n\nconst SKELETON_BACKGROUND_COLOR =\n 'var(--alias-colors-bg-skeleton-subtle, var(--background-neutral-subtle, #e5e7eb))';\n\n// --- Sub-components ---\n\nconst SkeletonButton: React.FC<SkeletonButtonProps> = ({\n active,\n size = 'default',\n shape = 'square',\n block,\n className,\n style,\n}) => {\n const animClass = active ? 'tw-animate-pulse' : '';\n const dims = BUTTON_SIZE_MAP[size];\n\n const borderRadius =\n shape === 'circle'\n ? '50%'\n : shape === 'round'\n ? `${dims.height / 2}px`\n : '4px';\n\n return (\n <span\n className={cn(\n 'ald-skeleton-button tw-inline-block tw-bg-[var(--background-neutral-subtle)]',\n animClass,\n block && 'tw-block tw-w-full',\n className,\n )}\n style={{\n backgroundColor: SKELETON_BACKGROUND_COLOR,\n width:\n shape === 'circle' ? dims.height : block ? undefined : dims.width,\n height: dims.height,\n borderRadius,\n ...style,\n }}\n />\n );\n};\n\nconst SkeletonAvatar: React.FC<SkeletonAvatarProps> = ({\n active,\n size = 'default',\n shape = 'circle',\n className,\n style,\n}) => {\n const animClass = active ? 'tw-animate-pulse' : '';\n const dim = typeof size === 'number' ? size : AVATAR_SIZE_MAP[size];\n\n return (\n <span\n className={cn(\n 'ald-skeleton-avatar tw-inline-block tw-bg-[var(--background-neutral-subtle)]',\n animClass,\n className,\n )}\n style={{\n backgroundColor: SKELETON_BACKGROUND_COLOR,\n width: dim,\n height: dim,\n borderRadius: shape === 'circle' ? '50%' : '4px',\n ...style,\n }}\n />\n );\n};\n\nconst SkeletonInput: React.FC<SkeletonInputProps> = ({\n active,\n size = 'default',\n block,\n className,\n style,\n}) => {\n const animClass = active ? 'tw-animate-pulse' : '';\n const height = INPUT_SIZE_MAP[size];\n\n return (\n <span\n className={cn(\n 'ald-skeleton-input tw-inline-block tw-bg-[var(--background-neutral-subtle)]',\n animClass,\n block && 'tw-block tw-w-full',\n className,\n )}\n style={{\n backgroundColor: SKELETON_BACKGROUND_COLOR,\n width: block ? undefined : 200,\n height,\n borderRadius: 4,\n ...style,\n }}\n />\n );\n};\n\nconst SkeletonImage: React.FC<SkeletonImageProps> = ({\n active,\n className,\n style,\n}) => {\n const animClass = active ? 'tw-animate-pulse' : '';\n\n return (\n <span\n className={cn(\n 'ald-skeleton-image tw-flex tw-items-center tw-justify-center tw-bg-[var(--background-neutral-subtle)]',\n animClass,\n className,\n )}\n style={{\n backgroundColor: SKELETON_BACKGROUND_COLOR,\n width: 96,\n height: 96,\n borderRadius: 4,\n ...style,\n }}\n >\n <svg\n viewBox=\"0 0 1098 1024\"\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"48\"\n height=\"48\"\n fill=\"currentColor\"\n style={{ opacity: 0.2 }}\n >\n <path d=\"M365.714 329.143q0 45.714-32.036 77.75t-77.75 32.036-77.75-32.036-32.036-77.75 32.036-77.75 77.75-32.036 77.75 32.036 32.036 77.75zM950.857 548.571v256H146.286V694.857l182.857-182.857 91.429 91.429 292.571-292.571zM1005.714 146.286H91.429q-7.46 0-12.873 5.413T73.143 164.571v694.857q0 7.46 5.413 12.873t12.873 5.413h914.286q7.46 0 12.873-5.413t5.413-12.873V164.571q0-7.46-5.413-12.873t-12.873-5.413zm91.429 18.286v694.857q0 37.714-26.857 64.571t-64.571 26.857H91.429q-37.714 0-64.571-26.857T0 859.429V164.571q0-37.714 26.857-64.571T91.429 73.143h914.286q37.714 0 64.571 26.857t26.857 64.571z\" />\n </svg>\n </span>\n );\n};\n\n// --- Main Skeleton component ---\n\nfunction Skeleton(props: SkeletonProps) {\n const {\n active = false,\n loading = true,\n className,\n style,\n children,\n avatar,\n title = true,\n paragraph = true,\n round,\n } = props;\n\n if (!loading) {\n return <>{children}</>;\n }\n\n const animClass = active ? 'tw-animate-pulse' : '';\n const rows =\n typeof paragraph === 'object' ? paragraph.rows || 3 : paragraph ? 3 : 0;\n\n return (\n <div\n className={cn('ald-skeleton tw-flex tw-gap-4', className)}\n style={style}\n >\n {avatar && (\n <div\n className={cn(\n 'ald-skeleton-avatar tw-shrink-0 tw-rounded-full tw-bg-[var(--background-neutral-subtle)]',\n animClass,\n typeof avatar === 'object' && avatar.shape === 'square'\n ? 'tw-rounded-r-50'\n : 'tw-rounded-full',\n )}\n style={{\n backgroundColor: SKELETON_BACKGROUND_COLOR,\n width: 40,\n height: 40,\n }}\n />\n )}\n <div className=\"ald-skeleton-content tw-flex-1\">\n {title && (\n <div\n className={cn(\n 'ald-skeleton-title tw-mb-4 tw-h-4 tw-bg-[var(--background-neutral-subtle)]',\n animClass,\n round ? 'tw-rounded-full' : 'tw-rounded-r-25',\n )}\n style={{\n backgroundColor: SKELETON_BACKGROUND_COLOR,\n width: typeof title === 'object' ? title.width : '38%',\n }}\n />\n )}\n {paragraph &&\n Array.from({ length: rows }).map((_, i) => (\n <div\n key={i}\n className={cn(\n 'ald-skeleton-paragraph tw-mb-3 tw-h-4 tw-bg-[var(--background-neutral-subtle)]',\n animClass,\n round ? 'tw-rounded-full' : 'tw-rounded-r-25',\n )}\n style={{\n backgroundColor: SKELETON_BACKGROUND_COLOR,\n width: i === rows - 1 ? '61%' : '100%',\n }}\n />\n ))}\n </div>\n </div>\n );\n}\n\nfunction SkeletonNode({\n active,\n className,\n style,\n children,\n}: {\n active?: boolean;\n className?: string;\n style?: React.CSSProperties;\n children?: React.ReactNode;\n}) {\n return (\n <div\n className={cn(\n 'ald-skeleton-node tw-inline-flex tw-items-center tw-justify-center tw-rounded-r-25 tw-bg-[var(--background-neutral-subtle)]',\n active && 'tw-animate-pulse',\n className,\n )}\n style={{\n backgroundColor: SKELETON_BACKGROUND_COLOR,\n ...style,\n }}\n >\n {children}\n </div>\n );\n}\n\n// Attach sub-components\nSkeleton.Button = SkeletonButton;\nSkeleton.Avatar = SkeletonAvatar;\nSkeleton.Input = SkeletonInput;\nSkeleton.Image = SkeletonImage;\nSkeleton.Node = SkeletonNode;\n\nexport default Skeleton;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../src/Skeleton/index.tsx"],"sourcesContent":["import React from 'react';\nimport { cn } from '../lib/utils';\n\nexport interface SkeletonProps {\n active?: boolean;\n loading?: boolean;\n className?: string;\n style?: React.CSSProperties;\n children?: React.ReactNode;\n avatar?:\n | boolean\n | {\n size?: number | 'small' | 'default' | 'large';\n shape?: 'circle' | 'square';\n };\n title?: boolean | { width?: number | string };\n paragraph?:\n | boolean\n | { rows?: number; width?: number | string | (number | string)[] };\n round?: boolean;\n}\n\n// --- Shared types for sub-components ---\n\ntype SkeletonElementSize = 'small' | 'default' | 'large';\n\ninterface SkeletonElementBaseProps {\n active?: boolean;\n size?: SkeletonElementSize;\n className?: string;\n style?: React.CSSProperties;\n}\n\ninterface SkeletonButtonProps extends SkeletonElementBaseProps {\n shape?: 'circle' | 'round' | 'square';\n block?: boolean;\n}\n\ninterface SkeletonAvatarProps extends SkeletonElementBaseProps {\n shape?: 'circle' | 'square';\n}\n\ninterface SkeletonInputProps extends SkeletonElementBaseProps {\n block?: boolean;\n}\n\ninterface SkeletonImageProps {\n active?: boolean;\n className?: string;\n style?: React.CSSProperties;\n}\n\n// --- Size maps ---\n\nconst BUTTON_SIZE_MAP: Record<\n SkeletonElementSize,\n { width: number; height: number }\n> = {\n small: { width: 64, height: 24 },\n default: { width: 80, height: 32 },\n large: { width: 96, height: 40 },\n};\n\nconst AVATAR_SIZE_MAP: Record<SkeletonElementSize, number> = {\n small: 24,\n default: 32,\n large: 40,\n};\n\nconst INPUT_SIZE_MAP: Record<SkeletonElementSize, number> = {\n small: 24,\n default: 32,\n large: 40,\n};\n\nconst SKELETON_BACKGROUND_COLOR = 'var(--background-neutral-surface)';\n\n// --- Sub-components ---\n\nconst SkeletonButton: React.FC<SkeletonButtonProps> = ({\n active,\n size = 'default',\n shape = 'square',\n block,\n className,\n style,\n}) => {\n const animClass = active ? 'tw-animate-pulse' : '';\n const dims = BUTTON_SIZE_MAP[size];\n\n const borderRadius =\n shape === 'circle'\n ? '50%'\n : shape === 'round'\n ? `${dims.height / 2}px`\n : '4px';\n\n return (\n <span\n className={cn(\n 'ald-skeleton-button tw-inline-block tw-bg-[var(--background-neutral-subtle)]',\n animClass,\n block && 'tw-block tw-w-full',\n className,\n )}\n style={{\n backgroundColor: SKELETON_BACKGROUND_COLOR,\n width:\n shape === 'circle' ? dims.height : block ? undefined : dims.width,\n height: dims.height,\n borderRadius,\n ...style,\n }}\n />\n );\n};\n\nconst SkeletonAvatar: React.FC<SkeletonAvatarProps> = ({\n active,\n size = 'default',\n shape = 'circle',\n className,\n style,\n}) => {\n const animClass = active ? 'tw-animate-pulse' : '';\n const dim = typeof size === 'number' ? size : AVATAR_SIZE_MAP[size];\n\n return (\n <span\n className={cn(\n 'ald-skeleton-avatar tw-inline-block tw-bg-[var(--background-neutral-subtle)]',\n animClass,\n className,\n )}\n style={{\n backgroundColor: SKELETON_BACKGROUND_COLOR,\n width: dim,\n height: dim,\n borderRadius: shape === 'circle' ? '50%' : '4px',\n ...style,\n }}\n />\n );\n};\n\nconst SkeletonInput: React.FC<SkeletonInputProps> = ({\n active,\n size = 'default',\n block,\n className,\n style,\n}) => {\n const animClass = active ? 'tw-animate-pulse' : '';\n const height = INPUT_SIZE_MAP[size];\n\n return (\n <span\n className={cn(\n 'ald-skeleton-input tw-inline-block tw-bg-[var(--background-neutral-subtle)]',\n animClass,\n block && 'tw-block tw-w-full',\n className,\n )}\n style={{\n backgroundColor: SKELETON_BACKGROUND_COLOR,\n width: block ? undefined : 200,\n height,\n borderRadius: 4,\n ...style,\n }}\n />\n );\n};\n\nconst SkeletonImage: React.FC<SkeletonImageProps> = ({\n active,\n className,\n style,\n}) => {\n const animClass = active ? 'tw-animate-pulse' : '';\n\n return (\n <span\n className={cn(\n 'ald-skeleton-image tw-flex tw-items-center tw-justify-center tw-bg-[var(--background-neutral-subtle)]',\n animClass,\n className,\n )}\n style={{\n backgroundColor: SKELETON_BACKGROUND_COLOR,\n width: 96,\n height: 96,\n borderRadius: 4,\n ...style,\n }}\n >\n <svg\n viewBox=\"0 0 1098 1024\"\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"48\"\n height=\"48\"\n fill=\"currentColor\"\n style={{ opacity: 0.2 }}\n >\n <path d=\"M365.714 329.143q0 45.714-32.036 77.75t-77.75 32.036-77.75-32.036-32.036-77.75 32.036-77.75 77.75-32.036 77.75 32.036 32.036 77.75zM950.857 548.571v256H146.286V694.857l182.857-182.857 91.429 91.429 292.571-292.571zM1005.714 146.286H91.429q-7.46 0-12.873 5.413T73.143 164.571v694.857q0 7.46 5.413 12.873t12.873 5.413h914.286q7.46 0 12.873-5.413t5.413-12.873V164.571q0-7.46-5.413-12.873t-12.873-5.413zm91.429 18.286v694.857q0 37.714-26.857 64.571t-64.571 26.857H91.429q-37.714 0-64.571-26.857T0 859.429V164.571q0-37.714 26.857-64.571T91.429 73.143h914.286q37.714 0 64.571 26.857t26.857 64.571z\" />\n </svg>\n </span>\n );\n};\n\n// --- Main Skeleton component ---\n\nfunction Skeleton(props: SkeletonProps) {\n const {\n active = false,\n loading = true,\n className,\n style,\n children,\n avatar,\n title = true,\n paragraph = true,\n round,\n } = props;\n\n if (!loading) {\n return <>{children}</>;\n }\n\n const animClass = active ? 'tw-animate-pulse' : '';\n const rows =\n typeof paragraph === 'object' ? paragraph.rows || 3 : paragraph ? 3 : 0;\n\n return (\n <div\n className={cn('ald-skeleton tw-flex tw-gap-4', className)}\n style={style}\n >\n {avatar && (\n <div\n className={cn(\n 'ald-skeleton-avatar tw-shrink-0 tw-rounded-full tw-bg-[var(--background-neutral-subtle)]',\n animClass,\n typeof avatar === 'object' && avatar.shape === 'square'\n ? 'tw-rounded-r-50'\n : 'tw-rounded-full',\n )}\n style={{\n backgroundColor: SKELETON_BACKGROUND_COLOR,\n width: 40,\n height: 40,\n }}\n />\n )}\n <div className=\"ald-skeleton-content tw-flex-1\">\n {title && (\n <div\n className={cn(\n 'ald-skeleton-title tw-mb-4 tw-h-4 tw-bg-[var(--background-neutral-subtle)]',\n animClass,\n round ? 'tw-rounded-full' : 'tw-rounded-r-25',\n )}\n style={{\n backgroundColor: SKELETON_BACKGROUND_COLOR,\n width: typeof title === 'object' ? title.width : '38%',\n }}\n />\n )}\n {paragraph &&\n Array.from({ length: rows }).map((_, i) => (\n <div\n key={i}\n className={cn(\n 'ald-skeleton-paragraph tw-mb-3 tw-h-4 tw-bg-[var(--background-neutral-subtle)]',\n animClass,\n round ? 'tw-rounded-full' : 'tw-rounded-r-25',\n )}\n style={{\n backgroundColor: SKELETON_BACKGROUND_COLOR,\n width: i === rows - 1 ? '61%' : '100%',\n }}\n />\n ))}\n </div>\n </div>\n );\n}\n\nfunction SkeletonNode({\n active,\n className,\n style,\n children,\n}: {\n active?: boolean;\n className?: string;\n style?: React.CSSProperties;\n children?: React.ReactNode;\n}) {\n return (\n <div\n className={cn(\n 'ald-skeleton-node tw-inline-flex tw-items-center tw-justify-center tw-rounded-r-25 tw-bg-[var(--background-neutral-subtle)]',\n active && 'tw-animate-pulse',\n className,\n )}\n style={{\n backgroundColor: SKELETON_BACKGROUND_COLOR,\n ...style,\n }}\n >\n {children}\n </div>\n );\n}\n\n// Attach sub-components\nSkeleton.Button = SkeletonButton;\nSkeleton.Avatar = SkeletonAvatar;\nSkeleton.Input = SkeletonInput;\nSkeleton.Image = SkeletonImage;\nSkeleton.Node = SkeletonNode;\n\nexport default Skeleton;\n"],"mappings":"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"}
|
package/dist/Spin/index.d.ts
CHANGED
|
@@ -10,5 +10,5 @@ export interface SpinProps {
|
|
|
10
10
|
className?: string;
|
|
11
11
|
style?: React.CSSProperties;
|
|
12
12
|
}
|
|
13
|
-
declare function CustomSpin(props: SpinProps): import("react/jsx-runtime").JSX.Element
|
|
13
|
+
declare function CustomSpin(props: SpinProps): import("react/jsx-runtime").JSX.Element;
|
|
14
14
|
export default CustomSpin;
|
package/dist/Spin/index.js
CHANGED
|
@@ -2,15 +2,22 @@ import { cn } from "../lib/utils.js";
|
|
|
2
2
|
import { cloneElement as cloneElement$1, isFragment, isReactComponent } from "../_utils/reactNode.js";
|
|
3
3
|
import Icon from "./CustomIcon/index.js";
|
|
4
4
|
import React, { isValidElement } from "react";
|
|
5
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
6
|
//#region src/Spin/index.tsx
|
|
6
7
|
function CustomSpin(props) {
|
|
7
8
|
const { size, tip, direction = "vertical", children, spinning, wrapperClassName, className, style } = props;
|
|
8
|
-
if (!children) return
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
9
|
+
if (!children) return /* @__PURE__ */ jsx("span", {
|
|
10
|
+
role: "status",
|
|
11
|
+
"aria-live": "polite",
|
|
12
|
+
"aria-busy": spinning,
|
|
13
|
+
"aria-label": typeof tip === "string" ? tip : "Loading",
|
|
14
|
+
children: Icon({
|
|
15
|
+
size,
|
|
16
|
+
tip,
|
|
17
|
+
direction,
|
|
18
|
+
spinning,
|
|
19
|
+
className
|
|
20
|
+
})
|
|
14
21
|
});
|
|
15
22
|
if (!isValidElement(children)) return children;
|
|
16
23
|
if (isFragment(children) || isReactComponent(children)) return React.createElement("div", {
|
|
@@ -18,7 +25,11 @@ function CustomSpin(props) {
|
|
|
18
25
|
...style,
|
|
19
26
|
position: "relative"
|
|
20
27
|
},
|
|
21
|
-
className: cn(wrapperClassName)
|
|
28
|
+
className: cn(wrapperClassName),
|
|
29
|
+
role: "status",
|
|
30
|
+
"aria-live": "polite",
|
|
31
|
+
"aria-busy": spinning,
|
|
32
|
+
"aria-label": typeof tip === "string" ? tip : "Loading"
|
|
22
33
|
}, [children, Icon({
|
|
23
34
|
size,
|
|
24
35
|
tip,
|
|
@@ -33,6 +44,10 @@ function CustomSpin(props) {
|
|
|
33
44
|
...children.props.style
|
|
34
45
|
},
|
|
35
46
|
className: cn(wrapperClassName, children.props.className),
|
|
47
|
+
role: "status",
|
|
48
|
+
"aria-live": "polite",
|
|
49
|
+
"aria-busy": spinning,
|
|
50
|
+
"aria-label": typeof tip === "string" ? tip : "Loading",
|
|
36
51
|
children: [children.props.children, Icon({
|
|
37
52
|
size,
|
|
38
53
|
tip,
|
package/dist/Spin/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../src/Spin/index.tsx"],"sourcesContent":["import { cn } from '../lib/utils';\nimport React, { ReactElement, isValidElement } from 'react';\nimport {\n cloneElement,\n isFragment,\n isReactComponent,\n} from '../_utils/reactNode';\nimport CustomIcon from './CustomIcon';\n\nexport type TDirection = 'vertical' | 'horizontal';\n\nexport interface SpinProps {\n size?: 'small' | 'large' | 'middle';\n direction?: TDirection;\n children?: React.ReactElement;\n tip?: React.ReactNode;\n spinning?: boolean;\n wrapperClassName?: string;\n className?: string;\n style?: React.CSSProperties;\n}\nfunction CustomSpin(props: SpinProps) {\n const {\n size,\n tip,\n direction = 'vertical',\n children,\n spinning,\n wrapperClassName,\n className,\n style,\n } = props;\n if (!children) {\n return CustomIcon({ size, tip, direction, spinning, className });\n }\n if (!isValidElement(children)) {\n return children;\n }\n if (isFragment(children) || isReactComponent(children)) {\n return React.createElement(\n 'div',\n {\n style: { ...style, position: 'relative' },\n className: cn(wrapperClassName),\n },\n [\n children,\n CustomIcon({\n size,\n tip,\n direction,\n inContainer: true,\n spinning,\n className,\n }),\n ],\n );\n } else {\n return cloneElement(children, {\n style: {\n position: 'relative',\n ...(children as ReactElement).props.style,\n },\n className: cn(\n wrapperClassName,\n (children as ReactElement).props.className,\n ),\n children: [\n (children as ReactElement).props.children,\n CustomIcon({\n size,\n tip,\n direction,\n spinning,\n inContainer: true,\n className,\n }),\n ],\n });\n }\n}\nexport default CustomSpin;\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../src/Spin/index.tsx"],"sourcesContent":["import { cn } from '../lib/utils';\nimport React, { ReactElement, isValidElement } from 'react';\nimport {\n cloneElement,\n isFragment,\n isReactComponent,\n} from '../_utils/reactNode';\nimport CustomIcon from './CustomIcon';\n\nexport type TDirection = 'vertical' | 'horizontal';\n\nexport interface SpinProps {\n size?: 'small' | 'large' | 'middle';\n direction?: TDirection;\n children?: React.ReactElement;\n tip?: React.ReactNode;\n spinning?: boolean;\n wrapperClassName?: string;\n className?: string;\n style?: React.CSSProperties;\n}\nfunction CustomSpin(props: SpinProps) {\n const {\n size,\n tip,\n direction = 'vertical',\n children,\n spinning,\n wrapperClassName,\n className,\n style,\n } = props;\n if (!children) {\n return (\n <span\n role=\"status\"\n aria-live=\"polite\"\n aria-busy={spinning}\n aria-label={typeof tip === 'string' ? tip : 'Loading'}\n >\n {CustomIcon({ size, tip, direction, spinning, className })}\n </span>\n );\n }\n if (!isValidElement(children)) {\n return children;\n }\n if (isFragment(children) || isReactComponent(children)) {\n return React.createElement(\n 'div',\n {\n style: { ...style, position: 'relative' },\n className: cn(wrapperClassName),\n role: 'status',\n 'aria-live': 'polite',\n 'aria-busy': spinning,\n 'aria-label': typeof tip === 'string' ? tip : 'Loading',\n },\n [\n children,\n CustomIcon({\n size,\n tip,\n direction,\n inContainer: true,\n spinning,\n className,\n }),\n ],\n );\n } else {\n return cloneElement(children, {\n style: {\n position: 'relative',\n ...(children as ReactElement).props.style,\n },\n className: cn(\n wrapperClassName,\n (children as ReactElement).props.className,\n ),\n role: 'status',\n 'aria-live': 'polite',\n 'aria-busy': spinning,\n 'aria-label': typeof tip === 'string' ? tip : 'Loading',\n children: [\n (children as ReactElement).props.children,\n CustomIcon({\n size,\n tip,\n direction,\n spinning,\n inContainer: true,\n className,\n }),\n ],\n });\n }\n}\nexport default CustomSpin;\n"],"mappings":";;;;;;AAqBA,SAAS,WAAW,OAAkB;CACpC,MAAM,EACJ,MACA,KACA,YAAY,YACZ,UACA,UACA,kBACA,WACA,UACE;AACJ,KAAI,CAAC,SACH,QACE,oBAAC,QAAD;EACE,MAAK;EACL,aAAU;EACV,aAAW;EACX,cAAY,OAAO,QAAQ,WAAW,MAAM;YAE3C,KAAW;GAAE;GAAM;GAAK;GAAW;GAAU;GAAW,CAAC;EACrD,CAAA;AAGX,KAAI,CAAC,eAAe,SAAS,CAC3B,QAAO;AAET,KAAI,WAAW,SAAS,IAAI,iBAAiB,SAAS,CACpD,QAAO,MAAM,cACX,OACA;EACE,OAAO;GAAE,GAAG;GAAO,UAAU;GAAY;EACzC,WAAW,GAAG,iBAAiB;EAC/B,MAAM;EACN,aAAa;EACb,aAAa;EACb,cAAc,OAAO,QAAQ,WAAW,MAAM;EAC/C,EACD,CACE,UACA,KAAW;EACT;EACA;EACA;EACA,aAAa;EACb;EACA;EACD,CAAC,CACH,CACF;KAED,QAAO,eAAa,UAAU;EAC5B,OAAO;GACL,UAAU;GACV,GAAI,SAA0B,MAAM;GACrC;EACD,WAAW,GACT,kBACC,SAA0B,MAAM,UAClC;EACD,MAAM;EACN,aAAa;EACb,aAAa;EACb,cAAc,OAAO,QAAQ,WAAW,MAAM;EAC9C,UAAU,CACP,SAA0B,MAAM,UACjC,KAAW;GACT;GACA;GACA;GACA;GACA,aAAa;GACb;GACD,CAAC,CACH;EACF,CAAC"}
|
package/dist/Switch/index.d.ts
CHANGED
|
@@ -16,6 +16,11 @@ export interface ISwitchProps {
|
|
|
16
16
|
'data-testid'?: string;
|
|
17
17
|
/** 透传到内部 switch 按钮元素的 aria-label,用于可访问性与自动化测试定位 */
|
|
18
18
|
'aria-label'?: string;
|
|
19
|
+
'aria-labelledby'?: string;
|
|
20
|
+
'aria-describedby'?: string;
|
|
21
|
+
'aria-invalid'?: React.AriaAttributes['aria-invalid'];
|
|
22
|
+
'aria-required'?: React.AriaAttributes['aria-required'];
|
|
23
|
+
'aria-busy'?: React.AriaAttributes['aria-busy'];
|
|
19
24
|
}
|
|
20
25
|
declare const Switch: React.FC<ISwitchProps>;
|
|
21
26
|
export default Switch;
|
package/dist/Switch/index.js
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { cn } from "../lib/utils.js";
|
|
2
2
|
import DisabledContext from "../ConfigProvider/DisabledContext.js";
|
|
3
3
|
import SizeContext from "../ConfigProvider/sizeContext.js";
|
|
4
|
-
import {
|
|
4
|
+
import { getSemanticOwnerAriaProps } from "../_utils/formControlSemanticOwner.js";
|
|
5
|
+
import React, { useContext, useEffect, useState } from "react";
|
|
5
6
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
6
7
|
//#region src/Switch/index.tsx
|
|
7
8
|
var switchSizeConfig = {
|
|
@@ -21,10 +22,11 @@ var switchSizeConfig = {
|
|
|
21
22
|
thumbSize: 8
|
|
22
23
|
}
|
|
23
24
|
};
|
|
24
|
-
var Switch = ({ className = "", disabled: customDisabled, loading = false, size: customSize, checked, defaultChecked, onChange, onClick, children, "data-testid": dataTestid, "aria-label": ariaLabel }) => {
|
|
25
|
+
var Switch = ({ className = "", disabled: customDisabled, loading = false, size: customSize, checked, defaultChecked, onChange, onClick, children, "data-testid": dataTestid, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-required": ariaRequired, "aria-busy": ariaBusy }) => {
|
|
25
26
|
const contentSize = useContext(SizeContext);
|
|
26
27
|
const size = customSize || contentSize || "middle";
|
|
27
28
|
const [userChecked, setUserChecked] = useState(typeof checked === "undefined" ? defaultChecked : checked);
|
|
29
|
+
const switchLabelId = React.useId();
|
|
28
30
|
const disabled = useContext(DisabledContext);
|
|
29
31
|
const currentDisabled = loading ? true : customDisabled ?? disabled;
|
|
30
32
|
useEffect(() => {
|
|
@@ -40,6 +42,7 @@ var Switch = ({ className = "", disabled: customDisabled, loading = false, size:
|
|
|
40
42
|
const { trackW, trackH, thumbSize } = switchSizeConfig[size];
|
|
41
43
|
const thumbOffset = 2;
|
|
42
44
|
const thumbTranslate = trackW - thumbSize - thumbOffset * 2;
|
|
45
|
+
const generatedLabelledBy = ariaLabelledBy || (!ariaLabel && children != null ? switchLabelId : void 0);
|
|
43
46
|
return /* @__PURE__ */ jsxs("span", {
|
|
44
47
|
className: cn(className, "ald-switch tw-inline-flex tw-items-center tw-gap-1.5 tw-text-[0]", `ald-switch-${size}`, currentDisabled && "tw-pointer-events-none tw-cursor-default", {
|
|
45
48
|
"ald-switch-disabled": currentDisabled,
|
|
@@ -49,9 +52,15 @@ var Switch = ({ className = "", disabled: customDisabled, loading = false, size:
|
|
|
49
52
|
type: "button",
|
|
50
53
|
role: "switch",
|
|
51
54
|
"aria-checked": !!userChecked,
|
|
52
|
-
"aria-busy": loading || void 0,
|
|
53
55
|
"data-testid": dataTestid,
|
|
54
|
-
|
|
56
|
+
...getSemanticOwnerAriaProps({
|
|
57
|
+
"aria-label": ariaLabel,
|
|
58
|
+
"aria-labelledby": generatedLabelledBy,
|
|
59
|
+
"aria-describedby": ariaDescribedBy,
|
|
60
|
+
"aria-invalid": ariaInvalid,
|
|
61
|
+
"aria-required": ariaRequired,
|
|
62
|
+
"aria-busy": loading || ariaBusy || void 0
|
|
63
|
+
}),
|
|
55
64
|
disabled: currentDisabled,
|
|
56
65
|
className: cn("ald-switch-btn tw-relative tw-inline-flex tw-cursor-pointer tw-items-center tw-rounded-full tw-border-0 tw-p-0 tw-transition-colors tw-duration-200", userChecked ? "tw-bg-[var(--control-state-selected)]" : "tw-bg-[var(--control-state-unselected)]", !currentDisabled && [
|
|
57
66
|
"focus-visible:tw-shadow-[0_0_0_2px_var(--focus-ring)]",
|
|
@@ -66,7 +75,7 @@ var Switch = ({ className = "", disabled: customDisabled, loading = false, size:
|
|
|
66
75
|
},
|
|
67
76
|
onClick: handleClick,
|
|
68
77
|
children: /* @__PURE__ */ jsx("span", {
|
|
69
|
-
className: cn("tw-block tw-rounded-full tw-bg-[var(--background-default)] tw-shadow-sm tw-transition-transform tw-duration-200"),
|
|
78
|
+
className: cn("tw-block tw-rounded-full tw-bg-[var(--background-default)] tw-shadow-[var(--elevation-bottom-bottom-sm)] tw-transition-transform tw-duration-200"),
|
|
70
79
|
style: {
|
|
71
80
|
width: thumbSize,
|
|
72
81
|
height: thumbSize,
|
|
@@ -75,6 +84,7 @@ var Switch = ({ className = "", disabled: customDisabled, loading = false, size:
|
|
|
75
84
|
}
|
|
76
85
|
})
|
|
77
86
|
}), children && /* @__PURE__ */ jsx("span", {
|
|
87
|
+
id: generatedLabelledBy === switchLabelId ? switchLabelId : void 0,
|
|
78
88
|
className: cn("ald-switch-text tw-inline-flex tw-items-center tw-align-middle tw-text-[var(--content-primary)]", size === "large" && "tw-h-5 tw-text-base tw-leading-5", size === "middle" && "tw-h-4 tw-text-sm tw-leading-4", size === "small" && "tw-h-3 tw-text-xs tw-leading-3", currentDisabled && "tw-opacity-50"),
|
|
79
89
|
children
|
|
80
90
|
})]
|
package/dist/Switch/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../src/Switch/index.tsx"],"sourcesContent":["import React, { useContext, useEffect, useState } from 'react';\nimport DisabledContext from '../ConfigProvider/DisabledContext';\nimport SizeContext from '../ConfigProvider/sizeContext';\nimport { cn } from '../lib/utils';\n\nexport type SwitchChangeEventHandler = (\n checked: boolean,\n event: React.MouseEvent<HTMLButtonElement>,\n) => void;\nexport type SwitchClickEventHandler = SwitchChangeEventHandler;\nexport type SwitchSize = 'large' | 'middle' | 'small';\n\nexport interface ISwitchProps {\n className?: string;\n checked?: boolean;\n defaultChecked?: boolean;\n disabled?: boolean;\n loading?: boolean;\n size?: SwitchSize;\n onClick?: SwitchChangeEventHandler;\n onChange?: SwitchChangeEventHandler;\n children?: React.ReactNode;\n /** 透传到内部 switch 按钮元素的 data-testid,用于自动化测试定位 */\n 'data-testid'?: string;\n /** 透传到内部 switch 按钮元素的 aria-label,用于可访问性与自动化测试定位 */\n 'aria-label'?: string;\n}\n\nconst switchSizeConfig: Record<\n SwitchSize,\n {\n trackW: number;\n trackH: number;\n thumbSize: number;\n }\n> = {\n large: {\n trackW: 36,\n trackH: 20,\n thumbSize: 16,\n },\n middle: {\n trackW: 28,\n trackH: 16,\n thumbSize: 12,\n },\n small: {\n trackW: 22,\n trackH: 12,\n thumbSize: 8,\n },\n};\n\nconst Switch: React.FC<ISwitchProps> = ({\n className = '',\n disabled: customDisabled,\n loading = false,\n size: customSize,\n checked,\n defaultChecked,\n onChange,\n onClick,\n children,\n 'data-testid': dataTestid,\n 'aria-label': ariaLabel,\n}) => {\n const contentSize = useContext(SizeContext);\n const size = customSize || contentSize || 'middle';\n\n const [userChecked, setUserChecked] = useState(\n typeof checked === 'undefined' ? defaultChecked : checked,\n );\n\n const disabled = useContext(DisabledContext);\n const mergedDisabled = customDisabled ?? disabled;\n\n const currentDisabled = loading ? true : mergedDisabled;\n\n useEffect(() => {\n if (typeof checked === 'boolean') {\n setUserChecked(checked);\n }\n }, [checked]);\n\n const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n if (currentDisabled) return;\n const newChecked = !userChecked;\n if (checked === undefined) {\n setUserChecked(newChecked);\n }\n onChange?.(newChecked, e);\n onClick?.(newChecked, e);\n };\n\n const { trackW, trackH, thumbSize } = switchSizeConfig[size];\n const thumbOffset = 2;\n const thumbTranslate = trackW - thumbSize - thumbOffset * 2;\n\n return (\n <span\n className={cn(\n className,\n 'ald-switch tw-inline-flex tw-items-center tw-gap-1.5 tw-text-[0]',\n `ald-switch-${size}`,\n currentDisabled && 'tw-pointer-events-none tw-cursor-default',\n {\n 'ald-switch-disabled': currentDisabled,\n 'ald-switch-checked': userChecked,\n },\n )}\n >\n <button\n type=\"button\"\n role=\"switch\"\n aria-checked={!!userChecked}\n
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../src/Switch/index.tsx"],"sourcesContent":["import React, { useContext, useEffect, useState } from 'react';\nimport DisabledContext from '../ConfigProvider/DisabledContext';\nimport SizeContext from '../ConfigProvider/sizeContext';\nimport { getSemanticOwnerAriaProps } from '../_utils/formControlSemanticOwner';\nimport { cn } from '../lib/utils';\n\nexport type SwitchChangeEventHandler = (\n checked: boolean,\n event: React.MouseEvent<HTMLButtonElement>,\n) => void;\nexport type SwitchClickEventHandler = SwitchChangeEventHandler;\nexport type SwitchSize = 'large' | 'middle' | 'small';\n\nexport interface ISwitchProps {\n className?: string;\n checked?: boolean;\n defaultChecked?: boolean;\n disabled?: boolean;\n loading?: boolean;\n size?: SwitchSize;\n onClick?: SwitchChangeEventHandler;\n onChange?: SwitchChangeEventHandler;\n children?: React.ReactNode;\n /** 透传到内部 switch 按钮元素的 data-testid,用于自动化测试定位 */\n 'data-testid'?: string;\n /** 透传到内部 switch 按钮元素的 aria-label,用于可访问性与自动化测试定位 */\n 'aria-label'?: string;\n 'aria-labelledby'?: string;\n 'aria-describedby'?: string;\n 'aria-invalid'?: React.AriaAttributes['aria-invalid'];\n 'aria-required'?: React.AriaAttributes['aria-required'];\n 'aria-busy'?: React.AriaAttributes['aria-busy'];\n}\n\nconst switchSizeConfig: Record<\n SwitchSize,\n {\n trackW: number;\n trackH: number;\n thumbSize: number;\n }\n> = {\n large: {\n trackW: 36,\n trackH: 20,\n thumbSize: 16,\n },\n middle: {\n trackW: 28,\n trackH: 16,\n thumbSize: 12,\n },\n small: {\n trackW: 22,\n trackH: 12,\n thumbSize: 8,\n },\n};\n\nconst Switch: React.FC<ISwitchProps> = ({\n className = '',\n disabled: customDisabled,\n loading = false,\n size: customSize,\n checked,\n defaultChecked,\n onChange,\n onClick,\n children,\n 'data-testid': dataTestid,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy,\n 'aria-describedby': ariaDescribedBy,\n 'aria-invalid': ariaInvalid,\n 'aria-required': ariaRequired,\n 'aria-busy': ariaBusy,\n}) => {\n const contentSize = useContext(SizeContext);\n const size = customSize || contentSize || 'middle';\n\n const [userChecked, setUserChecked] = useState(\n typeof checked === 'undefined' ? defaultChecked : checked,\n );\n const switchLabelId = React.useId();\n\n const disabled = useContext(DisabledContext);\n const mergedDisabled = customDisabled ?? disabled;\n\n const currentDisabled = loading ? true : mergedDisabled;\n\n useEffect(() => {\n if (typeof checked === 'boolean') {\n setUserChecked(checked);\n }\n }, [checked]);\n\n const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n if (currentDisabled) return;\n const newChecked = !userChecked;\n if (checked === undefined) {\n setUserChecked(newChecked);\n }\n onChange?.(newChecked, e);\n onClick?.(newChecked, e);\n };\n\n const { trackW, trackH, thumbSize } = switchSizeConfig[size];\n const thumbOffset = 2;\n const thumbTranslate = trackW - thumbSize - thumbOffset * 2;\n const generatedLabelledBy =\n ariaLabelledBy ||\n (!ariaLabel && children != null ? switchLabelId : undefined);\n\n return (\n <span\n className={cn(\n className,\n 'ald-switch tw-inline-flex tw-items-center tw-gap-1.5 tw-text-[0]',\n `ald-switch-${size}`,\n currentDisabled && 'tw-pointer-events-none tw-cursor-default',\n {\n 'ald-switch-disabled': currentDisabled,\n 'ald-switch-checked': userChecked,\n },\n )}\n >\n <button\n type=\"button\"\n role=\"switch\"\n aria-checked={!!userChecked}\n data-testid={dataTestid}\n {...getSemanticOwnerAriaProps({\n 'aria-label': ariaLabel,\n 'aria-labelledby': generatedLabelledBy,\n 'aria-describedby': ariaDescribedBy,\n 'aria-invalid': ariaInvalid,\n 'aria-required': ariaRequired,\n 'aria-busy': loading || ariaBusy || undefined,\n })}\n disabled={currentDisabled}\n className={cn(\n 'ald-switch-btn tw-relative tw-inline-flex tw-cursor-pointer tw-items-center tw-rounded-full tw-border-0 tw-p-0 tw-transition-colors tw-duration-200',\n userChecked\n ? 'tw-bg-[var(--control-state-selected)]'\n : 'tw-bg-[var(--control-state-unselected)]',\n // Focus is an independent layer on the interactive button. The\n // selected/unselected Control State Color contract remains intact.\n !currentDisabled && [\n 'focus-visible:tw-shadow-[0_0_0_2px_var(--focus-ring)]',\n 'forced-colors:focus-visible:tw-outline',\n 'forced-colors:focus-visible:tw-outline-2',\n 'forced-colors:focus-visible:tw-outline-offset-2',\n 'forced-colors:focus-visible:tw-outline-[Highlight]',\n ],\n currentDisabled && 'tw-cursor-not-allowed tw-opacity-40',\n )}\n style={{ width: trackW, height: trackH }}\n onClick={handleClick}\n >\n <span\n className={cn(\n 'tw-block tw-rounded-full tw-bg-[var(--background-default)] tw-shadow-[var(--elevation-bottom-bottom-sm)] tw-transition-transform tw-duration-200',\n )}\n style={{\n width: thumbSize,\n height: thumbSize,\n marginLeft: thumbOffset,\n transform: userChecked\n ? `translateX(${thumbTranslate}px)`\n : 'translateX(0)',\n }}\n />\n </button>\n {children && (\n <span\n id={generatedLabelledBy === switchLabelId ? switchLabelId : undefined}\n className={cn(\n 'ald-switch-text tw-inline-flex tw-items-center tw-align-middle tw-text-[var(--content-primary)]',\n size === 'large' && 'tw-h-5 tw-text-base tw-leading-5',\n size === 'middle' && 'tw-h-4 tw-text-sm tw-leading-4',\n size === 'small' && 'tw-h-3 tw-text-xs tw-leading-3',\n currentDisabled && 'tw-opacity-50',\n )}\n >\n {children}\n </span>\n )}\n </span>\n );\n};\n\nexport default Switch;\n"],"mappings":";;;;;;;AAkCA,IAAM,mBAOF;CACF,OAAO;EACL,QAAQ;EACR,QAAQ;EACR,WAAW;EACZ;CACD,QAAQ;EACN,QAAQ;EACR,QAAQ;EACR,WAAW;EACZ;CACD,OAAO;EACL,QAAQ;EACR,QAAQ;EACR,WAAW;EACZ;CACF;AAED,IAAM,UAAkC,EACtC,YAAY,IACZ,UAAU,gBACV,UAAU,OACV,MAAM,YACN,SACA,gBACA,UACA,SACA,UACA,eAAe,YACf,cAAc,WACd,mBAAmB,gBACnB,oBAAoB,iBACpB,gBAAgB,aAChB,iBAAiB,cACjB,aAAa,eACT;CACJ,MAAM,cAAc,WAAW,YAAY;CAC3C,MAAM,OAAO,cAAc,eAAe;CAE1C,MAAM,CAAC,aAAa,kBAAkB,SACpC,OAAO,YAAY,cAAc,iBAAiB,QACnD;CACD,MAAM,gBAAgB,MAAM,OAAO;CAEnC,MAAM,WAAW,WAAW,gBAAgB;CAG5C,MAAM,kBAAkB,UAAU,OAFX,kBAAkB;AAIzC,iBAAgB;AACd,MAAI,OAAO,YAAY,UACrB,gBAAe,QAAQ;IAExB,CAAC,QAAQ,CAAC;CAEb,MAAM,eAAe,MAA2C;AAC9D,MAAI,gBAAiB;EACrB,MAAM,aAAa,CAAC;AACpB,MAAI,YAAY,OACd,gBAAe,WAAW;AAE5B,aAAW,YAAY,EAAE;AACzB,YAAU,YAAY,EAAE;;CAG1B,MAAM,EAAE,QAAQ,QAAQ,cAAc,iBAAiB;CACvD,MAAM,cAAc;CACpB,MAAM,iBAAiB,SAAS,YAAY,cAAc;CAC1D,MAAM,sBACJ,mBACC,CAAC,aAAa,YAAY,OAAO,gBAAgB;AAEpD,QACE,qBAAC,QAAD;EACE,WAAW,GACT,WACA,oEACA,cAAc,QACd,mBAAmB,4CACnB;GACE,uBAAuB;GACvB,sBAAsB;GACvB,CACF;YAVH,CAYE,oBAAC,UAAD;GACE,MAAK;GACL,MAAK;GACL,gBAAc,CAAC,CAAC;GAChB,eAAa;GACb,GAAI,0BAA0B;IAC5B,cAAc;IACd,mBAAmB;IACnB,oBAAoB;IACpB,gBAAgB;IAChB,iBAAiB;IACjB,aAAa,WAAW,YAAY;IACrC,CAAC;GACF,UAAU;GACV,WAAW,GACT,uJACA,cACI,0CACA,2CAGJ,CAAC,mBAAmB;IAClB;IACA;IACA;IACA;IACA;IACD,EACD,mBAAmB,sCACpB;GACD,OAAO;IAAE,OAAO;IAAQ,QAAQ;IAAQ;GACxC,SAAS;aAET,oBAAC,QAAD;IACE,WAAW,GACT,mJACD;IACD,OAAO;KACL,OAAO;KACP,QAAQ;KACR,YAAY;KACZ,WAAW,cACP,cAAc,eAAe,OAC7B;KACL;IACD,CAAA;GACK,CAAA,EACR,YACC,oBAAC,QAAD;GACE,IAAI,wBAAwB,gBAAgB,gBAAgB;GAC5D,WAAW,GACT,mGACA,SAAS,WAAW,oCACpB,SAAS,YAAY,kCACrB,SAAS,WAAW,kCACpB,mBAAmB,gBACpB;GAEA;GACI,CAAA,CAEJ"}
|
|
@@ -49,7 +49,6 @@ function Header(props) {
|
|
|
49
49
|
})]
|
|
50
50
|
}) : title;
|
|
51
51
|
return typeof title === "string" ? /* @__PURE__ */ jsx("div", {
|
|
52
|
-
role: isSortable ? "columnheader" : void 0,
|
|
53
52
|
"aria-sort": isSortable ? ariaSort : void 0,
|
|
54
53
|
className: cn(prefixCls("th-default"), "tw-text-typography-label", prefixCls(`align-${align}`), {
|
|
55
54
|
[prefixCls("td-ellipsis-content")]: ellipsis,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Header.js","names":[],"sources":["../../../src/Table/components/Header.tsx"],"sourcesContent":["import { Column } from '@tanstack/react-table';\nimport { cn } from '../../lib/utils';\nimport React, { MouseEventHandler, useCallback } from 'react';\nimport SortAscIcon from '../../Icon/components/SortAscendingOrderColor';\nimport SortIcon from '../../Icon/components/SortColor';\nimport SortDescIcon from '../../Icon/components/SortDescendingOrderColor';\nimport { prefixCls } from '../helper';\nimport { ITableColumn, ITableProps } from '../types';\n\nexport default function Header<T extends object>(props: IProps<T>) {\n const { column } = props;\n const { title, dataIndex, align, ellipsis, sortOrder, onSort } = column\n .columnDef.meta as ITableColumn & { onSort: ITableProps<T>['onSort'] };\n const isSortable =\n sortOrder !== undefined && !!dataIndex && typeof onSort === 'function';\n const ariaSort =\n sortOrder === 'ascend'\n ? 'ascending'\n : sortOrder === 'descend'\n ? 'descending'\n : 'none';\n\n let sortIcon = <SortIcon size={20} color={'var(--action-neutral-normal)'} />;\n if (sortOrder === 'ascend') {\n sortIcon = <SortAscIcon size={20} color={'var(--action-primary-normal)'} />;\n } else if (sortOrder === 'descend') {\n sortIcon = (\n <SortDescIcon size={20} color={'var(--action-primary-normal)'} />\n );\n }\n\n const onClickTh = useCallback<MouseEventHandler>(\n (e) => {\n if (!isSortable || !dataIndex) {\n return;\n }\n e.stopPropagation();\n\n let newSortOrder: typeof sortOrder;\n if (sortOrder === 'ascend') {\n newSortOrder = 'descend';\n } else if (sortOrder === 'descend') {\n newSortOrder = null;\n } else {\n newSortOrder = 'ascend';\n }\n onSort(dataIndex, newSortOrder);\n },\n [dataIndex, isSortable, onSort, sortOrder],\n );\n\n const content = isSortable ? (\n <span className={prefixCls('sort-th-inner')}>\n <span className={prefixCls('sort-title')}>{title}</span>\n <span className={prefixCls('sort-btn')} aria-hidden=\"true\">\n {sortIcon}\n </span>\n </span>\n ) : (\n title\n );\n\n return typeof title === 'string' ? (\n <div\n key={dataIndex}\n
|
|
1
|
+
{"version":3,"file":"Header.js","names":[],"sources":["../../../src/Table/components/Header.tsx"],"sourcesContent":["import { Column } from '@tanstack/react-table';\nimport { cn } from '../../lib/utils';\nimport React, { MouseEventHandler, useCallback } from 'react';\nimport SortAscIcon from '../../Icon/components/SortAscendingOrderColor';\nimport SortIcon from '../../Icon/components/SortColor';\nimport SortDescIcon from '../../Icon/components/SortDescendingOrderColor';\nimport { prefixCls } from '../helper';\nimport { ITableColumn, ITableProps } from '../types';\n\nexport default function Header<T extends object>(props: IProps<T>) {\n const { column } = props;\n const { title, dataIndex, align, ellipsis, sortOrder, onSort } = column\n .columnDef.meta as ITableColumn & { onSort: ITableProps<T>['onSort'] };\n const isSortable =\n sortOrder !== undefined && !!dataIndex && typeof onSort === 'function';\n const ariaSort =\n sortOrder === 'ascend'\n ? 'ascending'\n : sortOrder === 'descend'\n ? 'descending'\n : 'none';\n\n let sortIcon = <SortIcon size={20} color={'var(--action-neutral-normal)'} />;\n if (sortOrder === 'ascend') {\n sortIcon = <SortAscIcon size={20} color={'var(--action-primary-normal)'} />;\n } else if (sortOrder === 'descend') {\n sortIcon = (\n <SortDescIcon size={20} color={'var(--action-primary-normal)'} />\n );\n }\n\n const onClickTh = useCallback<MouseEventHandler>(\n (e) => {\n if (!isSortable || !dataIndex) {\n return;\n }\n e.stopPropagation();\n\n let newSortOrder: typeof sortOrder;\n if (sortOrder === 'ascend') {\n newSortOrder = 'descend';\n } else if (sortOrder === 'descend') {\n newSortOrder = null;\n } else {\n newSortOrder = 'ascend';\n }\n onSort(dataIndex, newSortOrder);\n },\n [dataIndex, isSortable, onSort, sortOrder],\n );\n\n const content = isSortable ? (\n <span className={prefixCls('sort-th-inner')}>\n <span className={prefixCls('sort-title')}>{title}</span>\n <span className={prefixCls('sort-btn')} aria-hidden=\"true\">\n {sortIcon}\n </span>\n </span>\n ) : (\n title\n );\n\n return typeof title === 'string' ? (\n <div\n key={dataIndex}\n aria-sort={isSortable ? ariaSort : undefined}\n className={cn(\n prefixCls('th-default'),\n 'tw-text-typography-label',\n prefixCls(`align-${align}`),\n {\n [prefixCls('td-ellipsis-content')]: ellipsis,\n [prefixCls('th-sortable')]: isSortable,\n },\n )}\n >\n {isSortable ? (\n <button\n type=\"button\"\n className={prefixCls('sort-trigger')}\n aria-label={`Sort by ${title}`}\n onClick={onClickTh}\n >\n {content}\n </button>\n ) : (\n content\n )}\n </div>\n ) : (\n <>{title}</>\n );\n}\n\nexport interface IProps<T> {\n column: Column<T>;\n}\n"],"mappings":";;;;;;;;AASA,SAAwB,OAAyB,OAAkB;CACjE,MAAM,EAAE,WAAW;CACnB,MAAM,EAAE,OAAO,WAAW,OAAO,UAAU,WAAW,WAAW,OAC9D,UAAU;CACb,MAAM,aACJ,cAAc,UAAa,CAAC,CAAC,aAAa,OAAO,WAAW;CAC9D,MAAM,WACJ,cAAc,WACV,cACA,cAAc,YACd,eACA;CAEN,IAAI,WAAW,oBAAC,QAAD;EAAU,MAAM;EAAI,OAAO;EAAkC,CAAA;AAC5E,KAAI,cAAc,SAChB,YAAW,oBAAC,MAAD;EAAa,MAAM;EAAI,OAAO;EAAkC,CAAA;UAClE,cAAc,UACvB,YACE,oBAAC,QAAD;EAAc,MAAM;EAAI,OAAO;EAAkC,CAAA;CAIrE,MAAM,YAAY,aACf,MAAM;AACL,MAAI,CAAC,cAAc,CAAC,UAClB;AAEF,IAAE,iBAAiB;EAEnB,IAAI;AACJ,MAAI,cAAc,SAChB,gBAAe;WACN,cAAc,UACvB,gBAAe;MAEf,gBAAe;AAEjB,SAAO,WAAW,aAAa;IAEjC;EAAC;EAAW;EAAY;EAAQ;EAAU,CAC3C;CAED,MAAM,UAAU,aACd,qBAAC,QAAD;EAAM,WAAW,UAAU,gBAAgB;YAA3C,CACE,oBAAC,QAAD;GAAM,WAAW,UAAU,aAAa;aAAG;GAAa,CAAA,EACxD,oBAAC,QAAD;GAAM,WAAW,UAAU,WAAW;GAAE,eAAY;aACjD;GACI,CAAA,CACF;MAEP;AAGF,QAAO,OAAO,UAAU,WACtB,oBAAC,OAAD;EAEE,aAAW,aAAa,WAAW;EACnC,WAAW,GACT,UAAU,aAAa,EACvB,4BACA,UAAU,SAAS,QAAQ,EAC3B;IACG,UAAU,sBAAsB,GAAG;IACnC,UAAU,cAAc,GAAG;GAC7B,CACF;YAEA,aACC,oBAAC,UAAD;GACE,MAAK;GACL,WAAW,UAAU,eAAe;GACpC,cAAY,WAAW;GACvB,SAAS;aAER;GACM,CAAA,GAET;EAEE,EAxBC,UAwBD,GAEN,oBAAA,UAAA,EAAA,UAAG,OAAS,CAAA"}
|
package/dist/Table/index.js
CHANGED
|
@@ -118,6 +118,9 @@ function Table(props, ref) {
|
|
|
118
118
|
const showResizer = columnSizing && !(!!rowSelectionInfo.isRowSelectionEnabled && index === 0);
|
|
119
119
|
const { className: fixedClassName, style: fixedStyle } = getColumnFixedInfo(index, true);
|
|
120
120
|
return /* @__PURE__ */ jsxs("div", {
|
|
121
|
+
role: "columnheader",
|
|
122
|
+
"aria-label": typeof header.column.columnDef.meta.title === "string" ? header.column.columnDef.meta.title : void 0,
|
|
123
|
+
"aria-sort": header.column.columnDef.meta.sortOrder === "ascend" ? "ascending" : header.column.columnDef.meta.sortOrder === "descend" ? "descending" : header.column.columnDef.meta.sortOrder !== void 0 ? "none" : void 0,
|
|
121
124
|
className: cn(prefixCls("th"), fixedClassName),
|
|
122
125
|
style: {
|
|
123
126
|
width: header.getSize(),
|
|
@@ -150,6 +153,7 @@ function Table(props, ref) {
|
|
|
150
153
|
virtualPaddingRight = columnVirtualizer.getTotalSize() - (virtualColumns[virtualColumns.length - 1]?.end ?? 0);
|
|
151
154
|
}
|
|
152
155
|
const headerContent = /* @__PURE__ */ jsx("div", {
|
|
156
|
+
role: "rowgroup",
|
|
153
157
|
className: cn(prefixCls("header"), {
|
|
154
158
|
[prefixCls("overflow-x")]: true,
|
|
155
159
|
[prefixCls("sticky")]: isStickyWork,
|
|
@@ -204,6 +208,7 @@ function Table(props, ref) {
|
|
|
204
208
|
} else content = _.map(allHeaderCells, (header, index) => renderHeaderCell(header, index));
|
|
205
209
|
return /* @__PURE__ */ jsxs("div", {
|
|
206
210
|
className: prefixCls("tr"),
|
|
211
|
+
role: "row",
|
|
207
212
|
style: { width: totalColumnsWidth },
|
|
208
213
|
children: [content, y !== void 0 && /* @__PURE__ */ jsx("div", {
|
|
209
214
|
className: prefixCls("header-scroll-placeholder"),
|
|
@@ -234,6 +239,7 @@ function Table(props, ref) {
|
|
|
234
239
|
const { className: fixedClassName, style: fixedStyle } = getColumnFixedInfo(colIndex);
|
|
235
240
|
const tdContent = flexRender(cell.column.columnDef.cell, cell.getContext());
|
|
236
241
|
return /* @__PURE__ */ jsx("div", {
|
|
242
|
+
role: "cell",
|
|
237
243
|
className: cn(prefixCls("td"), fixedClassName),
|
|
238
244
|
style: {
|
|
239
245
|
width: cell.column.getSize(),
|
|
@@ -255,6 +261,7 @@ function Table(props, ref) {
|
|
|
255
261
|
rowSelectionInfo.isRowSelectionEnabled
|
|
256
262
|
]);
|
|
257
263
|
const bodyContent = /* @__PURE__ */ jsx("div", {
|
|
264
|
+
role: "rowgroup",
|
|
258
265
|
className: prefixCls("body"),
|
|
259
266
|
style: {
|
|
260
267
|
width: totalColumnsWidth,
|
|
@@ -272,6 +279,8 @@ function Table(props, ref) {
|
|
|
272
279
|
})
|
|
273
280
|
})
|
|
274
281
|
}), /* @__PURE__ */ jsx("div", {
|
|
282
|
+
role: "status",
|
|
283
|
+
"aria-live": "polite",
|
|
275
284
|
"aria-invalid": "true",
|
|
276
285
|
style: {
|
|
277
286
|
position: "absolute",
|
|
@@ -339,6 +348,8 @@ function Table(props, ref) {
|
|
|
339
348
|
const isRowSelected = rowSelectionInfo.isRowSelectionEnabled && rowSelectionInfo.selectedRowKeys.includes(rowId);
|
|
340
349
|
const isRowSelectionDisabled = rowSelectionInfo.isRowSelectionEnabled && !!rowSelection?.getCheckboxProps?.(row.original).disabled;
|
|
341
350
|
const rowNode = /* @__PURE__ */ jsx("div", {
|
|
351
|
+
role: "row",
|
|
352
|
+
"aria-rowindex": rowIndex + 2,
|
|
342
353
|
"data-index": virtual ? rowData.index : rowIndex,
|
|
343
354
|
className: cn(prefixCls("tr"), {
|
|
344
355
|
[prefixCls("row-hover")]: rowDndInfo.draggingRowId ? void 0 : hoverRowId === rowId,
|
|
@@ -377,6 +388,7 @@ function Table(props, ref) {
|
|
|
377
388
|
if (expandItem?.isExpanded !== true) return rowList;
|
|
378
389
|
const customRow = /* @__PURE__ */ jsx("div", {
|
|
379
390
|
className: cn(prefixCls("tr")),
|
|
391
|
+
role: "row",
|
|
380
392
|
onClick: onClickRow(row.original, rowIndex),
|
|
381
393
|
children: expandedRowRender(row.original, expandItem.level + 1)
|
|
382
394
|
}, customExpandRowKey);
|
|
@@ -392,35 +404,38 @@ function Table(props, ref) {
|
|
|
392
404
|
totalSize,
|
|
393
405
|
isShowFooter
|
|
394
406
|
]);
|
|
395
|
-
const
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
}),
|
|
410
|
-
ref: bodyRef,
|
|
411
|
-
onScroll: onBodyScroll,
|
|
412
|
-
children: bodyContent
|
|
407
|
+
const tableContentBody = /* @__PURE__ */ jsxs("div", {
|
|
408
|
+
className: prefixCls("content"),
|
|
409
|
+
role: "table",
|
|
410
|
+
"aria-label": "Data table",
|
|
411
|
+
children: [
|
|
412
|
+
headerContent,
|
|
413
|
+
/* @__PURE__ */ jsx("div", {
|
|
414
|
+
style: {
|
|
415
|
+
height: tableContentHeight,
|
|
416
|
+
position: virtual ? "relative" : void 0
|
|
417
|
+
},
|
|
418
|
+
className: cn(prefixCls("body-scroll"), {
|
|
419
|
+
[prefixCls("scroll-y")]: y !== void 0,
|
|
420
|
+
[prefixCls("scroll-hidden")]: isEmpty
|
|
413
421
|
}),
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
422
|
+
ref: bodyRef,
|
|
423
|
+
onScroll: onBodyScroll,
|
|
424
|
+
children: bodyContent
|
|
425
|
+
}),
|
|
426
|
+
isShowFooter && /* @__PURE__ */ jsx(TableFooter, {
|
|
427
|
+
rowSelectionInfo,
|
|
428
|
+
isShowPagination,
|
|
429
|
+
pagination,
|
|
430
|
+
scroll,
|
|
431
|
+
scrollToFirstRow
|
|
432
|
+
})
|
|
433
|
+
]
|
|
423
434
|
});
|
|
435
|
+
const tableContent = loading ? /* @__PURE__ */ jsx(CustomSpin, {
|
|
436
|
+
spinning: true,
|
|
437
|
+
children: tableContentBody
|
|
438
|
+
}) : tableContentBody;
|
|
424
439
|
const tableStyle = {};
|
|
425
440
|
if (y) tableStyle.height = y;
|
|
426
441
|
return /* @__PURE__ */ jsx("div", {
|
package/dist/Table/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../src/Table/index.tsx"],"sourcesContent":["import {\n Cell,\n Header,\n Row,\n flexRender,\n getCoreRowModel,\n useReactTable,\n} from '@tanstack/react-table';\nimport { VirtualItem, useVirtualizer } from '@tanstack/react-virtual';\nimport { cn } from '../lib/utils';\nimport './table.css';\nimport _ from 'lodash';\nimport React, {\n CSSProperties,\n ForwardedRef,\n forwardRef,\n useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { Empty, Spin } from '..';\nimport ExpandCell from './components/ExpandCell';\nimport Footer from './components/Footer';\nimport DndWrapper from './components/DndWrapper';\nimport { getRowKey, getTableColumns, prefixCls } from './helper';\nimport useExpandable, { getExpandableConfig } from './hooks/useExpandable';\nimport useFixed from './hooks/useFixed';\nimport useRowSelection from './hooks/useRowSelection';\nimport useScroll from './hooks/useScroll';\nimport { ITableProps, ITableRef } from './types';\nimport useRowDnd from './hooks/useRowDnd';\n\nconst HEADER_HEIGHT = 41;\nconst FOOTER_HEIGHT = 52;\n\nfunction TableResizeWrapper({\n children,\n onResize,\n}: {\n children: React.ReactNode;\n onResize: (width: number, height: number) => void;\n}) {\n const ref = useRef<HTMLDivElement>(null);\n const onResizeRef = useRef(onResize);\n onResizeRef.current = onResize;\n useEffect(() => {\n const el = ref.current;\n if (!el) return;\n let prevW = 0;\n let prevH = 0;\n const ro = new window.ResizeObserver(() => {\n const w = el.offsetWidth;\n const h = el.offsetHeight;\n if (w === prevW && h === prevH) return;\n prevW = w;\n prevH = h;\n onResizeRef.current(w, h);\n });\n ro.observe(el);\n return () => ro.disconnect();\n }, []);\n return (\n <div ref={ref} style={{ height: '100%' }}>\n {children}\n </div>\n );\n}\n\nfunction Table<TDataItem extends object>(\n props: ITableProps<TDataItem>,\n ref: ForwardedRef<ITableRef>,\n) {\n const {\n data,\n bordered,\n rowKey,\n columnSizing,\n sticky,\n loading,\n pagination,\n scroll = {},\n empty: emptyComponent,\n virtual = false,\n rowClassName = () => '',\n onRowClick,\n onError,\n onSort,\n expandable,\n rowDnd,\n rowSelection,\n } = props;\n const [totalSize, setTotalSize] = useState<{\n width: number;\n height: number;\n } | null>(null);\n\n const [hoverRowId, setHoverRowId] = useState<string | null>(null);\n\n const { y } = scroll;\n const {\n containerWidth,\n onBodyScroll,\n headerRef,\n bodyRef,\n isPingLeft,\n isPingRight,\n scrollbarWidth,\n changeIsPing,\n } = useScroll({\n totalSize,\n scroll,\n });\n\n const scrollToFirstRow = useCallback(() => {\n if (!bodyRef.current) {\n return;\n }\n bodyRef.current.scrollTop = 0;\n }, [bodyRef]);\n\n useImperativeHandle(ref, () => ({\n scrollToFirstRow,\n }));\n\n const expandableInfo = useExpandable({\n expandable,\n data,\n rowKey,\n });\n const expandableConfig = getExpandableConfig(expandable);\n\n const rowSelectionInfo = useRowSelection({\n ...props,\n data: expandableInfo.data,\n isExpandable: expandableInfo.isExpandable,\n flattenData: expandableInfo.flattenData,\n });\n\n const rowDndInfo = useRowDnd({\n ...props,\n columns: rowSelectionInfo.columns,\n data: expandableInfo.data,\n });\n\n const tableColumns = useMemo(() => {\n return getTableColumns<TDataItem>({\n columns: rowDndInfo.columns,\n containerWidth: containerWidth || 0,\n onError,\n onSort,\n });\n }, [containerWidth, onError, onSort, rowDndInfo.columns]);\n\n const tableInstance = useReactTable<TDataItem>({\n columns: tableColumns,\n // 排除掉被折叠的行\n data: rowDndInfo.tableData,\n getCoreRowModel: getCoreRowModel(),\n getRowId: (row, index) => {\n return getRowKey(row, rowKey, index);\n },\n columnResizeMode: 'onChange',\n });\n\n const headerGroups = tableInstance.getHeaderGroups();\n\n const columnWidths = headerGroups[0].headers.map((header) =>\n header.getSize(),\n );\n const getColumnFixedInfo = useFixed<TDataItem>({\n columnWidths,\n tableColumns,\n y,\n scrollbarWidth,\n });\n\n // 渲染 header\n const { rows } = tableInstance.getRowModel();\n\n const isStickyWork = !!sticky && y === undefined;\n const headerStyle: CSSProperties = {};\n if (isStickyWork && _.get(sticky, 'offsetHeader')) {\n headerStyle.top = _.get(sticky, 'offsetHeader', 0);\n }\n\n const totalColumnsWidth = _.sum(columnWidths);\n\n useEffect(() => {\n // 总列宽改变时,重新计算是否需要显示固定列的阴影\n changeIsPing(totalColumnsWidth);\n }, [changeIsPing, totalColumnsWidth]);\n\n const renderHeaderCell = useCallback(\n (header: Header<TDataItem, unknown>, index: number) => {\n // 选择行的列不能拖动宽度\n const showResizer =\n columnSizing &&\n !(!!rowSelectionInfo.isRowSelectionEnabled && index === 0);\n const { className: fixedClassName, style: fixedStyle } =\n getColumnFixedInfo(index, true);\n return (\n <div\n className={cn(prefixCls('th'), fixedClassName)}\n style={{ width: header.getSize(), ...fixedStyle }}\n key={header.id}\n >\n {flexRender(header.column.columnDef.header, header.getContext())}\n {showResizer && (\n <div\n onMouseDown={header.getResizeHandler()}\n onTouchStart={header.getResizeHandler()}\n className={cn(prefixCls('resizer'), {\n [prefixCls('self-resizing')]: header.column.getIsResizing(),\n })}\n />\n )}\n </div>\n );\n },\n [columnSizing, rowSelectionInfo, getColumnFixedInfo],\n );\n\n const visibleColumns = tableInstance.getVisibleLeafColumns();\n\n const columnVirtualizer = useVirtualizer({\n count: tableColumns.length,\n estimateSize: (index: number) => visibleColumns[index].getSize(),\n getScrollElement: () => bodyRef.current,\n horizontal: true,\n overscan: 5,\n });\n\n const virtualColumns = columnVirtualizer.getVirtualItems();\n\n //different virtualization strategy for columns - instead of absolute and translateY, we add empty columns to the left and right\n let virtualPaddingLeft: number | undefined;\n let virtualPaddingRight: number | undefined;\n\n if (columnVirtualizer && virtualColumns?.length) {\n virtualPaddingLeft = virtualColumns[0]?.start ?? 0;\n virtualPaddingRight =\n columnVirtualizer.getTotalSize() -\n (virtualColumns[virtualColumns.length - 1]?.end ?? 0);\n }\n\n const headerContent = (\n <div\n className={cn(prefixCls('header'), {\n [prefixCls('overflow-x')]: true,\n [prefixCls('sticky')]: isStickyWork,\n [prefixCls('resizing')]:\n tableInstance.getState().columnSizingInfo.isResizingColumn,\n })}\n ref={headerRef}\n style={headerStyle}\n >\n {_.map(headerGroups, (headerGroup) => {\n const allHeaderCells = headerGroup.headers;\n const virtualColumns = columnVirtualizer.getVirtualItems();\n\n const middleVirtualColumns: VirtualItem[] = [];\n // 将固定列单独拎出来,固定列不受列虚拟化影响,必须要渲染\n const leftFixedColumns: {\n header: Header<TDataItem, unknown>;\n index: number;\n }[] = [];\n const rightFixedColumns: {\n header: Header<TDataItem, unknown>;\n index: number;\n }[] = [];\n let content: React.ReactNode | null = null;\n if (virtual) {\n _.forEach(allHeaderCells, (header, index) => {\n const fixedInfo = getColumnFixedInfo(index);\n if (fixedInfo.fixed === 'left') {\n leftFixedColumns.push({ header, index });\n }\n if (fixedInfo.fixed === 'right') {\n rightFixedColumns.push({ header, index });\n }\n });\n\n _.forEach(virtualColumns, (virtualColumn) => {\n const colIndex = virtualColumn.index;\n const fixedInfo = getColumnFixedInfo(colIndex);\n if (fixedInfo.fixed !== 'left' && fixedInfo.fixed !== 'right') {\n middleVirtualColumns.push(virtualColumn);\n }\n });\n content = (\n <>\n {virtualPaddingLeft ? (\n //fake empty column to the left for virtualization scroll padding\n <div\n className={prefixCls('virtual-padding-left')}\n style={{ width: virtualPaddingLeft }}\n />\n ) : null}\n {leftFixedColumns.map(({ header, index }) => {\n return renderHeaderCell(header, index);\n })}\n {_.map(middleVirtualColumns, (virtualColumn) => {\n const header = allHeaderCells[virtualColumn.index];\n return renderHeaderCell(header, virtualColumn.index);\n })}\n {rightFixedColumns.map(({ header, index }) => {\n return renderHeaderCell(header, index);\n })}\n {virtualPaddingRight ? (\n //fake empty column to the right for virtualization scroll padding\n <div\n className={prefixCls('virtual-padding-right')}\n style={{ width: virtualPaddingRight }}\n />\n ) : null}\n </>\n );\n } else {\n content = _.map(allHeaderCells, (header, index) =>\n renderHeaderCell(header, index),\n );\n }\n\n return (\n <div\n className={prefixCls('tr')}\n key={headerGroup.id}\n style={{ width: totalColumnsWidth }}\n >\n {content}\n {y !== undefined && (\n <div\n className={prefixCls('header-scroll-placeholder')}\n style={{ flexBasis: scrollbarWidth }}\n />\n )}\n </div>\n );\n })}\n </div>\n );\n\n const onClickRow = useCallback(\n (rowData: TDataItem, rowIndex: number) => () => {\n if (typeof onRowClick !== 'function') {\n return;\n }\n if (window.getSelection()?.toString().length !== 0) {\n // 防止选择文本时触发 onRowClick\n return;\n }\n onRowClick(rowData, rowIndex);\n },\n [onRowClick],\n );\n\n const isShowPagination = !!(\n pagination &&\n (pagination.total > pagination.pageSize || pagination.showSizeChanger)\n );\n const isShowRowSelection = rowSelectionInfo.isShowRowSelectionInFooter;\n\n const isShowFooter = isShowPagination || isShowRowSelection;\n\n // 空态切换 size 的阈值\n const EMPTY_SMALL_SIZE_HEIGHT = 436;\n const isSmallEmpty = totalSize && totalSize.height < EMPTY_SMALL_SIZE_HEIGHT;\n\n const isEmpty = rows.length === 0 && !loading;\n\n const rowVirtualizer = useVirtualizer({\n count: rows.length,\n estimateSize: () => 48, // estimate row height for accurate scrollbar dragging\n // 没有测量出 bodyRef.current 的高度时,返回 null,避免虚拟化器从 DOM 获取异常高度\n getScrollElement: () => (totalSize ? bodyRef.current : null),\n // measure dynamic row height, except in firefox because it measures table border height incorrectly\n measureElement:\n typeof window !== 'undefined' &&\n navigator.userAgent.indexOf('Firefox') === -1\n ? (element) => element?.getBoundingClientRect().height\n : undefined,\n overscan: 5,\n });\n\n const tableRows = virtual ? rowVirtualizer.getVirtualItems() : rows;\n\n const renderBodyCell = useCallback(\n (row: Row<TDataItem>, cell: Cell<TDataItem, unknown>, colIndex: number) => {\n const { className: fixedClassName, style: fixedStyle } =\n getColumnFixedInfo(colIndex);\n const tdContent = flexRender(\n cell.column.columnDef.cell,\n cell.getContext(),\n );\n return (\n <div\n className={cn(prefixCls('td'), fixedClassName)}\n key={cell.id}\n style={{ width: cell.column.getSize(), ...fixedStyle }}\n >\n {expandableInfo.isExpandable &&\n colIndex === (rowSelectionInfo.isRowSelectionEnabled ? 1 : 0) ? (\n <ExpandCell\n expandableInfo={expandableInfo}\n expandable={expandable}\n data={row.original}\n rowKey={rowKey}\n >\n {tdContent}\n </ExpandCell>\n ) : (\n tdContent\n )}\n </div>\n );\n },\n [\n expandableInfo,\n expandable,\n rowKey,\n getColumnFixedInfo,\n rowSelectionInfo.isRowSelectionEnabled,\n ],\n );\n\n // 渲染 body\n const bodyContent = (\n <div\n className={prefixCls('body')}\n style={{\n width: totalColumnsWidth,\n height: virtual\n ? totalSize\n ? rowVirtualizer.getTotalSize()\n : 0\n : 'auto',\n }}\n >\n {isEmpty ? (\n <div style={{ width: totalSize?.width }}>\n <div style={{ visibility: 'hidden' }}>\n {emptyComponent || (\n <div\n className={cn(prefixCls('empty'), {\n [prefixCls('empty-small')]: isSmallEmpty,\n })}\n >\n <Empty\n image={isSmallEmpty ? null : Empty.PRESENTED_IMAGE_SEARCH}\n size={isSmallEmpty ? 'small' : undefined}\n />\n </div>\n )}\n </div>\n <div\n aria-invalid=\"true\"\n style={{\n position: 'absolute',\n top: 40,\n left: 0,\n right: 0,\n bottom: 0,\n }}\n >\n {emptyComponent || (\n <div\n className={cn(prefixCls('empty'), {\n [prefixCls('empty-small')]: isSmallEmpty,\n })}\n >\n <Empty\n image={isSmallEmpty ? null : Empty.PRESENTED_IMAGE_SEARCH}\n size={isSmallEmpty ? 'small' : undefined}\n />\n </div>\n )}\n </div>\n </div>\n ) : (\n _.reduce<Row<TDataItem> | VirtualItem, React.ReactNode[]>(\n tableRows,\n (rowList, rowData, rowIndex) => {\n const row = virtual\n ? rows[rowData.index]\n : (rowData as Row<TDataItem>);\n const allRowCells = row.getVisibleCells();\n\n let content: React.ReactNode | null = null;\n // 将固定列单独拎出来,固定列不受列虚拟化影响,必须要渲染\n const leftFixedColumns: {\n cell: Cell<TDataItem, unknown>;\n index: number;\n }[] = [];\n const rightFixedColumns: {\n cell: Cell<TDataItem, unknown>;\n index: number;\n }[] = [];\n\n if (virtual) {\n const virtualColumns = columnVirtualizer.getVirtualItems();\n\n const middleVirtualColumns: VirtualItem[] = [];\n\n _.forEach(allRowCells, (cell, index) => {\n const fixedInfo = getColumnFixedInfo(index);\n if (fixedInfo.fixed === 'left') {\n leftFixedColumns.push({ cell, index });\n }\n if (fixedInfo.fixed === 'right') {\n rightFixedColumns.push({ cell, index });\n }\n });\n\n _.forEach(virtualColumns, (virtualColumn) => {\n const colIndex = virtualColumn.index;\n const fixedInfo = getColumnFixedInfo(colIndex);\n if (fixedInfo.fixed !== 'left' && fixedInfo.fixed !== 'right') {\n middleVirtualColumns.push(virtualColumn);\n }\n });\n content = (\n <>\n {virtualPaddingLeft ? (\n //fake empty column to the left for virtualization scroll padding\n <div\n className={prefixCls('virtual-padding-left')}\n style={{ width: virtualPaddingLeft }}\n />\n ) : null}\n {leftFixedColumns.map(({ cell, index }) => {\n return renderBodyCell(row, cell, index);\n })}\n {middleVirtualColumns.map((virtualColumn) => {\n const colIndex = virtualColumn.index;\n const cell = allRowCells[colIndex];\n return renderBodyCell(row, cell, colIndex);\n })}\n {rightFixedColumns.map(({ cell, index }) => {\n return renderBodyCell(row, cell, index);\n })}\n {virtualPaddingRight ? (\n //fake empty column to the right for virtualization scroll padding\n <div\n className={prefixCls('virtual-padding-right')}\n style={{ width: virtualPaddingRight }}\n />\n ) : null}\n </>\n );\n } else {\n content = allRowCells.map((cell, index) =>\n renderBodyCell(row, cell, index),\n );\n }\n const rowId = row.id;\n const isRowSelected =\n rowSelectionInfo.isRowSelectionEnabled &&\n rowSelectionInfo.selectedRowKeys.includes(rowId);\n const isRowSelectionDisabled =\n rowSelectionInfo.isRowSelectionEnabled &&\n !!rowSelection?.getCheckboxProps?.(row.original).disabled;\n\n const rowNode = (\n <div\n key={rowId}\n data-index={virtual ? (rowData as VirtualItem).index : rowIndex}\n className={cn(\n prefixCls('tr'),\n {\n // 需要用 state 的原因是,存在固定列的情况,左右侧的固定列在 dom 结构上不在同一个 tr 上,所以不能用 css 的 :hover 来实现\n // 当拖拽行时,不显示 hover 状态\n [prefixCls('row-hover')]: rowDndInfo.draggingRowId\n ? undefined\n : hoverRowId === rowId,\n [prefixCls('row-dragging')]:\n rowDndInfo.draggingRowId === rowId,\n [prefixCls('row-selected')]: isRowSelected,\n [prefixCls('row-selection-disabled')]:\n isRowSelectionDisabled,\n [prefixCls('no-border-tr')]:\n isShowPagination && rowIndex === rows.length - 1,\n },\n rowClassName(row.original, rowIndex),\n )}\n ref={(node) => {\n // 只在虚拟滚动模式下才测量行高度,避免非虚拟模式下的不必要重渲染\n if (virtual) {\n rowVirtualizer.measureElement(node);\n }\n\n // 如果启用了行拖拽,则设置行引用\n if (rowDnd && node) {\n const rowRef = rowDndInfo.getRowRef(row.original, rowIndex);\n if (rowRef) {\n rowRef.current = node;\n }\n }\n }}\n onClick={onClickRow(row.original, rowIndex)}\n onMouseEnter={() => {\n if (!isRowSelectionDisabled) {\n setHoverRowId(rowId);\n }\n }}\n onMouseLeave={() => setHoverRowId(null)}\n style={\n virtual\n ? {\n position: 'absolute',\n transform: `translateY(${\n (rowData as VirtualItem).start\n }px)`,\n }\n : {}\n }\n >\n {content}\n </div>\n );\n rowList.push(rowNode);\n\n // 渲染额外展开的行\n const expandItem = expandableInfo.expandItemMap[rowId];\n const customExpandRowKey =\n expandableInfo.isExpandable && expandItem?.customExpandRowKey;\n const hasCustomExpandRowKey = !!customExpandRowKey;\n if (hasCustomExpandRowKey) {\n // 在该行的下面追加自定义展开行\n const expandedRowRender = expandableConfig.expandedRowRender;\n if (typeof expandedRowRender !== 'function') {\n console.error('expandedRowRender must be a function');\n return rowList;\n }\n if (expandItem?.isExpanded !== true) {\n return rowList;\n }\n const customRow = (\n <div\n key={customExpandRowKey}\n className={cn(prefixCls('tr'))}\n onClick={onClickRow(row.original, rowIndex)}\n >\n {expandedRowRender(row.original, expandItem.level + 1)}\n </div>\n );\n rowList.push(customRow);\n }\n return rowList;\n },\n [],\n )\n )}\n </div>\n );\n\n const tableContentHeight = useMemo(() => {\n return y && totalSize\n ? totalSize.height - HEADER_HEIGHT - (isShowFooter ? FOOTER_HEIGHT : 0)\n : 'auto';\n }, [y, totalSize, isShowFooter]);\n\n const tableContent = (\n <Spin spinning={!!loading}>\n <div className={prefixCls('content')}>\n {headerContent}\n <div\n style={{\n height: tableContentHeight,\n position: virtual ? 'relative' : undefined,\n }}\n className={cn(prefixCls('body-scroll'), {\n [prefixCls('scroll-y')]: y !== undefined,\n [prefixCls('scroll-hidden')]: isEmpty,\n })}\n ref={bodyRef}\n onScroll={onBodyScroll}\n >\n {bodyContent}\n </div>\n {isShowFooter && (\n <Footer\n rowSelectionInfo={rowSelectionInfo}\n isShowPagination={isShowPagination}\n pagination={pagination}\n scroll={scroll}\n scrollToFirstRow={scrollToFirstRow}\n />\n )}\n </div>\n </Spin>\n );\n\n const tableStyle: CSSProperties = {};\n if (y) {\n tableStyle.height = y;\n }\n\n return (\n <div\n className={cn(prefixCls('container'), {\n [prefixCls('bordered')]: bordered,\n })}\n style={tableStyle}\n >\n <TableResizeWrapper\n onResize={(w, h) =>\n setTotalSize((prev) => {\n if (prev && prev.width === w && prev.height === h) return prev;\n return { width: w, height: h };\n })\n }\n >\n <div\n className={cn(prefixCls('main'), {\n [prefixCls('overflow-hidden')]: !!y,\n [prefixCls('ping-left')]: isPingLeft,\n [prefixCls('ping-right')]: isPingRight,\n })}\n >\n {rowDnd ? <DndWrapper>{tableContent}</DndWrapper> : tableContent}\n </div>\n </TableResizeWrapper>\n </div>\n );\n}\n\nexport default forwardRef(Table) as <TDataItem extends object>(\n props: ITableProps<TDataItem> & {\n ref?: React.ForwardedRef<ITableRef>;\n },\n) => ReturnType<typeof Table>;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../src/Table/index.tsx"],"sourcesContent":["import {\n Cell,\n Header,\n Row,\n flexRender,\n getCoreRowModel,\n useReactTable,\n} from '@tanstack/react-table';\nimport { VirtualItem, useVirtualizer } from '@tanstack/react-virtual';\nimport { cn } from '../lib/utils';\nimport './table.css';\nimport _ from 'lodash';\nimport React, {\n CSSProperties,\n ForwardedRef,\n forwardRef,\n useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { Empty, Spin } from '..';\nimport ExpandCell from './components/ExpandCell';\nimport Footer from './components/Footer';\nimport DndWrapper from './components/DndWrapper';\nimport { getRowKey, getTableColumns, prefixCls } from './helper';\nimport useExpandable, { getExpandableConfig } from './hooks/useExpandable';\nimport useFixed from './hooks/useFixed';\nimport useRowSelection from './hooks/useRowSelection';\nimport useScroll from './hooks/useScroll';\nimport { ITableColumn, ITableProps, ITableRef } from './types';\nimport useRowDnd from './hooks/useRowDnd';\n\nconst HEADER_HEIGHT = 41;\nconst FOOTER_HEIGHT = 52;\n\nfunction TableResizeWrapper({\n children,\n onResize,\n}: {\n children: React.ReactNode;\n onResize: (width: number, height: number) => void;\n}) {\n const ref = useRef<HTMLDivElement>(null);\n const onResizeRef = useRef(onResize);\n onResizeRef.current = onResize;\n useEffect(() => {\n const el = ref.current;\n if (!el) return;\n let prevW = 0;\n let prevH = 0;\n const ro = new window.ResizeObserver(() => {\n const w = el.offsetWidth;\n const h = el.offsetHeight;\n if (w === prevW && h === prevH) return;\n prevW = w;\n prevH = h;\n onResizeRef.current(w, h);\n });\n ro.observe(el);\n return () => ro.disconnect();\n }, []);\n return (\n <div ref={ref} style={{ height: '100%' }}>\n {children}\n </div>\n );\n}\n\nfunction Table<TDataItem extends object>(\n props: ITableProps<TDataItem>,\n ref: ForwardedRef<ITableRef>,\n) {\n const {\n data,\n bordered,\n rowKey,\n columnSizing,\n sticky,\n loading,\n pagination,\n scroll = {},\n empty: emptyComponent,\n virtual = false,\n rowClassName = () => '',\n onRowClick,\n onError,\n onSort,\n expandable,\n rowDnd,\n rowSelection,\n } = props;\n const [totalSize, setTotalSize] = useState<{\n width: number;\n height: number;\n } | null>(null);\n\n const [hoverRowId, setHoverRowId] = useState<string | null>(null);\n\n const { y } = scroll;\n const {\n containerWidth,\n onBodyScroll,\n headerRef,\n bodyRef,\n isPingLeft,\n isPingRight,\n scrollbarWidth,\n changeIsPing,\n } = useScroll({\n totalSize,\n scroll,\n });\n\n const scrollToFirstRow = useCallback(() => {\n if (!bodyRef.current) {\n return;\n }\n bodyRef.current.scrollTop = 0;\n }, [bodyRef]);\n\n useImperativeHandle(ref, () => ({\n scrollToFirstRow,\n }));\n\n const expandableInfo = useExpandable({\n expandable,\n data,\n rowKey,\n });\n const expandableConfig = getExpandableConfig(expandable);\n\n const rowSelectionInfo = useRowSelection({\n ...props,\n data: expandableInfo.data,\n isExpandable: expandableInfo.isExpandable,\n flattenData: expandableInfo.flattenData,\n });\n\n const rowDndInfo = useRowDnd({\n ...props,\n columns: rowSelectionInfo.columns,\n data: expandableInfo.data,\n });\n\n const tableColumns = useMemo(() => {\n return getTableColumns<TDataItem>({\n columns: rowDndInfo.columns,\n containerWidth: containerWidth || 0,\n onError,\n onSort,\n });\n }, [containerWidth, onError, onSort, rowDndInfo.columns]);\n\n const tableInstance = useReactTable<TDataItem>({\n columns: tableColumns,\n // 排除掉被折叠的行\n data: rowDndInfo.tableData,\n getCoreRowModel: getCoreRowModel(),\n getRowId: (row, index) => {\n return getRowKey(row, rowKey, index);\n },\n columnResizeMode: 'onChange',\n });\n\n const headerGroups = tableInstance.getHeaderGroups();\n\n const columnWidths = headerGroups[0].headers.map((header) =>\n header.getSize(),\n );\n const getColumnFixedInfo = useFixed<TDataItem>({\n columnWidths,\n tableColumns,\n y,\n scrollbarWidth,\n });\n\n // 渲染 header\n const { rows } = tableInstance.getRowModel();\n\n const isStickyWork = !!sticky && y === undefined;\n const headerStyle: CSSProperties = {};\n if (isStickyWork && _.get(sticky, 'offsetHeader')) {\n headerStyle.top = _.get(sticky, 'offsetHeader', 0);\n }\n\n const totalColumnsWidth = _.sum(columnWidths);\n\n useEffect(() => {\n // 总列宽改变时,重新计算是否需要显示固定列的阴影\n changeIsPing(totalColumnsWidth);\n }, [changeIsPing, totalColumnsWidth]);\n\n const renderHeaderCell = useCallback(\n (header: Header<TDataItem, unknown>, index: number) => {\n // 选择行的列不能拖动宽度\n const showResizer =\n columnSizing &&\n !(!!rowSelectionInfo.isRowSelectionEnabled && index === 0);\n const { className: fixedClassName, style: fixedStyle } =\n getColumnFixedInfo(index, true);\n return (\n <div\n role=\"columnheader\"\n aria-label={\n typeof (header.column.columnDef.meta as ITableColumn).title ===\n 'string'\n ? ((header.column.columnDef.meta as ITableColumn).title as string)\n : undefined\n }\n aria-sort={\n (header.column.columnDef.meta as ITableColumn).sortOrder ===\n 'ascend'\n ? 'ascending'\n : (header.column.columnDef.meta as ITableColumn).sortOrder ===\n 'descend'\n ? 'descending'\n : (header.column.columnDef.meta as ITableColumn).sortOrder !==\n undefined\n ? 'none'\n : undefined\n }\n className={cn(prefixCls('th'), fixedClassName)}\n style={{ width: header.getSize(), ...fixedStyle }}\n key={header.id}\n >\n {flexRender(header.column.columnDef.header, header.getContext())}\n {showResizer && (\n <div\n onMouseDown={header.getResizeHandler()}\n onTouchStart={header.getResizeHandler()}\n className={cn(prefixCls('resizer'), {\n [prefixCls('self-resizing')]: header.column.getIsResizing(),\n })}\n />\n )}\n </div>\n );\n },\n [columnSizing, rowSelectionInfo, getColumnFixedInfo],\n );\n\n const visibleColumns = tableInstance.getVisibleLeafColumns();\n\n const columnVirtualizer = useVirtualizer({\n count: tableColumns.length,\n estimateSize: (index: number) => visibleColumns[index].getSize(),\n getScrollElement: () => bodyRef.current,\n horizontal: true,\n overscan: 5,\n });\n\n const virtualColumns = columnVirtualizer.getVirtualItems();\n\n //different virtualization strategy for columns - instead of absolute and translateY, we add empty columns to the left and right\n let virtualPaddingLeft: number | undefined;\n let virtualPaddingRight: number | undefined;\n\n if (columnVirtualizer && virtualColumns?.length) {\n virtualPaddingLeft = virtualColumns[0]?.start ?? 0;\n virtualPaddingRight =\n columnVirtualizer.getTotalSize() -\n (virtualColumns[virtualColumns.length - 1]?.end ?? 0);\n }\n\n const headerContent = (\n <div\n role=\"rowgroup\"\n className={cn(prefixCls('header'), {\n [prefixCls('overflow-x')]: true,\n [prefixCls('sticky')]: isStickyWork,\n [prefixCls('resizing')]:\n tableInstance.getState().columnSizingInfo.isResizingColumn,\n })}\n ref={headerRef}\n style={headerStyle}\n >\n {_.map(headerGroups, (headerGroup) => {\n const allHeaderCells = headerGroup.headers;\n const virtualColumns = columnVirtualizer.getVirtualItems();\n\n const middleVirtualColumns: VirtualItem[] = [];\n // 将固定列单独拎出来,固定列不受列虚拟化影响,必须要渲染\n const leftFixedColumns: {\n header: Header<TDataItem, unknown>;\n index: number;\n }[] = [];\n const rightFixedColumns: {\n header: Header<TDataItem, unknown>;\n index: number;\n }[] = [];\n let content: React.ReactNode | null = null;\n if (virtual) {\n _.forEach(allHeaderCells, (header, index) => {\n const fixedInfo = getColumnFixedInfo(index);\n if (fixedInfo.fixed === 'left') {\n leftFixedColumns.push({ header, index });\n }\n if (fixedInfo.fixed === 'right') {\n rightFixedColumns.push({ header, index });\n }\n });\n\n _.forEach(virtualColumns, (virtualColumn) => {\n const colIndex = virtualColumn.index;\n const fixedInfo = getColumnFixedInfo(colIndex);\n if (fixedInfo.fixed !== 'left' && fixedInfo.fixed !== 'right') {\n middleVirtualColumns.push(virtualColumn);\n }\n });\n content = (\n <>\n {virtualPaddingLeft ? (\n //fake empty column to the left for virtualization scroll padding\n <div\n className={prefixCls('virtual-padding-left')}\n style={{ width: virtualPaddingLeft }}\n />\n ) : null}\n {leftFixedColumns.map(({ header, index }) => {\n return renderHeaderCell(header, index);\n })}\n {_.map(middleVirtualColumns, (virtualColumn) => {\n const header = allHeaderCells[virtualColumn.index];\n return renderHeaderCell(header, virtualColumn.index);\n })}\n {rightFixedColumns.map(({ header, index }) => {\n return renderHeaderCell(header, index);\n })}\n {virtualPaddingRight ? (\n //fake empty column to the right for virtualization scroll padding\n <div\n className={prefixCls('virtual-padding-right')}\n style={{ width: virtualPaddingRight }}\n />\n ) : null}\n </>\n );\n } else {\n content = _.map(allHeaderCells, (header, index) =>\n renderHeaderCell(header, index),\n );\n }\n\n return (\n <div\n className={prefixCls('tr')}\n role=\"row\"\n key={headerGroup.id}\n style={{ width: totalColumnsWidth }}\n >\n {content}\n {y !== undefined && (\n <div\n className={prefixCls('header-scroll-placeholder')}\n style={{ flexBasis: scrollbarWidth }}\n />\n )}\n </div>\n );\n })}\n </div>\n );\n\n const onClickRow = useCallback(\n (rowData: TDataItem, rowIndex: number) => () => {\n if (typeof onRowClick !== 'function') {\n return;\n }\n if (window.getSelection()?.toString().length !== 0) {\n // 防止选择文本时触发 onRowClick\n return;\n }\n onRowClick(rowData, rowIndex);\n },\n [onRowClick],\n );\n\n const isShowPagination = !!(\n pagination &&\n (pagination.total > pagination.pageSize || pagination.showSizeChanger)\n );\n const isShowRowSelection = rowSelectionInfo.isShowRowSelectionInFooter;\n\n const isShowFooter = isShowPagination || isShowRowSelection;\n\n // 空态切换 size 的阈值\n const EMPTY_SMALL_SIZE_HEIGHT = 436;\n const isSmallEmpty = totalSize && totalSize.height < EMPTY_SMALL_SIZE_HEIGHT;\n\n const isEmpty = rows.length === 0 && !loading;\n\n const rowVirtualizer = useVirtualizer({\n count: rows.length,\n estimateSize: () => 48, // estimate row height for accurate scrollbar dragging\n // 没有测量出 bodyRef.current 的高度时,返回 null,避免虚拟化器从 DOM 获取异常高度\n getScrollElement: () => (totalSize ? bodyRef.current : null),\n // measure dynamic row height, except in firefox because it measures table border height incorrectly\n measureElement:\n typeof window !== 'undefined' &&\n navigator.userAgent.indexOf('Firefox') === -1\n ? (element) => element?.getBoundingClientRect().height\n : undefined,\n overscan: 5,\n });\n\n const tableRows = virtual ? rowVirtualizer.getVirtualItems() : rows;\n\n const renderBodyCell = useCallback(\n (row: Row<TDataItem>, cell: Cell<TDataItem, unknown>, colIndex: number) => {\n const { className: fixedClassName, style: fixedStyle } =\n getColumnFixedInfo(colIndex);\n const tdContent = flexRender(\n cell.column.columnDef.cell,\n cell.getContext(),\n );\n return (\n <div\n role=\"cell\"\n className={cn(prefixCls('td'), fixedClassName)}\n key={cell.id}\n style={{ width: cell.column.getSize(), ...fixedStyle }}\n >\n {expandableInfo.isExpandable &&\n colIndex === (rowSelectionInfo.isRowSelectionEnabled ? 1 : 0) ? (\n <ExpandCell\n expandableInfo={expandableInfo}\n expandable={expandable}\n data={row.original}\n rowKey={rowKey}\n >\n {tdContent}\n </ExpandCell>\n ) : (\n tdContent\n )}\n </div>\n );\n },\n [\n expandableInfo,\n expandable,\n rowKey,\n getColumnFixedInfo,\n rowSelectionInfo.isRowSelectionEnabled,\n ],\n );\n\n // 渲染 body\n const bodyContent = (\n <div\n role=\"rowgroup\"\n className={prefixCls('body')}\n style={{\n width: totalColumnsWidth,\n height: virtual\n ? totalSize\n ? rowVirtualizer.getTotalSize()\n : 0\n : 'auto',\n }}\n >\n {isEmpty ? (\n <div style={{ width: totalSize?.width }}>\n <div style={{ visibility: 'hidden' }}>\n {emptyComponent || (\n <div\n className={cn(prefixCls('empty'), {\n [prefixCls('empty-small')]: isSmallEmpty,\n })}\n >\n <Empty\n image={isSmallEmpty ? null : Empty.PRESENTED_IMAGE_SEARCH}\n size={isSmallEmpty ? 'small' : undefined}\n />\n </div>\n )}\n </div>\n <div\n role=\"status\"\n aria-live=\"polite\"\n aria-invalid=\"true\"\n style={{\n position: 'absolute',\n top: 40,\n left: 0,\n right: 0,\n bottom: 0,\n }}\n >\n {emptyComponent || (\n <div\n className={cn(prefixCls('empty'), {\n [prefixCls('empty-small')]: isSmallEmpty,\n })}\n >\n <Empty\n image={isSmallEmpty ? null : Empty.PRESENTED_IMAGE_SEARCH}\n size={isSmallEmpty ? 'small' : undefined}\n />\n </div>\n )}\n </div>\n </div>\n ) : (\n _.reduce<Row<TDataItem> | VirtualItem, React.ReactNode[]>(\n tableRows,\n (rowList, rowData, rowIndex) => {\n const row = virtual\n ? rows[rowData.index]\n : (rowData as Row<TDataItem>);\n const allRowCells = row.getVisibleCells();\n\n let content: React.ReactNode | null = null;\n // 将固定列单独拎出来,固定列不受列虚拟化影响,必须要渲染\n const leftFixedColumns: {\n cell: Cell<TDataItem, unknown>;\n index: number;\n }[] = [];\n const rightFixedColumns: {\n cell: Cell<TDataItem, unknown>;\n index: number;\n }[] = [];\n\n if (virtual) {\n const virtualColumns = columnVirtualizer.getVirtualItems();\n\n const middleVirtualColumns: VirtualItem[] = [];\n\n _.forEach(allRowCells, (cell, index) => {\n const fixedInfo = getColumnFixedInfo(index);\n if (fixedInfo.fixed === 'left') {\n leftFixedColumns.push({ cell, index });\n }\n if (fixedInfo.fixed === 'right') {\n rightFixedColumns.push({ cell, index });\n }\n });\n\n _.forEach(virtualColumns, (virtualColumn) => {\n const colIndex = virtualColumn.index;\n const fixedInfo = getColumnFixedInfo(colIndex);\n if (fixedInfo.fixed !== 'left' && fixedInfo.fixed !== 'right') {\n middleVirtualColumns.push(virtualColumn);\n }\n });\n content = (\n <>\n {virtualPaddingLeft ? (\n //fake empty column to the left for virtualization scroll padding\n <div\n className={prefixCls('virtual-padding-left')}\n style={{ width: virtualPaddingLeft }}\n />\n ) : null}\n {leftFixedColumns.map(({ cell, index }) => {\n return renderBodyCell(row, cell, index);\n })}\n {middleVirtualColumns.map((virtualColumn) => {\n const colIndex = virtualColumn.index;\n const cell = allRowCells[colIndex];\n return renderBodyCell(row, cell, colIndex);\n })}\n {rightFixedColumns.map(({ cell, index }) => {\n return renderBodyCell(row, cell, index);\n })}\n {virtualPaddingRight ? (\n //fake empty column to the right for virtualization scroll padding\n <div\n className={prefixCls('virtual-padding-right')}\n style={{ width: virtualPaddingRight }}\n />\n ) : null}\n </>\n );\n } else {\n content = allRowCells.map((cell, index) =>\n renderBodyCell(row, cell, index),\n );\n }\n const rowId = row.id;\n const isRowSelected =\n rowSelectionInfo.isRowSelectionEnabled &&\n rowSelectionInfo.selectedRowKeys.includes(rowId);\n const isRowSelectionDisabled =\n rowSelectionInfo.isRowSelectionEnabled &&\n !!rowSelection?.getCheckboxProps?.(row.original).disabled;\n\n const rowNode = (\n <div\n key={rowId}\n role=\"row\"\n aria-rowindex={rowIndex + 2}\n data-index={virtual ? (rowData as VirtualItem).index : rowIndex}\n className={cn(\n prefixCls('tr'),\n {\n // 需要用 state 的原因是,存在固定列的情况,左右侧的固定列在 dom 结构上不在同一个 tr 上,所以不能用 css 的 :hover 来实现\n // 当拖拽行时,不显示 hover 状态\n [prefixCls('row-hover')]: rowDndInfo.draggingRowId\n ? undefined\n : hoverRowId === rowId,\n [prefixCls('row-dragging')]:\n rowDndInfo.draggingRowId === rowId,\n [prefixCls('row-selected')]: isRowSelected,\n [prefixCls('row-selection-disabled')]:\n isRowSelectionDisabled,\n [prefixCls('no-border-tr')]:\n isShowPagination && rowIndex === rows.length - 1,\n },\n rowClassName(row.original, rowIndex),\n )}\n ref={(node) => {\n // 只在虚拟滚动模式下才测量行高度,避免非虚拟模式下的不必要重渲染\n if (virtual) {\n rowVirtualizer.measureElement(node);\n }\n\n // 如果启用了行拖拽,则设置行引用\n if (rowDnd && node) {\n const rowRef = rowDndInfo.getRowRef(row.original, rowIndex);\n if (rowRef) {\n rowRef.current = node;\n }\n }\n }}\n onClick={onClickRow(row.original, rowIndex)}\n onMouseEnter={() => {\n if (!isRowSelectionDisabled) {\n setHoverRowId(rowId);\n }\n }}\n onMouseLeave={() => setHoverRowId(null)}\n style={\n virtual\n ? {\n position: 'absolute',\n transform: `translateY(${\n (rowData as VirtualItem).start\n }px)`,\n }\n : {}\n }\n >\n {content}\n </div>\n );\n rowList.push(rowNode);\n\n // 渲染额外展开的行\n const expandItem = expandableInfo.expandItemMap[rowId];\n const customExpandRowKey =\n expandableInfo.isExpandable && expandItem?.customExpandRowKey;\n const hasCustomExpandRowKey = !!customExpandRowKey;\n if (hasCustomExpandRowKey) {\n // 在该行的下面追加自定义展开行\n const expandedRowRender = expandableConfig.expandedRowRender;\n if (typeof expandedRowRender !== 'function') {\n console.error('expandedRowRender must be a function');\n return rowList;\n }\n if (expandItem?.isExpanded !== true) {\n return rowList;\n }\n const customRow = (\n <div\n key={customExpandRowKey}\n className={cn(prefixCls('tr'))}\n role=\"row\"\n onClick={onClickRow(row.original, rowIndex)}\n >\n {expandedRowRender(row.original, expandItem.level + 1)}\n </div>\n );\n rowList.push(customRow);\n }\n return rowList;\n },\n [],\n )\n )}\n </div>\n );\n\n const tableContentHeight = useMemo(() => {\n return y && totalSize\n ? totalSize.height - HEADER_HEIGHT - (isShowFooter ? FOOTER_HEIGHT : 0)\n : 'auto';\n }, [y, totalSize, isShowFooter]);\n\n const tableContentBody = (\n <div className={prefixCls('content')} role=\"table\" aria-label=\"Data table\">\n {headerContent}\n <div\n style={{\n height: tableContentHeight,\n position: virtual ? 'relative' : undefined,\n }}\n className={cn(prefixCls('body-scroll'), {\n [prefixCls('scroll-y')]: y !== undefined,\n [prefixCls('scroll-hidden')]: isEmpty,\n })}\n ref={bodyRef}\n onScroll={onBodyScroll}\n >\n {bodyContent}\n </div>\n {isShowFooter && (\n <Footer\n rowSelectionInfo={rowSelectionInfo}\n isShowPagination={isShowPagination}\n pagination={pagination}\n scroll={scroll}\n scrollToFirstRow={scrollToFirstRow}\n />\n )}\n </div>\n );\n\n const tableContent = loading ? (\n <Spin spinning>{tableContentBody}</Spin>\n ) : (\n tableContentBody\n );\n\n const tableStyle: CSSProperties = {};\n if (y) {\n tableStyle.height = y;\n }\n\n return (\n <div\n className={cn(prefixCls('container'), {\n [prefixCls('bordered')]: bordered,\n })}\n style={tableStyle}\n >\n <TableResizeWrapper\n onResize={(w, h) =>\n setTotalSize((prev) => {\n if (prev && prev.width === w && prev.height === h) return prev;\n return { width: w, height: h };\n })\n }\n >\n <div\n className={cn(prefixCls('main'), {\n [prefixCls('overflow-hidden')]: !!y,\n [prefixCls('ping-left')]: isPingLeft,\n [prefixCls('ping-right')]: isPingRight,\n })}\n >\n {rowDnd ? <DndWrapper>{tableContent}</DndWrapper> : tableContent}\n </div>\n </TableResizeWrapper>\n </div>\n );\n}\n\nexport default forwardRef(Table) as <TDataItem extends object>(\n props: ITableProps<TDataItem> & {\n ref?: React.ForwardedRef<ITableRef>;\n },\n) => ReturnType<typeof Table>;\n"],"mappings":"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"}
|