@chenzy-design/svelte 0.1.0 → 0.2.0
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/components.json +1 -1
- package/package.json +7 -8
- package/src/_floating/use-floating.ts +0 -208
- package/src/anchor/Anchor.a11y.test.ts +0 -49
- package/src/anchor/Anchor.kbd.test.ts +0 -70
- package/src/anchor/Anchor.svelte +0 -359
- package/src/anchor/AnchorKbdFixture.svelte +0 -24
- package/src/anchor/index.ts +0 -3
- package/src/anchor/meta.ts +0 -70
- package/src/anchor/types.ts +0 -8
- package/src/autocomplete/AutoComplete.a11y.test.ts +0 -49
- package/src/autocomplete/AutoComplete.kbd.test.ts +0 -69
- package/src/autocomplete/AutoComplete.svelte +0 -706
- package/src/autocomplete/AutoCompleteKbdFixture.svelte +0 -24
- package/src/autocomplete/index.ts +0 -2
- package/src/autocomplete/meta.ts +0 -41
- package/src/avatar/Avatar.a11y.test.ts +0 -37
- package/src/avatar/Avatar.svelte +0 -315
- package/src/avatar/AvatarGroup.svelte +0 -142
- package/src/avatar/context.ts +0 -21
- package/src/avatar/index.ts +0 -10
- package/src/avatar/meta.ts +0 -73
- package/src/back-top/BackTop.a11y.test.ts +0 -40
- package/src/back-top/BackTop.svelte +0 -314
- package/src/back-top/index.ts +0 -2
- package/src/back-top/meta.ts +0 -108
- package/src/badge/Badge.a11y.test.ts +0 -35
- package/src/badge/Badge.svelte +0 -328
- package/src/badge/BadgeA11yFixture.svelte +0 -18
- package/src/badge/index.ts +0 -2
- package/src/badge/meta.ts +0 -62
- package/src/banner/Banner.a11y.test.ts +0 -48
- package/src/banner/Banner.svelte +0 -368
- package/src/banner/index.ts +0 -3
- package/src/banner/meta.ts +0 -121
- package/src/breadcrumb/Breadcrumb.a11y.test.ts +0 -35
- package/src/breadcrumb/Breadcrumb.kbd.test.ts +0 -45
- package/src/breadcrumb/Breadcrumb.svelte +0 -414
- package/src/breadcrumb/BreadcrumbKbdFixture.svelte +0 -23
- package/src/breadcrumb/Item.svelte +0 -77
- package/src/breadcrumb/context.ts +0 -27
- package/src/breadcrumb/index.ts +0 -21
- package/src/breadcrumb/meta.ts +0 -128
- package/src/breadcrumb/types.ts +0 -4
- package/src/button/Button.a11y.test.ts +0 -54
- package/src/button/Button.svelte +0 -176
- package/src/button/index.ts +0 -2
- package/src/button/meta.ts +0 -28
- package/src/calendar/Calendar.a11y.test.ts +0 -51
- package/src/calendar/Calendar.kbd.test.ts +0 -59
- package/src/calendar/Calendar.svelte +0 -1344
- package/src/calendar/CalendarKbdFixture.svelte +0 -23
- package/src/calendar/index.ts +0 -3
- package/src/calendar/meta.ts +0 -117
- package/src/card/Card.a11y.test.ts +0 -38
- package/src/card/Card.svelte +0 -341
- package/src/card/CardMeta.svelte +0 -60
- package/src/card/index.ts +0 -8
- package/src/card/meta.ts +0 -83
- package/src/carousel/Carousel.a11y.test.ts +0 -53
- package/src/carousel/Carousel.kbd.test.ts +0 -67
- package/src/carousel/Carousel.svelte +0 -806
- package/src/carousel/CarouselA11yFixture.svelte +0 -25
- package/src/carousel/CarouselKbdFixture.svelte +0 -24
- package/src/carousel/index.ts +0 -2
- package/src/carousel/meta.ts +0 -74
- package/src/cascader/Cascader.a11y.test.ts +0 -59
- package/src/cascader/Cascader.kbd.test.ts +0 -56
- package/src/cascader/Cascader.svelte +0 -1570
- package/src/cascader/CascaderKbdFixture.svelte +0 -31
- package/src/cascader/index.ts +0 -3
- package/src/cascader/meta.ts +0 -57
- package/src/cascader/types.ts +0 -9
- package/src/checkbox/Checkbox.svelte +0 -281
- package/src/checkbox/CheckboxGroup.a11y.test.ts +0 -43
- package/src/checkbox/CheckboxGroup.kbd.test.ts +0 -40
- package/src/checkbox/CheckboxGroup.svelte +0 -122
- package/src/checkbox/CheckboxGroupKbdFixture.svelte +0 -20
- package/src/checkbox/context.ts +0 -31
- package/src/checkbox/index.ts +0 -4
- package/src/checkbox/meta.ts +0 -67
- package/src/collapse/Collapse.a11y.test.ts +0 -53
- package/src/collapse/Collapse.kbd.test.ts +0 -89
- package/src/collapse/Collapse.svelte +0 -406
- package/src/collapse/CollapseA11yFixture.svelte +0 -27
- package/src/collapse/CollapseKbdFixture.svelte +0 -25
- package/src/collapse/CollapsePanel.svelte +0 -102
- package/src/collapse/context.ts +0 -54
- package/src/collapse/index.ts +0 -17
- package/src/collapse/meta.ts +0 -79
- package/src/collapse/types.ts +0 -5
- package/src/color-picker/ColorPicker.a11y.test.ts +0 -60
- package/src/color-picker/ColorPicker.kbd.test.ts +0 -73
- package/src/color-picker/ColorPicker.svelte +0 -985
- package/src/color-picker/ColorPickerKbdFixture.svelte +0 -25
- package/src/color-picker/index.ts +0 -2
- package/src/color-picker/meta.ts +0 -47
- package/src/config-provider/ConfigProvider.svelte +0 -227
- package/src/config-provider/context.ts +0 -29
- package/src/config-provider/index.ts +0 -48
- package/src/config-provider/meta.ts +0 -128
- package/src/date-picker/DatePicker.a11y.test.ts +0 -45
- package/src/date-picker/DatePicker.kbd.test.ts +0 -71
- package/src/date-picker/DatePicker.svelte +0 -1798
- package/src/date-picker/DatePickerKbdFixture.svelte +0 -26
- package/src/date-picker/RangePicker.kbd.test.ts +0 -69
- package/src/date-picker/RangePicker.svelte +0 -775
- package/src/date-picker/RangePickerKbdFixture.svelte +0 -30
- package/src/date-picker/index.ts +0 -4
- package/src/date-picker/meta.ts +0 -67
- package/src/date-picker/range-meta.ts +0 -44
- package/src/descriptions/Descriptions.a11y.test.ts +0 -33
- package/src/descriptions/Descriptions.svelte +0 -287
- package/src/descriptions/DescriptionsItem.svelte +0 -43
- package/src/descriptions/context.ts +0 -21
- package/src/descriptions/index.ts +0 -16
- package/src/descriptions/meta.ts +0 -45
- package/src/descriptions/types.ts +0 -6
- package/src/divider/Divider.a11y.test.ts +0 -23
- package/src/divider/Divider.svelte +0 -154
- package/src/divider/index.ts +0 -2
- package/src/divider/meta.ts +0 -23
- package/src/drawer/Drawer.a11y.test.ts +0 -41
- package/src/drawer/Drawer.kbd.test.ts +0 -67
- package/src/drawer/Drawer.svelte +0 -554
- package/src/drawer/DrawerKbdFixture.svelte +0 -28
- package/src/drawer/index.ts +0 -2
- package/src/drawer/meta.ts +0 -127
- package/src/dropdown/Dropdown.a11y.test.ts +0 -46
- package/src/dropdown/Dropdown.kbd.test.ts +0 -56
- package/src/dropdown/Dropdown.svelte +0 -573
- package/src/dropdown/DropdownA11yFixture.svelte +0 -24
- package/src/dropdown/DropdownDivider.svelte +0 -17
- package/src/dropdown/DropdownItem.svelte +0 -127
- package/src/dropdown/DropdownItemNode.svelte +0 -355
- package/src/dropdown/DropdownKbdFixture.svelte +0 -26
- package/src/dropdown/DropdownMenu.svelte +0 -24
- package/src/dropdown/DropdownSubMenu.svelte +0 -212
- package/src/dropdown/DropdownTitle.svelte +0 -34
- package/src/dropdown/context.ts +0 -13
- package/src/dropdown/index.ts +0 -36
- package/src/dropdown/meta.ts +0 -97
- package/src/dropdown/types.test.ts +0 -50
- package/src/dropdown/types.ts +0 -67
- package/src/empty/Empty.a11y.test.ts +0 -24
- package/src/empty/Empty.svelte +0 -304
- package/src/empty/index.ts +0 -2
- package/src/empty/meta.ts +0 -41
- package/src/form/Field.svelte +0 -492
- package/src/form/FieldArray.svelte +0 -75
- package/src/form/Form.a11y.test.ts +0 -39
- package/src/form/Form.svelte +0 -243
- package/src/form/FormA11yFixture.svelte +0 -31
- package/src/form/FormCascader.svelte +0 -82
- package/src/form/FormCheckbox.svelte +0 -83
- package/src/form/FormDatePicker.svelte +0 -80
- package/src/form/FormErrorMessage.svelte +0 -44
- package/src/form/FormInput.svelte +0 -95
- package/src/form/FormLabel.svelte +0 -46
- package/src/form/FormRadio.svelte +0 -83
- package/src/form/FormRating.svelte +0 -85
- package/src/form/FormSection.svelte +0 -45
- package/src/form/FormSelect.svelte +0 -96
- package/src/form/FormSlider.svelte +0 -95
- package/src/form/FormSlot.svelte +0 -51
- package/src/form/FormSwitch.svelte +0 -82
- package/src/form/FormTagInput.svelte +0 -79
- package/src/form/FormTreeSelect.svelte +0 -85
- package/src/form/FormUpload.svelte +0 -92
- package/src/form/context.ts +0 -47
- package/src/form/index.ts +0 -22
- package/src/form/meta.ts +0 -85
- package/src/grid/Col.svelte +0 -142
- package/src/grid/Grid.a11y.test.ts +0 -14
- package/src/grid/GridA11yFixture.svelte +0 -12
- package/src/grid/Row.svelte +0 -116
- package/src/grid/index.ts +0 -3
- package/src/grid/meta.ts +0 -72
- package/src/grid/use-breakpoint.svelte.ts +0 -48
- package/src/highlight/Highlight.a11y.test.ts +0 -25
- package/src/highlight/Highlight.svelte +0 -99
- package/src/highlight/index.ts +0 -2
- package/src/highlight/meta.ts +0 -80
- package/src/icon/Icon.svelte +0 -156
- package/src/icon/index.ts +0 -2
- package/src/icon/meta.ts +0 -41
- package/src/image/Image.a11y.test.ts +0 -30
- package/src/image/Image.svelte +0 -387
- package/src/image/ImagePreview.kbd.test.ts +0 -52
- package/src/image/ImagePreview.svelte +0 -309
- package/src/image/ImagePreviewGroup.svelte +0 -93
- package/src/image/ImagePreviewKbdFixture.svelte +0 -32
- package/src/image/context.ts +0 -26
- package/src/image/index.ts +0 -15
- package/src/image/meta.ts +0 -131
- package/src/index.ts +0 -208
- package/src/input/Input.a11y.test.ts +0 -58
- package/src/input/Input.svelte +0 -505
- package/src/input/index.ts +0 -2
- package/src/input/meta.ts +0 -40
- package/src/input-number/InputNumber.a11y.test.ts +0 -43
- package/src/input-number/InputNumber.kbd.test.ts +0 -41
- package/src/input-number/InputNumber.svelte +0 -674
- package/src/input-number/InputNumberKbdFixture.svelte +0 -15
- package/src/input-number/index.ts +0 -2
- package/src/input-number/meta.ts +0 -65
- package/src/layout/Content.svelte +0 -37
- package/src/layout/Footer.svelte +0 -49
- package/src/layout/Header.svelte +0 -46
- package/src/layout/Layout.a11y.test.ts +0 -34
- package/src/layout/Layout.svelte +0 -60
- package/src/layout/LayoutA11yFixture.svelte +0 -21
- package/src/layout/Sider.svelte +0 -207
- package/src/layout/index.ts +0 -26
- package/src/layout/meta.ts +0 -116
- package/src/list/List.a11y.test.ts +0 -69
- package/src/list/List.bench.ts +0 -26
- package/src/list/List.kbd.test.ts +0 -71
- package/src/list/List.svelte +0 -920
- package/src/list/ListA11yFixture.svelte +0 -38
- package/src/list/ListBenchFixture.svelte +0 -22
- package/src/list/ListItem.svelte +0 -175
- package/src/list/ListKbdFixture.svelte +0 -31
- package/src/list/ListMeta.svelte +0 -73
- package/src/list/context.ts +0 -39
- package/src/list/index.ts +0 -21
- package/src/list/meta.ts +0 -99
- package/src/locale-provider/LocaleProvider.svelte +0 -110
- package/src/locale-provider/context.ts +0 -22
- package/src/locale-provider/index.ts +0 -21
- package/src/locale-provider/meta.ts +0 -93
- package/src/locale-provider/use-locale.ts +0 -25
- package/src/lottie-icon/LottieIcon.svelte +0 -330
- package/src/lottie-icon/index.ts +0 -9
- package/src/lottie-icon/meta.ts +0 -162
- package/src/menu/Menu.a11y.test.ts +0 -54
- package/src/menu/Menu.kbd.test.ts +0 -69
- package/src/menu/Menu.svelte +0 -762
- package/src/menu/MenuKbdFixture.svelte +0 -22
- package/src/menu/MenuPopupNode.svelte +0 -525
- package/src/menu/index.ts +0 -4
- package/src/menu/meta.ts +0 -137
- package/src/menu/types.ts +0 -120
- package/src/meta.test.ts +0 -173
- package/src/modal/ConfirmModal.svelte +0 -173
- package/src/modal/Modal.a11y.test.ts +0 -46
- package/src/modal/Modal.kbd.test.ts +0 -65
- package/src/modal/Modal.svelte +0 -511
- package/src/modal/ModalKbdFixture.svelte +0 -24
- package/src/modal/command.svelte.ts +0 -103
- package/src/modal/index.ts +0 -30
- package/src/modal/meta.ts +0 -165
- package/src/modal/z-stack.ts +0 -26
- package/src/notification/NotificationContainer.svelte +0 -192
- package/src/notification/NotificationItem.a11y.test.ts +0 -73
- package/src/notification/NotificationItem.svelte +0 -368
- package/src/notification/index.ts +0 -9
- package/src/notification/meta.ts +0 -120
- package/src/notification/store.ts +0 -191
- package/src/overflow-list/OverflowList.a11y.test.ts +0 -46
- package/src/overflow-list/OverflowList.kbd.test.ts +0 -34
- package/src/overflow-list/OverflowList.svelte +0 -539
- package/src/overflow-list/OverflowListA11yFixture.svelte +0 -22
- package/src/overflow-list/OverflowListKbdFixture.svelte +0 -21
- package/src/overflow-list/index.ts +0 -2
- package/src/overflow-list/meta.ts +0 -138
- package/src/pagination/Pagination.a11y.test.ts +0 -62
- package/src/pagination/Pagination.kbd.test.ts +0 -66
- package/src/pagination/Pagination.svelte +0 -428
- package/src/pagination/PaginationKbdFixture.svelte +0 -15
- package/src/pagination/index.ts +0 -2
- package/src/pagination/meta.ts +0 -73
- package/src/popconfirm/Popconfirm.a11y.test.ts +0 -46
- package/src/popconfirm/Popconfirm.kbd.test.ts +0 -42
- package/src/popconfirm/Popconfirm.svelte +0 -724
- package/src/popconfirm/PopconfirmA11yFixture.svelte +0 -34
- package/src/popconfirm/PopconfirmKbdFixture.svelte +0 -17
- package/src/popconfirm/index.ts +0 -2
- package/src/popconfirm/meta.ts +0 -200
- package/src/popover/Popover.a11y.test.ts +0 -58
- package/src/popover/Popover.kbd.test.ts +0 -42
- package/src/popover/Popover.svelte +0 -643
- package/src/popover/PopoverA11yFixture.svelte +0 -35
- package/src/popover/PopoverKbdFixture.svelte +0 -18
- package/src/popover/index.ts +0 -2
- package/src/popover/meta.ts +0 -103
- package/src/progress/Progress.a11y.test.ts +0 -37
- package/src/progress/Progress.svelte +0 -423
- package/src/progress/index.ts +0 -3
- package/src/progress/meta.ts +0 -132
- package/src/radio/Radio.svelte +0 -330
- package/src/radio/RadioGroup.a11y.test.ts +0 -43
- package/src/radio/RadioGroup.kbd.test.ts +0 -75
- package/src/radio/RadioGroup.svelte +0 -199
- package/src/radio/RadioGroupKbdFixture.svelte +0 -21
- package/src/radio/context.ts +0 -42
- package/src/radio/index.ts +0 -4
- package/src/radio/meta.ts +0 -68
- package/src/rating/Rating.a11y.test.ts +0 -41
- package/src/rating/Rating.kbd.test.ts +0 -48
- package/src/rating/Rating.svelte +0 -407
- package/src/rating/RatingKbdFixture.svelte +0 -15
- package/src/rating/index.ts +0 -2
- package/src/rating/meta.ts +0 -40
- package/src/resize-observer/ResizeObserver.svelte +0 -169
- package/src/resize-observer/action.ts +0 -80
- package/src/resize-observer/index.ts +0 -9
- package/src/resize-observer/meta.ts +0 -102
- package/src/scroll-list/ScrollColumn.svelte +0 -592
- package/src/scroll-list/ScrollList.svelte +0 -257
- package/src/scroll-list/index.ts +0 -4
- package/src/scroll-list/meta.ts +0 -93
- package/src/scroll-list/types.ts +0 -18
- package/src/select/Select.a11y.test.ts +0 -59
- package/src/select/Select.kbd.test.ts +0 -59
- package/src/select/Select.svelte +0 -1155
- package/src/select/SelectKbdFixture.svelte +0 -29
- package/src/select/index.ts +0 -3
- package/src/select/meta.ts +0 -78
- package/src/select/types.ts +0 -2
- package/src/side-sheet/SideSheet.a11y.test.ts +0 -53
- package/src/side-sheet/SideSheet.kbd.test.ts +0 -63
- package/src/side-sheet/SideSheet.svelte +0 -659
- package/src/side-sheet/SideSheetKbdFixture.svelte +0 -30
- package/src/side-sheet/index.ts +0 -2
- package/src/side-sheet/meta.ts +0 -116
- package/src/skeleton/Skeleton.a11y.test.ts +0 -35
- package/src/skeleton/Skeleton.svelte +0 -131
- package/src/skeleton/SkeletonAvatar.svelte +0 -82
- package/src/skeleton/SkeletonButton.svelte +0 -90
- package/src/skeleton/SkeletonImage.svelte +0 -100
- package/src/skeleton/SkeletonParagraph.svelte +0 -103
- package/src/skeleton/SkeletonTitle.svelte +0 -74
- package/src/skeleton/context.ts +0 -11
- package/src/skeleton/index.ts +0 -8
- package/src/skeleton/meta.ts +0 -65
- package/src/slider/Slider.a11y.test.ts +0 -44
- package/src/slider/Slider.kbd.test.ts +0 -74
- package/src/slider/Slider.svelte +0 -716
- package/src/slider/SliderKbdFixture.svelte +0 -21
- package/src/slider/index.ts +0 -2
- package/src/slider/meta.ts +0 -55
- package/src/space/Space.a11y.test.ts +0 -22
- package/src/space/Space.svelte +0 -109
- package/src/space/SpaceA11yFixture.svelte +0 -17
- package/src/space/index.ts +0 -2
- package/src/space/meta.ts +0 -27
- package/src/spin/Spin.a11y.test.ts +0 -29
- package/src/spin/Spin.svelte +0 -293
- package/src/spin/SpinA11yFixture.svelte +0 -18
- package/src/spin/index.ts +0 -2
- package/src/spin/meta.ts +0 -72
- package/src/steps/Steps.a11y.test.ts +0 -39
- package/src/steps/Steps.kbd.test.ts +0 -73
- package/src/steps/Steps.svelte +0 -392
- package/src/steps/StepsKbdFixture.svelte +0 -21
- package/src/steps/index.ts +0 -3
- package/src/steps/meta.ts +0 -59
- package/src/steps/types.ts +0 -8
- package/src/switch/Switch.a11y.test.ts +0 -46
- package/src/switch/Switch.kbd.test.ts +0 -40
- package/src/switch/Switch.svelte +0 -310
- package/src/switch/SwitchKbdFixture.svelte +0 -22
- package/src/switch/index.ts +0 -2
- package/src/switch/meta.ts +0 -44
- package/src/table/Table.a11y.test.ts +0 -70
- package/src/table/Table.bench.ts +0 -51
- package/src/table/Table.kbd.test.ts +0 -94
- package/src/table/Table.svelte +0 -2327
- package/src/table/TableKbdFixture.svelte +0 -35
- package/src/table/grid-nav.test.ts +0 -173
- package/src/table/grid-nav.ts +0 -146
- package/src/table/index.ts +0 -13
- package/src/table/meta.ts +0 -121
- package/src/table/types.ts +0 -133
- package/src/tabs/TabPane.svelte +0 -92
- package/src/tabs/Tabs.a11y.test.ts +0 -47
- package/src/tabs/Tabs.kbd.test.ts +0 -74
- package/src/tabs/Tabs.svelte +0 -1128
- package/src/tabs/TabsA11yFixture.svelte +0 -20
- package/src/tabs/TabsKbdFixture.svelte +0 -25
- package/src/tabs/context.ts +0 -43
- package/src/tabs/index.ts +0 -14
- package/src/tabs/meta.ts +0 -152
- package/src/tabs/types.ts +0 -6
- package/src/tag/Tag.a11y.test.ts +0 -33
- package/src/tag/Tag.svelte +0 -366
- package/src/tag/TagA11yFixture.svelte +0 -18
- package/src/tag/index.ts +0 -2
- package/src/tag/meta.ts +0 -92
- package/src/tag-input/TagInput.a11y.test.ts +0 -41
- package/src/tag-input/TagInput.svelte +0 -544
- package/src/tag-input/index.ts +0 -2
- package/src/tag-input/meta.ts +0 -43
- package/src/tag-input/reorder.test.ts +0 -59
- package/src/tag-input/reorder.ts +0 -41
- package/src/test-utils/LocaleHarness.svelte +0 -29
- package/src/test-utils/a11y.ts +0 -108
- package/src/test-utils/kbd.ts +0 -52
- package/src/textarea/TextArea.a11y.test.ts +0 -44
- package/src/textarea/TextArea.svelte +0 -420
- package/src/textarea/index.ts +0 -2
- package/src/textarea/meta.ts +0 -104
- package/src/time-picker/TimePicker.a11y.test.ts +0 -45
- package/src/time-picker/TimePicker.kbd.test.ts +0 -70
- package/src/time-picker/TimePicker.svelte +0 -1023
- package/src/time-picker/TimePickerKbdFixture.svelte +0 -23
- package/src/time-picker/index.ts +0 -2
- package/src/time-picker/meta.ts +0 -64
- package/src/timeline/Timeline.a11y.test.ts +0 -54
- package/src/timeline/Timeline.svelte +0 -599
- package/src/timeline/TimelineItem.svelte +0 -164
- package/src/timeline/context.ts +0 -28
- package/src/timeline/index.ts +0 -16
- package/src/timeline/meta.ts +0 -129
- package/src/timeline/types.ts +0 -9
- package/src/toast/Toast.a11y.test.ts +0 -67
- package/src/toast/ToastContainer.svelte +0 -184
- package/src/toast/ToastItem.svelte +0 -247
- package/src/toast/index.ts +0 -9
- package/src/toast/live-region.ts +0 -78
- package/src/toast/meta.ts +0 -95
- package/src/toast/store.ts +0 -187
- package/src/tooltip/Tooltip.a11y.test.ts +0 -41
- package/src/tooltip/Tooltip.kbd.test.ts +0 -37
- package/src/tooltip/Tooltip.svelte +0 -416
- package/src/tooltip/TooltipA11yFixture.svelte +0 -31
- package/src/tooltip/TooltipKbdFixture.svelte +0 -16
- package/src/tooltip/index.ts +0 -2
- package/src/tooltip/meta.ts +0 -59
- package/src/tooltip/placement.ts +0 -6
- package/src/transfer/Transfer.a11y.test.ts +0 -63
- package/src/transfer/Transfer.kbd.test.ts +0 -75
- package/src/transfer/Transfer.svelte +0 -1451
- package/src/transfer/TransferKbdFixture.svelte +0 -23
- package/src/transfer/group.test.ts +0 -55
- package/src/transfer/group.ts +0 -61
- package/src/transfer/index.ts +0 -3
- package/src/transfer/meta.ts +0 -55
- package/src/transfer/reorder.test.ts +0 -52
- package/src/transfer/reorder.ts +0 -42
- package/src/transfer/tree.test.ts +0 -44
- package/src/transfer/tree.ts +0 -52
- package/src/transfer/types.ts +0 -32
- package/src/tree/Tree.a11y.test.ts +0 -63
- package/src/tree/Tree.kbd.test.ts +0 -91
- package/src/tree/Tree.svelte +0 -1500
- package/src/tree/TreeKbdFixture.svelte +0 -30
- package/src/tree/index.ts +0 -3
- package/src/tree/meta.ts +0 -152
- package/src/tree-select/TreeSelect.a11y.test.ts +0 -52
- package/src/tree-select/TreeSelect.kbd.test.ts +0 -53
- package/src/tree-select/TreeSelect.svelte +0 -1611
- package/src/tree-select/TreeSelectKbdFixture.svelte +0 -20
- package/src/tree-select/index.ts +0 -3
- package/src/tree-select/meta.ts +0 -73
- package/src/tree-select/types.ts +0 -11
- package/src/tree-select/virtual.test.ts +0 -104
- package/src/typography/Link.svelte +0 -120
- package/src/typography/Paragraph.svelte +0 -92
- package/src/typography/Text.svelte +0 -93
- package/src/typography/Title.svelte +0 -91
- package/src/typography/Typography.a11y.test.ts +0 -34
- package/src/typography/TypographyA11yFixture.svelte +0 -27
- package/src/typography/TypographyBase.svelte +0 -807
- package/src/typography/index.ts +0 -16
- package/src/typography/meta.ts +0 -158
- package/src/upload/Upload.a11y.test.ts +0 -58
- package/src/upload/Upload.svelte +0 -1094
- package/src/upload/UploadA11yFixture.svelte +0 -23
- package/src/upload/index.ts +0 -3
- package/src/upload/meta.ts +0 -64
- package/src/upload/types.ts +0 -16
- package/src/virtual-list/VirtualList.svelte +0 -401
- package/src/virtual-list/index.ts +0 -2
- package/src/virtual-list/meta.ts +0 -106
|
@@ -1,38 +0,0 @@
|
|
|
1
|
-
<!--
|
|
2
|
-
仅供 List.a11y.test.ts 使用的测试夹具:数据驱动 dataSource + renderItem Snippet。
|
|
3
|
-
selectable 时容器升级 role=listbox,行 role=option + aria-selected。
|
|
4
|
-
-->
|
|
5
|
-
<script lang="ts">
|
|
6
|
-
import { List } from './index.js';
|
|
7
|
-
|
|
8
|
-
interface Props {
|
|
9
|
-
selectable?: false | 'single' | 'multiple';
|
|
10
|
-
bordered?: boolean;
|
|
11
|
-
header?: string;
|
|
12
|
-
defaultSelectedKeys?: (string | number)[];
|
|
13
|
-
}
|
|
14
|
-
let {
|
|
15
|
-
selectable = false,
|
|
16
|
-
bordered = false,
|
|
17
|
-
header = undefined,
|
|
18
|
-
defaultSelectedKeys = [],
|
|
19
|
-
}: Props = $props();
|
|
20
|
-
|
|
21
|
-
const dataSource = [
|
|
22
|
-
{ key: 'u1', title: 'Ada Lovelace' },
|
|
23
|
-
{ key: 'u2', title: 'Alan Turing' },
|
|
24
|
-
{ key: 'u3', title: 'Grace Hopper' },
|
|
25
|
-
];
|
|
26
|
-
</script>
|
|
27
|
-
|
|
28
|
-
<List
|
|
29
|
-
{dataSource}
|
|
30
|
-
{selectable}
|
|
31
|
-
{bordered}
|
|
32
|
-
{defaultSelectedKeys}
|
|
33
|
-
{...header !== undefined ? { header } : {}}
|
|
34
|
-
>
|
|
35
|
-
{#snippet renderItem(item)}
|
|
36
|
-
<span>{(item as { title: string }).title}</span>
|
|
37
|
-
{/snippet}
|
|
38
|
-
</List>
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
<!--
|
|
2
|
-
仅供 List.bench.ts 使用的基准夹具:按 count 生成 dataSource,
|
|
3
|
-
用 renderItem snippet 渲染真实行。隔离 snippet(snippet 只能在 .svelte 内定义)。
|
|
4
|
-
-->
|
|
5
|
-
<script lang="ts">
|
|
6
|
-
import { List } from './index.js';
|
|
7
|
-
|
|
8
|
-
interface Props {
|
|
9
|
-
count?: number;
|
|
10
|
-
}
|
|
11
|
-
let { count = 100 }: Props = $props();
|
|
12
|
-
|
|
13
|
-
const dataSource = $derived(
|
|
14
|
-
Array.from({ length: count }, (_, i) => ({ key: `r${i}`, title: `Item ${i}` })),
|
|
15
|
-
);
|
|
16
|
-
</script>
|
|
17
|
-
|
|
18
|
-
<List {dataSource} bordered>
|
|
19
|
-
{#snippet renderItem(item)}
|
|
20
|
-
<span>{(item as { title: string }).title}</span>
|
|
21
|
-
{/snippet}
|
|
22
|
-
</List>
|
package/src/list/ListItem.svelte
DELETED
|
@@ -1,175 +0,0 @@
|
|
|
1
|
-
<!--
|
|
2
|
-
List.Item — 声明式列表项容器。
|
|
3
|
-
- 默认(非 selectable):渲染 <li role="listitem">,与 dataSource 模式同结构,复用父 List
|
|
4
|
-
的 split/size 样式。
|
|
5
|
-
- selectable:读父 List context(getListContext),渲染 role="option" + aria-selected,
|
|
6
|
-
左侧内置 checkbox/radio 视觉,点击/键盘触发 ctx.toggle(仅回调 onSelectionChange,
|
|
7
|
-
红线 #1:不回写 selectedKeys)。
|
|
8
|
-
default 主内容 + extra(右侧附加区) + actions(底部操作区)三段插槽,对齐 spec。
|
|
9
|
-
无 effect 自循环:选中态来自父 context 派生(受控 selectedKeys),本组件不写 $state。
|
|
10
|
-
-->
|
|
11
|
-
<script lang="ts">
|
|
12
|
-
import type { Snippet } from 'svelte';
|
|
13
|
-
import type { ListKey } from '@chenzy-design/core';
|
|
14
|
-
import { Checkbox } from '../checkbox/index.js';
|
|
15
|
-
import { getListContext } from './context.js';
|
|
16
|
-
|
|
17
|
-
interface Props {
|
|
18
|
-
/** selectable 模式下本项的唯一 key(用于选中态判定与回调)。 */
|
|
19
|
-
itemKey?: ListKey;
|
|
20
|
-
/** item 头部(字符串或 Snippet)。 */
|
|
21
|
-
header?: string | Snippet;
|
|
22
|
-
/** item 主要内容区(语义化 slot,与 children 不互斥)。 */
|
|
23
|
-
main?: Snippet;
|
|
24
|
-
/** 右侧附加内容区(如缩略图、统计数字)。 */
|
|
25
|
-
extra?: Snippet;
|
|
26
|
-
/** 底部操作区(按钮组)。 */
|
|
27
|
-
actions?: Snippet;
|
|
28
|
-
class?: string;
|
|
29
|
-
/** 主内容(通用插槽)。 */
|
|
30
|
-
children?: Snippet;
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
let { itemKey, header, main, extra, actions, class: className = '', children }: Props = $props();
|
|
34
|
-
|
|
35
|
-
function isSnippet(v: unknown): v is Snippet {
|
|
36
|
-
return typeof v === 'function';
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
const ctx = getListContext();
|
|
40
|
-
|
|
41
|
-
const selectable = $derived(ctx?.getSelectable() ?? false);
|
|
42
|
-
const selected = $derived(
|
|
43
|
-
selectable && itemKey !== undefined ? !!ctx?.isSelected(itemKey) : false,
|
|
44
|
-
);
|
|
45
|
-
const multiple = $derived(selectable === 'multiple');
|
|
46
|
-
|
|
47
|
-
function activate(shiftKey: boolean) {
|
|
48
|
-
if (!selectable || itemKey === undefined) return;
|
|
49
|
-
ctx?.toggle(itemKey, shiftKey);
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
function onClick(e: MouseEvent) {
|
|
53
|
-
activate(e.shiftKey);
|
|
54
|
-
}
|
|
55
|
-
|
|
56
|
-
// roving tabindex 由父派生(红线 #2:本组件只读不写父级 $state)。
|
|
57
|
-
const tabindex = $derived(
|
|
58
|
-
selectable && itemKey !== undefined ? (ctx?.rowTabindex(itemKey) ?? 0) : undefined,
|
|
59
|
-
);
|
|
60
|
-
|
|
61
|
-
function onKeydown(e: KeyboardEvent) {
|
|
62
|
-
if (e.key === ' ' || e.key === 'Enter') {
|
|
63
|
-
e.preventDefault();
|
|
64
|
-
activate(e.shiftKey);
|
|
65
|
-
return;
|
|
66
|
-
}
|
|
67
|
-
// ↑↓ / Home/End / PageUp/Down roving 交父按 DOM 顺序处理。
|
|
68
|
-
if (itemKey !== undefined) ctx?.onRowKeydown(e, itemKey);
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
const cls = $derived(
|
|
72
|
-
[
|
|
73
|
-
'cd-list__item',
|
|
74
|
-
selectable && 'cd-list__item--selectable',
|
|
75
|
-
selected && 'cd-list__item--selected',
|
|
76
|
-
className,
|
|
77
|
-
]
|
|
78
|
-
.filter(Boolean)
|
|
79
|
-
.join(' '),
|
|
80
|
-
);
|
|
81
|
-
</script>
|
|
82
|
-
|
|
83
|
-
{#snippet itemInner()}
|
|
84
|
-
{#if header !== undefined}
|
|
85
|
-
<div class="cd-list__item-header">
|
|
86
|
-
{#if isSnippet(header)}{@render header()}{:else}{header}{/if}
|
|
87
|
-
</div>
|
|
88
|
-
{/if}
|
|
89
|
-
<div class="cd-list__item-row">
|
|
90
|
-
<div class="cd-list__item-content">
|
|
91
|
-
{#if main}{@render main()}{/if}
|
|
92
|
-
{@render children?.()}
|
|
93
|
-
</div>
|
|
94
|
-
{#if extra}<div class="cd-list__item-extra">{@render extra()}</div>{/if}
|
|
95
|
-
</div>
|
|
96
|
-
{#if actions}<div class="cd-list__item-actions">{@render actions()}</div>{/if}
|
|
97
|
-
{/snippet}
|
|
98
|
-
|
|
99
|
-
{#if selectable}
|
|
100
|
-
<li
|
|
101
|
-
class={cls}
|
|
102
|
-
role="option"
|
|
103
|
-
aria-selected={selected}
|
|
104
|
-
data-list-key={itemKey}
|
|
105
|
-
{tabindex}
|
|
106
|
-
onclick={onClick}
|
|
107
|
-
onkeydown={onKeydown}
|
|
108
|
-
onfocus={() => itemKey !== undefined && ctx?.onRowFocus(itemKey)}
|
|
109
|
-
>
|
|
110
|
-
<span class="cd-list__item-selector" aria-hidden="true">
|
|
111
|
-
<Checkbox checked={selected} />
|
|
112
|
-
</span>
|
|
113
|
-
<div class="cd-list__item-main">
|
|
114
|
-
{@render itemInner()}
|
|
115
|
-
</div>
|
|
116
|
-
</li>
|
|
117
|
-
{:else}
|
|
118
|
-
<li class={cls}>
|
|
119
|
-
<div class="cd-list__item-main">
|
|
120
|
-
{@render itemInner()}
|
|
121
|
-
</div>
|
|
122
|
-
</li>
|
|
123
|
-
{/if}
|
|
124
|
-
|
|
125
|
-
<style>
|
|
126
|
-
.cd-list__item-main {
|
|
127
|
-
flex: 1;
|
|
128
|
-
min-inline-size: 0;
|
|
129
|
-
}
|
|
130
|
-
.cd-list__item-header {
|
|
131
|
-
font-weight: var(--cd-font-weight-medium, 500);
|
|
132
|
-
margin-block-end: var(--cd-spacing-1, 4px);
|
|
133
|
-
color: var(--cd-color-text-0);
|
|
134
|
-
}
|
|
135
|
-
.cd-list__item-row {
|
|
136
|
-
display: flex;
|
|
137
|
-
align-items: flex-start;
|
|
138
|
-
gap: var(--cd-spacing-3, 12px);
|
|
139
|
-
}
|
|
140
|
-
.cd-list__item-content {
|
|
141
|
-
flex: 1;
|
|
142
|
-
min-inline-size: 0;
|
|
143
|
-
}
|
|
144
|
-
.cd-list__item-extra {
|
|
145
|
-
flex: none;
|
|
146
|
-
}
|
|
147
|
-
.cd-list__item-actions {
|
|
148
|
-
display: flex;
|
|
149
|
-
gap: var(--cd-spacing-3, 12px);
|
|
150
|
-
margin-block-start: var(--cd-spacing-2, 8px);
|
|
151
|
-
}
|
|
152
|
-
|
|
153
|
-
.cd-list__item--selectable {
|
|
154
|
-
display: flex;
|
|
155
|
-
align-items: flex-start;
|
|
156
|
-
gap: var(--cd-spacing-2, 8px);
|
|
157
|
-
cursor: pointer;
|
|
158
|
-
outline: none;
|
|
159
|
-
}
|
|
160
|
-
.cd-list__item--selectable:hover {
|
|
161
|
-
background: var(--cd-color-fill-0, rgba(0, 0, 0, 0.03));
|
|
162
|
-
}
|
|
163
|
-
.cd-list__item--selectable:focus-visible {
|
|
164
|
-
box-shadow: inset 0 0 0 2px var(--cd-color-primary, #0066ff);
|
|
165
|
-
}
|
|
166
|
-
.cd-list__item--selected {
|
|
167
|
-
background: var(--cd-color-primary-light-default, rgba(0, 102, 255, 0.1));
|
|
168
|
-
}
|
|
169
|
-
.cd-list__item-selector {
|
|
170
|
-
flex: none;
|
|
171
|
-
display: flex;
|
|
172
|
-
align-items: center;
|
|
173
|
-
pointer-events: none;
|
|
174
|
-
}
|
|
175
|
-
</style>
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
<!--
|
|
2
|
-
仅供 List.kbd.test.ts(browser project)使用的键盘 e2e 夹具。
|
|
3
|
-
selectable="single" → role=listbox / 行 role=option,roving 单停靠点(真实焦点)。
|
|
4
|
-
前后各放按钮验证 Tab 进入只停靠单行、Tab 出去落到 after。
|
|
5
|
-
-->
|
|
6
|
-
<script lang="ts">
|
|
7
|
-
import { LocaleProvider } from '../locale-provider/index.js';
|
|
8
|
-
import List from './List.svelte';
|
|
9
|
-
|
|
10
|
-
type Row = { key: string; label: string };
|
|
11
|
-
const dataSource: Row[] = [
|
|
12
|
-
{ key: 'a', label: 'Alpha' },
|
|
13
|
-
{ key: 'b', label: 'Bravo' },
|
|
14
|
-
{ key: 'c', label: 'Charlie' },
|
|
15
|
-
];
|
|
16
|
-
</script>
|
|
17
|
-
|
|
18
|
-
<LocaleProvider locale="en_US">
|
|
19
|
-
<button type="button" data-testid="before">before</button>
|
|
20
|
-
<List
|
|
21
|
-
{dataSource}
|
|
22
|
-
rowKey="key"
|
|
23
|
-
selectable="single"
|
|
24
|
-
ariaLabel="People"
|
|
25
|
-
>
|
|
26
|
-
{#snippet renderItem(item: Row)}
|
|
27
|
-
<span>{item.label}</span>
|
|
28
|
-
{/snippet}
|
|
29
|
-
</List>
|
|
30
|
-
<button type="button" data-testid="after">after</button>
|
|
31
|
-
</LocaleProvider>
|
package/src/list/ListMeta.svelte
DELETED
|
@@ -1,73 +0,0 @@
|
|
|
1
|
-
<!--
|
|
2
|
-
List.Meta — 项内结构化布局:avatar(头像/图标) + title(标题) + description(描述)。
|
|
3
|
-
三段均可用 props(string)或同名 Snippet 提供,Snippet 优先。纯展示,无状态、无 effect。
|
|
4
|
-
-->
|
|
5
|
-
<script lang="ts">
|
|
6
|
-
import type { Snippet } from 'svelte';
|
|
7
|
-
|
|
8
|
-
interface Props {
|
|
9
|
-
/** 左侧头像/图标区,string 直接渲染或用 avatar Snippet。 */
|
|
10
|
-
avatar?: string | Snippet;
|
|
11
|
-
/** 标题,string 或 title Snippet。 */
|
|
12
|
-
title?: string | Snippet;
|
|
13
|
-
/** 描述,string 或 description Snippet。 */
|
|
14
|
-
description?: string | Snippet;
|
|
15
|
-
class?: string;
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
let { avatar, title, description, class: className = '' }: Props = $props();
|
|
19
|
-
|
|
20
|
-
function isSnippet(v: unknown): v is Snippet {
|
|
21
|
-
return typeof v === 'function';
|
|
22
|
-
}
|
|
23
|
-
</script>
|
|
24
|
-
|
|
25
|
-
<div class={['cd-list__meta', className].filter(Boolean).join(' ')}>
|
|
26
|
-
{#if avatar !== undefined}
|
|
27
|
-
<div class="cd-list__meta-avatar">
|
|
28
|
-
{#if isSnippet(avatar)}{@render avatar()}{:else}{avatar}{/if}
|
|
29
|
-
</div>
|
|
30
|
-
{/if}
|
|
31
|
-
<div class="cd-list__meta-content">
|
|
32
|
-
{#if title !== undefined}
|
|
33
|
-
<div class="cd-list__meta-title">
|
|
34
|
-
{#if isSnippet(title)}{@render title()}{:else}{title}{/if}
|
|
35
|
-
</div>
|
|
36
|
-
{/if}
|
|
37
|
-
{#if description !== undefined}
|
|
38
|
-
<div class="cd-list__meta-description">
|
|
39
|
-
{#if isSnippet(description)}{@render description()}{:else}{description}{/if}
|
|
40
|
-
</div>
|
|
41
|
-
{/if}
|
|
42
|
-
</div>
|
|
43
|
-
</div>
|
|
44
|
-
|
|
45
|
-
<style>
|
|
46
|
-
.cd-list__meta {
|
|
47
|
-
display: flex;
|
|
48
|
-
align-items: flex-start;
|
|
49
|
-
gap: var(--cd-spacing-3, 12px);
|
|
50
|
-
flex: 1;
|
|
51
|
-
min-inline-size: 0;
|
|
52
|
-
}
|
|
53
|
-
.cd-list__meta-avatar {
|
|
54
|
-
flex: none;
|
|
55
|
-
display: flex;
|
|
56
|
-
align-items: center;
|
|
57
|
-
}
|
|
58
|
-
.cd-list__meta-content {
|
|
59
|
-
flex: 1;
|
|
60
|
-
min-inline-size: 0;
|
|
61
|
-
}
|
|
62
|
-
.cd-list__meta-title {
|
|
63
|
-
color: var(--cd-list-item-color);
|
|
64
|
-
font-weight: var(--cd-font-weight-medium, 500);
|
|
65
|
-
line-height: 1.4;
|
|
66
|
-
}
|
|
67
|
-
.cd-list__meta-description {
|
|
68
|
-
color: var(--cd-list-header-color);
|
|
69
|
-
font-size: var(--cd-font-size-small, 12px);
|
|
70
|
-
line-height: 1.5;
|
|
71
|
-
margin-block-start: 2px;
|
|
72
|
-
}
|
|
73
|
-
</style>
|
package/src/list/context.ts
DELETED
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
import { getContext, setContext } from 'svelte';
|
|
2
|
-
import type { ListKey } from '@chenzy-design/core';
|
|
3
|
-
|
|
4
|
-
/**
|
|
5
|
-
* List context — exposes selectable state to declarative <List.Item> children.
|
|
6
|
-
* Getters keep reactivity to the parent List's props (reading a snapshot would
|
|
7
|
-
* freeze the initial value). No mutable state stored here; selection toggling
|
|
8
|
-
* goes through the parent's command (which calls the controlled onSelectionChange
|
|
9
|
-
* — red line #1: never writes back to selectedKeys).
|
|
10
|
-
*/
|
|
11
|
-
export interface ListContext {
|
|
12
|
-
/** Whether selectable is enabled (single|multiple). */
|
|
13
|
-
getSelectable: () => false | 'single' | 'multiple';
|
|
14
|
-
/** Whether row `key` is currently selected. */
|
|
15
|
-
isSelected: (key: ListKey) => boolean;
|
|
16
|
-
/** Request a selection toggle for row `key` (fires onSelectionChange only). */
|
|
17
|
-
toggle: (key: ListKey, shiftKey: boolean) => void;
|
|
18
|
-
/** Row vertical padding size class suffix. */
|
|
19
|
-
getSize: () => 'small' | 'default' | 'large';
|
|
20
|
-
/**
|
|
21
|
-
* roving tabindex (pure derived): focused row / first DOM row is 0, others -1.
|
|
22
|
-
* Red line #2: read-only during render, never writes parent $state.
|
|
23
|
-
*/
|
|
24
|
-
rowTabindex: (key: ListKey) => 0 | -1;
|
|
25
|
-
/** Row keydown: ↑↓ roving + Home/End + PageUp/Down (imperative focus()). */
|
|
26
|
-
onRowKeydown: (event: KeyboardEvent, key: ListKey) => void;
|
|
27
|
-
/** Sync focusedRowKey when a row gains focus. */
|
|
28
|
-
onRowFocus: (key: ListKey) => void;
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
const KEY = Symbol('cd-list');
|
|
32
|
-
|
|
33
|
-
export function setListContext(ctx: ListContext): void {
|
|
34
|
-
setContext(KEY, ctx);
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
export function getListContext(): ListContext | undefined {
|
|
38
|
-
return getContext<ListContext | undefined>(KEY);
|
|
39
|
-
}
|
package/src/list/index.ts
DELETED
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
import List_ from './List.svelte';
|
|
2
|
-
import ListItem_ from './ListItem.svelte';
|
|
3
|
-
import ListMeta from './ListMeta.svelte';
|
|
4
|
-
|
|
5
|
-
// List.Item 挂 Meta 子组件(List.Item.Meta),List 挂 Item(及 Item.Meta 镜像)。
|
|
6
|
-
const ListItem: typeof ListItem_ & { Meta: typeof ListMeta } = Object.assign(ListItem_, {
|
|
7
|
-
Meta: ListMeta,
|
|
8
|
-
});
|
|
9
|
-
|
|
10
|
-
export const List: typeof List_ & {
|
|
11
|
-
Item: typeof ListItem;
|
|
12
|
-
Meta: typeof ListMeta;
|
|
13
|
-
} = Object.assign(List_, { Item: ListItem, Meta: ListMeta });
|
|
14
|
-
|
|
15
|
-
export { ListItem, ListMeta };
|
|
16
|
-
export { meta as listMeta } from './meta.js';
|
|
17
|
-
export {
|
|
18
|
-
getListContext,
|
|
19
|
-
setListContext,
|
|
20
|
-
type ListContext,
|
|
21
|
-
} from './context.js';
|
package/src/list/meta.ts
DELETED
|
@@ -1,99 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Machine-readable component metadata for AI/docs consumption.
|
|
3
|
-
* List — see specs/components/show/List.spec.md
|
|
4
|
-
*/
|
|
5
|
-
export const meta = {
|
|
6
|
-
name: 'List',
|
|
7
|
-
category: 'show',
|
|
8
|
-
description:
|
|
9
|
-
'列表:数据驱动渲染(dataSource + renderItem),支持 header/footer(string 或 Snippet)、bordered 外框、split 行间分隔线、loading 骨架/spinner 与空态(默认 Empty)。泛型组件。',
|
|
10
|
-
exports: ['List', 'ListItem', 'ListMeta'],
|
|
11
|
-
subComponents: ['List.Item', 'List.Item.Meta', 'List.Meta'],
|
|
12
|
-
props: [
|
|
13
|
-
{ name: 'dataSource', type: 'T[]', default: '[]', desc: '列表数据数组' },
|
|
14
|
-
{
|
|
15
|
-
name: 'renderItem',
|
|
16
|
-
type: 'Snippet<[item: T, index: number]>',
|
|
17
|
-
default: 'undefined',
|
|
18
|
-
desc: '行渲染 Snippet',
|
|
19
|
-
},
|
|
20
|
-
{
|
|
21
|
-
name: 'rowKey',
|
|
22
|
-
type: 'string|((item: T) => string|number)',
|
|
23
|
-
default: "'key'",
|
|
24
|
-
desc: '行唯一标识,用于 each key',
|
|
25
|
-
},
|
|
26
|
-
{ name: 'size', type: "'small'|'default'|'large'", default: "'default'", desc: '行内边距尺寸' },
|
|
27
|
-
{ name: 'bordered', type: 'boolean', default: 'false', desc: '外层边框 + 圆角' },
|
|
28
|
-
{ name: 'split', type: 'boolean', default: 'true', desc: '行间分隔线' },
|
|
29
|
-
{ name: 'header', type: 'string|Snippet', default: 'undefined', desc: '头部内容' },
|
|
30
|
-
{ name: 'footer', type: 'string|Snippet', default: 'undefined', desc: '底部内容' },
|
|
31
|
-
{ name: 'loading', type: 'boolean', default: 'false', desc: '加载态,覆盖 body' },
|
|
32
|
-
{ name: 'loadingSkeleton', type: 'boolean', default: 'false', desc: 'loading 时用骨架行替代 spinner' },
|
|
33
|
-
{ name: 'skeletonCount', type: 'number', default: '3', desc: '骨架占位行数' },
|
|
34
|
-
{
|
|
35
|
-
name: 'emptyContent',
|
|
36
|
-
type: 'string|Snippet',
|
|
37
|
-
default: 'undefined',
|
|
38
|
-
desc: '空数据展示内容,默认内置 Empty',
|
|
39
|
-
},
|
|
40
|
-
{ name: 'grid', type: 'number | { column?: number; gutter?: number }', default: 'undefined', desc: '网格布局列数/间距' },
|
|
41
|
-
{ name: 'loadMore', type: 'Snippet', default: 'undefined', desc: '自定义底部加载区' },
|
|
42
|
-
{ name: 'onLoadMore', type: '() => void', default: 'undefined', desc: '内置加载更多按钮回调' },
|
|
43
|
-
{ name: 'loadingMore', type: 'boolean', default: 'false', desc: '内置按钮 loading 态' },
|
|
44
|
-
{ name: 'hasMore', type: 'boolean', default: 'false', desc: '是否还有更多数据' },
|
|
45
|
-
{ name: 'pagination', type: 'false | { pageSize?, current?, defaultCurrent?, onChange? }', default: 'undefined', desc: '分页(切片当页,与 loadMore 互斥优先)' },
|
|
46
|
-
{ name: 'virtualized', type: 'false | { itemSize?: number|"auto"; estimatedItemSize?: number; height: number|string; overscan?: number }', default: 'false', desc: '虚拟化:仅渲染视口内行,定高/动态测高,复用 core 区间数学(与 grid/pagination 互斥,优先生效)' },
|
|
47
|
-
{ name: 'selectable', type: "false | 'single' | 'multiple'", default: 'false', desc: '行可选模式:单选/多选(listbox/option 语义)' },
|
|
48
|
-
{ name: 'selectedKeys', type: '(string|number)[]', default: 'undefined', desc: '受控选中 key 集合(不回写,仅 onSelectionChange 回调)' },
|
|
49
|
-
{ name: 'defaultSelectedKeys', type: '(string|number)[]', default: '[]', desc: '非受控初始选中 key 集合' },
|
|
50
|
-
{ name: 'onSelectionChange', type: '(keys, { item, key, selected }) => void', default: 'undefined', desc: '选中态变更回调(受控/非受控均触发)' },
|
|
51
|
-
{ name: 'children', type: 'Snippet', default: 'undefined', desc: '声明式用法:内嵌 <List.Item>(不传 dataSource 时生效)' },
|
|
52
|
-
{ name: 'class', type: 'string', default: "''", desc: '根类名透传' },
|
|
53
|
-
],
|
|
54
|
-
capabilities: ['data-render', 'pagination', 'load-more', 'virtualized', 'grid', 'selectable', 'declarative-items', 'empty/loading-state'],
|
|
55
|
-
methods: [
|
|
56
|
-
{ name: 'scrollToIndex', type: "(index: number, opts?: { align?: 'start'|'center'|'end' }) => void", desc: '虚拟化模式命令式滚动到指定索引项' },
|
|
57
|
-
],
|
|
58
|
-
events: [
|
|
59
|
-
{ name: 'onSelectionChange', payload: '(keys, { item, key, selected })', desc: 'selectable 选中态变更' },
|
|
60
|
-
],
|
|
61
|
-
slots: [
|
|
62
|
-
{ name: 'renderItem', desc: '行渲染(item, index)' },
|
|
63
|
-
{ name: 'header', desc: '头部 Snippet(与 header string 二选一)' },
|
|
64
|
-
{ name: 'footer', desc: '底部 Snippet' },
|
|
65
|
-
{ name: 'emptyContent', desc: '空态 Snippet' },
|
|
66
|
-
{ name: 'children', desc: '声明式 <List.Item> 子项(不传 dataSource 时)' },
|
|
67
|
-
],
|
|
68
|
-
a11y: {
|
|
69
|
-
role: 'list',
|
|
70
|
-
focusable: false,
|
|
71
|
-
notes: [
|
|
72
|
-
'ul/li 原生列表语义;selectable 时容器 role=listbox(multiple 加 aria-multiselectable),行 role=option + aria-selected',
|
|
73
|
-
'selectable 行 tabindex=0,Space/Enter 切换选中;multiple 支持 shift 连选',
|
|
74
|
-
'loading 时根容器 aria-busy=true',
|
|
75
|
-
'骨架行 aria-hidden=true,spinner aria-hidden=true',
|
|
76
|
-
'虚拟化行带 aria-setsize/aria-posinset',
|
|
77
|
-
],
|
|
78
|
-
},
|
|
79
|
-
tokens: [
|
|
80
|
-
'--cd-list-bg',
|
|
81
|
-
'--cd-list-border',
|
|
82
|
-
'--cd-list-radius',
|
|
83
|
-
'--cd-list-item-padding',
|
|
84
|
-
'--cd-list-item-padding-small',
|
|
85
|
-
'--cd-list-split-color',
|
|
86
|
-
'--cd-list-header-color',
|
|
87
|
-
'--cd-list-item-color',
|
|
88
|
-
'--cd-radius-full',
|
|
89
|
-
'--cd-radius-small',
|
|
90
|
-
'--cd-color-primary',
|
|
91
|
-
],
|
|
92
|
-
examples: [
|
|
93
|
-
{
|
|
94
|
-
title: '基础',
|
|
95
|
-
code:
|
|
96
|
-
'{#snippet item(d)}<span>{d.title}</span>{/snippet}\n<List dataSource={data} renderItem={item} bordered />',
|
|
97
|
-
},
|
|
98
|
-
],
|
|
99
|
-
} as const;
|
|
@@ -1,110 +0,0 @@
|
|
|
1
|
-
<script lang="ts">
|
|
2
|
-
import { setContext } from 'svelte';
|
|
3
|
-
import type { Snippet } from 'svelte';
|
|
4
|
-
import {
|
|
5
|
-
createLocale,
|
|
6
|
-
resolveLocale,
|
|
7
|
-
mergeLocale,
|
|
8
|
-
en_US,
|
|
9
|
-
type LocaleApi,
|
|
10
|
-
type Direction,
|
|
11
|
-
type CreateLocaleOptions,
|
|
12
|
-
} from '@chenzy-design/locale';
|
|
13
|
-
import type { Locale } from '@chenzy-design/locale';
|
|
14
|
-
import { LOCALE_CONTEXT_KEY, type LocaleContextValue } from './context.js';
|
|
15
|
-
import { getLocaleContext } from './index.js';
|
|
16
|
-
|
|
17
|
-
interface Props {
|
|
18
|
-
/**
|
|
19
|
-
* 语言包对象,或内置/已注册的字符串码(如 'zh_CN' / 'en-US')。
|
|
20
|
-
* 字符串码经 registerLocale 注册表 + 内置包查表解析;未知码回退 en_US。
|
|
21
|
-
*/
|
|
22
|
-
locale: Locale | string;
|
|
23
|
-
/** 缺失 key 回退包,默认 createLocale 内部用 en_US。 */
|
|
24
|
-
fallback?: Locale;
|
|
25
|
-
/** 文本方向,默认 'auto'(按 locale.rtl 推断)。 */
|
|
26
|
-
direction?: Direction | 'auto';
|
|
27
|
-
/**
|
|
28
|
-
* 嵌套时是否深合并父级 LocaleProvider 的语言包(子覆盖父,未覆盖继承父)。
|
|
29
|
-
* 默认 true;设 false 则整体替换,仅用本级语言包。
|
|
30
|
-
*/
|
|
31
|
-
inherit?: boolean;
|
|
32
|
-
/** 默认 IANA 时区(如 'Asia/Shanghai')注入 formatDate;未设时继承父级。 */
|
|
33
|
-
timeZone?: string;
|
|
34
|
-
/** 默认 ISO 4217 货币(如 'CNY')用于 currency 风格 formatNumber;未设时继承父级。 */
|
|
35
|
-
currency?: string;
|
|
36
|
-
/** locale/direction 变化时的通知回调(受控,不回写)。 */
|
|
37
|
-
onLocaleChange?: (info: { locale: string; direction: Direction }) => void;
|
|
38
|
-
children?: Snippet<
|
|
39
|
-
[
|
|
40
|
-
{
|
|
41
|
-
locale: string;
|
|
42
|
-
t: LocaleApi['t'];
|
|
43
|
-
formatDate: LocaleApi['formatDate'];
|
|
44
|
-
formatNumber: LocaleApi['formatNumber'];
|
|
45
|
-
direction: Direction;
|
|
46
|
-
},
|
|
47
|
-
]
|
|
48
|
-
>;
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
let {
|
|
52
|
-
locale,
|
|
53
|
-
fallback,
|
|
54
|
-
direction = 'auto',
|
|
55
|
-
inherit = true,
|
|
56
|
-
timeZone,
|
|
57
|
-
currency,
|
|
58
|
-
onLocaleChange,
|
|
59
|
-
children,
|
|
60
|
-
}: Props = $props();
|
|
61
|
-
|
|
62
|
-
// 最近的父级 LocaleProvider 上下文(初始化期读一次);用于 inherit 深合并与配置继承。
|
|
63
|
-
const parent = getLocaleContext();
|
|
64
|
-
|
|
65
|
-
// 解析本级语言包:字符串码经注册表/内置查表,未知码回退 en_US;对象原样使用。
|
|
66
|
-
// 红线 #2:resolveLocale / mergeLocale 为 @chenzy-design/locale 的纯函数。
|
|
67
|
-
const resolved = $derived.by<Locale>(() => {
|
|
68
|
-
const own = resolveLocale(locale) ?? en_US;
|
|
69
|
-
// inherit:深合并父级生效包作基底,子覆盖父、未覆盖继承父。
|
|
70
|
-
return inherit && parent ? (mergeLocale(parent.resolved, own) as Locale) : own;
|
|
71
|
-
});
|
|
72
|
-
|
|
73
|
-
// 时区/货币:本级未设时继承父级生效值(仅 inherit 时;否则只用本级)。
|
|
74
|
-
const effTimeZone = $derived(timeZone ?? (inherit ? parent?.timeZone : undefined));
|
|
75
|
-
const effCurrency = $derived(currency ?? (inherit ? parent?.currency : undefined));
|
|
76
|
-
|
|
77
|
-
// 派生 LocaleApi:依赖变化时重建(Intl 缓存随之重置,可接受)。
|
|
78
|
-
// exactOptionalPropertyTypes 下条件构造 options,避免给可选属性传 undefined。
|
|
79
|
-
const api = $derived.by<LocaleApi>(() => {
|
|
80
|
-
const options: CreateLocaleOptions = { locale: resolved, direction };
|
|
81
|
-
if (fallback) options.fallback = fallback;
|
|
82
|
-
if (effTimeZone) options.timeZone = effTimeZone;
|
|
83
|
-
if (effCurrency) options.currency = effCurrency;
|
|
84
|
-
return createLocale(options);
|
|
85
|
-
});
|
|
86
|
-
|
|
87
|
-
// setContext 注入带 getter 的稳定引用对象,使后代 getContext 读到最新值。
|
|
88
|
-
// 红线 #1:locale 受控,仅注入不回写。resolved/timeZone/currency 供子级 inherit 用。
|
|
89
|
-
setContext<LocaleContextValue>(LOCALE_CONTEXT_KEY, {
|
|
90
|
-
get current(): LocaleApi {
|
|
91
|
-
return api;
|
|
92
|
-
},
|
|
93
|
-
get resolved(): Locale {
|
|
94
|
-
return resolved;
|
|
95
|
-
},
|
|
96
|
-
get timeZone(): string | undefined {
|
|
97
|
-
return effTimeZone;
|
|
98
|
-
},
|
|
99
|
-
get currency(): string | undefined {
|
|
100
|
-
return effCurrency;
|
|
101
|
-
},
|
|
102
|
-
});
|
|
103
|
-
|
|
104
|
-
// 红线 #3:$effect 只调通知回调,无 DOM/几何操作。首次 mount 也会触发一次(payload 为初始 locale,可接受)。
|
|
105
|
-
$effect(() => {
|
|
106
|
-
onLocaleChange?.({ locale: api.code, direction: api.direction });
|
|
107
|
-
});
|
|
108
|
-
</script>
|
|
109
|
-
|
|
110
|
-
{#if children}{@render children({ locale: api.code, t: api.t, formatDate: api.formatDate, formatNumber: api.formatNumber, direction: api.direction })}{/if}
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import type { Locale, LocaleApi } from '@chenzy-design/locale';
|
|
2
|
-
|
|
3
|
-
/** Svelte context key shared by LocaleProvider 与(未来的)ConfigProvider。 */
|
|
4
|
-
export const LOCALE_CONTEXT_KEY = Symbol('cd-locale');
|
|
5
|
-
|
|
6
|
-
/**
|
|
7
|
-
* 注入到 context 的对象。`current` 是消费端读的 LocaleApi(getter,随语言切换更新);
|
|
8
|
-
* `resolved`/`timeZone`/`currency` 供嵌套 LocaleProvider 做 inherit 深合并与配置继承,
|
|
9
|
-
* 消费组件无需关心。
|
|
10
|
-
*/
|
|
11
|
-
export interface LocaleContextValue {
|
|
12
|
-
/** 最近注入的 LocaleApi(getter,渲染期重新读取拿到最新值)。 */
|
|
13
|
-
readonly current: LocaleApi;
|
|
14
|
-
/** 当前生效的完整语言包对象,供子级 inherit 深合并的父基底。 */
|
|
15
|
-
readonly resolved: Locale;
|
|
16
|
-
/** 当前生效的默认时区,供子级未显式设置时继承。 */
|
|
17
|
-
readonly timeZone: string | undefined;
|
|
18
|
-
/** 当前生效的默认货币,供子级未显式设置时继承。 */
|
|
19
|
-
readonly currency: string | undefined;
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
export type { Locale, LocaleApi };
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
import { getContext } from 'svelte';
|
|
2
|
-
import { LOCALE_CONTEXT_KEY, type LocaleContextValue } from './context.js';
|
|
3
|
-
|
|
4
|
-
export { default as LocaleProvider } from './LocaleProvider.svelte';
|
|
5
|
-
export {
|
|
6
|
-
LOCALE_CONTEXT_KEY,
|
|
7
|
-
type LocaleApi,
|
|
8
|
-
type LocaleContextValue,
|
|
9
|
-
} from './context.js';
|
|
10
|
-
export { meta as localeProviderMeta } from './meta.js';
|
|
11
|
-
|
|
12
|
-
/**
|
|
13
|
-
* 读取最近 LocaleProvider 注入的上下文值。
|
|
14
|
-
* 约束:getContext 只能在组件初始化期调用,故此 helper 必须在消费组件的
|
|
15
|
-
* `<script>` 顶层(初始化期)调用,返回对象的 `current` 持有最新 LocaleApi。
|
|
16
|
-
*/
|
|
17
|
-
export function getLocaleContext(): LocaleContextValue | undefined {
|
|
18
|
-
return getContext(LOCALE_CONTEXT_KEY);
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
export { useLocale } from './use-locale.js';
|